ログイン周り 整備

src/api/auth.ts

@@ -3,8 +3,7 @@ import { getUrl } from "./url";
 
 type MeResponse = {
   data: {
-    id: string;
-    name: string;
+    customer_name: string;
     email: string;
   };
 } & APICommonResponse;

src/contexts/AuthContext.tsx

@@ -8,69 +8,57 @@ type Auth = {
   initialized: boolean;
   authenticated: boolean;
 
-  userId: string | null;
   name: string;
   email: string;
 
   login: (email: string, password: string) => Promise<boolean>;
   logout: VoidFunction;
+  me: VoidFunction;
 };
 export const AuthContext = createContext<Auth>({
   initialized: false,
 
   authenticated: false,
 
-  userId: null,
   name: "",
   email: "",
 
   login: async (email: string, password: string) => false,
   logout: () => {},
+  me: () => {},
 });
 
 type Props = HasChildren;
 function AuthContextProvider({ children }: Props) {
   const [initialized, setInitialized] = useState(false);
-  const [userId, setUserId] = useState<string | null>(null);
   const [name, setName] = useState("");
   const [email, setEmail] = useState("");
 
-  const testLogin = () => {
-    //TODO MOCK対応
-    setInitialized(true);
-    setUserId("testing");
-    setName("testuser");
-    setEmail("test@test.com");
-  };
-
   const authenticated = useMemo(() => {
-    // return !!userId;
-    return true;
-  }, [userId]);
+    return !!email;
+  }, [email]);
 
   const { callAPI: callMe } = useAPICall({
     apiMethod: me,
     backDrop: true,
-    onSuccess: (res) => {
+    onSuccess: ({ data }) => {
       setInitialized(true);
 
-      //削除予定
-      testLogin();
+      setEmail(data.email);
+      setName(data.customer_name);
     },
     onFailed: () => {
       clear();
       setInitialized(true);
-
-      //削除予定
-      testLogin();
     },
   });
 
   const { callAPI: callLogin } = useAPICall({
     apiMethod: APILogin,
     backDrop: true,
-    onSuccess: (res) => {
-      setInitialized(true);
+    onSuccess: ({ data }) => {
+      setEmail(data.email);
+      setName(data.customer_name);
     },
   });
 
@@ -82,25 +70,23 @@ function AuthContextProvider({ children }: Props) {
   });
 
   const clear = () => {
-    setUserId(null);
     setName("");
     setEmail("");
   };
 
   const login = async (email: string, password: string) => {
-    //削除予定
-    testLogin();
-    return true;
-    // const res = await callLogin({ email, password });
-    // if (!res) return false;
-
-    // return res.result === ResultCode.SUCCESS;
+    const res = await callLogin({ email, password });
+    return res?.result === ResultCode.SUCCESS;
   };
   const logout = () => {
     callLogout({});
     console.info("ログアウト");
   };
 
+  const meFetch = () => {
+    callMe({});
+  };
+
   useEffect(() => {
     callMe({});
   }, []);
@@ -111,13 +97,13 @@ function AuthContextProvider({ children }: Props) {
         // Value
         initialized,
         authenticated,
-        userId,
         name,
         email,
 
         // Func
         login,
         logout,
+        me: meFetch,
       }}
     >
       {children}

src/layouts/dashbord/navigator.tsx

@@ -64,7 +64,7 @@ const itemCategory = {
 export default function Navigator(props: DrawerProps) {
   const { ...other } = props;
 
-  const { userId, name } = useAuth();
+  const { name } = useAuth();
 
   const { navigateWhenChanged } = useNavigateCustom();
 

src/pages/common/Page404.tsx

@@ -7,15 +7,18 @@ import { getPath } from "routes/path";
 
 export default function Page404() {
   const { navigateWhenChanged } = useNavigateCustom();
-  const { authenticated } = useAuth();
+  const { authenticated, initialized } = useAuth();
 
-  // ログインページにアクセス経験ある場合は、ログインページへ遷移させる
   useEffect(() => {
+    if (!initialized) return;
     if (authenticated) {
       navigateWhenChanged(getPath(PageID.DASHBOARD_OVERVIEW));
       return;
+    } else {
+      navigateWhenChanged(getPath(PageID.LOGIN));
+      return;
     }
-  }, []);
+  }, [initialized, authenticated]);
 
-  return <Box>NotFound.</Box>;
+  return null;
 }

src/pages/dashboard/index.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@mui/material";
-import { PageID, TabID } from "pages";
 import useDashboard from "hooks/useDashBoard";
+import { PageID, TabID } from "pages";
 import { useEffect } from "react";
 
 export default function Overview() {