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

src/hooks/useAppBridge.tsx

@@ -53,6 +53,12 @@ interface UseAppBridgeReturn {
   openBiometricRegistrationPopup: () => Promise<boolean>;
   // 간편 인증 등록 팝업 닫기
   closeBiometricRegistrationPopup: () => Promise<void>;
+
+  // 푸시 알림 권한 확인
+  isPushNotificationEnabled: () => Promise<boolean>;
+
+  // 앱 설정 화면 열기
+  openAppSettings: () => Promise<void>;
 }
 
 export const useAppBridge = (): UseAppBridgeReturn => {
@@ -229,6 +235,21 @@ export const useAppBridge = (): UseAppBridgeReturn => {
     return appBridge.safeCall(() => appBridge.shareContent(content));
   }, [isNativeEnvironment]);
 
+  const isPushNotificationEnabled = useCallback(async (): Promise<boolean> => {
+    if (!isNativeEnvironment) {
+      return true;
+    }
+    const result = await appBridge.safeCall(() => appBridge.isPushNotificationEnabled(), false);
+    return result || false;
+  }, [isNativeEnvironment]);
+
+  const openAppSettings = useCallback(async (): Promise<void> => {
+    if (!isNativeEnvironment) {
+      return;
+    }
+    return appBridge.safeCall(() => appBridge.openAppSettings());
+  }, [isNativeEnvironment]);
+
   return {
     isNativeEnvironment,
     isAndroid,
@@ -249,6 +270,8 @@ export const useAppBridge = (): UseAppBridgeReturn => {
     requestRefreshToken,
     registerBiometric,
     openBiometricRegistrationPopup,
-    closeBiometricRegistrationPopup
+    closeBiometricRegistrationPopup,
+    isPushNotificationEnabled,
+    openAppSettings
   };
 }; 

src/pages/setting/setting-page.tsx

@@ -12,9 +12,12 @@ import {
 	useSetFooterMode
 } from '@/widgets/sub-layout/use-sub-layout';
 import { ChangeEvent, useEffect, useState } from 'react';
+import { useAppBridge } from '@/hooks/useAppBridge';
 
 export const SettingPage = () => {
   let userInfo = useStore.getState().UserStore.userInfo;
+  const { isPushNotificationEnabled, openAppSettings } = useAppBridge();
+
   useSetHeaderTitle('설정');
   useSetHeaderType(HeaderType.LeftArrow);
   useSetFooterMode(false);
@@ -27,6 +30,7 @@ export const SettingPage = () => {
   const {mutateAsync: appAlarmFind} = useAppAlarmFindMutation();
   const {mutateAsync: appAlarmConsent} = useAppAlarmConsentMutation();
 
+  const [pushNotificationEnabled, setPushNotificationEnabled] = useState<boolean>(false);
   const [alarmSetting, setAlarmSetting] = useState<Record<string, boolean>>({
     '21': false,
     '11': false,
@@ -41,6 +45,16 @@ export const SettingPage = () => {
     window.open('https://www.nicevan.co.kr/privacy-policy', '_blank');
   };
 
+  const checkPushNotificationStatus = () => {
+    isPushNotificationEnabled().then((enabled) => {
+      setPushNotificationEnabled(enabled);
+    });
+  };
+
+  const onClickPushNotificationToggle = () => {
+    openAppSettings();
+  };
+  
   const callAppAlarmFind = () => {
     if(userInfo.usrid){
       let params: AppAlarmFindParams = {
@@ -88,6 +102,26 @@ export const SettingPage = () => {
   
   useEffect(() => {
     callAppAlarmFind();
+    checkPushNotificationStatus();
+
+    // 앱이 포어그라운드로 돌아올 때 푸시 알림 권한 상태 재확인
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === 'visible') {
+        checkPushNotificationStatus();
+      }
+    };
+
+    const handleFocus = () => {
+      checkPushNotificationStatus();
+    };
+
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+    window.addEventListener('focus', handleFocus);
+
+    return () => {
+      document.removeEventListener('visibilitychange', handleVisibilityChange);
+      window.removeEventListener('focus', handleFocus);
+    };
   }, []);
 
   return (
@@ -96,8 +130,8 @@ export const SettingPage = () => {
         <div className="sub-wrap">
           <div className="settings-header">
             <div className="settings-title">알림 수신 설정</div>
-            <label className="settings-switch">
-              <input type="checkbox" />
+            <label className="settings-switch" onClick={onClickPushNotificationToggle}>
+              <input type="checkbox" checked={pushNotificationEnabled} readOnly />
               <span className="slider"></span>
             </label>
           </div>
@@ -112,6 +146,7 @@ export const SettingPage = () => {
                 <input
                   type="checkbox"
                   checked={ alarmSetting['21'] }
+                  disabled={ !pushNotificationEnabled }
                   onChange={ (e: ChangeEvent<HTMLInputElement>) => callAppAlarmConsent(e.target.checked, '21') }
                 />
                 <span className="slider"></span>
@@ -123,6 +158,7 @@ export const SettingPage = () => {
                 <input
                   type="checkbox"
                   checked={ alarmSetting['11'] }
+                  disabled={ !pushNotificationEnabled }
                   onChange={ (e: ChangeEvent<HTMLInputElement>) => callAppAlarmConsent(e.target.checked, '11') }
                 />
                 <span className="slider"></span>
@@ -134,6 +170,7 @@ export const SettingPage = () => {
                 <input
                   type="checkbox"
                   checked={ alarmSetting['31'] }
+                  disabled={ !pushNotificationEnabled }
                   onChange={ (e: ChangeEvent<HTMLInputElement>) => callAppAlarmConsent(e.target.checked, '31') }
                 />
                 <span className="slider"></span>
@@ -145,6 +182,7 @@ export const SettingPage = () => {
                 <input
                   type="checkbox"
                   checked={ alarmSetting['41'] }
+                  disabled={ !pushNotificationEnabled }
                   onChange={ (e: ChangeEvent<HTMLInputElement>) => callAppAlarmConsent(e.target.checked, '41') }
                 />
                 <span className="slider"></span>
@@ -160,6 +198,7 @@ export const SettingPage = () => {
                 <input
                   type="checkbox"
                   checked={ alarmSetting['61'] }
+                  disabled={ !pushNotificationEnabled }
                   onChange={ (e: ChangeEvent<HTMLInputElement>) => callAppAlarmConsent(e.target.checked, '61') }
                 />
                 <span className="slider"></span>
@@ -171,6 +210,7 @@ export const SettingPage = () => {
                 <input
                   type="checkbox"
                   checked={ alarmSetting['62'] }
+                  disabled={ !pushNotificationEnabled }
                   onChange={ (e: ChangeEvent<HTMLInputElement>) => callAppAlarmConsent(e.target.checked, '62') }
                 />
                 <span className="slider"></span>

src/types/bridge.ts

@@ -65,7 +65,13 @@ export enum BridgeMessageType {
   GET_LANGUAGE = 'getLanguage',
   
   // 메시지 카운트 업데이트
-  UPDATE_MESSAGE_COUNT = 'updateMessageCount'
+  UPDATE_MESSAGE_COUNT = 'updateMessageCount',
+
+  // 푸시 알림 권한 확인
+  IS_PUSH_NOTIFICATION_ENABLED = 'isPushNotificationEnabled',
+
+  // 앱 설정 화면 열기
+  OPEN_APP_SETTINGS = 'openAppSettings'
 }
 
 export interface DeviceInfo {

src/utils/appBridge.ts

@@ -195,6 +195,16 @@ class AppBridge {
     return this.sendMessage(BridgeMessageType.UPDATE_MESSAGE_COUNT, { count });
   }
 
+  // 푸시 알림 권한 확인
+  async isPushNotificationEnabled(): Promise<boolean> {
+    return this.sendMessage(BridgeMessageType.IS_PUSH_NOTIFICATION_ENABLED);
+  }
+
+  // 앱 설정 화면 열기
+  async openAppSettings(): Promise<void> {
+    return this.sendMessage(BridgeMessageType.OPEN_APP_SETTINGS);
+  }
+
   // 네이티브 환경 체크
   isNativeEnvironment(): boolean {
     return !!(