Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Chat session screen fix #262

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Chat session screen fix #262

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
a3bdb69
confilts solved
bhujoshi Nov 10, 2024
62f5dff
Chat session broken into two pages
bhujoshi Nov 10, 2024
0a06915
Fixed the name for chat session follow up
bhujoshi Nov 10, 2024
be78018
Grid action button removed
bhujoshi Nov 10, 2024
043830b
Fixed error session screen
bhujoshi Nov 13, 2024
2be093f
Error converted to string
bhujoshi Nov 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
39 changes: 25 additions & 14 deletions ApplicationRoot.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import React, { useState, useCallback, useEffect} from 'react';
import React, { useState, useCallback, useEffect } from 'react';
import { StyleSheet, View, TouchableOpacity, Linking, Platform, Animated } from 'react-native';
import AboutUsScreen from './screens/AboutUsScreen';
import ChatSessionScreen from './screens/ChatSessionScreen';
import HomeSearchScreen from './screens/HomeSearchScreen.js';
import ChatSessionHistoriesScreen from './screens/ChatSessionHistoriesScreen';
import MyPalettesScreen from './screens/MyPalettesScreen.js';
import Colors from './constants/Styles';
Expand All @@ -10,6 +10,7 @@ import { createNativeStackNavigator } from '@react-navigation/native-stack';
import ColorDetailsScreen from './screens/ColorDetailScreen';
import PalettesScreen from './screens/PalettesScreen';
import SavePaletteScreen from './screens/SavePaletteScreen';
import ChatSessionScreen from './screens/ChatSessionScreen';
import ColorListScreen from './screens/ColorListScreen';
import PaletteViewScreen from './screens/PaletteViewScreen.js';
import PaletteEditScreen from './screens/PaletteEditScreen.js';
Expand All @@ -29,7 +30,7 @@ import UserProfile from './screens/UserProfileScreen.js';
import useApplicationStore from './hooks/useApplicationStore.js';
import ExplorePaletteScreen from './screens/ExplorePaletteScreen.js';
import { notifyMessage } from './libs/Helpers.js';
import FlashMessage from "react-native-flash-message";
import FlashMessage from 'react-native-flash-message';
import ShareMenu from 'react-native-share-menu';
import Color from 'pigment/full';
import { logEvent } from './libs/Helpers.js';
Expand All @@ -43,11 +44,11 @@ export default function App() {
const { loadInitPaletteFromStore } = applicationState;
const [isMenuOpen, setMenu] = useState(false);
const navigationRef = useNavigationContainerRef();
useIAPConnection(function(error) {
useIAPConnection(function (error) {
if (error) {
// TODO: figure out a better way to handle this error and show user a way to retry, ask for help or continue.
notifyMessage("Error during purchase initialization. Purchase might not work. Please retry");
}
notifyMessage('Error during purchase initialization. Purchase might not work. Please retry');
}
loadInitPaletteFromStore(); // Still load the palettes. Specially simulator will always face this issue.
});

Expand Down Expand Up @@ -84,7 +85,7 @@ export default function App() {
});
} catch (error) {
notifyMessage('Error parsing url: ' + error.message);
navigationRef.navigate(ROUTE_NAMES.HOME);
navigationRef.navigate(ROUTE_NAMES.HOME_SEARCH);
}
},
[navigationRef]
Expand Down Expand Up @@ -165,20 +166,30 @@ export default function App() {
height: HEADER_HEIGHT
}
}}>
<Stack.Screen
name={ROUTE_NAMES.HOME_SEARCH}
options={{
headerLeft: hamburgerMenuIcon,
headerTitleContainerStyle: { left: 40 },
title: t('HueHive AI')
}}
component={HomeSearchScreen}
/>
<Stack.Screen
name={ROUTE_NAMES.CHAT_SESSION}
options={{
options={{
headerLeft: hamburgerMenuIcon,
headerTitleContainerStyle: { left: 40 },
title: t('HueHive AI') }}
headerTitleContainerStyle: { left: 40 },
title: t('HueHive AI chat')
}}
component={ChatSessionScreen}
/>
<Stack.Screen
name={ROUTE_NAMES.MY_PALETTES}
options={() => {
return {
headerLeft: hamburgerMenuIcon,
headerTitleContainerStyle: { left: 40 },
headerTitleContainerStyle: { left: 40 },
title: t('My Palettes')
};
}}
Expand All @@ -189,7 +200,7 @@ export default function App() {
options={{ title: t('About us') }}
component={AboutUsScreen}
/>

<Stack.Screen
name={ROUTE_NAMES.CHAT_SESSION_HISTORIES}
options={{ title: t('Your chats') }}
Expand Down Expand Up @@ -238,7 +249,7 @@ export default function App() {
</AppAuthProvider>
</NavigationContainer>
</View>
<FlashMessage floating={true} position={{bottom: 100}} />
<FlashMessage floating={true} position={{ bottom: 100 }} />
</SideMenu>
</GestureHandlerRootView>
);
Expand All @@ -248,7 +259,7 @@ const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
flexDirection: 'row',
flexDirection: 'row'
},
sideMenuIcon: {
fontSize: 25,
Expand Down
92 changes: 46 additions & 46 deletions components/GridActionButton.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import {
Text,
Image,
TouchableOpacity,
Platform,
Platform
} from 'react-native';
import Color from 'pigment/full';
import RNColorThief from 'react-native-color-thief';
Expand All @@ -30,8 +30,7 @@ import useApplicationStore from '../hooks/useApplicationStore';
import MultiColorView from './MultiColorView';
import { ROUTE_NAMES } from '../libs/constants';


const GridActionButton = ({ navigation}) => {
const GridActionButton = ({ navigation }) => {
const { t } = useTranslation();
const [pickImageLoading, setPickImageLoading] = useState(false);
const [isColorPickerVisible, setIsColorPickerVisible] = React.useState(false);
Expand Down Expand Up @@ -174,38 +173,38 @@ const GridActionButton = ({ navigation}) => {
logEvent('chat_session_action_button');
props.navigation.reset({
index: 0,
routes: [{ name: ROUTE_NAMES.CHAT_SESSION }],
routes: [{ name: ROUTE_NAMES.HOME_SEARCH }]
});
}
},
Platform.OS == 'android' ? (
pro.plan !== 'starter'
? {
id: 6,
icon: <MaterialIcons name="create" size={20} />,
text1: t('Create palette'),
text2: t(' manually'),
onPress: () => {
logEvent('create_new_palette');
navigation.navigate('SavePalette');
Platform.OS == 'android'
? pro.plan !== 'starter'
? {
id: 6,
icon: <MaterialIcons name="create" size={20} />,
text1: t('Create palette'),
text2: t(' manually'),
onPress: () => {
logEvent('create_new_palette');
navigation.navigate('SavePalette');
}
}
}
: {
id: 7,
icon: <FontAwesome5 name="unlock" size={20} />,
text1: t('Unlock'),
text2: t('Pro'),
onPress: () => {
logEvent('home_screen_pro_button');
navigation.navigate('ProVersion');
: {
id: 7,
icon: <FontAwesome5 name="unlock" size={20} />,
text1: t('Unlock'),
text2: t('Pro'),
onPress: () => {
logEvent('home_screen_pro_button');
navigation.navigate('ProVersion');
}
}
}) : null
: null
].filter(Boolean)
];
return (
<>
<ActionButtonContainer
config={actionButtonConfig} />
<ActionButtonContainer config={actionButtonConfig} />
<Modal
visible={isColorPickerVisible}
animationType="slide"
Expand All @@ -232,9 +231,9 @@ const GridActionButton = ({ navigation}) => {
setSelectedImage(null);
setAutomaticColors([]);
}}>
{pickImageLoading &&
<ActivityIndicator size="large" color={Colors.primary} style={styles.loadingIndicator} />
}
{pickImageLoading && (
<ActivityIndicator size="large" color={Colors.primary} style={styles.loadingIndicator} />
)}
<TouchableWithoutFeedback
onPress={() => {
setIsImagePickerModalVisible(false);
Expand All @@ -256,22 +255,23 @@ const GridActionButton = ({ navigation}) => {
<Text style={styles.nextButtonText}>{t('Next')}</Text>
<MaterialIcons name="arrow-forward" size={24} color={Color.primaryDark} />
</TouchableOpacity>
{Platform.OS == 'android' && (<><View
style={{
flexDirection: 'row',
alignItems: 'center'
}}>
<Text style={{ backgroundColor: '#ccc', height: 1, flex: 1 }}> </Text>
<Text style={{ marginHorizontal: 10 }}> {t('OR')}</Text>
<Text style={{ backgroundColor: '#ccc', height: 1, flex: 1 }}> </Text>
</View>
<TouchableOpacity style={styles.pickColorsButton} onPress={handlePickColors}>
<Text style={styles.pickColorsButtonText}>{t('Pick colors Manually')}</Text>
</TouchableOpacity>
</>
{Platform.OS == 'android' && (
<>
<View
style={{
flexDirection: 'row',
alignItems: 'center'
}}>
<Text style={{ backgroundColor: '#ccc', height: 1, flex: 1 }}> </Text>
<Text style={{ marginHorizontal: 10 }}> {t('OR')}</Text>
<Text style={{ backgroundColor: '#ccc', height: 1, flex: 1 }}> </Text>
</View>
<TouchableOpacity style={styles.pickColorsButton} onPress={handlePickColors}>
<Text style={styles.pickColorsButtonText}>{t('Pick colors Manually')}</Text>
</TouchableOpacity>
</>
)}
</View>

</View>
</TouchableWithoutFeedback>
</View>
Expand Down Expand Up @@ -319,7 +319,7 @@ const styles = {
height: 120
},
imageExtractedColorPreview: {
margin: 16,
margin: 16
},
colorPickerModalContent: {
backgroundColor: 'white',
Expand All @@ -333,7 +333,7 @@ const styles = {
previewImage: {
height: 150,
resizeMode: 'contain',
marginHorizontal: 20,
marginHorizontal: 20
},
colorPreviewContainer: {
display: 'flex',
Expand All @@ -349,7 +349,7 @@ const styles = {
},
pickColorsButton: {
alignItems: 'center',
marginVertical: 8,
marginVertical: 8
},
pickColorsButtonText: {
fontSize: 18,
Expand Down
41 changes: 21 additions & 20 deletions components/HamburgerMenu.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,14 +57,14 @@ const HamburgerMenu = (props) => {

<ScrollView>
<View style={styles.menu}>
<TouchableOpacity
<TouchableOpacity
style={styles.menuItem}
onPress={async () => {
logEvent('home');
props.toggleSideMenu();
props.navigation.reset({
index: 0,
routes: [{ name: ROUTE_NAMES.HOME }],
routes: [{ name: ROUTE_NAMES.HOME_SEARCH }]
});
}}>
<View style={styles.menuItemView}>
Expand Down Expand Up @@ -100,20 +100,21 @@ const HamburgerMenu = (props) => {
<Text style={styles.textAreaMenuItem}>{t('Explore Palettes')}</Text>
</View>
</TouchableOpacity>
{Platform.OS == 'ios' && <TouchableOpacity
style={styles.menuItem}
onPress={async () => {
logEvent('hm_palette_library');
navigate('PaletteLibrary');
}}>
<View style={styles.menuItemView}>
<View style={styles.menuIcon}>
<MaterialCommunityIcons name="palette-swatch-outline" style={styles.icon} />
{Platform.OS == 'ios' && (
<TouchableOpacity
style={styles.menuItem}
onPress={async () => {
logEvent('hm_palette_library');
navigate('PaletteLibrary');
}}>
<View style={styles.menuItemView}>
<View style={styles.menuIcon}>
<MaterialCommunityIcons name="palette-swatch-outline" style={styles.icon} />
</View>
<Text style={styles.textAreaMenuItem}>{t('Palette Library')}</Text>
</View>
<Text style={styles.textAreaMenuItem}>{t('Palette Library')}</Text>
</View>
</TouchableOpacity>
}
</TouchableOpacity>
)}
{
<MenuLink
id={'rate-us'}
Expand All @@ -123,7 +124,7 @@ const HamburgerMenu = (props) => {
: 'https://apps.apple.com/app/id1596763657?action=write-review'
}
icon={<MaterialIcons name="star-outline" style={styles.icon} />}>
{t('Rate us on ' + (Platform.OS == 'android' ? 'PlayStore' : "AppStore"))}
{t('Rate us on ' + (Platform.OS == 'android' ? 'PlayStore' : 'AppStore'))}
</MenuLink>
}
<TouchableOpacity
Expand Down Expand Up @@ -152,7 +153,7 @@ const HamburgerMenu = (props) => {
<Text style={[styles.textAreaMenuItem]}>{t('About us')}</Text>
</View>
</TouchableOpacity>
{ Platform.OS == 'android' && // right now histories requires login. That's why enabling it in only android.
{Platform.OS == 'android' && ( // right now histories requires login. That's why enabling it in only android.
<TouchableOpacity
style={styles.menuItem}
onPress={async () => {
Expand All @@ -166,8 +167,8 @@ const HamburgerMenu = (props) => {
<Text style={styles.textAreaMenuItem}>{t('Huehive AI chat history')}</Text>
</View>
</TouchableOpacity>
}
{(Platform.OS == 'android' && !userData) && (
)}
{Platform.OS == 'android' && !userData && (
<TouchableOpacity
style={styles.menuItem}
onPress={async () => {
Expand All @@ -183,7 +184,7 @@ const HamburgerMenu = (props) => {
</View>
</TouchableOpacity>
)}
{(Platform.OS == 'android') && (
{Platform.OS == 'android' && (
<TouchableOpacity
style={styles.menuItem}
onPress={async () => {
Expand Down
6 changes: 4 additions & 2 deletions hooks/useChatSession.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,14 +12,16 @@ const useChatSession = (initialMessages) => {
const interval = setInterval(async () => {
try {
const messageResponse = await getChatSession(chatSession.data.id, latestMessage.id);
console.log('Test it ', latestMessage.id);
if (messageResponse.data.length > 0) {
console.log(messageResponse.data);
clearInterval(interval);
setMessages((prevMessages) => [...prevMessages, ...messageResponse.data]);
setIsLoading(false);
}
} catch (error) {
console.error('Error fetching chat session updates', error);
setError(error);
setError(error.toString());
sendClientError('fetch_new_message', error.message);
clearInterval(interval);
}
Expand All @@ -38,7 +40,7 @@ const useChatSession = (initialMessages) => {
return chatSession;
} catch (error) {
console.error('Error creating chat session', error);
setError(error);
setError(error.toString());
sendClientError('create_session', error.message);
throw error;
} finally {
Expand Down
Loading