fix: いいね機能のemits名修正

.env.example

@@ -0,0 +1,5 @@
+DB_NAME=your_database_name
+DB_USER=your_username
+DB_PASSWORD=your_password
+MINIO_ROOT_USER=your_minio_user
+MINIO_ROOT_PASSWORD=your_minio_password

.gitignore

@@ -0,0 +1 @@
+.env

docker-compose.yml

@@ -16,10 +16,9 @@ services:
     ports:
       - 35555:5432
     environment:
-      TZ: Asia/Tokyo
-      POSTGRES_DB: curry_addiction
-      POSTGRES_USER: root
-      POSTGRES_PASSWORD: secret
+      POSTGRES_DB: ${DB_NAME}
+      POSTGRES_USER: ${DB_USER}
+      POSTGRES_PASSWORD: ${DB_PASSWORD}
     volumes:
       - postgres_data:/var/lib/postgresql
 
@@ -34,9 +33,9 @@ services:
       - DB_CONNECTION=pgsql
       - DB_HOST=curry_addiction_db
       - DB_PORT=5432
-      - DB_DATABASE=curry_addiction
-      - DB_USERNAME=root
-      - DB_PASSWORD=secret
+      - DB_DATABASE=${DB_NAME}
+      - DB_USERNAME=${DB_USER}
+      - DB_PASSWORD=${DB_PASSWORD}
 
   curry_addiction_composer:
     build: docker/composer
@@ -72,8 +71,8 @@ services:
       - "9000:9000"
       - "9090:9091"
     environment:
-      - MINIO_ROOT_USER=minio
-      - MINIO_ROOT_PASSWORD=minio123
+      - MINIO_ROOT_USER=${MINIO_ROOT_USER}
+      - MINIO_ROOT_PASSWORD=${MINIO_ROOT_PASSWORD}
     entrypoint: sh
     command: -c "
       mkdir -p /data/.minio.sys/buckets;

frontend-user/src/views/atoms/PageItem.vue

@@ -11,7 +11,7 @@ defineProps<Props>()
     class="inline-flex items-center font-body text-sumi-500 text-sm border border-gray-200 duration-500 hover:bg-gray-50 focus:z-20 focus:outline-offset-0 first-of-type:rounded-l-full last-of-type:rounded-r-full"
     :class="{
       'bg-sumi-100 text-sumi-900': active,
-      hidden: disabled,
+      'opacity-50': disabled,
       'cursor-not-allowed': disabled
     }"
   >

frontend-user/src/views/molecules/card/Card.vue

@@ -14,8 +14,8 @@ defineProps<Props>()
 
 const emits = defineEmits<{
   (e: 'clickItem'): void
-  (e: 'toggleLike'): void
-  (e: 'toggleArchive'): void
+  (e: 'like'): void
+  (e: 'archive'): void
 }>()
 </script>
 <template>
@@ -30,8 +30,8 @@ const emits = defineEmits<{
       :date
       :is-liked
       :is-archived
-      @toggle-like="emits('toggleLike')"
-      @toggle-archive="emits('toggleArchive')"
+      @like="emits('like')"
+      @archive="emits('archive')"
     />
   </div>
 </template>

frontend-user/src/views/molecules/card/CardBody.vue

@@ -14,18 +14,13 @@ interface Props {
 defineProps<Props>()
 
 const emits = defineEmits<{
-  (e: 'toggleLike'): void
-  (e: 'toggleArchive'): void
+  (e: 'like'): void
+  (e: 'archive'): void
 }>()
 </script>
 <template>
   <div class="flex flex-col justify-between h-28 pb-2">
-    <CardIcons
-      :is-liked
-      :is-archived
-      @toggle-like="emits('toggleLike')"
-      @toggle-archive="emits('toggleArchive')"
-    />
+    <CardIcons :is-liked :is-archived @like="emits('like')" @archive="emits('archive')" />
     <StoreNameBrowseItem class="text-md px-3 py-1 text-sumi-900" :store-name="storeName" />
     <div class="flex justify-between items-center">
       <StoreLocationBrowseItem :location :date />

frontend-user/src/views/molecules/card/CardIcons.vue

@@ -8,33 +8,32 @@ interface Props {
   readonly isLiked: boolean
   readonly isArchived: boolean
 }
-
 defineProps<Props>()
 
 const emits = defineEmits<{
-  (e: 'toggleLike'): void
-  (e: 'toggleArchive'): void
+  (e: 'like'): void
+  (e: 'archive'): void
 }>()
 </script>
 <template>
   <div class="flex justify-between h-fit px-1.5 py-1">
     <div
-      @click.stop="emits('toggleLike')"
+      @click.stop="emits('like')"
       class="w-8 h-8 rounded-full transition-opacity duration-500 cursor-pointer hover:bg-gray-100 flex items-center justify-center"
       v-show="!isLiked"
     >
       <HeartIcon class="text-gray-700 cursor-pointer" />
     </div>
     <div
-      @click.stop="emits('toggleLike')"
+      @click.stop="emits('like')"
       class="w-8 h-8 relative rounded-full transition-opacity duration-500 cursor-pointer hover:bg-pink-50 flex items-center justify-center"
       v-show="isLiked"
     >
       <LikedHeartIcon class="text-transparent cursor-pointer fill-red-400" :liked="isLiked" />
       <LikedAnimationDots />
     </div>
     <div
-      @click.stop="emits('toggleArchive')"
+      @click.stop="emits('archive')"
       class="w-8 h-8 rounded-full transition-opacity duration-500 cursor-pointer hover:bg-gray-100 flex items-center justify-center"
     >
       <ArchiveIcon class="text-gray-700 cursor-pointer" :archived="isArchived" />

frontend-user/src/views/pages/Dashboard/Like/components/PostList.vue

@@ -38,7 +38,7 @@ async function loadPosts(
       posts.value = data
       paginationStatus.value = meta
     } catch (error) {
-      console.error('Failed to load posts:', error)
+      console.error('投稿の読み込みに失敗しました。:', error)
     }
   }
 }
@@ -53,13 +53,27 @@ function toViewer(postId: number): void {
   router.push({ name: 'PostViewer', params: { id: postId } })
 }
 
-async function toggleLike(postId: number): Promise<void> {
+// いいね一覧ページではいいねした投稿のみ取得
+// =>いいねの解除のみ可能
+async function removeLike(postId: number): Promise<void> {
   try {
     const response = await likePost(postId)
     if (response.status === 200) {
-      const postIndex = posts.value.findIndex((post) => post.id === postId)
-      if (postIndex !== -1) {
-        posts.value[postIndex].current_user_liked = !posts.value[postIndex].current_user_liked
+      posts.value = posts.value.filter((post) => post.id !== postId)
+
+      // ページネーションの総数を更新
+      if (paginationStatus.value && paginationStatus.value.total) {
+        paginationStatus.value.total -= 1
+      }
+
+      // 現在のページの投稿が0になった場合、前のページに戻る
+      if (
+        posts.value.length === 0 &&
+        paginationStatus.value &&
+        paginationStatus.value.current_page &&
+        paginationStatus.value.current_page > 1
+      ) {
+        await doChangePage(paginationStatus.value.current_page - 1)
       }
     }
   } catch (error) {
@@ -101,8 +115,8 @@ watch(
       :is-liked="post.current_user_liked"
       :is-archived="false"
       @clickItem="toViewer(post.id)"
-      @toggle-like="toggleLike(post.id)"
-      @toggle-archive="toggleArchive(post.id)"
+      @like="removeLike(post.id)"
+      @archive="toggleArchive(post.id)"
     />
   </CardDisplayAreaLayout>
   <Pagination class="mt-12" @change-page="doChangePage" :pagination-status="paginationStatus" />

frontend-user/src/views/pages/Dashboard/Trash/components/TrashList.vue

@@ -36,7 +36,7 @@ async function loadPosts(page: number = 1, userId: number, forceReload: boolean
       posts.value = data
       paginationStatus.value = meta
     } catch (error) {
-      console.error('Failed to load posts:', error)
+      console.error('投稿の読み込みに失敗しました。:', error)
     }
   }
 }

frontend-user/src/views/pages/Post/components/PostList.vue

@@ -33,7 +33,7 @@ async function loadPosts(page: number = 1, userId?: number, forceReload: boolean
       posts.value = data
       paginationStatus.value = meta
     } catch (error) {
-      console.error('Failed to load posts:', error)
+      console.error('投稿の読み込みに失敗しました。:', error)
     }
   }
 }
@@ -96,8 +96,8 @@ watch(
       :is-liked="post.current_user_liked"
       :is-archived="false"
       @clickItem="toViewer(post.id)"
-      @toggle-like="toggleLike(post.id)"
-      @toggle-archive="toggleArchive(post.id)"
+      @like="toggleLike(post.id)"
+      @archive="toggleArchive(post.id)"
     />
   </CardDisplayAreaLayout>
   <Pagination class="mt-12" @change-page="doChangePage" :pagination-status="paginationStatus" />