Merge pull request #248 from amosproj/integrate-custom-instructions

Integrate custom instructions

src/frontend/helpers/screens.ts

@@ -5,5 +5,6 @@ export enum Screens {
   SignUp = 'SignUp',
   ForgotPassword = 'ForgotPassword',
   ResetPassword = 'ResetPassword',
-  Chat = 'Chat'
+  Chat = 'Chat',
+  CustomInstructions = 'CustomInstructions'
 }

src/frontend/routes/MainRoutes.tsx

@@ -2,10 +2,11 @@ import { createDrawerNavigator } from '@react-navigation/drawer';
 import React from 'react';
 import { Header } from '../components';
 import { Screens } from '../helpers';
-import { ChatUI, DrawerMenu } from '../screens';
+import { ChatUI, DrawerMenu, CustomInstructions } from '../screens';
 
 export type MainDrawerParams = {
   [Screens.Chat]: { chatId: string | null };
+  [Screens.CustomInstructions]: undefined;
 };
 
 const MainRouteDrawer = createDrawerNavigator<MainDrawerParams>();
@@ -18,6 +19,11 @@ export function MainRoutes() {
         component={ChatUI}
         options={{ header: (props) => <Header {...props} /> }}
       />
+      <MainRouteDrawer.Screen
+        name={Screens.CustomInstructions}
+        component={CustomInstructions}
+        options={{ header: (props) => <Header {...props} /> }}
+      />
     </MainRouteDrawer.Navigator>
   );
 }

src/frontend/screens/CustomInstructions/index.tsx

@@ -0,0 +1,25 @@
+// src/frontend/screens/CustomInstructions.tsx
+import React from 'react';
+import { View, Text, StyleSheet  } from 'react-native';
+import  PersonalInfoForm  from '../../components/PersonalInfoForm';
+
+export function CustomInstructions() {
+    return (
+      <View style={styles.container}>
+        <Text style={styles.title}>Custom Instructions</Text>
+        <PersonalInfoForm />
+      </View>
+    );
+  }
+
+  const styles = StyleSheet.create({
+    container: {
+      flex: 1,
+      padding: 16,
+    },
+    title: {
+      fontSize: 24,
+      fontWeight: 'bold',
+      marginBottom: 16,
+    },
+  });

src/frontend/screens/DrawerMenu/index.tsx

@@ -16,6 +16,10 @@ import { Screens } from 'src/frontend/helpers';
 import { LLM_MODELS, useActiveChatId, useCreateChat, useGetAllChat } from 'src/frontend/hooks';
 import type { AppRoutesParams } from 'src/frontend/routes';
 import type { Chat } from 'src/frontend/types';
+import { MainDrawerParams } from 'src/frontend/routes/MainRoutes';
+import { DrawerNavigationProp } from '@react-navigation/drawer';
+
+
 
 /**
  * NOTE: needs to be called DrawerMenu because Drawer is already defined in react-native-paper
@@ -26,11 +30,13 @@ export function DrawerMenu() {
   const { chats, status, error } = useGetAllChat();
   const { reset } = useNavigation<NativeStackNavigationProp<AppRoutesParams>>();
   const { colors } = useTheme();
+  const navigationC = useNavigation<DrawerNavigationProp<MainDrawerParams>>();
 
   // ------------ Define navigation functions ------------
   const goToProfile = () => {
     //navigation.navigate('Profile');
-    console.log('TODO: implement Profile Screen');
+
+    navigate('Main', { screen: Screens.CustomInstructions });
   };
 
   const { navigate } = useNavigation<NativeStackNavigationProp<AppRoutesParams>>();

src/frontend/screens/index.ts

@@ -6,3 +6,4 @@ export * from './DrawerMenu';
 export * from './SignUp';
 export * from './ForgotPassword';
 export * from './ResetPassword';
+export * from './CustomInstructions';