From 5170aca9779fba16ba1bdae4514146e71acdf37c Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 8 Sep 2025 02:14:08 +0900 Subject: [PATCH 01/20] feat: Add PKS section --- .../components/my-page/MyPagePKSSection.tsx | 93 +++++++++++++++++++ websites/poolc.org/src/hooks/useCopy.ts | 37 ++++++++ websites/poolc.org/src/lib/api-v2/queryKey.ts | 3 + .../poolc.org/src/pages/my-page/MyPage.tsx | 13 ++- 4 files changed, 144 insertions(+), 2 deletions(-) create mode 100644 websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx create mode 100644 websites/poolc.org/src/hooks/useCopy.ts diff --git a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx new file mode 100644 index 00000000..40311c54 --- /dev/null +++ b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx @@ -0,0 +1,93 @@ +import { CopyOutlined, CheckOutlined } from '@ant-design/icons'; +import { Typography, Space, Button } from 'antd'; +import { createStyles } from 'antd-style'; +import useCopy from '../../hooks/useCopy'; + +const { Link, Paragraph } = Typography; + +export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { + const { styles } = useStyles(); + const { isCopied, copy } = useCopy(); + + const code = dedent`kubectl config set-credentials pks --token=${jwtToken} + kubectl config set-cluster pks --server="https://165.132.131.121:6443" --insecure-skip-tls-verify=true + kubectl config set-context pks --cluster=pks --user=pks + kubectl config use-context pks`; + + return ( + + + + Docs [https://github.com/PoolC/PKS-docs/tree/user-guide] + + +
+
+ Command +
+ 
{code}
+
+ + ); +} + +const useStyles = createStyles(({ css }) => ({ + container: css({ + width: '100%', + }), + title: css({ + margin: '0 !important', + }), + docs: css({ + color: '#000', + }), + codeBlock: css({ + width: '100%', + border: '1px solid rgba(100, 100, 100, 0.2)', + borderRadius: '6px', + overflow: 'hidden', + }), + codeHeader: css({ + display: 'flex', + justifyContent: 'space-between', + alignItems: 'center', + padding: '8px 12px', + background: 'rgba(150, 150, 150, 0.1)', + borderBottom: '1px solid rgba(100, 100, 100, 0.2)', + }), + codeLabel: css({ + fontSize: '12px', + fontWeight: '500', + color: 'rgba(0, 0, 0, 0.7)', + letterSpacing: '0.5px', + }), + copyButton: css({ + border: 'none', + boxShadow: 'none', + '&:hover': { + background: 'rgba(0, 0, 0, 0.1)', + }, + }), + code: css({ + whiteSpace: 'pre !important', + margin: '0 !important', + padding: '12px', + fontFamily: 'SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace', + background: 'rgba(250, 250, 250, 0.5)', + overflowX: 'auto', + }), +})); + +function dedent(text: TemplateStringsArray, ...args: unknown[]) { + let raw = text.raw[0]; + + for (let i = 0; i < args.length; i++) { + raw += String(args[i]) + text.raw[i + 1]; + } + + return raw + .split('\n') + .map((line) => line.trim()) + .join('\n'); +} diff --git a/websites/poolc.org/src/hooks/useCopy.ts b/websites/poolc.org/src/hooks/useCopy.ts new file mode 100644 index 00000000..fbca7179 --- /dev/null +++ b/websites/poolc.org/src/hooks/useCopy.ts @@ -0,0 +1,37 @@ +import { useState, useCallback } from 'react'; + +export default function useCopy() { + const [isCopied, setIsCopied] = useState(false); + + const copy = useCallback(async (text: string) => { + if (navigator.clipboard) { + await navigator.clipboard.writeText(text); + } else { + legacyCopy(text); + } + + setIsCopied(true); + + setTimeout(() => { + setIsCopied(false); + }, 1000); + }, []); + + return { + isCopied, + copy, + }; +} + +function legacyCopy(text: string) { + const textArea = document.createElement('textarea'); + textArea.value = text; + textArea.style.position = 'fixed'; + textArea.style.left = '-999999px'; + textArea.style.top = '-999999px'; + document.body.appendChild(textArea); + textArea.focus(); + textArea.select(); + document.execCommand('copy'); + document.body.removeChild(textArea); +} diff --git a/websites/poolc.org/src/lib/api-v2/queryKey.ts b/websites/poolc.org/src/lib/api-v2/queryKey.ts index 589ae5f1..bf8ceff4 100644 --- a/websites/poolc.org/src/lib/api-v2/queryKey.ts +++ b/websites/poolc.org/src/lib/api-v2/queryKey.ts @@ -43,4 +43,7 @@ export const queryKey = { all: ['notification.all'] as const, unread: ['notification.unread'] as const, }, + kubernetes: { + me: ['kubernetes.me'] as const, + }, }; diff --git a/websites/poolc.org/src/pages/my-page/MyPage.tsx b/websites/poolc.org/src/pages/my-page/MyPage.tsx index 6bcb9ff4..97247bbf 100644 --- a/websites/poolc.org/src/pages/my-page/MyPage.tsx +++ b/websites/poolc.org/src/pages/my-page/MyPage.tsx @@ -3,12 +3,13 @@ import { createStyles } from 'antd-style'; import { Link } from 'react-router-dom'; import { ArrowRightOutlined, EditTwoTone, MessageTwoTone, QuestionCircleFilled, StarTwoTone, UserOutlined } from '@ant-design/icons'; import { Block, WhiteBlock } from '~/styles/common/Block.styles'; -import { BadgeControllerService, BaekjoonControllerService, MemberControllerService, queryKey, useAppMutation, useAppQueries } from '~/lib/api-v2'; +import { BadgeControllerService, BaekjoonControllerService, KubernetesControllerService, MemberControllerService, queryKey, useAppMutation, useAppQueries } from '~/lib/api-v2'; import { MENU } from '~/constants/menus'; import MyPageGrassSection from '~/components/my-page/MyPageGrassSection'; import { queryClient } from '~/lib/utils/queryClient'; import { getProfileImageUrl } from '~/lib/utils/getProfileImageUrl'; import getFileUrl from '~/lib/utils/getFileUrl'; +import MyPagePKSSection from '~/components/my-page/MyPagePKSSection'; const useStyles = createStyles(({ css }) => ({ whiteBlock: css` @@ -114,7 +115,7 @@ export default function MyPage() { }, ]; - const [{ data: myHour }, { data: me }, { data: badge }, { data: baekjoon }] = useAppQueries({ + const [{ data: myHour }, { data: me }, { data: badge }, { data: baekjoon }, { data: kubernetes }] = useAppQueries({ queries: [ { queryKey: queryKey.member.hour, @@ -132,6 +133,10 @@ export default function MyPage() { queryKey: queryKey.baekjoon.baekjoon, queryFn: BaekjoonControllerService.getMyBaekjoonUsingGet, }, + { + queryKey: queryKey.kubernetes.me, + queryFn: KubernetesControllerService.getMyKeyUsingGet, + }, ], }); @@ -259,6 +264,10 @@ export default function MyPage() { } /> + + PKS + + From b5c51cdf0950de5b6f0689b6e53c8e57d135648f Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 8 Sep 2025 02:16:16 +0900 Subject: [PATCH 02/20] fix: Remove warnings on dev --- .../src/components/header/Notification/Notification.tsx | 2 +- websites/poolc.org/src/pages/my-page/MyPage.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/websites/poolc.org/src/components/header/Notification/Notification.tsx b/websites/poolc.org/src/components/header/Notification/Notification.tsx index 3dbaaa50..743f23eb 100644 --- a/websites/poolc.org/src/components/header/Notification/Notification.tsx +++ b/websites/poolc.org/src/components/header/Notification/Notification.tsx @@ -222,7 +222,7 @@ export default function Notification() { return (
- + 
{code}
@@ -62,13 +62,6 @@ const useStyles = createStyles(({ css }) => ({ color: 'rgba(0, 0, 0, 0.7)', letterSpacing: '0.5px', }), - copyButton: css({ - border: 'none', - boxShadow: 'none', - '&:hover': { - background: 'rgba(0, 0, 0, 0.1)', - }, - }), code: css({ whiteSpace: 'pre !important', margin: '0 !important', From 8328d69d1f15e0a8e20ce6d9eee6e2e17f5ed60b Mon Sep 17 00:00:00 2001 From: jimmy0006 <45549879+jimmy0006@users.noreply.github.com> Date: Mon, 8 Sep 2025 19:33:32 +0900 Subject: [PATCH 04/20] Update web-client-deploy-development.yml rollback workflow for dev branch --- .../web-client-deploy-development.yml | 44 +++++++++---------- 1 file changed, 22 insertions(+), 22 deletions(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index f9d1f240..931fadc7 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -12,27 +12,27 @@ jobs: - uses: actions/checkout@v4 # TODO: 패키지 구조 변경 및 s3 배포에 따라 변경해야함 - # - uses: actions/setup-node@v4 - # with: - # node-version: '20' - # cache: 'yarn' + - uses: actions/setup-node@v4 + with: + node-version: '20' + cache: 'yarn' - # - name: build - # run: | - # rm ./apps/web/.env && mv ./apps/web/.env.dev ./apps/web/.env - # yarn set version 3.8.1 - # yarn install --immutable --immutable-cache - # yarn web codegen - # yarn web build + - name: build + run: | + rm ./apps/web/.env && mv ./apps/web/.env.dev ./apps/web/.env + yarn set version 3.8.1 + yarn install --immutable --immutable-cache + yarn web codegen + yarn web build - # - name: scp - # uses: appleboy/scp-action@v0.1.7 - # with: - # host: ${{ secrets.SSH_HOST }} - # username: ${{ secrets.SSH_USERNAME }} - # key: ${{ secrets.SSH_PEM_KEY }} - # port: ${{ secrets.SSH_PORT }} - # source: ./apps/web/build/* - # # TODO: 패키지 구조 변경에 따라 target 디렉토리도 변경해야함 - # target: ~/dialga/apps/web-client/build - # strip_components: 3 + - name: scp + uses: appleboy/scp-action@v0.1.7 + with: + host: ${{ secrets.SSH_HOST }} + username: ${{ secrets.SSH_USERNAME }} + key: ${{ secrets.SSH_PEM_KEY }} + port: ${{ secrets.SSH_PORT }} + source: ./apps/web/build/* + # TODO: 패키지 구조 변경에 따라 target 디렉토리도 변경해야함 + target: ~/k8s/dialga/build + strip_components: 3 From 279f945470b1c5ed96930e126ddafe85a42586ca Mon Sep 17 00:00:00 2001 From: jimmy0006 <45549879+jimmy0006@users.noreply.github.com> Date: Mon, 8 Sep 2025 19:35:43 +0900 Subject: [PATCH 05/20] Update web-client-deploy-development.yml fix workflow --- .github/workflows/web-client-deploy-development.yml | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index 931fadc7..1daa33e4 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -17,9 +17,16 @@ jobs: node-version: '20' cache: 'yarn' + # - name: build + # run: | + # rm ./apps/web/.env && mv ./apps/web/.env.dev ./apps/web/.env + # yarn set version 3.8.1 + # yarn install --immutable --immutable-cache + # yarn web codegen + # yarn web build - name: build run: | - rm ./apps/web/.env && mv ./apps/web/.env.dev ./apps/web/.env + mv ./apps/web/.env.dev ./apps/web/.env yarn set version 3.8.1 yarn install --immutable --immutable-cache yarn web codegen From 5eceed0c2e04abbb5b2e1bd051b03ad109b8d484 Mon Sep 17 00:00:00 2001 From: jimmy0006 <45549879+jimmy0006@users.noreply.github.com> Date: Mon, 8 Sep 2025 19:37:14 +0900 Subject: [PATCH 06/20] Update web-client-deploy-development.yml fixing dialga workflows --- .github/workflows/web-client-deploy-development.yml | 1 - 1 file changed, 1 deletion(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index 1daa33e4..4b6e22d3 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -26,7 +26,6 @@ jobs: # yarn web build - name: build run: | - mv ./apps/web/.env.dev ./apps/web/.env yarn set version 3.8.1 yarn install --immutable --immutable-cache yarn web codegen From 02349c222f7cf72b6731679d676c2ee738332766 Mon Sep 17 00:00:00 2001 From: jimmy0006 <45549879+jimmy0006@users.noreply.github.com> Date: Mon, 8 Sep 2025 19:40:57 +0900 Subject: [PATCH 07/20] Update web-client-deploy-development.yml workflows fix --- .../web-client-deploy-development.yml | 31 ++++++++++++++----- 1 file changed, 24 insertions(+), 7 deletions(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index 4b6e22d3..d490ef68 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -15,7 +15,28 @@ jobs: - uses: actions/setup-node@v4 with: node-version: '20' - cache: 'yarn' + # cache: 'yarn' + + # fix from here + - name: Cache Yarn + uses: actions/cache@v4 + with: + path: | + .yarn/cache + .yarn/releases + .yarn/plugins + .pnp.* + key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} + restore-keys: | + ${{ runner.os }}-yarn- + + - name: build + run: | + yarn set version 3.8.1 + yarn install --immutable --immutable-cache + yarn web codegen + yarn web build + # fix to here # - name: build # run: | @@ -24,12 +45,8 @@ jobs: # yarn install --immutable --immutable-cache # yarn web codegen # yarn web build - - name: build - run: | - yarn set version 3.8.1 - yarn install --immutable --immutable-cache - yarn web codegen - yarn web build + + - name: scp uses: appleboy/scp-action@v0.1.7 From 76d23feb26b8895aa7d036af926c0a658eebad81 Mon Sep 17 00:00:00 2001 From: jimmy0006 <45549879+jimmy0006@users.noreply.github.com> Date: Mon, 8 Sep 2025 19:44:21 +0900 Subject: [PATCH 08/20] Update web-client-deploy-development.yml github workflow fix --- .github/workflows/web-client-deploy-development.yml | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index d490ef68..1a560e29 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -18,6 +18,11 @@ jobs: # cache: 'yarn' # fix from here + - name: Set Yarn version + run: | + corepack enable + yarn set version 3.8.1 + - name: Cache Yarn uses: actions/cache@v4 with: @@ -29,10 +34,9 @@ jobs: key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} restore-keys: | ${{ runner.os }}-yarn- - - - name: build + + - name: Install and Build run: | - yarn set version 3.8.1 yarn install --immutable --immutable-cache yarn web codegen yarn web build From e0e7426e247924ecc250ba464ea46a572b356dd0 Mon Sep 17 00:00:00 2001 From: jimmy0006 <45549879+jimmy0006@users.noreply.github.com> Date: Mon, 8 Sep 2025 19:45:49 +0900 Subject: [PATCH 09/20] Update web-client-deploy-development.yml rollback --- .../web-client-deploy-development.yml | 57 +++++-------------- 1 file changed, 15 insertions(+), 42 deletions(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index 1a560e29..9f691bb8 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -12,35 +12,10 @@ jobs: - uses: actions/checkout@v4 # TODO: 패키지 구조 변경 및 s3 배포에 따라 변경해야함 - - uses: actions/setup-node@v4 - with: - node-version: '20' - # cache: 'yarn' - - # fix from here - - name: Set Yarn version - run: | - corepack enable - yarn set version 3.8.1 - - - name: Cache Yarn - uses: actions/cache@v4 - with: - path: | - .yarn/cache - .yarn/releases - .yarn/plugins - .pnp.* - key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} - restore-keys: | - ${{ runner.os }}-yarn- - - - name: Install and Build - run: | - yarn install --immutable --immutable-cache - yarn web codegen - yarn web build - # fix to here + # - uses: actions/setup-node@v4 + # with: + # node-version: '20' + # cache: 'yarn' # - name: build # run: | @@ -49,17 +24,15 @@ jobs: # yarn install --immutable --immutable-cache # yarn web codegen # yarn web build - - - - name: scp - uses: appleboy/scp-action@v0.1.7 - with: - host: ${{ secrets.SSH_HOST }} - username: ${{ secrets.SSH_USERNAME }} - key: ${{ secrets.SSH_PEM_KEY }} - port: ${{ secrets.SSH_PORT }} - source: ./apps/web/build/* - # TODO: 패키지 구조 변경에 따라 target 디렉토리도 변경해야함 - target: ~/k8s/dialga/build - strip_components: 3 + # - name: scp + # uses: appleboy/scp-action@v0.1.7 + # with: + # host: ${{ secrets.SSH_HOST }} + # username: ${{ secrets.SSH_USERNAME }} + # key: ${{ secrets.SSH_PEM_KEY }} + # port: ${{ secrets.SSH_PORT }} + # source: ./apps/web/build/* + # # TODO: 패키지 구조 변경에 따라 target 디렉토리도 변경해야함 + # target: ~/k8s/dialga/build + # strip_components: 3 From 9b71d45ffcd1924cb0c181d273c34696835cd90d Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 8 Sep 2025 21:40:26 +0900 Subject: [PATCH 10/20] feat: Update deploy script on dev --- .../web-client-deploy-development.yml | 43 +++++++++---------- 1 file changed, 20 insertions(+), 23 deletions(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index 9f691bb8..57d52f32 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -11,28 +11,25 @@ jobs: steps: - uses: actions/checkout@v4 - # TODO: 패키지 구조 변경 및 s3 배포에 따라 변경해야함 - # - uses: actions/setup-node@v4 - # with: - # node-version: '20' - # cache: 'yarn' + - uses: actions/setup-node@v4 + with: + node-version: '20' + cache: 'yarn' - # - name: build - # run: | - # rm ./apps/web/.env && mv ./apps/web/.env.dev ./apps/web/.env - # yarn set version 3.8.1 - # yarn install --immutable --immutable-cache - # yarn web codegen - # yarn web build + - name: build + run: | + rm ./websites/poolc.org/.env && mv ./websites/poolc.org/.env.dev ./websites/poolc.org/.env + yarn set version 4.9.2 + yarn install --immutable --immutable-cache + yarn workspace @dialga/poolc.org build - # - name: scp - # uses: appleboy/scp-action@v0.1.7 - # with: - # host: ${{ secrets.SSH_HOST }} - # username: ${{ secrets.SSH_USERNAME }} - # key: ${{ secrets.SSH_PEM_KEY }} - # port: ${{ secrets.SSH_PORT }} - # source: ./apps/web/build/* - # # TODO: 패키지 구조 변경에 따라 target 디렉토리도 변경해야함 - # target: ~/k8s/dialga/build - # strip_components: 3 + - name: scp + uses: appleboy/scp-action@v0.1.7 + with: + host: ${{ secrets.SSH_HOST }} + username: ${{ secrets.SSH_USERNAME }} + key: ${{ secrets.SSH_PEM_KEY }} + port: ${{ secrets.SSH_PORT }} + source: ./websites/poolc.org/build/* + target: ~/k8s/dialga/build + strip_components: 3 From 4c9d612735d8da94c81831d8b136c9e6c245f04a Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 8 Sep 2025 21:44:23 +0900 Subject: [PATCH 11/20] fix: Add cache dependency --- .github/workflows/web-client-deploy-development.yml | 2 ++ 1 file changed, 2 insertions(+) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index 57d52f32..eb712f5b 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -15,6 +15,8 @@ jobs: with: node-version: '20' cache: 'yarn' + # @see https://github.com/cypress-io/github-action#yarn-modern + cache-dependency-path: ./yarn.lock - name: build run: | From 61b012bab95a9db3fa20fe6234b87673ab64cc7e Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 8 Sep 2025 21:46:47 +0900 Subject: [PATCH 12/20] fix: Delete immutable-cache option --- .github/workflows/web-client-deploy-development.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/web-client-deploy-development.yml b/.github/workflows/web-client-deploy-development.yml index eb712f5b..1408fb30 100644 --- a/.github/workflows/web-client-deploy-development.yml +++ b/.github/workflows/web-client-deploy-development.yml @@ -22,7 +22,7 @@ jobs: run: | rm ./websites/poolc.org/.env && mv ./websites/poolc.org/.env.dev ./websites/poolc.org/.env yarn set version 4.9.2 - yarn install --immutable --immutable-cache + yarn install --immutable yarn workspace @dialga/poolc.org build - name: scp From 4819f33aa67b2da606c3e2f9c066c4237490139c Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 8 Sep 2025 22:08:00 +0900 Subject: [PATCH 13/20] feat: Dynamic inject server url using dotenv-cli --- websites/poolc.org/.env | 4 +-- websites/poolc.org/package.json | 3 +- websites/poolc.org/vite.config.ts | 1 - yarn.lock | 49 +++++++++++++++++++++++++++++++ 4 files changed, 53 insertions(+), 4 deletions(-) diff --git a/websites/poolc.org/.env b/websites/poolc.org/.env index a4f9d7de..ee3b77ac 100644 --- a/websites/poolc.org/.env +++ b/websites/poolc.org/.env @@ -1,3 +1,3 @@ -VITE_API_BASE_URL=https://api.poolc.org -VITE_FILE_URL=https://api.poolc.org +VITE_API_BASE_URL=https://dev.poolc.org/api +VITE_FILE_URL=https://dev.poolc.org/api VITE_MAX_FILE_SIZE=50000000 # 50mb diff --git a/websites/poolc.org/package.json b/websites/poolc.org/package.json index dff3ac7b..1309449e 100644 --- a/websites/poolc.org/package.json +++ b/websites/poolc.org/package.json @@ -10,7 +10,7 @@ "sync:type": "yarn dlx typesync", "check:type": "tsc", "check:type:watch": "yarn check:type --watch", - "codegen": "openapi -i https://api.poolc.org/v2/api-docs -o src/lib/api-v2/__generated__ --useUnionTypes --useOptions -c axios", + "codegen": "dotenv -e ./.env -- bash -c 'openapi -i $VITE_API_BASE_URL/v2/api-docs -o src/lib/api-v2/__generated__ --useUnionTypes --useOptions -c axios'", "postinstall": "yarn codegen", "lint": "eslint . && prettier . --check --ignore-path .gitignore", "format": "eslint . --fix && prettier . --write --ignore-path .gitignore" @@ -20,6 +20,7 @@ }, "devDependencies": { "@types/node": "^18.15.3", + "dotenv-cli": "^10.0.0", "eslint": "^8.57.0", "openapi-typescript-codegen": "^0.28.0", "prettier": "^3.1.1", diff --git a/websites/poolc.org/vite.config.ts b/websites/poolc.org/vite.config.ts index fe65e0e7..da03864c 100644 --- a/websites/poolc.org/vite.config.ts +++ b/websites/poolc.org/vite.config.ts @@ -4,7 +4,6 @@ import path from 'path'; export default defineConfig(({ mode }) => { // @see https://stackoverflow.com/a/66389044 - // process.env = { ...process.env, ...loadEnv(mode, process.cwd()) }; process.env = Object.assign(process.env, loadEnv(mode, process.cwd())); return { diff --git a/yarn.lock b/yarn.lock index 5e5b6563..e594f5a4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1697,6 +1697,7 @@ __metadata: dependencies: "@dialga/react-editor": "workspace:^" "@types/node": "npm:^18.15.3" + dotenv-cli: "npm:^10.0.0" eslint: "npm:^8.57.0" openapi-typescript-codegen: "npm:^0.28.0" prettier: "npm:^3.1.1" @@ -4515,6 +4516,17 @@ __metadata: languageName: node linkType: hard +"cross-spawn@npm:^7.0.6": + version: 7.0.6 + resolution: "cross-spawn@npm:7.0.6" + dependencies: + path-key: "npm:^3.1.0" + shebang-command: "npm:^2.0.0" + which: "npm:^2.0.1" + checksum: 10c0/053ea8b2135caff68a9e81470e845613e374e7309a47731e81639de3eaeb90c3d01af0e0b44d2ab9d50b43467223b88567dfeb3262db942dc063b9976718ffc1 + languageName: node + linkType: hard + "csstype@npm:^3.0.2, csstype@npm:^3.1.3": version: 3.1.3 resolution: "csstype@npm:3.1.3" @@ -4851,6 +4863,43 @@ __metadata: languageName: node linkType: hard +"dotenv-cli@npm:^10.0.0": + version: 10.0.0 + resolution: "dotenv-cli@npm:10.0.0" + dependencies: + cross-spawn: "npm:^7.0.6" + dotenv: "npm:^17.1.0" + dotenv-expand: "npm:^11.0.0" + minimist: "npm:^1.2.6" + bin: + dotenv: cli.js + checksum: 10c0/c469e65167fc3d1ef7bc6f90c8b7a0accd245ad1cdb73da8c72b32ddb308550dc4d5bfcdae964ab1f8a247957d756afc7b050d0f88fa5868c05ff6d3dfb4c1ba + languageName: node + linkType: hard + +"dotenv-expand@npm:^11.0.0": + version: 11.0.7 + resolution: "dotenv-expand@npm:11.0.7" + dependencies: + dotenv: "npm:^16.4.5" + checksum: 10c0/d80b8a7be085edf351270b96ac0e794bc3ddd7f36157912939577cb4d33ba6492ebee349d59798b71b90e36f498d24a2a564fb4aa00073b2ef4c2a3a49c467b1 + languageName: node + linkType: hard + +"dotenv@npm:^16.4.5": + version: 16.6.1 + resolution: "dotenv@npm:16.6.1" + checksum: 10c0/15ce56608326ea0d1d9414a5c8ee6dcf0fffc79d2c16422b4ac2268e7e2d76ff5a572d37ffe747c377de12005f14b3cc22361e79fc7f1061cce81f77d2c973dc + languageName: node + linkType: hard + +"dotenv@npm:^17.1.0": + version: 17.2.2 + resolution: "dotenv@npm:17.2.2" + checksum: 10c0/be66513504590aff6eccb14167625aed9bd42ce80547f4fe5d195860211971a7060949b57108dfaeaf90658f79e40edccd3f233f0a978bff507b5b1565ae162b + languageName: node + linkType: hard + "dunder-proto@npm:^1.0.0, dunder-proto@npm:^1.0.1": version: 1.0.1 resolution: "dunder-proto@npm:1.0.1" From 9b68733f58c0b438ec5a9e6763827e07774b3121 Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 15 Sep 2025 23:52:24 +0900 Subject: [PATCH 14/20] feat: Add k8s button to header --- .../src/components/header/Menus/Menus.tsx | 5 + .../components/my-page/MyPageContainer.tsx | 281 +++++++++++++++++ .../src/lib/api-v2/useAppSuspenseQueries.ts | 2 +- .../poolc.org/src/pages/my-page/MyPage.tsx | 285 ++---------------- 4 files changed, 310 insertions(+), 263 deletions(-) create mode 100644 websites/poolc.org/src/components/my-page/MyPageContainer.tsx diff --git a/websites/poolc.org/src/components/header/Menus/Menus.tsx b/websites/poolc.org/src/components/header/Menus/Menus.tsx index c3a906a4..2f060c39 100644 --- a/websites/poolc.org/src/components/header/Menus/Menus.tsx +++ b/websites/poolc.org/src/components/header/Menus/Menus.tsx @@ -75,6 +75,11 @@ const Menus = ({ visible: isLogin, content: 'Room', }, + { + to: `/${MENU.MY_PAGE}#pks`, + visible: isLogin, + content: 'K8s', + }, { to: `/${MENU.APPLY}`, visible: !isLogin || (isLogin && !isAuthorizedRole(role)), diff --git a/websites/poolc.org/src/components/my-page/MyPageContainer.tsx b/websites/poolc.org/src/components/my-page/MyPageContainer.tsx new file mode 100644 index 00000000..d8945fd0 --- /dev/null +++ b/websites/poolc.org/src/components/my-page/MyPageContainer.tsx @@ -0,0 +1,281 @@ +import { Avatar, Button, List, Popover, Space, Typography } from 'antd'; +import { Link } from 'react-router-dom'; +import { ArrowRightOutlined, EditTwoTone, MessageTwoTone, QuestionCircleFilled, StarTwoTone, UserOutlined } from '@ant-design/icons'; +import { createStyles } from 'antd-style'; +import { useEffect, useRef } from 'react'; +import { BadgeControllerService, BaekjoonControllerService, KubernetesControllerService, MemberControllerService, queryKey, useAppMutation, useAppSuspenseQueries } from '~/lib/api-v2'; +import { MENU } from '~/constants/menus'; +import MyPageGrassSection from '~/components/my-page/MyPageGrassSection'; +import { queryClient } from '~/lib/utils/queryClient'; +import { getProfileImageUrl } from '~/lib/utils/getProfileImageUrl'; +import getFileUrl from '~/lib/utils/getFileUrl'; +import MyPagePKSSection from '~/components/my-page/MyPagePKSSection'; + +export default function MyPageContainer({ locationHash }: { locationHash: string }) { + const { styles, cx } = useStyles(); + + const listData: { + title: string; + icon: JSX.Element; + link?: string; + onClick?: () => void; + }[] = [ + { + title: '회원 정보 수정', + icon: , + link: '/my-info', + }, + { + title: '내가 쓴 글', + icon: , + link: `/${MENU.MY_PAGE}/${MENU.MY_PAGE_MY_POSTS}`, + }, + { + title: '내가 스크랩한 글', + icon: , + link: `/${MENU.MY_PAGE}/${MENU.MY_PAGE_MY_SCRAPS}`, + }, + { + title: '쪽지', + icon: , + link: `/${MENU.MESSAGE}`, + }, + ]; + + const [{ data: myHour }, { data: me }, { data: badge }, { data: baekjoon }, { data: kubernetes }] = useAppSuspenseQueries({ + queries: [ + { + queryKey: queryKey.member.hour, + queryFn: MemberControllerService.getMyActivityTimeUsingGet, + }, + { + queryKey: queryKey.member.me, + queryFn: MemberControllerService.getMeUsingGet, + }, + { + queryKey: queryKey.badge.badge, + queryFn: BadgeControllerService.getMyBadgeUsingGet, + }, + { + queryKey: queryKey.baekjoon.baekjoon, + queryFn: BaekjoonControllerService.getMyBaekjoonUsingGet, + }, + { + queryKey: queryKey.kubernetes.me, + queryFn: KubernetesControllerService.getMyKeyUsingGet, + }, + ], + }); + + const { mutate: selectBadge } = useAppMutation({ + mutationFn: BadgeControllerService.selectBadgeUsingPost, + }); + + const onBadgeButtonClick = (id: number) => { + if (me?.badge?.id === id) { + return; + } + + selectBadge( + { + badgeId: id, + }, + { + onSuccess() { + queryClient.invalidateQueries({ + queryKey: queryKey.member.me, + }); + }, + }, + ); + }; + + const pksRef = useRef(null); + + useEffect(() => { + if (locationHash === PKS_ID) { + pksRef.current?.scrollIntoView({ behavior: 'smooth' }); + } + }, [locationHash]); + + return ( + + + + + + {me.name}님 + {me.badge && } + + {me.introduction} + + + + 나의 활동시간 + {myHour.hour ?? 0}시간 + {/* + {myHour?.hour ?? 0}시간 / {activityMinimumHour}시간 + + */} + + + + 풀씨 잔디 + + + 풀씨-백준 익스텐션을 설치하고 +
+ 백준문제를 풀면 풀씨 잔디를 심을 수 있습니다. + + + + + + } + > + + + + {baekjoon.data && } + + + + 얻은 뱃지 + + 모든 뱃지보기 > + + + {badge?.data && badge.data.length > 0 ? ( + + {badge.data.map((el, idx) => ( + + ))} + + ) : ( + 아직 뱃지가 없습니다. + )} + + + 나의 메뉴 + + item.link ? ( + + +
+ {item.icon} + {item.title} +
+ + + + ) : ( + +
+ {item.icon} + {item.title} +
+ + + ) + } + /> + + + PKS (PoolC Kubernetes Service) + + + + ); +} + +const PKS_ID = 'pks'; + +const useStyles = createStyles(({ css }) => ({ + whiteBlock: css` + box-sizing: border-box; + padding: 30px 20px; + `, + wrapper: css` + width: 100%; + box-sizing: border-box; + `, + fullWidth: css` + width: 100%; + `, + link: css` + display: flex; + justify-content: space-between; + align-items: center; + width: 100%; + text-decoration: inherit; + cursor: pointer; + `, + linkInner: css` + display: flex; + align-items: center; + gap: 20px; + `, + userName: css` + font-size: 24px; + font-weight: 700; + position: relative; + + &:before { + position: absolute; + content: ''; + width: 100%; + height: 7px; + background-color: #47be9b; + opacity: 0.5; + bottom: 0; + left: 0; + } + `, + grassTitle: css` + display: flex; + align-items: center; + gap: 10px; + `, + badgeTitle: css` + display: flex; + align-items: center; + justify-content: space-between; + `, + badgeLink: css` + font-size: 12px; + color: #9d9893 !important; + display: flex; + align-items: center; + gap: 5px; + `, + badgeButton: css` + display: flex; + height: auto; + min-width: auto; + padding: 0; + border: 2px solid transparent; + &.active { + border-color: #47be9b; + } + `, + badge: css` + border: 2px solid #47be9b; + `, +})); diff --git a/websites/poolc.org/src/lib/api-v2/useAppSuspenseQueries.ts b/websites/poolc.org/src/lib/api-v2/useAppSuspenseQueries.ts index b244d3dd..26cf65e3 100644 --- a/websites/poolc.org/src/lib/api-v2/useAppSuspenseQueries.ts +++ b/websites/poolc.org/src/lib/api-v2/useAppSuspenseQueries.ts @@ -1,3 +1,3 @@ import { useSuspenseQueries } from '@tanstack/react-query'; -export const useAppSuspeneseQueries = useSuspenseQueries; +export const useAppSuspenseQueries = useSuspenseQueries; diff --git a/websites/poolc.org/src/pages/my-page/MyPage.tsx b/websites/poolc.org/src/pages/my-page/MyPage.tsx index d12dd626..623b5105 100644 --- a/websites/poolc.org/src/pages/my-page/MyPage.tsx +++ b/websites/poolc.org/src/pages/my-page/MyPage.tsx @@ -1,275 +1,36 @@ -import { Avatar, Button, List, Popover, Space, Typography } from 'antd'; import { createStyles } from 'antd-style'; -import { Link } from 'react-router-dom'; -import { ArrowRightOutlined, EditTwoTone, MessageTwoTone, QuestionCircleFilled, StarTwoTone, UserOutlined } from '@ant-design/icons'; +import { Suspense } from 'react'; +import { useLocation } from 'react-router'; import { Block, WhiteBlock } from '~/styles/common/Block.styles'; -import { BadgeControllerService, BaekjoonControllerService, KubernetesControllerService, MemberControllerService, queryKey, useAppMutation, useAppQueries } from '~/lib/api-v2'; -import { MENU } from '~/constants/menus'; -import MyPageGrassSection from '~/components/my-page/MyPageGrassSection'; -import { queryClient } from '~/lib/utils/queryClient'; -import { getProfileImageUrl } from '~/lib/utils/getProfileImageUrl'; -import getFileUrl from '~/lib/utils/getFileUrl'; -import MyPagePKSSection from '~/components/my-page/MyPagePKSSection'; - -const useStyles = createStyles(({ css }) => ({ - whiteBlock: css` - box-sizing: border-box; - padding: 30px 20px; - `, - wrapper: css` - width: 100%; - box-sizing: border-box; - `, - fullWidth: css` - width: 100%; - `, - link: css` - display: flex; - justify-content: space-between; - align-items: center; - width: 100%; - text-decoration: inherit; - cursor: pointer; - `, - linkInner: css` - display: flex; - align-items: center; - gap: 20px; - `, - userName: css` - font-size: 24px; - font-weight: 700; - position: relative; - - &:before { - position: absolute; - content: ''; - width: 100%; - height: 7px; - background-color: #47be9b; - opacity: 0.5; - bottom: 0; - left: 0; - } - `, - grassTitle: css` - display: flex; - align-items: center; - gap: 10px; - `, - badgeTitle: css` - display: flex; - align-items: center; - justify-content: space-between; - `, - badgeLink: css` - font-size: 12px; - color: #9d9893 !important; - display: flex; - align-items: center; - gap: 5px; - `, - badgeButton: css` - display: flex; - height: auto; - min-width: auto; - padding: 0; - border: 2px solid transparent; - &.active { - border-color: #47be9b; - } - `, - badge: css` - border: 2px solid #47be9b; - `, -})); +import MyPageContainer from '~/components/my-page/MyPageContainer'; +import Skeleton from '~/components/common/Skeleton'; export default function MyPage() { - const { styles, cx } = useStyles(); - - const listData: { - title: string; - icon: JSX.Element; - link?: string; - onClick?: () => void; - }[] = [ - { - title: '회원 정보 수정', - icon: , - link: '/my-info', - }, - { - title: '내가 쓴 글', - icon: , - link: `/${MENU.MY_PAGE}/${MENU.MY_PAGE_MY_POSTS}`, - }, - { - title: '내가 스크랩한 글', - icon: , - link: `/${MENU.MY_PAGE}/${MENU.MY_PAGE_MY_SCRAPS}`, - }, - { - title: '쪽지', - icon: , - link: `/${MENU.MESSAGE}`, - }, - ]; + const { styles } = useStyles(); + const location = useLocation(); - const [{ data: myHour }, { data: me }, { data: badge }, { data: baekjoon }, { data: kubernetes }] = useAppQueries({ - queries: [ - { - queryKey: queryKey.member.hour, - queryFn: MemberControllerService.getMyActivityTimeUsingGet, - }, - { - queryKey: queryKey.member.me, - queryFn: MemberControllerService.getMeUsingGet, - }, - { - queryKey: queryKey.badge.badge, - queryFn: BadgeControllerService.getMyBadgeUsingGet, - }, - { - queryKey: queryKey.baekjoon.baekjoon, - queryFn: BaekjoonControllerService.getMyBaekjoonUsingGet, - }, - { - queryKey: queryKey.kubernetes.me, - queryFn: KubernetesControllerService.getMyKeyUsingGet, - }, - ], - }); - - const { mutate: selectBadge } = useAppMutation({ - mutationFn: BadgeControllerService.selectBadgeUsingPost, - }); - - const onBadgeButtonClick = (id: number) => { - if (me?.badge?.id === id) { - return; - } - - selectBadge( - { - badgeId: id, - }, - { - onSuccess() { - queryClient.invalidateQueries({ - queryKey: queryKey.member.me, - }); - }, - }, - ); - }; + const locationHash = location.hash.replace(/^#/, ''); return ( - - - - - - {me?.name}님 - {me?.badge && } - - {me?.introduction} - - - - 나의 활동시간 - {myHour?.hour ?? 0}시간 - {/* - {myHour?.hour ?? 0}시간 / {activityMinimumHour}시간 - - */} - - - - 풀씨 잔디 - - - 풀씨-백준 익스텐션을 설치하고 -
- 백준문제를 풀면 풀씨 잔디를 심을 수 있습니다. - - - - - - } - > - - - - {baekjoon?.data && } - - - - 얻은 뱃지 - - 모든 뱃지보기 > - - - {badge?.data && badge.data.length > 0 ? ( - - {badge.data.map((el, idx) => ( - - ))} - - ) : ( - 아직 뱃지가 없습니다. - )} - - - 나의 메뉴 - - item.link ? ( - - -
- {item.icon} - {item.title} -
- - - - ) : ( - -
- {item.icon} - {item.title} -
- - - ) - } - /> - - - PKS - - - +
+ }> + + +
); } + +const useStyles = createStyles(({ css }) => ({ + whiteBlock: css` + box-sizing: border-box; + padding: 30px 20px; + `, + wrapper: css` + width: 100%; + box-sizing: border-box; + `, +})); From 90f595bf4426559c331d6b1fef4526d96898a95c Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Mon, 15 Sep 2025 23:55:14 +0900 Subject: [PATCH 15/20] fix: Replace old hook names with new one --- websites/poolc.org/src/components/home/HomeEntry.tsx | 4 ++-- .../members/MemberDetail/MemberDetailContent.tsx | 8 +++++--- .../src/components/message/MessageAllListContent.tsx | 4 ++-- 3 files changed, 9 insertions(+), 7 deletions(-) diff --git a/websites/poolc.org/src/components/home/HomeEntry.tsx b/websites/poolc.org/src/components/home/HomeEntry.tsx index 729bc7d7..9a49129d 100644 --- a/websites/poolc.org/src/components/home/HomeEntry.tsx +++ b/websites/poolc.org/src/components/home/HomeEntry.tsx @@ -3,7 +3,7 @@ import Carousel from '~/components/home/Carousel'; import RecentNotice from '~/components/home/RecentNotice'; import RecentProject from '~/components/home/RecentProject'; import { useAppSelector } from '~/hooks/useAppSelector'; -import { PoolcControllerService, PostControllerService, ProjectControllerService, queryKey, useAppSuspeneseQueries } from '~/lib/api-v2'; +import { PoolcControllerService, PostControllerService, ProjectControllerService, queryKey, useAppSuspenseQueries } from '~/lib/api-v2'; import { getBoardTitleForRequest } from '~/lib/utils/boardUtil'; import ApplyBanner from '~/components/home/ApplyBanner'; @@ -20,7 +20,7 @@ const useStyles = createStyles(({ css }) => ({ export default function HomeEntry() { const { styles } = useStyles(); - const [{ data: poolcInfo }, { data: projectInfo }, { data: noticeInfo }] = useAppSuspeneseQueries({ + const [{ data: poolcInfo }, { data: projectInfo }, { data: noticeInfo }] = useAppSuspenseQueries({ queries: [ { queryKey: queryKey.poolc.poolc, diff --git a/websites/poolc.org/src/components/members/MemberDetail/MemberDetailContent.tsx b/websites/poolc.org/src/components/members/MemberDetail/MemberDetailContent.tsx index 1a5ade76..6192be2f 100644 --- a/websites/poolc.org/src/components/members/MemberDetail/MemberDetailContent.tsx +++ b/websites/poolc.org/src/components/members/MemberDetail/MemberDetailContent.tsx @@ -20,12 +20,12 @@ import { ActivityContainer, Activities, } from './MemberDetailContent.styles'; -import { ConversationControllerService, MemberControllerService, MemberResponse, queryKey, useAppMutation, useAppSuspeneseQueries } from '~/lib/api-v2'; +import { ConversationControllerService, MemberControllerService, MemberResponse, queryKey, useAppMutation, useAppSuspenseQueries } from '~/lib/api-v2'; import { MENU } from '~/constants/menus'; export default function MemberDetailContent({ loginId }: { loginId: string }) { const history = useHistory(); - const [{ data: _member }, { data: me }] = useAppSuspeneseQueries({ + const [{ data: _member }, { data: me }] = useAppSuspenseQueries({ queries: [ { queryKey: queryKey.member.id(loginId), @@ -96,7 +96,9 @@ export default function MemberDetailContent({ loginId }: { loginId: string }) {

참여 활동

- {member.projects?.map((project) => )} + {member.projects?.map((project) => ( + + ))} {/* TODO: fill undefined props */} {member.hostActivities?.map((activity) => ( diff --git a/websites/poolc.org/src/components/message/MessageAllListContent.tsx b/websites/poolc.org/src/components/message/MessageAllListContent.tsx index e3082b28..c6f3cba4 100644 --- a/websites/poolc.org/src/components/message/MessageAllListContent.tsx +++ b/websites/poolc.org/src/components/message/MessageAllListContent.tsx @@ -2,7 +2,7 @@ import { Button, List, Space, Typography } from 'antd'; import { ArrowLeftOutlined } from '@ant-design/icons'; import { Link, useHistory } from 'react-router-dom'; import { createStyles } from 'antd-style'; -import { ConversationControllerService, MemberControllerService, queryKey, useAppSuspeneseQueries } from '~/lib/api-v2'; +import { ConversationControllerService, MemberControllerService, queryKey, useAppSuspenseQueries } from '~/lib/api-v2'; import { dayjs } from '~/lib/utils/dayjs'; import { MENU } from '~/constants/menus'; @@ -41,7 +41,7 @@ export default function MessageAllListContent() { const { styles } = useStyles(); const history = useHistory(); - const [{ data: conversations }, { data: me }] = useAppSuspeneseQueries({ + const [{ data: conversations }, { data: me }] = useAppSuspenseQueries({ queries: [ { queryKey: queryKey.conversation.all, From 5e3e813bdaa8b2354e303aabc69270095655e967 Mon Sep 17 00:00:00 2001 From: Jinho Choi Date: Tue, 16 Sep 2025 13:19:45 +0900 Subject: [PATCH 16/20] chore: Fix PKS docs link --- websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx index 25e2600f..cad3e2bb 100644 --- a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx +++ b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx @@ -18,7 +18,7 @@ export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { - Docs [https://github.com/PoolC/PKS-docs/tree/user-guide] + Docs [https://github.com/PoolC/PKS-docs/tree/main]
From a12d15218e30caa843501a69f269df68566e942c Mon Sep 17 00:00:00 2001 From: "leo.choi" Date: Tue, 16 Sep 2025 15:05:03 +0900 Subject: [PATCH 17/20] feat: Update PKS link ui --- .nvmrc | 1 + .../components/my-page/MyPagePKSSection.tsx | 61 +++++++++++++++---- 2 files changed, 49 insertions(+), 13 deletions(-) create mode 100644 .nvmrc diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 00000000..09c06f5d --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +v20.19.3 \ No newline at end of file diff --git a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx index cad3e2bb..704d4c8d 100644 --- a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx +++ b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx @@ -1,14 +1,29 @@ -import { CopyOutlined, CheckOutlined } from '@ant-design/icons'; -import { Typography, Space, Button } from 'antd'; +import { CopyOutlined, CheckOutlined, ArrowRightOutlined, SettingTwoTone, BookTwoTone } from '@ant-design/icons'; +import { Typography, Space, Button, List } from 'antd'; import { createStyles } from 'antd-style'; import useCopy from '../../hooks/useCopy'; -const { Link, Paragraph } = Typography; - export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { const { styles } = useStyles(); const { isCopied, copy } = useCopy(); + const linkList: { + title: string; + icon: JSX.Element; + link: string; + }[] = [ + { + title: 'kubectl 빠른 설정', + icon: , + link: 'https://github.com/PoolC/PKS-docs/tree/main/docs/user-guides', + }, + { + title: '전체 문서', + icon: , + link: 'https://github.com/PoolC/PKS-docs/tree/main', + }, + ]; + const code = dedent`kubectl config set-credentials pks --token=${jwtToken} kubectl config set-cluster pks --server="https://165.132.131.121:6443" --insecure-skip-tls-verify=true kubectl config set-context pks --cluster=pks --user=pks @@ -16,11 +31,23 @@ export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { return ( - - - Docs [https://github.com/PoolC/PKS-docs/tree/main] - - + ( + + +
+ {item.icon} + {item.title} +
+ + + + )} + />
Command @@ -36,11 +63,19 @@ const useStyles = createStyles(({ css }) => ({ container: css({ width: '100%', }), - title: css({ - margin: '0 !important', + fullWidth: css({ + width: '100%', }), - docs: css({ - color: '#000', + link: css({ + display: 'flex', + justifyContent: 'space-between', + alignItems: 'center', + width: '100%', + }), + linkInner: css({ + display: 'flex', + alignItems: 'center', + gap: '20px', }), codeBlock: css({ width: '100%', From d69f385f1d998982307a4e392f084438da02e969 Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Fri, 26 Sep 2025 03:46:33 +0900 Subject: [PATCH 18/20] feat: Add menus in PKS site --- .../src/components/my-page/MyPagePKSSection.tsx | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx index 704d4c8d..e40ca507 100644 --- a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx +++ b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx @@ -1,4 +1,4 @@ -import { CopyOutlined, CheckOutlined, ArrowRightOutlined, SettingTwoTone, BookTwoTone } from '@ant-design/icons'; +import { CopyOutlined, CheckOutlined, ArrowRightOutlined, SettingTwoTone, BookTwoTone, DeploymentUnitOutlined, EyeTwoTone } from '@ant-design/icons'; import { Typography, Space, Button, List } from 'antd'; import { createStyles } from 'antd-style'; import useCopy from '../../hooks/useCopy'; @@ -14,14 +14,24 @@ export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { }[] = [ { title: 'kubectl 빠른 설정', - icon: , + icon: , link: 'https://github.com/PoolC/PKS-docs/tree/main/docs/user-guides', }, { title: '전체 문서', - icon: , + icon: , link: 'https://github.com/PoolC/PKS-docs/tree/main', }, + { + title: 'Argo CD', + icon: , + link: 'https://argocd.dev.poolc.org', + }, + { + title: '모니터링', + icon: , + link: 'https://mon.dev.poolc.org', + }, ]; const code = dedent`kubectl config set-credentials pks --token=${jwtToken} From a10562e3f90abc7116b220630e698bc9fd70f0c8 Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Fri, 26 Sep 2025 03:53:06 +0900 Subject: [PATCH 19/20] chore: Set https to http --- .../poolc.org/src/components/my-page/MyPagePKSSection.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx index e40ca507..d86375c7 100644 --- a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx +++ b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx @@ -25,12 +25,12 @@ export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { { title: 'Argo CD', icon: , - link: 'https://argocd.dev.poolc.org', + link: 'http://argocd.dev.poolc.org', }, { title: '모니터링', icon: , - link: 'https://mon.dev.poolc.org', + link: 'http://mon.dev.poolc.org', }, ]; From 3757aca2de67e40c99408a821d384fb95ad6d1f4 Mon Sep 17 00:00:00 2001 From: jinhodotchoi Date: Fri, 26 Sep 2025 04:45:14 +0900 Subject: [PATCH 20/20] feat: Add ArgoCDForm --- .../components/my-page/MyPageArgoCDForm.tsx | 32 +++++++++++++++++++ .../components/my-page/MyPagePKSSection.tsx | 19 ++++++++--- 2 files changed, 46 insertions(+), 5 deletions(-) create mode 100644 websites/poolc.org/src/components/my-page/MyPageArgoCDForm.tsx diff --git a/websites/poolc.org/src/components/my-page/MyPageArgoCDForm.tsx b/websites/poolc.org/src/components/my-page/MyPageArgoCDForm.tsx new file mode 100644 index 00000000..dc2bd5d9 --- /dev/null +++ b/websites/poolc.org/src/components/my-page/MyPageArgoCDForm.tsx @@ -0,0 +1,32 @@ +import { Form, Input } from 'antd'; +import { CopyOutlined, CheckOutlined } from '@ant-design/icons'; +import { createStyles } from 'antd-style'; +import useCopy from '../../hooks/useCopy'; + +const USER_NAME = 'poolini'; + +const PASSWORD = 'rgbc0ffee'; + +export default function MyPageArgoCDForm() { + const { styles } = useStyles(); + + const { isCopied: isUserNameCopied, copy: copyUserName } = useCopy(); + const { isCopied: isPasswordCopied, copy: copyPassword } = useCopy(); + + return ( +
+ + : copyUserName(USER_NAME)} />} /> + + + : copyPassword(PASSWORD)} />} /> + +
+ ); +} + +const useStyles = createStyles(({ css }) => ({ + inputWrap: css({ + marginBottom: '8px', + }), +})); diff --git a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx index d86375c7..2f32fc7a 100644 --- a/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx +++ b/websites/poolc.org/src/components/my-page/MyPagePKSSection.tsx @@ -1,14 +1,16 @@ -import { CopyOutlined, CheckOutlined, ArrowRightOutlined, SettingTwoTone, BookTwoTone, DeploymentUnitOutlined, EyeTwoTone } from '@ant-design/icons'; -import { Typography, Space, Button, List } from 'antd'; +import { CopyOutlined, CheckOutlined, ArrowRightOutlined, SettingTwoTone, BookTwoTone, DeploymentUnitOutlined, EyeTwoTone, QuestionCircleFilled } from '@ant-design/icons'; +import { Button, Popover, Space, Typography, List } from 'antd'; import { createStyles } from 'antd-style'; -import useCopy from '../../hooks/useCopy'; +import { ReactNode } from 'react'; +import useCopy from '~/hooks/useCopy'; +import MyPageArgoCDForm from './MyPageArgoCDForm'; export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { const { styles } = useStyles(); const { isCopied, copy } = useCopy(); const linkList: { - title: string; + title: ReactNode; icon: JSX.Element; link: string; }[] = [ @@ -23,7 +25,14 @@ export default function MyPagePKSSection({ jwtToken }: { jwtToken: string }) { link: 'https://github.com/PoolC/PKS-docs/tree/main', }, { - title: 'Argo CD', + title: ( + + Argo CD + }> + + + + ), icon: , link: 'http://argocd.dev.poolc.org', },