feat: 권한 거부 페이지 생성 (#87)

src/configs/axios.ts

@@ -62,6 +62,8 @@ API.interceptors.response.use(
 
         config.headers['Authorization'] = accessToken;
         return API.request(config);
+      } else if (data.errorCode === '4107') {
+        location.href = PAGE_URL.NoPermission;
       }
 
       return Promise.reject({

src/configs/path.ts

@@ -5,6 +5,7 @@ export enum PAGE_URL {
   FindPassword = '/auth/findPassword',
   Admission = '/auth/admission',
   UseTerms = '/auth/useTerms',
+  NoPermission = '/auth/noPermission',
 
   Home = '/home',
 

src/pages/auth/AuthPageSwitch.tsx

@@ -2,6 +2,7 @@ import { Route, Switch } from 'react-router-dom';
 
 import { Admission } from './admission';
 import { FindPassword } from './findPassword';
+import { NoPermission } from './NoPermission';
 import { SignIn } from './signIn';
 import { SignUp } from './signUp';
 import { UseTerms } from './useTerms';
@@ -15,5 +16,6 @@ export const AuthPageSwitch: React.FC = () => (
     <Route path={PAGE_URL.SignUp} component={SignUp} />
     <Route path={PAGE_URL.UseTerms} component={UseTerms} />
     <Route path={PAGE_URL.FindPassword} component={FindPassword} />
+    <Route path={PAGE_URL.NoPermission} component={NoPermission} />
   </Switch>
 );

src/pages/auth/NoPermission/NoPermissionPage.tsx

@@ -0,0 +1,20 @@
+import { observer } from 'mobx-react-lite';
+import React from 'react';
+
+import { PageUiStoreImpl } from './NoPermissionPageUiStore';
+
+import { BodyScreen, Header, PageBody, PageStoreHOC } from '@/components';
+import { PAGE_URL } from '@/configs/path';
+
+const NoPermissionPage: React.FC = observer(() => {
+  return (
+    <>
+      <Header withBack={PAGE_URL.Home} title="경고" />
+      <PageBody>
+        <BodyScreen>접근 권한이 없습니다.</BodyScreen>
+      </PageBody>
+    </>
+  );
+});
+
+export default PageStoreHOC(<NoPermissionPage />, { store: PageUiStoreImpl });

src/pages/auth/NoPermission/NoPermissionPageUiStore.ts

@@ -0,0 +1,9 @@
+import { makeAutoObservable } from 'mobx';
+
+export class NoPermissionPageUiStore {
+  constructor() {
+    makeAutoObservable(this, {}, { autoBind: true });
+  }
+}
+
+export const PageUiStoreImpl = new NoPermissionPageUiStore();

src/pages/auth/NoPermission/index.ts

@@ -0,0 +1 @@
+export { default as NoPermission } from './NoPermissionPage';

src/pages/auth/useTerms/UseTermsPage.tsx

@@ -9,11 +9,7 @@ import { PAGE_URL } from '@/configs/path';
 import { useRootStore } from '@/stores/RootStore';
 
 const UseTermsPage: React.FC = observer(() => {
-  const {
-    replace,
-    push,
-    location: { pathname },
-  } = useHistory();
+  const { replace, push } = useHistory();
   const {
     auth: { isSignIn },
   } = useRootStore();