Momo 94 세팅화면 버튼 경로 추가

package.json

@@ -28,6 +28,7 @@
     "react-native-gesture-handler": "^2.9.0",
     "react-native-iphone-x-helper": "^1.3.1",
     "react-native-linear-gradient": "^2.6.2",
+    "react-native-linking": "^0.0.0",
     "react-native-navigation": "^7.31.1",
     "react-native-progress": "^5.0.0",
     "react-native-reanimated": "^2.14.4",

src/navigation/RootNavigator.js

@@ -14,6 +14,7 @@ import ClosetScreen from '../screens/ClosetScreen';
 import { SettingsScreen } from '../screens/SettingsScreen';
 import LoginScreenAlpha from '../screens/LoginScreenAlpha';
 import { MainTutorialScreen } from '../screens/tutorials/MainTutorialScreen';
+import { VersionScreen } from '../screens/ViersionScreen';
 import { OnBoardingNavigator } from '../screens/onboarding/OnBoardingNavigator';
 
 import { HomeTab } from '../components/NavigatorComponent/HomeTab';
@@ -147,14 +148,12 @@ export const RootNavigator = () => {
       }}
     >
       {isTutorialFinished && isAuthUser? (
-        <AuthStack.Screen name="Tabs" component={TabComponent}
-          options={{
-            gestureEnabled: false,
-          }}
-          />
+        <AuthStack.Screen name="Tabs" component={TabComponent} options={{gestureEnabled: false,}}/>
+
       ) : !isTutorialFinished && isAuthUser ? (<AuthStack.Screen name="Tutorial" component={MainTutorialScreen}/>) 
       : (<AuthStack.Screen name="Onboarding" component={OnBoardingNavigator}/>)
       }
+      <AuthStack.Screen name="Version" component={VersionScreen}/>
     </AuthStack.Navigator>
   );
 };

src/screens/SettingsScreen.js

@@ -1,28 +1,41 @@
-import { StyleSheet, View, SafeAreaView } from 'react-native';
+import {StyleSheet, View, SafeAreaView, Linking} from 'react-native';
 import React from 'react';
+import { useNavigation } from '@react-navigation/native';
 
-import { PretendardedText } from '../components/CustomComponent/PretendardedText';
-import { ButtonLarge } from '../components/Buttons/ButtonLarge';
+import {PretendardedText} from '../components/CustomComponent/PretendardedText';
+import {ButtonLarge} from '../components/Buttons/ButtonLarge';
 
 export const SettingsScreen = () => {
-    // const [isEnabled, setIsEnabled] = useState(false);
-    // const toggleSwitch = () => setIsEnabled(previousState => !previousState);
+  // const [isEnabled, setIsEnabled] = useState(false);
+  // const toggleSwitch = () => setIsEnabled(previousState => !previousState);
 
-    function test() {
-        alert('test')
-    }
+  const navigation = useNavigation();
 
-    return (
-        <View style={{ flex: 1, backgroundColor: '#F9F9F9'}}>
-            <SafeAreaView style={{ flex: 1, alignItems: 'center', width: '100%', }}>
-                <PretendardedText style={styles.header}>환경설정</PretendardedText>
-                <View style={styles.buttons}>
-                    <ButtonLarge type={'default'} text={'66팀 이야기'} icon={false} action={test} />
-                    <ButtonLarge type={'default'} text={'모모스토리'} icon={false} action={test} />
-                    <ButtonLarge type={'default'} text={'즉각 피드백'} icon={false} action={test} />
-                    <ButtonLarge type={'default'} text={'버전 정보'} icon={false} action={test} />
-                    <ButtonLarge type={'default'} text={'출시 알림 받기'} icon={true} action={test} />
-                    {/* <View style={styles.toggleRow}>
+  const open66TeamStory = () => {};
+
+  const openMomoStory = () => {};
+
+  const openImmediateFeedback = () => {};
+
+  const openVersionInfoScreen = () => {
+    navigation.navigate('Version')
+  };
+
+  const openReleaseNotification = () => {
+    Linking.openURL('https://docs.google.com/forms/d/e/1FAIpQLSfSquNhinU_Unhq11ZVacTFjRzimSut-Y8KjZm2xi_nB4bSSA/viewform?usp=sf_link');
+  };
+
+  return (
+    <View style={{flex: 1, backgroundColor: '#F9F9F9'}}>
+      <SafeAreaView style={{flex: 1, alignItems: 'center', width: '100%'}}>
+        <PretendardedText style={styles.header}>환경설정</PretendardedText>
+        <View style={styles.buttons}>
+          <ButtonLarge type={'default'} text={'66팀 이야기'} icon={false} action={open66TeamStory}/>
+          <ButtonLarge type={'default'} text={'모모스토리'} icon={false} action={openMomoStory}/>
+          <ButtonLarge type={'default'} text={'즉각 피드백'} icon={false} action={openImmediateFeedback}/>
+          <ButtonLarge type={'default'} text={'버전 정보'} icon={false} action={openVersionInfoScreen}/>
+          <ButtonLarge type={'default'} text={'출시 알림 받기'} icon={true} action={openReleaseNotification}/>
+          {/* <View style={styles.toggleRow}>
                         <PretendardedText style={styles.toggleText}>사진으로 인증하기</PretendardedText>
                         <Switch
                             trackColor={{ false: '#595959', true: '#3CE3AC' }}
@@ -32,35 +45,34 @@ export const SettingsScreen = () => {
                             value={isEnabled}
                         />
                     </View> */}
-                </View>
-            </SafeAreaView>
         </View>
-    );
+      </SafeAreaView>
+    </View>
+  );
 };
 
-
 const styles = StyleSheet.create({
-    header: {
-        fontWeight: 700,
-        fontSize: 16,
-        color: '#222222',
-        marginTop: 30,
-        marginBottom: 30,
-    },
-    buttons: {
-        width: '100%',
-        alignItems: 'center',
-        flex: 0.65,
-        justifyContent: 'space-between',
-        backgroundColor: '#F9F9F9',
-    },
-    toggleRow: {
-        flexDirection: 'row',
-        justifyContent: 'space-between',
-        width: '80%',
-    },
-    toggleText: {
-        fontWeight: 700,
-        fontSize: 16,
-    },
+  header: {
+    fontWeight: 700,
+    fontSize: 16,
+    color: '#222222',
+    marginTop: 30,
+    marginBottom: 30,
+  },
+  buttons: {
+    width: '100%',
+    alignItems: 'center',
+    flex: 0.65,
+    justifyContent: 'space-between',
+    backgroundColor: '#F9F9F9',
+  },
+  toggleRow: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    width: '80%',
+  },
+  toggleText: {
+    fontWeight: 700,
+    fontSize: 16,
+  },
 });

src/screens/ViersionScreen.js

@@ -0,0 +1,40 @@
+import {StyleSheet, View, SafeAreaView} from 'react-native';
+import React from 'react';
+
+import {PretendardedText} from '../components/CustomComponent/PretendardedText';
+import MomoSymbol from '../assets/images/momo_symbol.svg'
+
+export const VersionScreen = () => {
+
+  return (
+    <View style={{flex: 1, backgroundColor: '#F9F9F9'}}>
+      <SafeAreaView style={{flex: 1, alignItems: 'center', width: '100%'}}>
+        <PretendardedText style={styles.header}>버전 정보</PretendardedText>
+        <View style={{flex: 1, alignItems: 'center', width: '100%'}}>
+
+          <View style={{flex: 8, alignItems: 'center', width: '100%', paddingTop: '15%'}}>
+            <MomoSymbol/>
+            <PretendardedText style={{paddingTop: '5%', fontWeight: '700', fontSize: 16, color: '#222222'}}>최신 버전입니다.</PretendardedText>
+            <PretendardedText style={{fontWeight: '500', fontSize: 16, color: '#808080'}}>현재 버전 : Alpha Ver.</PretendardedText>
+          </View>
+          <View style={{flex: 0.8, alignItems: 'center', width: '100%'}}>
+            <PretendardedText style={{fontWeight: '500', fontSize: 14, color: '#B3B3B3'}}>저희 66team은 늘 더 나은 사용자 경험을 위해</PretendardedText>
+            <PretendardedText style={{fontWeight: '500', fontSize: 14, color: '#B3B3B3'}}>빠른 업데이트를 하고있어요.</PretendardedText>
+          </View>
+
+        </View>
+      </SafeAreaView>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  header: {
+    fontWeight: 700,
+    fontSize: 16,
+    color: '#222222',
+    marginTop: 30,
+    marginBottom: 30,
+  },
+
+});