Merge branch 'main' of https://gitea.bpsoft.co.kr/nicepayments/nice-app-web

src/pages/setting/setting-page.tsx

@@ -11,12 +11,12 @@ import {
 	useSetHeaderType,
 	useSetFooterMode
 } from '@/widgets/sub-layout/use-sub-layout';
-import { ChangeEvent, useEffect, useState } from 'react';
+import { ChangeEvent, useCallback, useEffect, useState } from 'react';
 import { useAppBridge } from '@/hooks/useAppBridge';
 
 export const SettingPage = () => {
   let userInfo = useStore.getState().UserStore.userInfo;
-  const { isPushNotificationEnabled, openAppSettings } = useAppBridge();
+  const { isPushNotificationEnabled, openAppSettings, logout, getLoginType } = useAppBridge();
 
   useSetHeaderTitle('설정');
   useSetHeaderType(HeaderType.LeftArrow);
@@ -45,11 +45,22 @@ export const SettingPage = () => {
     window.open('https://www.nicevan.co.kr/privacy-policy', '_blank');
   };
 
-  const checkPushNotificationStatus = () => {
+  const onClickLogout = () => {
+    logout();
+  };
+
+  const checkPushNotificationStatus = useCallback(() => {
+    console.log('checkPushNotificationStatus');
     isPushNotificationEnabled().then((enabled) => {
       setPushNotificationEnabled(enabled);
     });
-  };
+  }, [isPushNotificationEnabled]);
+
+  const loadLoginType = useCallback(() => {
+    getLoginType().then((type) => {
+      setLoginType(type as LoginType);
+    });
+  }, [getLoginType]);
 
   const onClickPushNotificationToggle = () => {
     openAppSettings();
@@ -103,6 +114,7 @@ export const SettingPage = () => {
   useEffect(() => {
     callAppAlarmFind();
     checkPushNotificationStatus();
+    loadLoginType();
 
     // 앱이 포어그라운드로 돌아올 때 푸시 알림 권한 상태 재확인
     const handleVisibilityChange = () => {
@@ -122,7 +134,7 @@ export const SettingPage = () => {
       document.removeEventListener('visibilitychange', handleVisibilityChange);
       window.removeEventListener('focus', handleFocus);
     };
-  }, []);
+  }, [checkPushNotificationStatus, loadLoginType]);
 
   return (
     <>
@@ -131,7 +143,12 @@ export const SettingPage = () => {
           <div className="settings-header">
             <div className="settings-title">알림 수신 설정</div>
             <label className="settings-switch" onClick={onClickPushNotificationToggle}>
-              <input type="checkbox" checked={pushNotificationEnabled} readOnly />
+              <input
+                type="checkbox"
+                checked={pushNotificationEnabled}
+                readOnly
+                onClick={(e) => e.preventDefault()}
+              />
               <span className="slider"></span>
             </label>
           </div>
@@ -234,7 +251,7 @@ export const SettingPage = () => {
             </div>
           </div>
 
-          <div 
+          <div
             className="settings-row link"
             onClick={ () => setLoginTypeBottomSheetOn(true) }
           >
@@ -242,7 +259,7 @@ export const SettingPage = () => {
             <div className="click">{ APP_LOGIN_TYPE[loginType] }</div>
           </div>
 
-          <div 
+          <div
             className="settings-row link nopadding"
             onClick={ () => setServiceLanguageBottomSheetOn(true) }
           >
@@ -252,7 +269,7 @@ export const SettingPage = () => {
 
           <div className="settings-divider"></div>
 
-          <div className="settings-row danger">
+          <div className="settings-row danger" onClick={onClickLogout}>
             <div className="settings-row-title bd-style">로그아웃</div>
           </div>