Merge branch 'master' into 375-feature-search-groups

.github/workflows/production.yaml

@@ -5,53 +5,64 @@ on:
     types:
       - released
 
+env:
+  REGISTRY: ghcr.io
+  REPOSITORY: ${{ github.repository }}
+  IMAGE_TAG: prod${{ github.run_number }}
+
 jobs:
   build:
     runs-on: ubuntu-latest
+
     permissions:
+      contents: read
+      packages: write
       deployments: write
+
     environment:
       name: production
       url: https://ziggle.gistory.me
-    outputs:
-      ECR_REGISTRY: ${{ steps.login-ecr.outputs.registry }}
-      ECR_REPOSITORY: ziggle-frontend
-      IMAGE_TAG: prod${{ github.run_number }}
-    steps:
-      - uses: actions/checkout@v4
-
-      - name: Configure AWS credentials
-        uses: aws-actions/configure-aws-credentials@v4
-        with:
-          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
-          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
-          aws-region: ap-northeast-2
-
-      - name: Login to Amazon ECR
-        id: login-ecr
-        uses: aws-actions/amazon-ecr-login@v2
 
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
+    steps:
+      - name: Checkout Repository
+        uses: actions/checkout@v4
 
       - name: setup environment
         run: |
           echo "${{ vars.ENV }}" >> .env.production
           echo "NEXTAUTH_SECRET=${{ secrets.NEXTAUTH_SECRET }}" >> .env.production
           echo "IDP_CLIENT_SECRET=${{ secrets.IDP_CLIENT_SECRET }}" >> .env.production
+          echo "NEXT_PUBLIC_GA_TRACKING_ID=${{ secrets.GA_TRACKING_ID }}" >> .env.production
+          echo "NEXT_PUBLIC_AMPLITUDE_API_KEY=${{ secrets.AMPLITUDE_API_KEY }}" >> .env.production
 
-      - name: Build, tag, and push image to Amazon ECR
-        uses: docker/build-push-action@v5
-        env:
-          ECR_REGISTRY: ${{ steps.login-ecr.outputs.registry }}
-          ECR_REPOSITORY: ziggle-frontend
-          IMAGE_TAG: prod${{ github.run_number }} # Use run number as image tag
+      - name: Login to the Container Registry
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Extract metadata (tags, labels) from the Docker
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ${{ env.REGISTRY }}/${{ env.REPOSITORY }}
+          tags: ${{ env.IMAGE_TAG }}
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Build and push Docker image
+        id: push
+        uses: docker/build-push-action@v6
         with:
           context: .
           push: true
-          tags: ${{ env.ECR_REGISTRY }}/${{ env.ECR_REPOSITORY }}:${{ env.IMAGE_TAG }}
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
           cache-from: type=gha
           cache-to: type=gha,mode=max
+
   deploy:
     name: Update Git Repository
     needs: build
@@ -65,19 +76,12 @@ jobs:
           fetch-depth: 0
 
       - name: Update Kubernetes Manifest
-        env:
-          ECR_REGISTRY: ${{ needs.build.outputs.ECR_REGISTRY }}
-          ECR_REPOSITORY: ${{ needs.build.outputs.ECR_REPOSITORY }}
-          IMAGE_TAG: ${{ needs.build.outputs.IMAGE_TAG }}
         run: |
-          sed -i "s|image:.*|image: $ECR_REGISTRY\/$ECR_REPOSITORY:$IMAGE_TAG|g" infoteam/service/ziggle/next.prod.yaml
+          sed -i "s|image:.*|image: $REGISTRY\/$REPOSITORY:$IMAGE_TAG|g" infoteam/service/ziggle/next.prod.yaml
 
       - name: Commit and Push
-        env:
-          ECR_REPOSITORY: ${{ needs.build.outputs.ECR_REPOSITORY }}
-          IMAGE_TAG: ${{ needs.build.outputs.IMAGE_TAG }}
         run: |
           git config --global user.email "41898282+github-actions[bot]@users.noreply.github.com"
           git config --global user.name "GitHub Actions"
-          git commit -am "Update image $ECR_REPOSITORY:$IMAGE_TAG"
+          git commit -am "Update image $REPOSITORY:$IMAGE_TAG"
           git push -u origin master

.github/workflows/staging.yaml

@@ -5,53 +5,63 @@ on:
     branches:
       - master
 
+env:
+  REGISTRY: ghcr.io
+  REPOSITORY: ${{ github.repository }}
+  IMAGE_TAG: dev${{ github.run_number }}
+
 jobs:
   build:
+    name: Build docker image
     runs-on: ubuntu-latest
+
     permissions:
+      contents: read
+      packages: write
       deployments: write
+
     environment:
       name: staging
       url: https://stg.ziggle.gistory.me
-    outputs:
-      ECR_REGISTRY: ${{ steps.login-ecr.outputs.registry }}
-      ECR_REPOSITORY: ziggle-frontend
-      IMAGE_TAG: dev${{ github.run_number }}
-    steps:
-      - uses: actions/checkout@v4
-
-      - name: Configure AWS credentials
-        uses: aws-actions/configure-aws-credentials@v4
-        with:
-          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
-          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
-          aws-region: ap-northeast-2
 
-      - name: Login to Amazon ECR
-        id: login-ecr
-        uses: aws-actions/amazon-ecr-login@v2
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
 
       - name: setup environment
         run: |
           echo "${{ vars.ENV }}" >> .env.production
           echo "NEXTAUTH_SECRET=${{ secrets.NEXTAUTH_SECRET }}" >> .env.production
           echo "IDP_CLIENT_SECRET=${{ secrets.IDP_CLIENT_SECRET }}" >> .env.production
 
-      - name: Build, tag, and push image to Amazon ECR
-        uses: docker/build-push-action@v5
-        env:
-          ECR_REGISTRY: ${{ steps.login-ecr.outputs.registry }}
-          ECR_REPOSITORY: ziggle-frontend
-          IMAGE_TAG: dev${{ github.run_number }} # Use run number as image tag
+      - name: Login to the Container Registry
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Extract metadata (tags, labels) from the Docker
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ${{ env.REGISTRY }}/${{ env.REPOSITORY }}
+          tags: ${{ env.IMAGE_TAG }}
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Build and push Docker image
+        id: push
+        uses: docker/build-push-action@v6
         with:
           context: .
           push: true
-          tags: ${{ env.ECR_REGISTRY }}/${{ env.ECR_REPOSITORY }}:${{ env.IMAGE_TAG }}
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
           cache-from: type=gha
           cache-to: type=gha,mode=max
+
   deploy:
     name: Update Git Repository
     needs: build
@@ -65,19 +75,12 @@ jobs:
           fetch-depth: 0
 
       - name: Update Kubernetes Manifest
-        env:
-          ECR_REGISTRY: ${{ needs.build.outputs.ECR_REGISTRY }}
-          ECR_REPOSITORY: ${{ needs.build.outputs.ECR_REPOSITORY }}
-          IMAGE_TAG: ${{ needs.build.outputs.IMAGE_TAG }}
         run: |
-          sed -i "s|image:.*|image: $ECR_REGISTRY\/$ECR_REPOSITORY:$IMAGE_TAG|g" infoteam/service/ziggle/next.stg.yaml
+          sed -i "s|image:.*|image: $REGISTRY\/$REPOSITORY:$IMAGE_TAG|g" infoteam/service/ziggle/next.stg.yaml
 
       - name: Commit and Push
-        env:
-          ECR_REPOSITORY: ${{ needs.build.outputs.ECR_REPOSITORY }}
-          IMAGE_TAG: ${{ needs.build.outputs.IMAGE_TAG }}
         run: |
           git config --global user.email "41898282+github-actions[bot]@users.noreply.github.com"
           git config --global user.name "GitHub Actions"
-          git commit -am "Update image $ECR_REPOSITORY:$IMAGE_TAG"
+          git commit -am "Update image $REPOSITORY:$IMAGE_TAG"
           git push -u origin master

.gitignore

@@ -39,3 +39,6 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+playwright
+test-results
+playwright-report

.vscode/settings.json

@@ -14,6 +14,7 @@
   },
   "editor.formatOnSave": false,
   "cSpell.words": [
+    "Swal",
     "Zabo",
     "Ziggle"
   ],

package.json

@@ -11,6 +11,8 @@
     "build-storybook": "storybook build"
   },
   "dependencies": {
+    "@amplitude/analytics-browser": "^2.11.9",
+    "@next/third-parties": "^15.0.3",
     "@tinymce/tinymce-react": "^4.3.0",
     "@toss/use-overlay": "^1.4.0",
     "@vercel/og": "^0.5.17",
@@ -26,6 +28,7 @@
     "lottie-react": "^2.4.0",
     "next": "14.2.3",
     "next-auth": "^4.24.7",
+    "next-themes": "^0.4.3",
     "react": "^18",
     "react-calendar": "^4.6.1",
     "react-clock": "^4.5.1",

src/api/image/image.ts

@@ -3,6 +3,6 @@ import { ziggleApi } from '..';
 export const uploadImages = async (images: File[]) => {
   const fd = new FormData();
   images.forEach((image) => fd.append('images', image));
-  const { data } = await ziggleApi.post('/image/upload', fd);
+  const { data } = await ziggleApi.post<string[]>('/image/upload', fd);
   return data;
 };

src/api/log/log-events.ts

@@ -2,45 +2,76 @@ const LogEvents = {
   screenView: 'screen_view',
 
   // Nav Bar
-  navBarClickLogo: 'nav_bar_click_logo',
-  navBarClickAll: 'nav_bar_click_all',
-  navBarClickWrite: 'nav_bar_click_write',
-  navBarClickSearch: 'nav_bar_click_search',
-  navBarClickLogin: 'nav_bar_click_login',
-  navBarClickMyPage: 'nav_bar_click_my_page',
+  navBarClickLogo: 'navbar_click_logo',
+  navBarClickLogin: 'navbar_click_login',
+  navBarClickMyPage: 'navbar_click_my_page',
+  // only for mobile
+  navBarClickMenu: 'navbar_click_menu',
+
+  // Search Page
+  searchSubmit: 'search_submit',
+  searchClickSearch: 'search_click_search',
+  searchChangeKeyword: 'search_change_keyword',
+  searchClickClear: 'search_click_clear',
+  // only for mobile
+  searchClickExpand: 'search_click_expand',
+  searchClickCancel: 'search_click_cancel',
 
   // Footer
   footerClickGithub: 'footer_click_github',
   footerClickPlayStore: 'footer_click_play_store',
   footerClickAppStore: 'footer_click_app_store',
   footerClickInfo: 'footer_click_info',
+  footerClickBugReport: 'footer_click_bug_report',
   footerClickServiceTerms: 'footer_click_service_terms',
   footerClickPrivacyPolicy: 'footer_click_privacy_policy',
   footerClickContact: 'footer_click_contact',
+  footerClickHouse: 'footer_click_house',
   footerClickGist: 'footer_click_gist',
   footerClickGijol: 'footer_click_gijol',
 
-  // Home Page
+  // Sidebar
+  sidebarClickLink: 'sidebar_click_link',
+  sidebarClickProfile: 'sidebar_click_profile',
 
-  // Search Page
-  searchPageSubmit: 'search_page_submit',
-  searchPageTypeChange: 'search_page_type_change',
-  searchPageClickCancel: 'search_page_click_cancel',
+  // My Page
+  myClickMyNotice: 'my_click_my_notice',
+  myClickReminded: 'my_click_reminded',
+  myClickBugReport: 'my_click_bug_report',
+  myToggleLanguage: 'my_toggle_language',
+  myClickMode: 'my_click_mode',
+  myClickLogout: 'my_click_logout',
+  myClickUnregister: 'my_click_unregister',
+
+  // Notice Detail Page
+  detailClickImage: 'detail_click_image',
+  detailClickReaction: 'detail_click_reaction',
+  detailClickShare: 'detail_click_share',
+  detailClickCopyLink: 'detail_click_copy_link',
+  // only for author
+  detailClickEdit: 'detail_click_edit',
+  detailClickRemove: 'detail_click_remove',
 
   // Notice Writing Page
-  noticeWritingPageTypeTitle: 'notice_writing_page_type_title',
-  noticeWritingPageCheckDeadline: 'notice_writing_page_check_deadline',
-  noticeWritingPageCheckEnglish: 'notice_writing_page_check_english',
-  noticeWritingPageSetDeadline: 'notice_writing_page_set_deadline',
-  noticeWritingPageSetType: 'notice_writing_page_set_type',
-  noticeWritingPageTypeTag: 'notice_writing_page_type_tag',
-  noticeWritingPageTypeContent: 'notice_writing_page_type_content',
-  noticeWritingPageClickSubmit: 'notice_writing_page_click_submit',
+  writingAcceptSaved: 'writing_accept_saved',
+  writingRejectSaved: 'writing_reject_saved',
+  writingToggleEnglish: 'writing_toggle_english',
+  writingChangeTab: 'writing_change_tab',
+  writingClickDeepl: 'writing_click_deepl',
+  writingSelectType: 'writing_select_type',
+  writingToggleDeadline: 'writing_toggle_deadline',
+  writingSetDeadline: 'writing_set_deadline',
+  writingSubmit: 'writing_submit',
+  // edit mode
+  writingModify: 'writing_modify',
+
+  // Category Page
+  categoryToggleDeadline: 'category_toggle_deadline',
 
   // Components
   noticeClick: 'notice_click',
-  searchResultClick: 'search_result_click',
-  search: 'search',
+  noticeClickReaction: 'notice_click_reaction',
+  noticeClickShare: 'notice_click_share',
 } as const;
 
 export default LogEvents;