Skip to content

Commit

Permalink
Feat/chat UI improvements (#201)
Browse files Browse the repository at this point in the history 
* feat: update menu component (#189)

* Feat/chat menu generation settings (#200)

* feat: added chat generation settings, rename, remove, duplicate functionalities into chat menu

* chore: updated translations

* chore: change actions/upload-artifact@v3 => v4

* fix: updated submenu styles & code refactoring
  • Loading branch information
@Mukhammadali
Mukhammadali authored Feb 5, 2025
1 parent 86703a5 commit bf3e88b
Show file tree
Hide file tree
Showing 92 changed files with 2,934 additions and 784 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/ci.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ jobs:
run: yarn build:android # TODO: change to build:android:release

- name: Upload Android APK
uses: actions/upload-artifact@v3
uses: actions/upload-artifact@v4
with:
name: android-debug-apk # TODO: change to release-apk
path: android/app/build/outputs/apk/debug/app-debug.apk
Expand Down
7 changes: 7 additions & 0 deletions .svgrrc
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"replaceAttrValues": {
"#333333": "{props.fill}",
"#858585": "{props.fill}",
"#FF653F": "{props.fill}"
}
}
36 changes: 13 additions & 23 deletions App.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import * as React from 'react';
import {Dimensions, StyleSheet} from 'react-native';

import {reaction} from 'mobx';
import {observer} from 'mobx-react';
import {NavigationContainer} from '@react-navigation/native';
import {Provider as PaperProvider} from 'react-native-paper';
Expand All @@ -16,8 +15,13 @@ import {KeyboardProvider} from 'react-native-keyboard-controller';

import {useTheme} from './src/hooks';
import {Theme} from './src/utils/types';
import {modelStore, chatSessionStore} from './src/store';
import {HeaderRight, SidebarContent, ModelsHeaderRight} from './src/components';

import {
SidebarContent,
ModelsHeaderRight,
ChatHeader,
HeaderLeft,
} from './src/components';
import {
ChatScreen,
ModelsScreen,
Expand All @@ -30,30 +34,20 @@ const Drawer = createDrawerNavigator();
const screenWidth = Dimensions.get('window').width;

const App = observer(() => {
const [chatTitle, setChatTitle] = React.useState('Default Chat Page');

React.useEffect(() => {
const dispose = reaction(
() => modelStore.chatTitle,
newTitle => setChatTitle(newTitle),
{fireImmediately: true},
);
return () => dispose();
}, []);

const theme = useTheme();
const styles = createStyles(theme);

return (
<GestureHandlerRootView style={styles.root}>
<SafeAreaProvider>
<KeyboardProvider statusBarTranslucent navigationBarTranslucent>
<BottomSheetModalProvider>
<PaperProvider theme={theme}>
<PaperProvider theme={theme}>
<BottomSheetModalProvider>
<NavigationContainer>
<Drawer.Navigator
useLegacyImplementation={false}
screenOptions={{
headerLeft: () => <HeaderLeft />,
drawerStyle: {
width: screenWidth * 0.8,
},
Expand All @@ -68,11 +62,7 @@ const App = observer(() => {
name="Chat"
component={gestureHandlerRootHOC(ChatScreen)}
options={{
title: chatTitle,
headerRight: () => <HeaderRight />,
headerStyle: chatSessionStore.shouldShowHeaderDivider
? styles.headerWithDivider
: styles.headerWithoutDivider,
header: () => <ChatHeader />,
}}
/>
<Drawer.Screen
Expand All @@ -99,8 +89,8 @@ const App = observer(() => {
/>
</Drawer.Navigator>
</NavigationContainer>
</PaperProvider>
</BottomSheetModalProvider>
</BottomSheetModalProvider>
</PaperProvider>
</KeyboardProvider>
</SafeAreaProvider>
</GestureHandlerRootView>
Expand Down
1 change: 1 addition & 0 deletions __mocks__/external/react-native-svg.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
module.exports = 'SvgMock';
4 changes: 4 additions & 0 deletions __mocks__/stores/chatSessionStore.ts
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,11 @@
import {sessionFixtures} from '../../jest/fixtures/chatSessions';
import {defaultCompletionSettings} from '../../src/store/ChatSessionStore';

export const mockChatSessionStore = {
sessions: sessionFixtures,
//currentSessionMessages: [],
activeSessionId: 'session-1',
newChatCompletionSettings: defaultCompletionSettings,
loadSessionList: jest.fn().mockResolvedValue(undefined),
deleteSession: jest.fn().mockResolvedValue(undefined),
setActiveSession: jest.fn(),
Expand All @@ -22,6 +24,8 @@ export const mockChatSessionStore = {
enterEditMode: jest.fn(),
removeMessagesFromId: jest.fn(),
setIsGenerating: jest.fn(),
duplicateSession: jest.fn().mockResolvedValue(undefined),
setNewChatCompletionSettings: jest.fn(),
};

Object.defineProperty(mockChatSessionStore, 'currentSessionMessages', {
Expand Down
29 changes: 29 additions & 0 deletions ios/PocketPal.xcodeproj/project.pbxproj
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,23 @@

/* Begin PBXBuildFile section */
00E356F31AD99517003FC87E /* PocketPalTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* PocketPalTests.m */; };
0EA415939DF84BA0B5D83752 /* Inter-ExtraBold.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 61091C7135514E2DB18E4698 /* Inter-ExtraBold.ttf */; };
13B07FBC1A68108700A75B9A /* AppDelegate.mm in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.mm */; };
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
1C5077855E738169D7580281 /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = 56D1BD968C32BD43D7C02874 /* PrivacyInfo.xcprivacy */; };
375E301319AD454A94795C74 /* Inter-Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 0A2C56A4517648B6980A4706 /* Inter-Regular.ttf */; };
41BA04C779A2451C9129DBE3 /* Inter-Medium.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 472C516838F74AE493E1D6F1 /* Inter-Medium.ttf */; };
81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
92B512A3E25B49FE875B90DD /* Inter-Light.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 7F3EE19EF80E472DAE9D162E /* Inter-Light.ttf */; };
A8894CE22D0E02AF00FA6CAC /* GoogleService-Info.plist in Resources */ = {isa = PBXBuildFile; fileRef = A8894CE12D0E02AF00FA6CAC /* GoogleService-Info.plist */; };
A88DF87F2D0B6F7400239E77 /* DeviceInfoModule.h in Sources */ = {isa = PBXBuildFile; fileRef = A88DF87D2D0B6F7400239E77 /* DeviceInfoModule.h */; };
A88DF8802D0B6F7400239E77 /* DeviceInfoModule.m in Sources */ = {isa = PBXBuildFile; fileRef = A88DF87E2D0B6F7400239E77 /* DeviceInfoModule.m */; };
ACB048A1D4B12175111FED89 /* libPods-PocketPal-PocketPalTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 79A3B9EA89EFE88FA274FD1C /* libPods-PocketPal-PocketPalTests.a */; };
C3B4E5DF753F2A61870BEB67 /* libPods-PocketPal.a in Frameworks */ = {isa = PBXBuildFile; fileRef = B2B1B50A483B5EBA13F9E622 /* libPods-PocketPal.a */; };
CEFFF7B6DE024CE1B6E1A077 /* Inter-SemiBold.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 6C88909D5B5643EBA861C5D0 /* Inter-SemiBold.ttf */; };
E0EA396ED005462DB3EF953C /* Inter-Bold.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 2E6C966DE9064B9CAC87A8D4 /* Inter-Bold.ttf */; };
F436DB309CC848A09D1A78E8 /* Inter-Thin.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 99314BF13A4B46BCA459EB37 /* Inter-Thin.ttf */; };
/* End PBXBuildFile section */

/* Begin PBXContainerItemProxy section */
Expand All @@ -34,18 +41,25 @@
00E356EE1AD99517003FC87E /* PocketPalTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = PocketPalTests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
00E356F11AD99517003FC87E /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
00E356F21AD99517003FC87E /* PocketPalTests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = PocketPalTests.m; sourceTree = "<group>"; };
0A2C56A4517648B6980A4706 /* Inter-Regular.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-Regular.ttf"; path = "../src/assets/fonts/Inter-Regular.ttf"; sourceTree = "<group>"; };
13B07F961A680F5B00A75B9A /* PocketPal.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = PocketPal.app; sourceTree = BUILT_PRODUCTS_DIR; };
13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = PocketPal/AppDelegate.h; sourceTree = "<group>"; };
13B07FB01A68108700A75B9A /* AppDelegate.mm */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.cpp.objcpp; name = AppDelegate.mm; path = PocketPal/AppDelegate.mm; sourceTree = "<group>"; };
13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = PocketPal/Images.xcassets; sourceTree = "<group>"; };
13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = PocketPal/Info.plist; sourceTree = "<group>"; };
13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = PocketPal/main.m; sourceTree = "<group>"; };
2502009346FB84D4290094D7 /* Pods-PocketPal.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-PocketPal.release.xcconfig"; path = "Target Support Files/Pods-PocketPal/Pods-PocketPal.release.xcconfig"; sourceTree = "<group>"; };
2E6C966DE9064B9CAC87A8D4 /* Inter-Bold.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-Bold.ttf"; path = "../src/assets/fonts/Inter-Bold.ttf"; sourceTree = "<group>"; };
340A2151750B488EE0567E04 /* Pods-PocketPal.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-PocketPal.debug.xcconfig"; path = "Target Support Files/Pods-PocketPal/Pods-PocketPal.debug.xcconfig"; sourceTree = "<group>"; };
472C516838F74AE493E1D6F1 /* Inter-Medium.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-Medium.ttf"; path = "../src/assets/fonts/Inter-Medium.ttf"; sourceTree = "<group>"; };
56D1BD968C32BD43D7C02874 /* PrivacyInfo.xcprivacy */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xml; name = PrivacyInfo.xcprivacy; path = PocketPal/PrivacyInfo.xcprivacy; sourceTree = "<group>"; };
5E01428B4E51E39CBC5D2180 /* Pods-PocketPal-PocketPalTests.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-PocketPal-PocketPalTests.debug.xcconfig"; path = "Target Support Files/Pods-PocketPal-PocketPalTests/Pods-PocketPal-PocketPalTests.debug.xcconfig"; sourceTree = "<group>"; };
61091C7135514E2DB18E4698 /* Inter-ExtraBold.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-ExtraBold.ttf"; path = "../src/assets/fonts/Inter-ExtraBold.ttf"; sourceTree = "<group>"; };
6C88909D5B5643EBA861C5D0 /* Inter-SemiBold.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-SemiBold.ttf"; path = "../src/assets/fonts/Inter-SemiBold.ttf"; sourceTree = "<group>"; };
79A3B9EA89EFE88FA274FD1C /* libPods-PocketPal-PocketPalTests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-PocketPal-PocketPalTests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
7F3EE19EF80E472DAE9D162E /* Inter-Light.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-Light.ttf"; path = "../src/assets/fonts/Inter-Light.ttf"; sourceTree = "<group>"; };
81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = PocketPal/LaunchScreen.storyboard; sourceTree = "<group>"; };
99314BF13A4B46BCA459EB37 /* Inter-Thin.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "Inter-Thin.ttf"; path = "../src/assets/fonts/Inter-Thin.ttf"; sourceTree = "<group>"; };
A8894CE12D0E02AF00FA6CAC /* GoogleService-Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = "GoogleService-Info.plist"; sourceTree = "<group>"; };
A88DF87D2D0B6F7400239E77 /* DeviceInfoModule.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; name = DeviceInfoModule.h; path = PocketPal/DeviceInfoModule.h; sourceTree = "<group>"; };
A88DF87E2D0B6F7400239E77 /* DeviceInfoModule.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; name = DeviceInfoModule.m; path = PocketPal/DeviceInfoModule.m; sourceTree = "<group>"; };
Expand Down Expand Up @@ -121,6 +135,21 @@
name = Frameworks;
sourceTree = "<group>";
};
56ED328619B54356A6EB292D /* Resources */ = {
isa = PBXGroup;
children = (
2E6C966DE9064B9CAC87A8D4 /* Inter-Bold.ttf */,
7F3EE19EF80E472DAE9D162E /* Inter-Light.ttf */,
472C516838F74AE493E1D6F1 /* Inter-Medium.ttf */,
0A2C56A4517648B6980A4706 /* Inter-Regular.ttf */,
6C88909D5B5643EBA861C5D0 /* Inter-SemiBold.ttf */,
99314BF13A4B46BCA459EB37 /* Inter-Thin.ttf */,
61091C7135514E2DB18E4698 /* Inter-ExtraBold.ttf */,
);
name = Resources;
path = "";
sourceTree = "<group>";
};
832341AE1AAA6A7D00B99B32 /* Libraries */ = {
isa = PBXGroup;
children = (
Expand Down
1 change: 1 addition & 0 deletions jest.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,5 +45,6 @@ module.exports = {
'<rootDir>/__mocks__/external/@react-native-firebase/app.js',
'@react-native-firebase/app-check':
'<rootDir>/__mocks__/external/@react-native-firebase/app-check.js',
'\\.svg': '<rootDir>/__mocks__/external/react-native-svg.js',
},
};
2 changes: 2 additions & 0 deletions jest/fixtures/models.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,8 @@ export const mockBasicModel: Model = {
chatTemplate: mockChatTemplate,
defaultCompletionSettings: mockDefaultCompletionParams,
completionSettings: mockCompletionParams,
defaultStopWords: mockDefaultCompletionParams.stop,
stopWords: mockCompletionParams.stop,
};

// Factory function for creating custom models
Expand Down
8 changes: 8 additions & 0 deletions metro.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,19 @@ const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');

//const localPackagePaths = ['localpath/code/llama.rn'];

const defaultConfig = getDefaultConfig(__dirname);
const {assetExts, sourceExts} = defaultConfig.resolver;

const config = {
resolver: {
//nodeModulesPaths: [...localPackagePaths], // update to resolver
assetExts: assetExts.filter(ext => ext !== 'svg'),
sourceExts: [...sourceExts, 'svg'],
},
transformer: {
babelTransformerPath: require.resolve(
'react-native-svg-transformer/react-native',
),
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
Expand Down
3 changes: 2 additions & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@
"react-native-render-html": "^6.3.4",
"react-native-safe-area-context": "^4.14.0",
"react-native-screens": "^4.4.0",
"react-native-svg": "^15.9.0",
"react-native-svg": "^15.11.1",
"react-native-vector-icons": "^10.1.0",
"uuid": "^10.0.0"
},
Expand Down Expand Up @@ -99,6 +99,7 @@
"postinstall-postinstall": "^2.1.0",
"prettier": "2.8.8",
"react-native-dotenv": "^3.4.11",
"react-native-svg-transformer": "^1.5.0",
"react-test-renderer": "18.3.1",
"typescript": "5.0.4"
},
Expand Down
3 changes: 3 additions & 0 deletions src/assets/icons/clock-fast-forward.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions src/assets/icons/close.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions src/assets/icons/copy.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 5 additions & 0 deletions src/assets/icons/dots-vertical.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 10 additions & 0 deletions src/assets/icons/duplicate.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit bf3e88b

Please sign in to comment.