[Deploy] 에러핸들링 실사용 배포 (2.0.3) (#108)

* fix: cookie test

* fix: 개발 환경 https 설정 제거

* chore: mkcert 패키지 제거

* chore: PR 템플릿 생성

* [Chore] 패키지 매니저를 pnpm으로 변경해요. (#52)

* chore: 패키지 매니저 pnpm으로 변경

* chore: yaml파일 삭제

* fix : eslint,prettier 제대로 되게 수정

* [Chore] client 서비스에 wow-design 시스템을 적용해요. (#56)

* feature: wowds로 마이그레이션

* fix: 디자인 시스템 마이그레이션

* feature: wow design system으로 마이그레이션

* fix: wowds 기본 CSS 설치

* feat : 디스코드 튜토리얼 UI 1차 반영

* feat : 가이드까지 UI 완성

* feat : width 에도 반영

* fix : spaceKet 로 타입 수정

* feat : spacing 토큰 변경

* feat : ㄹ리뷰 반영

* feat : 디스코드 api 연결

* feat : Image 컴포넌트 타입 수정

* fix: space 토큰 수정

* [Feature] github 로그인 페이지를 2차 MVP 페이지에 맞게 수정해요. (#62)

* feature: github 로그인 페이지 생성

* fix: 패키지 매니저 구성 변경

* fix: 패키지 구성 변경

* refactor : 리팩토링 및 변수명 변경

* fix: 하드코딩된 토큰 환경변수에 저장

* Create CODEOWNERS

* [Feature] 대시보드 2차 MVP DTO에 맞게 뷰를 수정해요. (#57)

* chore: 패키지 매니저 pnpm으로 변경

* chore: yaml파일 삭제

* feature: 새롭게 바뀐 DTO 반영

* chore: 컴포넌트 단순화 분리 작업

* feature: Mypage status 생성

* feature: wowds로 마이그레이션

* fix: 디자인 시스템 마이그레이션

* feature: wow design system으로 마이그레이션

* fix: 이것저것 반영

* feature: 대시보드 2차 MVP 틀 구현

* fix: 메인화면 네임 수정

* #51: #51: WIP on feature/#51

* feature: helpBox 생성

* fix: 서버 번경 사항 챙기기

* feat: 정회원 버튼 생성

* feat: react-hook-form 기본 세팅

* feat: signup 페이지 완성

* fix: 백엔드 DTO 변경에 따른 반영

* fix: 코드리뷰 반영

* fix: 코드리뷰 반영 - 랜더링 최적화

* fix: 패키지 변경사항 반영

* [Feature] 기본 회원 정보를 받을 수 있는 Signup 페이지를 2차 MVP에 맞게 수정해요. (#60)

* chore: 패키지 매니저 pnpm으로 변경

* chore: yaml파일 삭제

* feature: 새롭게 바뀐 DTO 반영

* chore: 컴포넌트 단순화 분리 작업

* feature: Mypage status 생성

* feature: wowds로 마이그레이션

* fix: 디자인 시스템 마이그레이션

* feature: wow design system으로 마이그레이션

* fix: 이것저것 반영

* feature: 대시보드 2차 MVP 틀 구현

* fix: 메인화면 네임 수정

* #51: #51: WIP on feature/#51

* feature: helpBox 생성

* fix: 서버 번경 사항 챙기기

* feat: 정회원 버튼 생성

* feat : wow ui 설치

* feat: react-hook-form 기본 세팅

* fix: 백엔드 api 명세 변경에 따른 프론트 수정 사항 반영

* fix: progressBar wow-ui로 변경

* fix: helpBox 안맞는 부분 수정

* fix: accesstoken 지우기

* feat: signup 페이지 완성

* fix: 코드리뷰 반영

* fix : pnpm install

* refactor : query 관련 훅으로 리팩토링, Space 컴포넌트 수정

* fix: getValues 로 수정

* refactor: react-hook-form 의 pattern 사용해서 유효성 검증

* feat : 라우팅 반영

* style : width 100% 수정

* [Feature] 정회원 지원하기 액션시트를 생성하고, API를 연결해요. (#63)

* chore: 패키지 매니저 pnpm으로 변경

* chore: yaml파일 삭제

* feature: 새롭게 바뀐 DTO 반영

* chore: 컴포넌트 단순화 분리 작업

* feature: Mypage status 생성

* feature: wowds로 마이그레이션

* fix: 디자인 시스템 마이그레이션

* feature: wow design system으로 마이그레이션

* fix: 이것저것 반영

* feature: 대시보드 2차 MVP 틀 구현

* fix: 메인화면 네임 수정

* #51: #51: WIP on feature/#51

* feature: helpBox 생성

* fix: 서버 번경 사항 챙기기

* feat: 정회원 버튼 생성

* feat: BottomSheet context 생성

* feat : wow ui 설치

* feat: react-hook-form 기본 세팅

* fix: 백엔드 api 명세 변경에 따른 프론트 수정 사항 반영

* fix: progressBar wow-ui로 변경

* fix: helpBox 안맞는 부분 수정

* fix: accesstoken 지우기

* chore: 패키지 업데이트

* feat: BottomSheet 기본 틀 잡기

* feat: 바텀시트 기본 틀 다잡아두기

* feature: API 연결

* fix: pc화면에서 어색해보이지 않도록 가운데 정렬

* fix: 준회원일 경우에만 가입 BottomSheet 보이게끔

* fix: merge 삑난거 수정하기

* fix: 코드리뷰 반영

* fix: 코드리뷰 반영

* fix: 코드리뷰 반영

* fix: bottomSheet overlay fixed로 변경하기

* fix: 코드리뷰 반영

* [Feature] Bevy 가입 인증 절차를 생성해요. (#70)

* feat: 기본 Bevy 뷰 생성

* fix: useMutation으로 API 분리

* fix: 사용하지 않는 파일 삭제

* [Feature] 홍익대학교 Gmail을 통해 재학생 인증 기능을 만들어요. (#67)

* feat: 인증하기 초기 화면 디자인 변경

* fix : 필요없는 파일 삭제

* fix: API 객체로 변경

* fix: 이메일 인증 화면 변경하기

* feat: 재학생 인증 실패/성공 화면 만들기

* fix: 백엔드 API 반영 전 상태로 되돌리기

* fix: 코드리뷰 작성

* fix: preventReload 적용

* fix: 버튼 삑나간거 고치기

* fix: media query 중단점 수정

* fix: wowds ui 업데이트

* fix: code를 서버에게 보내요.

* feat: 회비 납부 플로우 추가

* feat: 토스페이먼츠 결제하기 라우팅

* feat: 토스페이먼츠 클라이언트키 임시등록

* feat: 총 결제금액 표시

* feat: 결제 성공 시 마이페이지로 리다이렉트

* chore: 결제 위젯 연동에 필요한 패키지 설치

* fix: PENDING 상태일 때만 결제창 띄움

* fix: 총 결제 금액 임시 하드코딩

* feat: coupon API 추가

* design: 결제창 레이아웃 변경

* feat: 결제 성공 및 실패 화면, 라우팅

* chore: wowds-ui 설치

* feat: wowds로 마이그레이션

* design: wowds UI 적용

* fix: Box 테두리 색상 임시 변경

* feat: 결제정보 전달 API

* feat: 유저정보 API 임시설정

* feat: 쿠폰 타입 변경

* feat: 토스페이먼츠 최신 API 임시 구현 사항

* fix: API post -> get

* chore: payments 라이브러리 업데이트

* feat: 토스페이먼츠 위젯 라이브러리 업데이트에 의한 기능구현 변경

* feat: useProduct hook으로 결제 관리

* fix: 결제 실패 시 쿠폰 적용 페이지로 라우팅

* chore: react-secure-storage 설치

* feat: ENV 추가

* feat: 결제 정보 암호화, 로컬스토리지 저장

* fix: 할인금액이 있을 때만 노출

* feat: 결제 실패 시 로컬스토리지 초기화

* fix: 스토리지 리턴타입 단언

* fix: 토스페이먼츠 타입 any 허용

* refactor: 회비 납부 페이지 컴포넌트 분리

* feat: 임시 주문과 결제 승인 API 구분하기

* fix: 토스페이먼츠 테스트를 위한 로직 수정

* feat: 주문완료 API 추가

* design: 회비 납부 UI 수정

* feat: 쿠폰 정보 추가

* refactor: 라우팅 없이 결제 위젯 연결

* fix: 결제 실패 시 라우팅 변경

* fix: 스토리지 관련 로직 삭제

* fix: 스토리지 관련 로직 삭제

* refactor: useProduct 훅, 관련 로직 리렌더링 최소화 리팩토링

* fix: 스토리지 clear 로직 삭제

* fix: 테스트용 API 제거

* chore: 주석 제거

* chore: console.log 삭제

* chore: wowds-ui 버전업

* refactor: 쿠폰 드롭다운

* feat: 무료 주문 생성 API

* feat: 주문 생성 API mutation hook으로 변경, 총 가격에 따른 API 조건부 반환

* feat: 주문 완료 API mutation hook으로 변경

* fix : 빌드 에러 수정 , ci 작성

* fix : ci 수정

* fix :svg 속성, 필요없는 컴포넌트 삭제

* fix : 안쓰는 api 삭제

* [Fix]: 디스코드 연동 마이너 이슈 수정  (#75)

* fix: 디스코드 합류 체크 관련 API 호출 개선 및 문구 변경

* fix: 메서드 잘못된거 하나 슬쩍 고치기

* fix: API 문서 수정

* [Fix]: Signup 페이지 마이너 UI 이슈 수정  (#74)

* fix: signup 마이너 UI 이슈 수정

* fix: 안쓰는 스타일 객체 일단 삭제

* feat: 푸터 텍스트 로고 추가

* feat: 푸터 UI

* fix: 기존 홈 온보딩 이미지 삭제

* feat : qa반영

* fix : 불필요한 스타일 삭제, 텍필에 100% 추가

* [Refactor] : 학교 이메일 인증 페이지 QA 개선 반영 (#80)

* fix: email 인증 error코드 중복 제거

* refac: 스팸메일함 안내문구 추가

* chore: 채널톡 위젯 삭제

* [Refactor] : Signup 페이지 QA 개선 반영 (#79)

* fix: 하단 absolute 처리

* fix: bottom간격 해결

* fix: signup QA

* chore: wow-ui 버전 업데이트

* [Feature]: Sentry 세팅 (#81)

* chore: sentry 패키지 기본 설치

* feat: Sentry ErrorBoundary 추가

* fix: sentry 관련 기본적인 세팅 완료

* fix: json 문법 수정

* fix: Chatbot 삭제

* fix: 브라우저 설정 환경에 따른 sentry 세팅

* fix: 필요없는 dev 세팅 환경 지우기

* fix: 논리 테스트 (#82)

* [Chore]: Sentry 논리 되돌리기 (#83)

* fix: 논리 테스트

* fix: sentry 논리판단 되돌리기

* [Chore] : 빌드로그에서 vercel 환경변수 볼 수 있도록 하기 (#84)

* fix: 논리 테스트

* fix: sentry 논리판단 되돌리기

* chore: console 테스트

* fix: 로딩 스피너 추가 및 기존 패키지 제거 (#89)

* [Refactor]: 마이너 UI 이슈 수정 (#90)

* fix: textfield 가로길이 안맞는 부분 수정

* fix: scroll 반 쯤 내려가 있는 문제 해결

* [Refactor] : 결제 페이지에 준회원이 아닌 경우 접근하지 못하도록 해요. (#88)

* fix: payment 가드 생성

* fix: 현재 모집기간 닫혀있을때 결제화면 접근 못함

* refac: 토스페이먼츠 접근 화면 가드 꼼꼼하게 다듬기

* fix: data undefined 처리

* fix: payment 성공화면 access화면 생성

* [Refactor]: 학교 이메일 인증 정책을 변경해요 (#91)

* fix: email 인증 error코드 중복 제거

* refac: 스팸메일함 안내문구 추가

* chore: 채널톡 위젯 삭제

* fix: 학회원 모집 마감 처리 Box 생성

* fix: 이메일 인증 in_progress 단계 추가

* fix: 이미 사용하고 있는 타입으로 변경

* [Fix] 토스페이먼츠 QA 개선 반영 (#93)

* [Fix]: 서버 로그인 로직 변경에 따른 AccessToken, RefeshToken 쿠키 세팅 제거 및 landingStatus 제거  (#87)

* fix: 논리 테스트

* fix: sentry 논리판단 되돌리기

* chore: console 테스트

* fix: cookie base-url 상위 도메인으로 변경

* fix: landingStatus 로직 제거

* fix: 메인화면 지원하기 버튼 dashboard로 라우트

* fix:landingStatus 삭제 및 쿠키로직 수정

* fix: landingStatus 관련된 모든 로직 제거

* fix: 쿠키 판단 로직 재건

* fix: 필요없는 guard 모두 삭제

* fix: 리다이렉트 정리

* fix: 로그인 유지 시간 sessionStorage에서 확인

* fix: 쿠키 관련 도메인 로직 모두 삭제

* fix: Cookie 관련 모든 로직 삭제

* fix: 빌드에러 터지는거 해결

* fix: 서버에서 refresh갱신 실패할때 로그아웃 처리

* fix: 403 에러 왔을때 세션 만료

* fix: 모집 기간 마감 예외처리

* fix: 파일 확장명 변경

* [Fix] 토스페이먼츠 결제성공 페이지 가드 임시삭제 (#94)

* fix: PaymentsSuccess 가드 임시 삭제

* fix: 전체 금액이 0 미만일 때 0으로 처리

* fix: 사용하지 않는 import 삭제

* fix: 디스코드 관련 qa 반영

* feat : 인증을 완료한 경우에는 대시보드로 라우팅 하는 가드 설정

* [Fix]: 0807 QA 반영 (#95)

* fix: navigate 정상화

* fix: 모집 차수 깨져 보이는 현상 개선

* fix: 모집 기간 아닐 때 에러 화면 제거

* fix: signup화면 제출 문구 수정

* refac: 이메일 도메인 직접 입력할 수 있도록 변경

* feat: 로그아웃 로직 붙임

* fix: wowds-ui 버전 업데이트

* fix: username 닉네임 잘못된 부분 수정

* fix: 대기중 문구만 뜨는 것 고치기

* fix: console log 삭제

* fix: 합류 확인 여부 리팩토링

* fix: 로그인 코드 변경

* fix:joinServer 안내문구

* fix:빌드실패 고치기

* fix:서버 status 변경사항 반영

* fix: build 에러 해결

* fix: paymentStatus enum 변경

* [Fix] 토스페이먼츠 쿠폰 관련 QA 사항 반영 (#97)

* feat: 총 금액이 0원 이하일 때와 아닐 때의 로직 분리

* fix: 로직 수정 및 에러 토스트 메시지로 변환

* fix: 톤매너 정립

---------

Co-authored-by: Eugene Kim <[email protected]>

* fix: 상용배포 마이너 UI 이슈

* [Feature]: 에러핸들러 동작방식 수정, sentry 에러잡기 테스트 (#102)

* feat: custom error 핸들러 추가

* feat: sentry 에러 잡는 Async component 생성

* feat: 404 페이지 생성

* feat: 404 페이지 404 잡히게끔 설정

* fix: Text 잘못 import 한것 제거

* feat: apiErrorboundary 수정

* [Feature]: react query를 이용한 에러 처리방식으로 수정 (#103)

* feat: custom error 핸들러 추가

* feat: sentry 에러 잡는 Async component 생성

* feat: 404 페이지 생성

* feat: 404 페이지 404 잡히게끔 설정

* fix: Text 잘못 import 한것 제거

* feat: apiErrorboundary 수정

* fix: error동작방식 수정

* chore: 에러처리 순서 변경

* fix: 빌드에러 처리

* [Feature]: 2024-2 가입 랜딩페이지 수정 (#101)

* fix: 지원기간 하드코딩 변경

* fix: 온보딩 문구 수정

* fix: footer 이용약관 추가

* feat: sentry sourcemap 설정 (#106)

* [Fix] Sentry 에러 dsn 키 문제 해결 (#107)

* feat: sentry sourcemap 설정

* fix: sentry 에러바운더리인식문제 해결

* fix: key 없을경우 대체

* fix: 키 문제 확인

* fix: 키 들어가는지 확인

* fix: key 문제점 해결

---------

Co-authored-by: 강나연 <[email protected]>
Co-authored-by: 강나연 <[email protected]>
Co-authored-by: SeieunYoo <[email protected]>
Co-authored-by: SeieunYoo <[email protected]>
Co-authored-by: hamo-o <[email protected]>
Co-authored-by: 이현영 <[email protected]>

.gitignore

@@ -25,4 +25,6 @@ dist-ssr
 *.sw?
 
 .env
-*.pem
+*.pem
+# Sentry Config File
+.env.sentry-build-plugin

src/constants/environment.ts

@@ -5,6 +5,6 @@ export const {
   VITE_ACCESS_TOKEN: ACCESS_TOKEN,
   VITE_CLIENT_KEY: CLIENT_KEY,
   REACT_APP_SECURE_LOCAL_STORAGE_HASH_KEY: SECURE_KEY,
-  SENTRY_DSN_KEY: SENTRY_DSN_KEY,
+  VITE_SENTRY_DSN_KEY: VITE_SENTRY_DSN_KEY,
   SENTRY_AUTH_TOKEN: SENTRY_AUTH_TOKEN
 } = import.meta.env;

src/main.tsx

@@ -1,16 +1,17 @@
-import sentry from '@utils/sentry';
+/* eslint-disable import/namespace */
 import * as Sentry from '@sentry/react';
+import sentry from './utils/sentry';
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+
 import BottomSheetProvider from './components/provider/BottomSheetProvider';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { Routers } from '@/routes';
 import { GlobalStyle } from '@/styles';
 import { Global } from '@emotion/react';
 import { ToastContainer } from 'react-toastify';
 import './styles/styles.scss';
-
 try {
   sentry.initSentry();
 } catch (error: unknown) {

src/utils/sentry.ts

@@ -1,3 +1,4 @@
+/* eslint-disable import/namespace */
 import { useEffect } from 'react';
 import * as Sentry from '@sentry/react';
 import {
@@ -6,34 +7,31 @@ import {
   useLocation,
   useNavigationType
 } from 'react-router-dom';
-import { SENTRY_DSN_KEY } from '@/constants/environment';
+import { VITE_SENTRY_DSN_KEY } from '@/constants/environment';
 
 const setSentry = () => {
   function initSentry() {
-    if (process.env.NODE_ENV === 'development') return;
-
     Sentry.init({
-      environment: process.env.VERCEL_ENV,
-      dsn: SENTRY_DSN_KEY,
+      environment: process.env.NODE_ENV,
+      dsn: VITE_SENTRY_DSN_KEY,
       tracesSampleRate: 1.0,
+      tracePropagationTargets: [
+        'localhost',
+        /^https:\/\/(?:dev-|local-)?onboarding\.gdschongik\.com(?:\/.*)/,
+        /^https:\/\/(?:dev-)?api\.gdschongik\.com(?:\/.*)/
+      ],
       integrations: [
+        Sentry.browserTracingIntegration(),
         Sentry.reactRouterV6BrowserTracingIntegration({
           useEffect,
           useLocation,
           useNavigationType,
           createRoutesFromChildren,
           matchRoutes
         }),
-        // eslint-disable-next-line import/namespace
         Sentry.replayIntegration()
       ],
 
-      tracePropagationTargets: [
-        /^https:\/\/onboarding.gdschongik.com\/?.*$/,
-        /^https:\/\/api\.gdschongik\.com\/?.*$/,
-        /^https:\/\/dev-onboarding.gdschongik.com\/?.*$/,
-        /^https:\/\/dev-api\.gdschongik\.com\/?.*$/
-      ],
       replaysSessionSampleRate: 0.1,
       replaysOnErrorSampleRate: 1.0
     });

vite.config.ts

@@ -1,7 +1,6 @@
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react-swc';
 import tsconfigPaths from 'vite-tsconfig-paths';
-
 import { sentryVitePlugin } from '@sentry/vite-plugin';
 
 // https://vitejs.dev/config/
@@ -10,13 +9,17 @@ export default defineConfig({
     react(),
     tsconfigPaths(),
     sentryVitePlugin({
-      org: process.env.SENTRY_ORG_NAME,
-      project: process.env.SENTRY_PROJECT_NAME,
-      authToken: process.env.SENTRY_AUTH_TOKEN,
+      org: process.env.VITE_SENTRY_ORG_NAME,
+      project: process.env.VITE_SENTRY_PROJECT_NAME,
+      authToken: process.env.VITE_SENTRY_AUTH_TOKEN,
       sourcemaps: {
         assets: './dist/**',
         filesToDeleteAfterUpload: '**/*.map'
       }
+    }),
+    sentryVitePlugin({
+      org: 'gdsc-hongik',
+      project: 'wow-onboarding'
     })
   ],
   build: {