[Sz 550] settings 파일 image, notification 관련 수정

app/settingsView/settingsAccountView.tsx

@@ -1,106 +1,49 @@
-import React, { useContext, useState } from 'react';
-import { StyleSheet, View } from 'react-native';
-import { Layout, Text, Button } from '@ui-kitten/components';
-import { LoginContext } from '../../contexts/LoginContext';
-import ConfirmModal from '@/components/common/molecules/ConfirmModal';
-import { api as Api } from '@/utils/api';
+import '@/locales/index';
+import { IndexPath, Layout, Menu, MenuItem } from '@ui-kitten/components';
+import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { useStorage } from '@/hooks/auth/useStorage';
-import { useRouter } from 'expo-router';
+import { SafeAreaView, StyleSheet } from 'react-native';
 
 const SettingsAccountView = () => {
   const { t } = useTranslation();
-  const { userId } = useContext(LoginContext);
-  const { clear: clearStorage } = useStorage();
-  const router = useRouter();
-
-  const [isDeleteAccountModalVisible, setDeleteAccountModalVisible] =
-    useState(false);
-
-  const clearStackAndNavigate = () => {
-    router.dismissAll();
-    router.replace('/');
-  };
-
-  const handleDeleteAccountModalConfirm = async () => {
-    await Api.deleteUser();
-    await clearStorage();
-    setDeleteAccountModalVisible(false);
-    clearStackAndNavigate();
-  };
-
-  const handleDeleteAccountModalCancel = () => {
-    setDeleteAccountModalVisible(false);
-  };
+  const notificationOn = 0;
+  // const notificationOff = 1;
+  const [selectedIndex, setSelectedIndex] = useState(
+    new IndexPath(notificationOn),
+  );
 
   return (
-    <Layout style={styles.container}>
-      {/* 유저 정보 */}
-      <View style={styles.infoContainer}>
-        <Text category="label" appearance="hint">
-          {t('views.settingsAccountView.userId')}
-        </Text>
-        <Text category="p1">{userId}</Text>
-
-        {/* <Text category="label" appearance="hint" style={styles.infoSpacing}>
-          이메일
-        </Text>
-        <Text category="p1">{email}</Text> */}
-      </View>
-
-      {/* 회원탈퇴 버튼 */}
-      <Button
-        appearance="ghost"
-        status="danger"
-        onPress={() => setDeleteAccountModalVisible(true)}
-        style={styles.deleteButton}
-      >
-        {t('views.settingsAccountView.deleteModalTitle')}
-      </Button>
-      <ConfirmModal
-        visible={isDeleteAccountModalVisible}
-        onConfirm={handleDeleteAccountModalConfirm}
-        onCancel={handleDeleteAccountModalCancel}
-        titleKey="views.settingsAccountView.deleteModalTitle"
-        messageKey="views.settingsAccountView.deleteModalMessage"
-      />
-    </Layout>
+    <>
+      <SafeAreaView style={styles.container}>
+        <Layout style={styles.layout} level="1">
+          <Menu
+            selectedIndex={selectedIndex}
+            onSelect={index => setSelectedIndex(index)}
+          >
+            <MenuItem title={t('views.settingsAccountView.on')} />
+            <MenuItem title={t('views.settingsAccountView.off')} />
+          </Menu>
+        </Layout>
+      </SafeAreaView>
+    </>
   );
 };
 
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    padding: 16,
-    backgroundColor: '#FFFFFF',
-  },
-  avatarContainer: {
-    alignItems: 'center',
-    marginBottom: 24,
-  },
-  avatar: {
-    width: 80,
-    height: 80,
-    borderRadius: 40,
-    marginBottom: 8,
   },
-  editButton: {
-    marginTop: 4,
-  },
-  infoContainer: {
-    marginBottom: 24,
+  layout: {
+    flex: 1,
+    justifyContent: 'center',
     paddingHorizontal: 16,
   },
-  infoSpacing: {
-    marginTop: 16,
-  },
-  twoFactorButton: {
-    marginTop: 8,
-    width: '100%',
+  text: {
+    textAlign: 'center',
   },
-  deleteButton: {
-    marginTop: 24,
-    alignSelf: 'center',
+  link: {
+    color: 'blue',
+    textDecorationLine: 'underline',
   },
 });
 

app/settingsView/settingsView.jsx

@@ -13,12 +13,15 @@ import { useTranslation } from 'react-i18next';
 import ConfirmModal from '@/components/common/molecules/ConfirmModal';
 import { api as Api } from '@/utils/api';
 import { useStorage } from '@/hooks/auth/useStorage';
+
+import iconSource from '../../assets/icon.png';
 import {
   Linking,
   SafeAreaView,
   StyleSheet,
   Platform,
   View,
+  Image,
 } from 'react-native';
 import { heightPercentage, widthPercentage } from '@/utils/responsiveSize';
 import fontStyles from '@/theme/fontStyles';
@@ -57,6 +60,13 @@ const SettingsView = () => {
       return `English`;
     }
   };
+  const getNotification = () => {
+    if (i18n.language === 'ko') {
+      return `켬`;
+    } else if (i18n.language === 'en') {
+      return `On`;
+    }
+  };
   const [isDeleteAccountModalVisible, setDeleteAccountModalVisible] =
     useState(false);
   const handleDeleteAccountModalConfirm = async () => {
@@ -83,7 +93,7 @@ const SettingsView = () => {
       {
         title: t('views.settingsView.notification'),
         id: 2,
-        currentStatus: '한국어',
+        currentStatus: getNotification(),
         handlePress: () => {
           router.push('settingsView/settingsAccountView');
         },
@@ -159,7 +169,7 @@ const SettingsView = () => {
     >
       <View style={{ ...styles.infoContainer, backgroundColor: theme.Black06 }}>
         <View style={{ ...styles.logo, backgroundColor: theme.Gray02 }}>
-          <Text>이미지</Text>
+          <Image source={iconSource} style={styles.logo} />
         </View>
         <View style={styles.userTextContainer}>
           <Text style={fontStyles.Subtitle.S2.M_130}>
@@ -206,6 +216,7 @@ const styles = StyleSheet.create({
     height: widthPercentage(64),
     alignItems: 'center',
     justifyContent: 'center',
+    resizeMode: 'contain',
     borderRadius: 100,
   },
   userTextContainer: {

components/icons/AddSubtodoIcon.tsx

@@ -0,0 +1,12 @@
+import { View, Text } from 'react-native';
+import React from 'react';
+
+const AddSubtodoIcon = () => {
+  return (
+    <View>
+      <Text>AddSubtodoIcon</Text>
+    </View>
+  );
+};
+
+export default AddSubtodoIcon;

hooks/auth/useLogin.js

@@ -44,8 +44,8 @@ const useLogin = () => {
       setUserId(jwtTokenData.userId);
       setIsLoggedIn(true);
       if (jwtTokenData.isNew) {
-        handleAddCategory({ categoryName: t('veiws.categoryAddView.init') });
-        handleAddCategory({ categoryName: t('veiws.categoryAddView.init2') });
+        handleAddCategory({ categoryName: t('views.categoryAddView.init') });
+        handleAddCategory({ categoryName: t('views.categoryAddView.init2') });
         router.push('/funnelView/funnelView');
       } else {
         router.push('/(tabs)');

locales/en.json

@@ -37,7 +37,9 @@
     "settingsAccountView": {
       "userId": "user ID",
       "deleteModalTitle": "Delete Account",
-      "deleteModalMessage": "Are you sure to delete account?"
+      "deleteModalMessage": "Are you sure to delete account?",
+      "on": "On",
+      "off": "Off"
     },
     "categoryAddView": {
       "label": "category input",

locales/ko.json

@@ -38,7 +38,9 @@
     "settingsAccountView": {
       "userId": "사용자 ID",
       "deleteModalTitle": "계정 삭제",
-      "deleteModalMessage": "정말 삭제하시겠습니까?"
+      "deleteModalMessage": "정말 삭제하시겠습니까?",
+      "on": "켬",
+      "off": "끔"
     },
     "categoryAddView": {
       "label": "카테고리 입력",