From fa9027a1778a83ebdb19f5d40685d5ef81db1021 Mon Sep 17 00:00:00 2001
From: "saito.k" <saito.k@nds-tyo.co.jp>
Date: Wed, 31 May 2023 04:38:54 +0000
Subject: [PATCH] =?UTF-8?q?Merged=20PR=20116:=20=E5=8E=9F=E5=9B=A0?=
 =?UTF-8?q?=E8=AA=BF=E6=9F=BB=EF=BC=86=E5=AF=BE=E5=BF=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## 概要
[Task1792: 原因調査＆対応](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/1792)

- ログイン画面の描画が複数回行われる最中に、app.tsxの言語切り替えのuseEffectが走ると、B2Cのユーザー情報が取得できないので、言語切り替えのタイミングをずらすことで対応する

## レビューポイント
- 対応方法に問題はあるか

## UIの変更
- Before/Afterのスクショなど
- スクショ置き場

## 動作確認状況
- ローカルで確認

## 補足
---
 dictation_client/src/App.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/dictation_client/src/App.tsx b/dictation_client/src/App.tsx
index 0f33e23..cfd0d78 100644
--- a/dictation_client/src/App.tsx
+++ b/dictation_client/src/App.tsx
@@ -3,7 +3,7 @@ import { BrowserRouter } from "react-router-dom";
 import { PublicClientApplication } from "@azure/msal-browser";
 import { MsalProvider, useMsal } from "@azure/msal-react";
 import { msalConfig } from "common/msalConfig";
-import { useEffect } from "react";
+import { useEffect, useLayoutEffect } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import globalAxios, { AxiosError, AxiosResponse } from "axios";
 import { clearToken } from "features/auth";
@@ -39,8 +39,9 @@ const App = (): JSX.Element => {
   }, [dispatch, instance]);
 
   // Language読み取り
-  useEffect(() => {
+  useLayoutEffect(() => {
     const language = document.cookie
+      .trim()
       .split(";")
       .map((x) => x.split("="))
       .find((x) => x.length === 2 && x[0] === "language");