deploy: 6차 MVP 배포 (#137)

* fix: 디자인 QA 누락건들 반영 (#126)

* fix: 타임피커 스타일 수정

* fix: 공연 등록 페이지 디자인 qa 반영

* fix: 주최자 홈 -> 홈 텍스트 수정

* fix: 공연 등록 이미지 관련 수정사항 반영

* fix: 남은 디자인 QA 반영

* fix: Input 모바일 오른쪽 패딩 수정 (#127)

* feat: 권한 설정 작업 (#125)

* feat: Dialog Provider에서 Dialog 컴포넌트에 width prop 추가

* feat: 공연 정보 페이지 > 공연명 우측에 권한 설정 버튼 추가

* feat: 권한 설정 Dialog 추가

* feat: host 리스트, 본인 정보 쿼리 추가

* feat: host 권한 추가/수정/삭제 mutation 추가

* feat: host type 추가/수정/삭제 mutation invalidQueries 추가

* feat: ShowDetailLayout 이용처에서 showId prop 전달

* feat: 호스트 인풋폼 컴포넌트 추가

* feat: 호스트 리스트 컴포넌트 추가

* feat: query api path 수정

* feat: 권한 설정 Dialog 추가

* feat: 모바일 적용

* feat: 아이콘 추가

* fix: 추가한 아이콘 props 수정

* feat: 권한 없을 때 보여주는 화면 컴포넌트 추가

* feat: 권한 없을 때 보여주는 컴포넌트 모바일 대응

* feat: host list item 컴포넌트 추가

* feat: host 추가 mutation interface 변경 반영

* feat: 호스트 추가/수정/삭제 시 invalidateQueries 수정

* 불필요값 제거

* 불티 아이콘 props 카멜케이스로 수정

* fix: mutateAsync -> mutate로 변경

* fix: 디자인 qa 하면서 생긴 버그 수정 및 라우터 구조 수정 (#128)

* fix: 라우트 구조 수정

* fix: 디자인 QA 하면서 생긴 버그 수정

* feat: 스크롤바 제거 및 바디 스크롤락 적용

* feat: 정산 관리 페이지에서 정산 계좌 입력 삭제 (#129)

* feat: AccountInfo 삭제, userCode 반영 및 다이나믹 링크 반영 (#130)

* feat: AccountInfo 컴포넌트 제거

* feat: 정산계좌 내려주는 훅 제거 및 사용자 코드 반영

* feat: 다이나믹 링크 .debug 붙이는 로직 추가

* feat: 태그를 운영에서만 심기로

* feat: 딥링크 분기 추가 반영 (#132)

* Fix: 선물 디자인 QA (#131)

* fix: 선물 수령 화면 > 일부 스타일 수정

* fix: 선물 수령 화면 배경색 변경

* fix: 선물 취소/환불 규정 영역 최대 넓이값 조정

* fix: 선물 수령 화면 > confirm message 줄바꿈 적용

* fix: desktop view에서 confirm message 좌측 정렬

* fix: confirm에서 alert 모달 대응

* fix: 선물 인트로 화면 > 선물 보낸이 이름으로 변경

* fix: 공연일 값 제거하고 선물 만료일 추가

* fix: confirmOptions의 type 필수 제외

* fix: Alert 컴포넌트 추가

* fix: Confirm에서 type으로 분기하던 것 제거

* fix: 등록하기 버튼 클릭 시 환경에 따라 confirm/alert 분기 처리

* Fix: 권한 설정 디자인 QA (#133)

* fix: 권한 설정 Dialog > Host InputForm 스타일 수정

* fix: Dialog 닫기버튼 컬러 변경

* fix: 초대하기 버튼 disabled 시의 텍스트 컬러 변경

* fix: 호스트 멤버 권한 드롭다운 chevron down 아이콘 컬러 변경

* fix: 호스트 input form 해쉬태그 추가, 이미 초대한 회원 에러 처리

* fix: 방문자 관리 empty 화면 스타일 변경

* fix: 도우미일 때 권한 설정 버튼 미노출

* fix: 본인 권한 도우미로 바꿀 때 플로우 개선

* fix: 본인 권한 삭제 시 플로우 개선

* fix: 공연 리스트 아이템에 나의 호스트 타입 필드명 변경

* fix: 모바일에서 권한 설정 바텀시트 높이 수정

* fix: 권한 변경 시 confirm message 정렬

* fix: 호스트 권한 삭제 후 onSuccess 처리에서 본인 여부 분기 적용

* fix: 빼먹은 값 추가,,

* Fix: 디자인 QA (#134)

* fix: 호스트 input form hashtag 상시 노출

* fix: 모바일 공연 상세 > 공연명 말줄임 처리

* fix: Dialog close button icon 넓이, 높이 수정

* fix: 권한 설정 Dialog > chevron down icon 컬러 변경

* fix: 입장 관리 empty 화면 수정

* feat: 설정 팝업 관련 UI 구현 및 API 연동 (#135)

* feat: 설정 팝업 UI 관련 작업

* feat: 계정 설정 팝업 API 연동 및 회원 탈퇴 API 연동 (카카오 로그인 시에만 회원 탈퇴 가능)

* style: lint 실행

* Fix: 디자인 QA (#136)

* fix: 호스트 input form hashtag 상시 노출

* fix: 모바일 공연 상세 > 공연명 말줄임 처리

* fix: Dialog close button icon 넓이, 높이 수정

* fix: 권한 설정 Dialog > chevron down icon 컬러 변경

* fix: 입장 관리 empty 화면 수정

* fix: 초대하기 버튼 disabled color 수정

* fix: 모바일에서 권한설정 버튼 텍스트 미노출

* fix: 권한 설정 버튼 최소 너비값 제거

---------

Co-authored-by: Park YoungHo <[email protected]>
Co-authored-by: Shim MunSeong <[email protected]>

apps/admin/index.html

@@ -45,13 +45,15 @@
     <!-- Google tag (gtag.js) -->
     <script async src="https://www.googletagmanager.com/gtag/js?id=G-KKHNG1QPW4"></script>
     <script>
-      window.dataLayer = window.dataLayer || [];
-      function gtag() {
-        dataLayer.push(arguments);
-      }
-      gtag('js', new Date());
+      if (window.location.origin === 'https://boolti.in') {
+        window.dataLayer = window.dataLayer || [];
+        function gtag() {
+          dataLayer.push(arguments);
+        }
+        gtag('js', new Date());
 
-      gtag('config', 'G-KKHNG1QPW4');
+        gtag('config', 'G-KKHNG1QPW4');
+      }
     </script>
     <meta name="appleid-signin-client-id" content="%VITE_APPLE_CLIENT_ID%" />
     <meta name="appleid-signin-scope" content="name email" />

apps/admin/src/App.tsx

@@ -9,6 +9,7 @@ import {
   createBrowserRouter,
   Navigate,
   Outlet,
+  RouteObject,
   RouterProvider,
   ScrollRestoration,
 } from 'react-router-dom';
@@ -128,16 +129,23 @@ const privateRoutes = [
   },
 ];
 
-const router = createBrowserRouter([...publicRoutes, ...privateRoutes]);
+const routes: RouteObject[] = [
+  {
+    element: (
+      <QueryClientProvider>
+        <BooltiUIProvider>
+          <Outlet />
+        </BooltiUIProvider>
+      </QueryClientProvider>
+    ),
+    children: [...publicRoutes, ...privateRoutes],
+  },
+];
+
+const router = createBrowserRouter(routes);
 
 const App = () => {
-  return (
-    <QueryClientProvider>
-      <BooltiUIProvider>
-        <RouterProvider router={router} />
-      </BooltiUIProvider>
-    </QueryClientProvider>
-  );
+  return <RouterProvider router={router} />;
 };
 
 export default App;

apps/admin/src/components/AccountDeleteForm/AccountDeleteForm.styles.ts

@@ -0,0 +1,60 @@
+import { mq_lg } from '@boolti/ui';
+import styled from '@emotion/styled';
+
+const AccountDeleteForm = styled.form`
+  padding: 24px 0;
+
+  ${mq_lg} {
+    padding: 0;
+  }
+`;
+
+const AccountDeleteFormDescription = styled.p`
+  ${({ theme }) => theme.typo.b3};
+  color: ${({ theme }) => theme.palette.grey.g90};
+  margin-bottom: 12px;
+  line-height: 24px;
+`;
+
+const AccountDeleteFormTextArea = styled.textarea`
+  width: 100%;
+  padding: 12px;
+  border: 1px solid ${({ theme }) => theme.palette.grey.g20};
+  border-radius: 4px;
+  background-color: ${({ theme }) => theme.palette.grey.w};
+  color: ${({ theme }) => theme.palette.grey.g90};
+  ${({ theme }) => theme.typo.b3};
+
+  &:placeholder-shown {
+    border: 1px solid ${({ theme }) => theme.palette.grey.g20};
+    color: ${({ theme }) => theme.palette.grey.g30};
+  }
+
+  &:focus {
+    border: 1px solid ${({ theme }) => theme.palette.grey.g90};
+  }
+
+  &:disabled {
+    background: ${({ theme }) => theme.palette.grey.g10};
+    border: 1px solid ${({ theme }) => theme.palette.grey.g20};
+    color: ${({ theme }) => theme.palette.grey.g40};
+  }
+
+  &::placeholder {
+    color: ${({ theme }) => theme.palette.grey.g30};
+  }
+`;
+
+const AccountDeleteFormButtonWrapper = styled.div`
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+  margin-top: 32px;
+`;
+
+export default {
+  AccountDeleteForm,
+  AccountDeleteFormDescription,
+  AccountDeleteFormTextArea,
+  AccountDeleteFormButtonWrapper,
+};

apps/admin/src/components/AccountDeleteForm/index.tsx

@@ -0,0 +1,86 @@
+import { Button } from '@boolti/ui';
+import Styled from './AccountDeleteForm.styles';
+import { useForm } from 'react-hook-form';
+import { useDeleteMe, useLogout } from '@boolti/api';
+import { useAuthAtom } from '~/atoms/useAuthAtom';
+import { useNavigate } from 'react-router-dom';
+import { PATH } from '~/constants/routes';
+
+export interface AccountDeleteFormInputs {
+  reason: string;
+}
+
+interface AccountDeleteFormProps {
+  oauthType?: 'KAKAO' | 'APPLE';
+  onClose: () => void;
+}
+
+const AccountDeleteForm = ({ oauthType, onClose }: AccountDeleteFormProps) => {
+  const navigate = useNavigate();
+
+  const deleteMeMutation = useDeleteMe();
+  const { removeToken } = useAuthAtom();
+  const logoutMutation = useLogout({
+    onSuccess: () => {
+      removeToken();
+    },
+  });
+  const {
+    register,
+    handleSubmit,
+    reset,
+    formState: { isValid },
+  } = useForm<AccountDeleteFormInputs>();
+
+  const submitHandler = async (data: AccountDeleteFormInputs) => {
+    let appleIdAuthorizationCode: string | undefined = undefined;
+
+    // TODO: 애플 로그인 시 탈퇴 로직 작성
+    if (oauthType === 'APPLE') {
+      const appleAuthData = await window.AppleID?.auth.signIn();
+
+      appleIdAuthorizationCode = appleAuthData?.authorization.code;
+    }
+
+    await deleteMeMutation.mutateAsync({
+      reason: data.reason,
+      appleIdAuthorizationCode,
+    });
+    await logoutMutation.mutateAsync();
+
+    onClose();
+    navigate(PATH.INDEX);
+  };
+
+  return (
+    <Styled.AccountDeleteForm onSubmit={handleSubmit(submitHandler)}>
+      <Styled.AccountDeleteFormDescription>
+        삭제 이유를 알려 주세요. 주신 의견 참고하여 더 나은 서비스를 제공하는 불티가 되겠습니다.
+      </Styled.AccountDeleteFormDescription>
+      <Styled.AccountDeleteFormTextArea
+        placeholder="예) 계정 삭제 후 재 가입할게요"
+        rows={3}
+        autoFocus
+        {...register('reason', { required: true })}
+      />
+      <Styled.AccountDeleteFormButtonWrapper>
+        <Button
+          type="button"
+          colorTheme="line"
+          size="medium"
+          onClick={() => {
+            onClose();
+            reset();
+          }}
+        >
+          취소하기
+        </Button>
+        <Button type="submit" colorTheme="primary" size="medium" disabled={!isValid}>
+          삭제하기
+        </Button>
+      </Styled.AccountDeleteFormButtonWrapper>
+    </Styled.AccountDeleteForm>
+  );
+};
+
+export default AccountDeleteForm;

apps/admin/src/components/AuthoritySettingDialogContent/AuthoritySettingDialogContent.styles.ts

@@ -0,0 +1,7 @@
+import styled from '@emotion/styled';
+
+const Container = styled.div``;
+
+export default {
+  Container,
+};