설정 페이지 및 관련 컴포넌트 다국어(localization) 적용

- 설정 페이지 전체 텍스트 다국어 지원
- 로그인 방식 선택 bottom sheet 다국어 적용
- 서비스 언어 선택 bottom sheet 다국어 적용
- 앱브리지에서 언어 설정 조회 기능 추가
- 페이지 로드 시 앱브리지 언어 설정으로 초기화
- AppLanguage enum 값 변경 (KO/EN → ko/en)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/entities/alarm/ui/login-type-bottom-sheet.tsx

@@ -1,12 +1,12 @@
-import { APP_LOGIN_TYPE } from "@/entities/common/model/constant";
 import { LoginType } from "@/entities/common/model/types";
 import { IMAGE_ROOT } from "@/shared/constants/common";
+import { useTranslation } from "react-i18next";
 
 export interface LoginTypeBottomSheetProps {
   loginTypeBottomSheetOn: boolean;
   setLoginTypeBottomSheetOn: (loginTypeBottomSheetOn: boolean) => void;
   loginType: LoginType;
-  setLoginType: (loginType: LoginType) => void;
+  setLoginType: (loginType: string) => void;
 };
 
 export const LoginTypeBottomSheet = ({
@@ -15,11 +15,12 @@ export const LoginTypeBottomSheet = ({
   loginType,
   setLoginType
 }: LoginTypeBottomSheetProps) => {
+  const { t } = useTranslation();
 
   const onClickToClose = () => {
     setLoginTypeBottomSheetOn(false);
   };
-  const onChangeLoginType = (type: LoginType) => {
+  const onChangeLoginType = (type: string) => {
     setLoginType(type);
     onClickToClose();
   };
@@ -30,14 +31,14 @@ export const LoginTypeBottomSheet = ({
       <div className="bottomsheet">
         <div className="bottomsheet-header">
           <div className="bottomsheet-title">
-            <h2>로그인 방식을 선택하세요.</h2>
-            <button 
-              className="close-btn" 
+            <h2>{t('settings.loginType.title')}</h2>
+            <button
+              className="close-btn"
               type="button"
             >
-              <img 
+              <img
                 src={ IMAGE_ROOT + '/ico_close.svg' }
-                alt="닫기"
+                alt={t('common.close')}
                 onClick={ onClickToClose }
               />
             </button>
@@ -47,14 +48,14 @@ export const LoginTypeBottomSheet = ({
         <div className="bottomsheet-content">
           <div className="bottom-section">
             <ul className="list-style-circle link">
-              <li 
+              <li
                 className={ `${(loginType === LoginType.ID)? 'selected': ''}` }
-                onClick={ () => onChangeLoginType(LoginType.ID) }
-              >{ APP_LOGIN_TYPE[LoginType.ID] }</li>
+                onClick={ () => onChangeLoginType('ID') }
+              >{t('settings.loginType.idPassword')}</li>
               <li
                 className={ `${(loginType === LoginType.BIOMETRIC)? 'selected': ''}` }
-                onClick={ () => onChangeLoginType(LoginType.BIOMETRIC) }
-              >{ APP_LOGIN_TYPE[LoginType.BIOMETRIC] }</li>
+                onClick={ () => onChangeLoginType('BIOMETRIC') }
+              >{t('settings.loginType.biometric')}</li>
             </ul>
           </div>
         </div>

src/entities/alarm/ui/service-language-bottom-sheet.tsx

@@ -1,26 +1,31 @@
 import { APP_LANGUAGE } from "@/entities/common/model/constant";
 import { AppLanguage } from "@/entities/common/model/types";
 import { IMAGE_ROOT } from "@/shared/constants/common";
+import { useTranslation } from "react-i18next";
 
 export interface ServiceLanguageBottomSheetProps {
   serviceLanguageBottomSheetOn: boolean;
   setServiceLanguageBottomSheetOn: (serviceLanguageBottomSheetOn: boolean) => void;
   appLanguage: AppLanguage;
   setAppLanguage: (appLanguage: AppLanguage) => void;
+  changeLanguage: (language: string) => void | Promise<void>;
 };
 
 export const ServiceLanguageBottomSheet = ({
-  serviceLanguageBottomSheetOn,
+  serviceLanguageBottomSheetOn: _serviceLanguageBottomSheetOn,
   setServiceLanguageBottomSheetOn,
   appLanguage,
-  setAppLanguage
+  setAppLanguage,
+  changeLanguage
 }: ServiceLanguageBottomSheetProps) => {
+  const { t } = useTranslation();
 
   const onClickToClose = () => {
     setServiceLanguageBottomSheetOn(false);
   };
   const onChangeServiceLanguage = (language: AppLanguage) => {
     setAppLanguage(language);
+    changeLanguage(language);
     onClickToClose();
   };
 
@@ -30,14 +35,14 @@ export const ServiceLanguageBottomSheet = ({
       <div className="bottomsheet">
         <div className="bottomsheet-header">
           <div className="bottomsheet-title">
-            <h2>서비스 언어를 선택하세요.</h2>
-            <button 
-              className="close-btn" 
+            <h2>{t('settings.serviceLanguage.title')}</h2>
+            <button
+              className="close-btn"
               type="button"
             >
-              <img 
+              <img
                 src={ IMAGE_ROOT + '/ico_close.svg' }
-                alt="닫기"
+                alt={t('common.close')}
                 onClick={ onClickToClose }
               />
             </button>
@@ -46,12 +51,8 @@ export const ServiceLanguageBottomSheet = ({
 
         <div className="bottomsheet-content">
           <div className="bottom-section">
-            <p className="fs16">※ 미지원 언어일 경우 ENGLISH 자동 설정</p>
+            <p className="fs16">{t('settings.serviceLanguage.notice')}</p>
             <ul className="list-style-circle link">
-              <li
-                className={ `${(appLanguage === AppLanguage.DEVICE)? 'selected': ''}` }
-                onClick={ () => onChangeServiceLanguage(AppLanguage.DEVICE) }
-              >{ APP_LANGUAGE[AppLanguage.DEVICE] }</li>
               <li 
                 className={ `${(appLanguage === AppLanguage.KO)? 'selected': ''}` }
                 onClick={ () => onChangeServiceLanguage(AppLanguage.KO) }

src/entities/common/model/constant.ts

@@ -2,9 +2,9 @@ import { PATHS } from "@/shared/constants/paths";
 import { SortTypeKeys } from "./types";
 
 export const APP_LANGUAGE = {
-  DEVICE: '기기 설정 언어',
-  KO: '한국어',
-  EN: 'ENGLISH',
+  // DEVICE: '기기 설정 언어',
+  ko: '한국어',
+  en: 'English',
 };
 export const APP_LOGIN_TYPE = {
   ID: 'ID/PW 입력',

src/entities/common/model/types.ts

@@ -1,7 +1,7 @@
 export enum AppLanguage {
-  DEVICE = 'DEVICE',
-  KO = 'KO',
-  EN = 'EN'
+  // DEVICE = 'DEVICE',
+  KO = 'ko',
+  EN = 'en'
 };
 export enum LoginType {
   ID = 'ID',