From 05578025d854cd8980959bdb33e64f1d34c791b0 Mon Sep 17 00:00:00 2001
From: MinseoLee <mmmm@ajou.ac.kr>
Date: Thu, 7 Dec 2023 20:25:39 +0900
Subject: [PATCH] refactor: don't block render but handler
---
src/_app/App.tsx | 4 +---
src/common/instances/Connector.ts | 3 ---
src/pages/admin-page/AdminPage.tsx | 14 +++++---------
src/pages/cart-page/CartPage.tsx | 4 +---
src/pages/history-page/HistoryPage.tsx | 4 ++--
src/pages/login-page/LoginPage.tsx | 5 ++---
src/pages/main-page/MainPage.tsx | 6 +++---
src/pages/menu-page/MenuPage.tsx | 4 ++--
src/pages/order-page/success-page/SuccessPage.tsx | 4 +---
src/pages/signup-page/SignupPage.tsx | 8 ++++----
10 files changed, 21 insertions(+), 35 deletions(-)
diff --git a/src/_app/App.tsx b/src/_app/App.tsx
index b54e65b..6a0194c 100644
--- a/src/_app/App.tsx
+++ b/src/_app/App.tsx
@@ -44,8 +44,7 @@ function App() {
useEffect(() => {
- connector.current = new Connector(setLogin);
- console.log('app', connector.current);
+ if (!connector.current) connector.current = new Connector(setLogin);
}, []);
useEffect(() => {
@@ -57,7 +56,6 @@ function App() {
socket.current = new Socket();
socket.current?.onOrder((d: CartItemPostModel) => {
- console.log(d);
setToastItem({
id: '', title: d.shopId, description: d.waitingCount.toString(), goto: ''
});
diff --git a/src/common/instances/Connector.ts b/src/common/instances/Connector.ts
index f5b69cd..6c54333 100644
--- a/src/common/instances/Connector.ts
+++ b/src/common/instances/Connector.ts
@@ -10,17 +10,14 @@ class Connector {
private randomUuid = Math.random();
constructor(setLogin: LoginInstance) {
- console.log('constructed');
this.setLoginInstance = setLogin;
}
setIsAdmin(b: boolean) {
this.isAdmin = b;
- console.log('setIsAdmin', b);
}
getIsAdmin() {
- console.log('getIsAdmin', this.isAdmin);
return this.isAdmin;
}
diff --git a/src/pages/admin-page/AdminPage.tsx b/src/pages/admin-page/AdminPage.tsx
index 49ff62e..08c8f19 100644
--- a/src/pages/admin-page/AdminPage.tsx
+++ b/src/pages/admin-page/AdminPage.tsx
@@ -4,22 +4,18 @@ import { useNavigate } from "react-router-dom";
import APP_ROUTE from "../../_app/config/route";
import { ALERT } from "../../common/constants";
-import type Connector from "../../common/instances/Connector";
import type { GFC } from "../../common/types/fc";
const AdminPage: GFC = ({ connector }) => {
- if (!connector) return <></>;
-
const navigator = useNavigate();
useEffect(() => {
- console.log('adminpage', connector);
- // if (!connector.getIsAdmin()) {
- // alert(ALERT.REQ_WRONG);
- // navigator(APP_ROUTE.LOGIN);
- // return;
- // }
+ if (!connector.current?.getIsAdmin()) {
+ alert(ALERT.REQ_WRONG);
+ navigator(APP_ROUTE.LOGIN);
+ return;
+ }
}, [connector]);
return (
diff --git a/src/pages/cart-page/CartPage.tsx b/src/pages/cart-page/CartPage.tsx
index 7e99ca0..fb5cfcd 100644
--- a/src/pages/cart-page/CartPage.tsx
+++ b/src/pages/cart-page/CartPage.tsx
@@ -14,8 +14,6 @@ import type { GFC } from "../../common/types/fc";
const CartPage: GFC = ({ connector }) => {
- if (!connector) return <></>;
-
const { cartItem, setCartItem } = useContext(CartContext);
const [quantities, setQuantities] = useState<number[]>([]);
const [totalPrice, setTotalPrice] = useState(0);
@@ -45,7 +43,7 @@ const CartPage: GFC = ({ connector }) => {
};
const handleOrder = () => {
- if (!cartItem?.shop) return;
+ if (!cartItem?.shop || !connector.current) return;
void (async () => {
try {
diff --git a/src/pages/history-page/HistoryPage.tsx b/src/pages/history-page/HistoryPage.tsx
index d62155f..b5f46fe 100644
--- a/src/pages/history-page/HistoryPage.tsx
+++ b/src/pages/history-page/HistoryPage.tsx
@@ -10,11 +10,11 @@ import type { GFC } from "../../common/types/fc";
const HistoryPage: GFC = ({ connector }) => {
- if (!connector) return <></>;
-
const [model, setModel] = useState<HistoryPageModel|null>(null);
useEffect(() => {
+ if (!connector.current) return;
+
void (async () => {
try {
const response = await connector.current!.get<HistoryPageModel>('/order');
diff --git a/src/pages/login-page/LoginPage.tsx b/src/pages/login-page/LoginPage.tsx
index 3c62822..fe8d3df 100644
--- a/src/pages/login-page/LoginPage.tsx
+++ b/src/pages/login-page/LoginPage.tsx
@@ -11,8 +11,6 @@ import type { GFC } from "../../common/types/fc";
const LoginPage: GFC = ({ connector }) => {
- if (!connector) return <></>;
-
const [account, setAccount] = useState({
loginId: '', password: ''
});
@@ -36,12 +34,13 @@ const LoginPage: GFC = ({ connector }) => {
navigate(APP_ROUTE.SIGNUP);
};
const handleLogin = () => {
+ if (!connector.current) return;
+
void (async () => {
try {
const response = await connector.current!.login<LoginPagePostModel>(account);
if (response.role?.isAdmin) {
connector.current!.setIsAdmin(true);
- console.log('loginpage', connector);
navigate(APP_ROUTE.ADMIN);
} else {
connector.current!.setIsAdmin(false);
diff --git a/src/pages/main-page/MainPage.tsx b/src/pages/main-page/MainPage.tsx
index d7c625a..ecbda5a 100644
--- a/src/pages/main-page/MainPage.tsx
+++ b/src/pages/main-page/MainPage.tsx
@@ -13,16 +13,16 @@ import type { GFC } from "../../common/types/fc";
const MainPage: GFC = ({ connector }) => {
- if (!connector) return <></>;
-
const [model, setModel] = useState<MainPageModel|null>(null);
useEffect(() => {
+ if (!connector.current) return;
+
void (async () => {
try {
const response = await connector.current!.get<MainPageModel>('/shop');
setModel(response as MainPageModel);
- } catch {
+ } catch(e) {
alert(ALERT.REQ_FAIL);
}
})();
diff --git a/src/pages/menu-page/MenuPage.tsx b/src/pages/menu-page/MenuPage.tsx
index 88ff2ea..5921dd5 100644
--- a/src/pages/menu-page/MenuPage.tsx
+++ b/src/pages/menu-page/MenuPage.tsx
@@ -15,12 +15,12 @@ interface Props {
setHeaderName: Dispatch<SetStateAction<string>>;
}
const MenuPage: GFCWithProp<Props> = ({ connector, setHeaderName }) => {
- if (!connector) return <></>;
-
const [model, setModel] = useState<MenuPageModel|null>(null);
const { pathname } = useLocation();
useEffect(() => {
+ if (!connector.current) return;
+
void (async () => {
try {
const response = await connector.current!.get<MenuPageModel>(
diff --git a/src/pages/order-page/success-page/SuccessPage.tsx b/src/pages/order-page/success-page/SuccessPage.tsx
index 269db00..4a01131 100644
--- a/src/pages/order-page/success-page/SuccessPage.tsx
+++ b/src/pages/order-page/success-page/SuccessPage.tsx
@@ -8,12 +8,10 @@ import type { GFC } from "../../../common/types/fc";
const SuccessPage: GFC = ({ connector }) => {
- if (!connector) return <></>;
-
const location = useLocation();
useEffect(() => {
- if (!location.search) return;
+ if (!location.search || !connector.current) return;
void (async () => {
try {
diff --git a/src/pages/signup-page/SignupPage.tsx b/src/pages/signup-page/SignupPage.tsx
index e0694b1..92958ff 100644
--- a/src/pages/signup-page/SignupPage.tsx
+++ b/src/pages/signup-page/SignupPage.tsx
@@ -10,8 +10,6 @@ import type { GFC } from "../../common/types/fc";
const SignupPage: GFC = ({ connector }) => {
- if (!connector) return <></>;
-
const navigate = useNavigate();
const [accountData, setAccountData] = useState({
loginId: '',
@@ -72,14 +70,16 @@ const SignupPage: GFC = ({ connector }) => {
};
const handleSignup = () => {
- if(
+ if (!connector.current) return;
+
+ if (
accountData.loginId !== '' &&
accountData.name !== '' &&
accountData.email !== '' &&
accountData.phone !== '' &&
accountData.password !== '' &&
passwordAgain !== ''
- ){
+ ) {
try {
void(async () => {
await connector.current!.post('/user/register', accountData);
--
GitLab