Merge pull request #82 from Team-Futsukayoi/feature/#71_extend-user-p…

…rofile-with-additional-attributes

Feature/#71 extend user profile with additional attributes

package.json

@@ -26,6 +26,9 @@
     "@emotion/styled": "^11.13.0",
     "@mui/icons-material": "^6.1.5",
     "@mui/material": "^6.1.5",
+    "@mui/x-date-pickers": "^7.22.0",
+    "date-fns": "^4.1.0",
+    "dayjs": "^1.11.13",
     "express": "^4.21.1",
     "firebase": "^11.0.1",
     "framer-motion": "^11.11.10",

src/App.jsx

@@ -6,26 +6,37 @@ import ChatPage from './pages/chatpage/ChatPage';
 import SuccessPage from './pages/SuccessPage';
 import Header from './components/Header';
 import NavigationBar from './components/NavigationBar';
-import { useLocation } from 'react-router-dom/dist';
+import { useLocation } from 'react-router-dom';
 import ProfilePage from './pages/user/ProfilePage';
+import UserAttributesPage from './pages/user/UserAttributesPage';
+import { LocalizationProvider } from '@mui/x-date-pickers';
+import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
+import dayjs from 'dayjs';
+import 'dayjs/locale/ja';
+
+// 日本語ロケールを設定
+dayjs.locale('ja');
 
 function App() {
   const location = useLocation();
-  const hideNavBarPaths = ['/', '/signin', '/signup'];
+  const hideNavBarPaths = ['/', '/signin', '/signup', '/user-attributes'];
 
   return (
     <>
-      {!hideNavBarPaths.includes(location.pathname) && <Header />}
-      <Routes>
-        <Route path="/" element={<SignIn />} />
-        <Route path="/signup" element={<SignUp />} />
-        <Route path="/signin" element={<SignIn />} />
-        <Route path="/profile" element={<ProfilePage />} />
-        <Route path="/success" element={<SuccessPage />} />
-        <Route path="/chatlist" element={<ChatListPage />} />
-        <Route path="/chat/:friendId" element={<ChatPage />} />
-      </Routes>
-      {!hideNavBarPaths.includes(location.pathname) && <NavigationBar />}
+      <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="ja">
+        {!hideNavBarPaths.includes(location.pathname) && <Header />}
+        <Routes>
+          <Route path="/" element={<SignIn />} />
+          <Route path="/signup" element={<SignUp />} />
+          <Route path="/signin" element={<SignIn />} />
+          <Route path="/profile" element={<ProfilePage />} />
+          <Route path="/success" element={<SuccessPage />} />
+          <Route path="/chatlist" element={<ChatListPage />} />
+          <Route path="/chat/:friendId" element={<ChatPage />} />
+          <Route path="/user-attributes" element={<UserAttributesPage />} />
+        </Routes>
+        {!hideNavBarPaths.includes(location.pathname) && <NavigationBar />}
+      </LocalizationProvider>
     </>
   );
 }

src/consts/constants.js

@@ -0,0 +1,6 @@
+export const alcoholStrengthOptions = [
+  { value: 'strong', label: '強い', icon: '🍺' },
+  { value: 'medium', label: '普通', icon: '🍷' },
+  { value: 'weak', label: '弱い', icon: '🥂' },
+  { value: 'none', label: '飲まない', icon: '🚫' },
+];

src/pages/SuccessPage.jsx

@@ -26,7 +26,7 @@ const SuccessPage = () => {
         open={open}
         message="ログインに成功しました"
         handleClose={handleClose}
-        bottomOffset="80px"
+        bottomOffset="90px"
         autoHideDuration={3000} // 確認: 正しく設定されている
       />
       <Typography variant="h4" color="primary" gutterBottom>

src/pages/auth/SignIn.jsx

@@ -56,7 +56,10 @@ export const SignIn = () => {
       const userDoc = await getDoc(doc(db, 'users', user.uid));
       if (userDoc.exists()) {
         const userData = userDoc.data();
-        console.log('User ID:', userData.userId);
+        if (!userData.isProfileComplete) {
+          navigate('/user-attributes');
+          return;
+        }
       }
 
       setError('');

src/pages/auth/SignUp.jsx

@@ -56,6 +56,7 @@ export const SignUp = () => {
         email: user.email,
         userId: userId,
         createdAt: new Date(),
+        isProfileComplete: false,
       });
 
       await setDoc(doc(db, 'userIds', userId), { uid: user.uid });