Merge branch 'develop' into fix/fix-finished-topic-timestamp

.github/workflows/deploy-aws.yml

@@ -25,7 +25,7 @@ jobs:
           --deployment-config-name CodeDeployDefault.OneAtATime \
           --deployment-group-name ${{ env.PROJECT }}-deploy-group \
           --description "Deployment for ${{ env.PROJECT }}" \
-          --github-location repository=KoukiNAGATA/sushi-chat,commitId="${{ github.sha }}" \
-          --file-exists-behavior RETAIN \
+          --github-location repository=$GITHUB_REPOSITORY,commitId="${{ github.sha }}" \
+          --file-exists-behavior OVERWRITE \
         env:
           PROJECT: sushi-chat

.github/workflows/front-preview-deploy.yml

@@ -0,0 +1,26 @@
+name: Frontend preview deploy
+on:
+  pull_request:
+    paths:
+      - "app/front/**"
+      - "yarn.lock"
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          ref: ${{ github.event.inputs.ref }}
+      - name: Deploy to vercel
+        id: deploy-to-vercel
+        uses: amondnet/vercel-action@v20
+        with:
+          vercel-token: ${{ secrets.VERCEL_TOKEN }}
+          vercel-org-id: ${{ secrets.ORG_ID }}
+          vercel-project-id: ${{ secrets.PROJECT_ID }}
+      - name: Comment to PR
+        uses: thollander/actions-comment-pull-request@v1
+        with:
+          message: "Success to deploy preview URL!\n\n${{ steps.deploy-to-vercel.outputs.preview-url }}"
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/front-production-deploy.yml

@@ -0,0 +1,21 @@
+name: Frontend production deploy
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          ref: ${{ github.event.inputs.ref }}
+      - name: Deploy to vercel
+        id: deploy-to-vercel
+        uses: amondnet/vercel-action@v20
+        with:
+          vercel-token: ${{ secrets.VERCEL_TOKEN }}
+          vercel-org-id: ${{ secrets.ORG_ID }}
+          vercel-project-id: ${{ secrets.PROJECT_ID }}
+          vercel-args: "--prod"

app/front/apiClient/index.ts

@@ -1,5 +1,6 @@
 import { NuxtAxiosInstance } from "@nuxtjs/axios"
-import { RestApi, PathsWithMethod } from "sushi-chat-shared"
+import { RestApi, PathsWithMethod, EmptyRecord } from "sushi-chat-shared"
+import getIdToken from "~/utils/getIdToken"
 
 type PathObject<
   Method extends "get" | "post" | "put",
@@ -9,6 +10,13 @@ type PathObject<
   params: RestApi<Method, Path>["params"]
 }
 
+type PathOrPathObj<
+  Method extends "get" | "post" | "put",
+  Path extends PathsWithMethod<Method>,
+> = Path extends `${string}:${string}`
+  ? PathObject<Method, Path>
+  : Path | PathObject<Method, Path>
+
 /**
  * PathObjectからパスを組み立てる関数
  * @param path PathObject
@@ -32,7 +40,6 @@ const pathBuilder = (path: {
  *  async asyncData({ app }) {
  *    const sampleResponse = await app.$apiClient.get(
  *      { pathname: "/room/:id/history", params: { id: "roomId" } },
- *      {},
  *    )
  *    if (sampleResponse.result === "success") {
  *      const rooms = sampleResponse.data
@@ -54,7 +61,8 @@ export default class Repository {
    * idTokenを設定する
    * @param idToken idToken
    */
-  public setToken(idToken: string | null) {
+  public async setToken() {
+    const idToken = await getIdToken()
     if (idToken != null) {
       this.nuxtAxios.setToken(`Bearer ${idToken}`)
     } else {
@@ -65,18 +73,18 @@ export default class Repository {
   /**
    * getリクエストを行う
    * @param path エンドポイントを表すPathObjectまたはパス文字列（パスパラメータ（`:xyz`）を含まない場合は直接文字列を指定可能）
-   * @param data 送信するデータ
+   * @param query クエリパラメータ
    * @returns レスポンス
    */
   public async get<Path extends PathsWithMethod<"get">>(
-    path: Path extends `${string}:${string}`
-      ? PathObject<"get", Path>
-      : Path | PathObject<"get", Path>,
-    data: RestApi<"get", Path>["request"],
+    ...[path, query]: RestApi<"get", Path>["query"] extends EmptyRecord
+      ? [path: PathOrPathObj<"get", Path>]
+      : [path: PathOrPathObj<"get", Path>, query: RestApi<"get", Path>["query"]]
   ) {
+    await this.setToken()
     return await this.nuxtAxios.$get<RestApi<"get", Path>["response"]>(
       typeof path === "string" ? path : pathBuilder(path),
-      { data },
+      { params: query },
     )
   }
 
@@ -87,14 +95,32 @@ export default class Repository {
    * @returns レスポンス
    */
   public async post<Path extends PathsWithMethod<"post">>(
-    path: Path extends `${string}:${string}`
-      ? PathObject<"post", Path>
-      : Path | PathObject<"post", Path>,
-    data: RestApi<"post", Path>["request"],
+    ...[path, body, query]: RestApi<"post", Path>["request"] extends EmptyRecord
+      ? RestApi<"post", Path>["query"] extends EmptyRecord
+        ? [path: PathOrPathObj<"post", Path>]
+        : [
+            path: PathOrPathObj<"post", Path>,
+            body: RestApi<"post", Path>["request"],
+            query: RestApi<"post", Path>["query"],
+          ]
+      : RestApi<"post", Path>["query"] extends EmptyRecord
+      ? [
+          path: PathOrPathObj<"post", Path>,
+          body: RestApi<"post", Path>["request"],
+        ]
+      : [
+          path: PathOrPathObj<"post", Path>,
+          body: RestApi<"post", Path>["request"],
+          query: RestApi<"post", Path>["query"],
+        ]
   ) {
+    await this.setToken()
     return await this.nuxtAxios.$post<RestApi<"post", Path>["response"]>(
       typeof path === "string" ? path : pathBuilder(path),
-      data,
+      body,
+      {
+        params: query,
+      },
     )
   }
 
@@ -105,14 +131,32 @@ export default class Repository {
    * @returns レスポンス
    */
   public async put<Path extends PathsWithMethod<"put">>(
-    path: Path extends `${string}:${string}`
-      ? PathObject<"put", Path>
-      : Path | PathObject<"put", Path>,
-    data: RestApi<"put", Path>["request"],
+    ...[path, data, query]: RestApi<"put", Path>["request"] extends EmptyRecord
+      ? RestApi<"put", Path>["query"] extends EmptyRecord
+        ? [path: PathOrPathObj<"put", Path>]
+        : [
+            path: PathOrPathObj<"put", Path>,
+            body: RestApi<"put", Path>["request"],
+            query: RestApi<"put", Path>["query"],
+          ]
+      : RestApi<"put", Path>["query"] extends EmptyRecord
+      ? [
+          path: PathOrPathObj<"put", Path>,
+          body: RestApi<"put", Path>["request"],
+        ]
+      : [
+          path: PathOrPathObj<"put", Path>,
+          body: RestApi<"put", Path>["request"],
+          query: RestApi<"put", Path>["query"],
+        ]
   ) {
+    await this.setToken()
     return await this.nuxtAxios.$put<RestApi<"put", Path>["response"]>(
       typeof path === "string" ? path : pathBuilder(path),
       data,
+      {
+        params: query,
+      },
     )
   }
 }

app/front/assets/scss/admin.scss

@@ -1,19 +1,18 @@
 /*管理画面*/
 .drawer-menu-wrapper {
-  position: absolute;
+  position: fixed;
   z-index: $z-modal;
   right: 0;
-  width: 100%;
   height: 100%;
   background-color: $bg;
   word-break: break-all;
   display: none;
-  @media screen and (min-width: $large+px) {
+  @media screen and (min-width: $large) {
     display: block;
   }
 
   .drawer-menu {
-    padding: 30px;
+    padding: 16px 30px;
     display: flex;
     flex-direction: column;
     height: 100%;
@@ -161,7 +160,7 @@
           justify-content: center;
           align-items: center;
           & .text-mini {
-            font-size: 60%;
+            font-size: 12px;
           }
         }
       }
@@ -192,6 +191,10 @@
           &.pause {
             margin-right: 0.5rem;
           }
+
+          &.reopen {
+            padding: 10px;
+          }
         }
       }
     }
@@ -222,9 +225,6 @@
 }
 
 @media screen and (min-width: 880px) {
-  .drawer-menu-wrapper {
-    width: calc(80% - 440px - 2em);
-  }
   .room-info {
     padding: 0px;
   }

app/front/assets/scss/common.scss

@@ -23,6 +23,10 @@ button {
   &:focus-visible {
     outline: auto;
   }
+
+  &:disabled {
+    cursor: default;
+  }
 }
 
 label {