0.1.7 #33

0.1.7

.github/workflows/deploy.yaml

@@ -0,0 +1,66 @@
+name: deploy-cluster
+on:
+  push:
+    branches: ["k8s"]
+jobs:
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+    steps:
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v1
+
+      # - name: Login to GitHub Container Registry
+      #   uses: docker/login-action@v2
+      #   with:
+      #     registry: ghcr.io
+      #     username: ${{github.actor}}
+      #     password: ${{ secrets.GH_TOKEN }}
+
+      - name: Login to Vultr Container Registry
+        uses: docker/login-action@v2
+        with:
+          registry: sjc.vultrcr.com
+          username: ${{ secrets.VULTR_REGU }}
+          password: ${{ secrets.VULTR_REPW }}
+
+      - name: Build and push the Docker image
+        uses: docker/build-push-action@v3
+        with:
+          push: true
+          tags: |
+            sjc.vultrcr.com/medici/shin-front:latest
+            sjc.vultrcr.com/medici/shin-front:${{ github.sha }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+      # - name: Build and push the Docker image
+      #   uses: docker/build-push-action@v3
+      #   with:
+      #     push: true
+      #     tags: |
+      #       ghcr.io/medici-mansion/shinnyang-server-dev:latest
+      #       ghcr.io/medici-mansion/shinnyang-server-dev:${{ github.sha }}
+      #     cache-from: type=gha
+      #     cache-to: type=gha,mode=max
+  deploy:
+    name: Deploy
+    needs: [build]
+    runs-on: ubuntu-latest
+    steps:
+      - name: Set the Kubernetes context
+        uses: azure/k8s-set-context@v2
+        with:
+          method: service-account
+          k8s-url: https://cc33adee-ae13-46cb-9388-19d5a494a094.vultr-k8s.com:6443
+          k8s-secret: ${{ secrets.KUBERNETES_SECRET }}
+      - name: Checkout source code
+        uses: actions/checkout@v3
+      - name: Deploy to the Kubernetes cluster
+        uses: azure/k8s-deploy@v1
+        with:
+          namespace: default
+          manifests: |
+            k8s/deployment.yaml
+            k8s/service.yaml
+          images: |
+            sjc.vultrcr.com/medici/shin-front:${{ github.sha }}

Dockerfile

@@ -0,0 +1,66 @@
+FROM node:21-alpine AS base
+
+# Install dependencies only when needed
+FROM base AS deps
+# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
+RUN apk add --no-cache libc6-compat
+WORKDIR /app
+
+# Install dependencies based on the preferred package manager
+COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
+RUN \
+  if [ -f yarn.lock ]; then yarn add sharp --ignore-engines && yarn --frozen-lockfile; \
+  elif [ -f package-lock.json ]; then npm ci; \
+  elif [ -f pnpm-lock.yaml ]; then yarn global add pnpm &&  pnpm i --force @img/sharp-linuxmusl-x64 && pnpm i --frozen-lockfile ; \
+  else echo "Lockfile not found." && exit 1; \
+  fi
+
+# Rebuild the source code only when needed
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+
+# Next.js collects completely anonymous telemetry data about general usage.
+# Learn more here: https://nextjs.org/telemetry
+# Uncomment the following line in case you want to disable telemetry during the build.
+# ENV NEXT_TELEMETRY_DISABLED 1
+
+RUN yarn build
+
+# If using npm comment out above and use below instead
+# RUN npm run build
+
+# Production image, copy all the files and run next
+FROM base AS runner
+WORKDIR /app
+
+ENV NODE_ENV production
+# Uncomment the following line in case you want to disable telemetry during runtime.
+# ENV NEXT_TELEMETRY_DISABLED 1
+
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+
+COPY --from=builder /app/public ./public
+
+# Set the correct permission for prerender cache
+RUN mkdir .next
+RUN chown nextjs:nodejs .next
+
+# Automatically leverage output traces to reduce image size
+# https://nextjs.org/docs/advanced-features/output-file-tracing
+COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
+COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
+
+USER nextjs
+
+EXPOSE 3000
+
+ENV PORT 3000
+# set hostname to localhost
+ENV HOSTNAME "0.0.0.0"
+
+# server.js is created by next build from the standalone output
+# https://nextjs.org/docs/pages/api-reference/next-config-js/output
+CMD ["node", "server.js"]

actions/blur-image-.action.ts

@@ -0,0 +1,56 @@
+"use server";
+import { getPlaiceholder } from "plaiceholder";
+import path from "node:path";
+import fs from "node:fs/promises";
+
+export interface ImageMetadata {
+  path: string;
+  name: string;
+}
+
+export interface ImageWithBlur
+  extends Awaited<ReturnType<typeof getBlurImage>> {
+  src: string;
+}
+
+export async function getBlurImage(src: string) {
+  "use server";
+  if (!src.includes("http")) {
+    const imagePath = src;
+    const buffer = await fs.readFile(
+      path.join(process.cwd(), "public", imagePath),
+    );
+    const placeholder = await getPlaiceholder(buffer, {
+      saturation: 10,
+      size: 10,
+    });
+    return {
+      placeholder,
+      src: imagePath,
+    };
+  } else {
+    const response = await fetch(src, {
+      cache: "reload",
+    });
+    const arrayBuffer = Buffer.from(await response.arrayBuffer());
+    const placeholder = await getPlaiceholder(arrayBuffer, { size: 10 });
+    return {
+      placeholder,
+      src: src,
+    };
+  }
+}
+
+export async function generateBlurImageByImageList<T extends ImageMetadata[]>(
+  imageList: [...T],
+) {
+  "use server";
+  const result = await Promise.all(
+    imageList.map((img) => getBlurImage(img.path)),
+  );
+  const imageDict = {};
+  imageList.forEach((image, index) => {
+    (imageDict as any)[image.name] = result[index];
+  });
+  return imageDict as { [key in T[number]["name"]]: ImageWithBlur };
+}

actions/user-action.ts

@@ -22,8 +22,6 @@ export const userAction = async () => {
       };
     }
   } catch (error) {
-    cookie.delete("access");
-    cookie.delete("refresh");
     session.token = null;
   }
   return session;

apis/index.ts

@@ -1,4 +1,14 @@
-import { Acc, Cat, LetterResponse, Letters, Session, User } from "@/type";
+import {
+  Acc,
+  Cat,
+  LetterResponse,
+  Letters,
+  Mail,
+  PostCatAccessoryDTO,
+  Session,
+  User,
+  UserCatResponse,
+} from "@/type";
 import axios from "axios";
 export const api = axios.create({ baseURL: process.env.NEXT_PUBLIC_API_URL });
 export const getGoogleCode = () => {
@@ -67,13 +77,52 @@ export const getAccessories = async () => {
 
 export const sendLetter = async (param: Letters) => {
   const res = await api.post("/letters", param);
-  return res.data
+  return res.data;
 };
 
 export const getLetter = async (letterId: string) => {
   const res = await api.get<LetterResponse>(`/letters/${letterId}`);
-  return res.data
-}
+  return res.data;
+};
+
+export const getMails = async () => {
+  const res = await api.get<Mail[]>("/mails");
+  return res.data.map((mail, index) => ({ ...mail, index: index }));
+};
+
+export const getMailById = async (mailId: string) => {
+  const res = await api.get<Mail>(`/mails/${mailId}`);
+  return res.data;
+};
+export const readMail = async (mailId: string) => {
+  const res = await api.post("/mails/read", {
+    mailId,
+  });
+  return res.data;
+};
+
+export const saveMail = async (letterId: string) => {
+  const res = await api.put<boolean>("/mails", {
+    letterId,
+  });
+  return res.data;
+};
+
+export const getUserCat = async () => {
+  const response = await api.get<UserCatResponse[]>("/common/user-cat");
+
+  return response.data;
+};
+
+export const postCatAccessory = async (
+  postCatAccessoryDTO: PostCatAccessoryDTO,
+) => {
+  const response = await api.patch<UserCatResponse>(
+    "/common/accessory",
+    postCatAccessoryDTO,
+  );
+  return response.data;
+};
 
 const APIs = {
   getGoogleCode,
@@ -83,7 +132,13 @@ const APIs = {
   getCats,
   getAccessories,
   sendLetter,
-  getLetter
+  getLetter,
+  getMails,
+  readMail,
+  saveMail,
+  getMailById,
+  getUserCat,
+  postCatAccessory,
 };
 
 export default APIs;

app/(root)/(home)/[userId]/layout.tsx

@@ -1,8 +1,9 @@
 import APIs from "@/apis";
 import PrefetchQuery from "@/hydrate/prefetch-query";
 import CommonQuery from "@/lib/queries/common.query";
+import MailQuery from "@/lib/queries/mails.query";
 import { WithParam } from "@/type";
-import { cookies } from "next/headers";
+import { cookies, headers } from "next/headers";
 import { redirect } from "next/navigation";
 import React from "react";
 
@@ -13,17 +14,18 @@ const UserLayout = async ({
   const cookie = cookies();
   const access = cookie.get("access");
   const user = await APIs.getMe(access?.value || "");
+  const header = headers();
+  const pathname = header.get("x-url") || "";
+
   if (user.id !== userId) return redirect("/");
+  if (!user.nickname && !pathname.includes("nickname"))
+    return redirect(`nickname`);
   return (
-    <div className="h-[100dvh] bg-background sm:h-screen">
-      <main className="flex h-full divide-x-2">
-        <section className="pc-main-grid flex-[1]">
-          <PrefetchQuery queries={[CommonQuery.getCat]}>
-            {children}
-          </PrefetchQuery>
-        </section>
-      </main>
-    </div>
+    <PrefetchQuery
+      queries={[CommonQuery.getCat, CommonQuery.getAcc, MailQuery.getMails]}
+    >
+      {children}
+    </PrefetchQuery>
   );
 };