Merge pull request #43 from KUSITMS-29th-TEAM-D/develop

v0.1.1
KUSITMS-29th-TEAM-D · May 18, 2024 · c88cc0e · c88cc0e
2 parents 2e73f57 + 87d6324
commit c88cc0e
Show file tree

Hide file tree

Showing 70 changed files with 1,956 additions and 577 deletions.
diff --git a/index.html b/index.html
@@ -21,6 +21,11 @@
   </head>
   <body>
     <div id="root"></div>
+    <script
+      src="https://t1.kakaocdn.net/kakao_js_sdk/2.7.1/kakao.min.js"
+      integrity="sha384-kDljxUXHaJ9xAb2AzRd59KxjrFjzHa5TAoFQ6GbYTCAG0bjM55XohjjDT7tDDC01"
+      crossorigin="anonymous"
+    ></script>
     <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>
diff --git a/src/apis/client.ts b/src/apis/client.ts
@@ -14,14 +14,15 @@ export const authClient: AxiosInstance = axios.create({
 });
 
 authClient.interceptors.request.use((config) => {
-  if (!authClient.defaults.headers.common['Authorization']) {
-    if (userService.getUser() === '') {
-      // register token이 만료된 상황
-      userService.removeUser();
-      window.location.href = '/auth';
+  if (!config.headers.common || !config.headers.common['Authorization']) {
+    if (userService.getUser().nickname === '') {
+      // register token이 없는 상황 (새로고침)
+      authService.onSetRegisterToken();
+      config.headers['Authorization'] = authClient.defaults.headers.common['Authorization'];
     } else if (userService.getUser()) {
       // access token이 만료된 상황
       authService.onRefreshToken();
+      config.headers['Authorization'] = authClient.defaults.headers.common['Authorization'];
     }
   }
 

diff --git a/src/apis/personaAPI.ts b/src/apis/personaAPI.ts
@@ -0,0 +1,27 @@
+import { authClient, noAuthClient } from '@/apis/client';
+import { DefineRequest } from '@/types/test.type';
+
+export const personaAPI = {
+  // 페르소나 생성
+  register: async (member: boolean, userInfo: DefineRequest) => {
+    if (member) {
+      const response = await authClient.post('/api/personas/define', userInfo);
+      return response.data;
+    }
+
+    const response = await noAuthClient.post('/api/personas/define', userInfo);
+    return response.data;
+  },
+  // 비로그인 유저 페르소나 조회
+  getPersona: async (personaId: string) => {
+    const response = await noAuthClient.get(
+      `/api/personas/define/sharing?define_persona_id=${personaId}`
+    );
+    return response.data;
+  },
+  // 로그인 유저 페르소나 조회
+  getPersonaMember: async () => {
+    const response = await authClient.get('/api/personas/define');
+    return response.data;
+  },
+};
diff --git a/src/apis/userAPI.ts b/src/apis/userAPI.ts
@@ -1,4 +1,4 @@
-import { authClient } from '@/apis/client';
+import { authClient, noAuthClient } from '@/apis/client';
 import { RegisterRequest } from '@/types/userAPI.type';
 
 export const userAPI = {
@@ -7,4 +7,9 @@ export const userAPI = {
     const response = await authClient.post('/api/users/register', userInfo);
     return response.data;
   },
+  // 닉네임 중복 체크
+  duplicateCheck: async (nickname: string) => {
+    const response = await noAuthClient.get(`/api/users/check-nickname/${nickname}`);
+    return response.data;
+  },
 };
diff --git a/src/assets/backgrounds/defineBackground.png b/src/assets/backgrounds/defineBackground.png
diff --git a/src/assets/backgrounds/loginBackground.png b/src/assets/backgrounds/loginBackground.png
diff --git a/src/assets/backgrounds/onboardingBackground.png b/src/assets/backgrounds/onboardingBackground.png
diff --git a/src/assets/icons/check.svg b/src/assets/icons/check.svg
diff --git a/src/assets/icons/close.svg b/src/assets/icons/close.svg
diff --git a/src/components/DefineResultPage/Button.tsx b/src/components/DefineResultPage/Button.tsx
@@ -0,0 +1,86 @@
+import styled, { css } from 'styled-components';
+
+import { ReactComponent as DownloadIcon } from '@/assets/icons/download.svg';
+import { ReactComponent as KakaoIcon } from '@/assets/icons/kakaoIcon.svg';
+
+interface ButtonProps {
+  onClick?: () => void;
+}
+
+interface ShareButtonProps extends ButtonProps {
+  desktop?: boolean;
+}
+
+export const KakaoShareButton = ({ onClick }: ButtonProps) => {
+  return (
+    <StyledShareButton type="button" onClick={onClick}>
+      <KakaoIcon />
+      <span>Kakao로 공유</span>
+      <div style={{ width: '24px' }} />
+    </StyledShareButton>
+  );
+};
+
+export const DownloadButton = ({ onClick, desktop = false }: ShareButtonProps) => {
+  return (
+    <StyledDownloadButton type="button" onClick={onClick} $desktop={desktop}>
+      <DownloadIcon />
+      <span>이미지로 저장</span>
+      <div style={{ width: '24px' }} />
+    </StyledDownloadButton>
+  );
+};
+
+const StyledButton = styled.button`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  width: 100%;
+  height: 48px;
+  padding: 8px 16px;
+  border-radius: 8px;
+
+  span {
+    ${({ theme }) => theme.font.desktop.label1m};
+  }
+`;
+
+const StyledShareButton = styled(StyledButton)`
+  background: #fee500;
+
+  span {
+    color: #191600;
+  }
+
+  &:hover {
+    filter: brightness(80%);
+  }
+`;
+
+const StyledDownloadButton = styled(StyledButton)<{ $desktop: boolean }>`
+  ${({ $desktop }) =>
+    $desktop
+      ? css`
+          background: ${({ theme }) => theme.color.primary50};
+
+          span {
+            color: ${({ theme }) => theme.color.primary700};
+          }
+
+          &:hover {
+            background: ${({ theme }) => theme.color.primary100};
+          }
+        `
+      : css`
+          background: ${({ theme }) => theme.color.gray800};
+
+          span {
+            color: ${({ theme }) => theme.color.white};
+          }
+
+          svg path {
+            fill: ${({ theme }) => theme.color.white};
+          }
+        `}
+`;