From c74906c788858921905b2ea2df4ede16843d6b6a Mon Sep 17 00:00:00 2001
From: Ogata Katsuya <130939004+ogatakatsuya@users.noreply.github.com>
Date: Thu, 18 Jul 2024 12:36:18 +0900
Subject: [PATCH] =?UTF-8?q?profile=E7=94=BB=E9=9D=A2=E3=81=AE=E3=83=90?=
 =?UTF-8?q?=E3=82=B0=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 backend/api/db.py                             |  2 +-
 backend/api/migrate_db.py                     |  2 +-
 frontend/next.config.mjs                      |  1 +
 .../profile/[user_id]/_components/Post.jsx    |  4 --
 .../src/app/profile/me/_components/MyPost.jsx | 38 ++++++++-----------
 5 files changed, 19 insertions(+), 28 deletions(-)

diff --git a/backend/api/db.py b/backend/api/db.py
index 80e3075..ffd159f 100644
--- a/backend/api/db.py
+++ b/backend/api/db.py
@@ -12,7 +12,7 @@
 
 ASYNC_DB_URL = f"mysql+aiomysql://{DB_USER}:{DB_PASSWORD}@{DB_HOST}:3306/{DB_NAME}?charset=utf8"
 
-async_engine = create_async_engine(ASYNC_DB_URL, echo=True)
+async_engine = create_async_engine(ASYNC_DB_URL)
 async_session = sessionmaker(
     autocommit=False, autoflush=False, bind=async_engine, class_=AsyncSession
 )
diff --git a/backend/api/migrate_db.py b/backend/api/migrate_db.py
index d531f8a..9ed0aa0 100644
--- a/backend/api/migrate_db.py
+++ b/backend/api/migrate_db.py
@@ -11,7 +11,7 @@
 DB_NAME = os.getenv('DB_NAME')
 
 DB_URL = f"mysql+pymysql://{DB_USER}:{DB_PASSWORD}@{DB_HOST}:3306/{DB_NAME}?charset=utf8"
-engine = create_engine(DB_URL, echo=True)
+engine = create_engine(DB_URL)
 
 
 def reset_database():
diff --git a/frontend/next.config.mjs b/frontend/next.config.mjs
index 59bb56d..4ddfbb4 100644
--- a/frontend/next.config.mjs
+++ b/frontend/next.config.mjs
@@ -12,6 +12,7 @@ const nextConfig = {
       },
     ],
   },
+  reactStrictMode: false,
 };
 
 export default nextConfig;
\ No newline at end of file
diff --git a/frontend/src/app/profile/[user_id]/_components/Post.jsx b/frontend/src/app/profile/[user_id]/_components/Post.jsx
index 713d111..9d7beb4 100644
--- a/frontend/src/app/profile/[user_id]/_components/Post.jsx
+++ b/frontend/src/app/profile/[user_id]/_components/Post.jsx
@@ -47,10 +47,6 @@ const Post = ({ user_id }) => {
             console.error("Error fetching posts:", error);
         }
     };
-
-    useEffect(() => {
-        fetchPost(offset)
-    },[])
     
     useEffect(() => {
         if (hasMore && offset>0) {
diff --git a/frontend/src/app/profile/me/_components/MyPost.jsx b/frontend/src/app/profile/me/_components/MyPost.jsx
index 218b5b0..f6d6e1f 100644
--- a/frontend/src/app/profile/me/_components/MyPost.jsx
+++ b/frontend/src/app/profile/me/_components/MyPost.jsx
@@ -13,7 +13,7 @@ import {
     IconButton,
     StackDivider,
     Stack,
-} from '@chakra-ui/react'
+} from '@chakra-ui/react';
 import { MdExpandMore } from "react-icons/md";
 
 const MyPost = () => {
@@ -21,6 +21,7 @@ const MyPost = () => {
     const [post, setPost] = useState([]);
     const [hasMore, setHasMore] = useState(true);
     const [offset, setOffset] = useState(0);
+    const [initialLoad, setInitialLoad] = useState(true); // 初回ロードフラグ
     const observerTarget = useRef(null);
 
     const fetchPost = async (offset) => {
@@ -32,15 +33,13 @@ const MyPost = () => {
             });
             if (res.ok) {
                 const data = await res.json();
-                if (offset === 0) { //初回表示時はレンダリングが2回行われるため
+                if (offset === 0 && initialLoad) { // 初回表示時は上書きする
                     setPost(data);
-                    setOffset(0);
-                    console.log(data)
+                    setInitialLoad(false); // 初回ロードを完了としてマーク
                 } else {
                     setPost((prevPosts) => [...prevPosts, ...data]);
-                    console.log(data)
                 }
-                setHasMore( data.length === 10 )
+                setHasMore(data.length === 10);
             } else {
                 console.error("Error fetching posts:", res.statusText);
             }
@@ -50,12 +49,7 @@ const MyPost = () => {
     };
 
     useEffect(() => {
-        fetchPost(offset)
-    },[])
-    
-    useEffect(() => {
-        if (hasMore && offset>0) {
-            console.log("fetch post")
+        if (hasMore && offset > 0) {
             fetchPost(offset);
         }
     }, [offset, hasMore]);
@@ -82,7 +76,7 @@ const MyPost = () => {
 
     const redirectToDetail = (post_id) => {
         router.push(`/post/${post_id}`);
-    }
+    };
 
     return (
         <>
@@ -92,7 +86,7 @@ const MyPost = () => {
                         <Card width="650px" key={item.id} bgColor="gray.100">
                             <CardBody>
                                 <Flex alignItems="center">
-                                    <Avatar src={item?.icon_url}/>
+                                    <Avatar src={item?.icon_url} />
                                     <Box ml={3}>
                                         <Text fontSize='md'>
                                             {item.user_nickname ? item.user_nickname : item.user_name}
@@ -108,12 +102,12 @@ const MyPost = () => {
                                     </Text>
                                     {item.file_url &&
                                         <Image
-                                                src={item.file_url}
-                                                width={200}
-                                                height={200}
-                                                alt="Imege"
-                                                style={{ width: 'auto', height: 'auto' }}
-                                                priority
+                                            src={item.file_url}
+                                            width={200}
+                                            height={200}
+                                            alt="Image"
+                                            style={{ width: 'auto', height: 'auto' }}
+                                            priority
                                         />
                                     }
                                 </Box>
@@ -139,6 +133,6 @@ const MyPost = () => {
             </Box>
         </>
     );
-}
+};
 
-export default MyPost;
\ No newline at end of file
+export default MyPost;