From 7d85218d5f7b3d745dd4c4614063d5cf39ebc443 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 21:38:16 +0200 Subject: [PATCH 01/14] plist --- ios/arcade/Info.plist | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ios/arcade/Info.plist b/ios/arcade/Info.plist index fe9c3678..4eee1ad3 100644 --- a/ios/arcade/Info.plist +++ b/ios/arcade/Info.plist @@ -21,7 +21,7 @@ CFBundleSignature ???? CFBundleVersion - 62 + 63 ITSAppUsesNonExemptEncryption LSRequiresIPhoneOS From 9448d5bf03f27cfa6a2954e0c2ca07fd85ef0676 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 21:45:28 +0200 Subject: [PATCH 02/14] ErrorBoundary more readble --- app/screens/ErrorScreen/ErrorDetails.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/screens/ErrorScreen/ErrorDetails.tsx b/app/screens/ErrorScreen/ErrorDetails.tsx index d5ce4e9f..1d60cd5f 100644 --- a/app/screens/ErrorScreen/ErrorDetails.tsx +++ b/app/screens/ErrorScreen/ErrorDetails.tsx @@ -60,7 +60,7 @@ const $heading: TextStyle = { const $errorSection: ViewStyle = { flex: 2, - backgroundColor: colors.separator, + backgroundColor: colors.palette.neutral800, marginVertical: spacing.medium, borderRadius: 6, } @@ -75,7 +75,7 @@ const $errorContent: TextStyle = { const $errorBacktrace: TextStyle = { marginTop: spacing.medium, - color: colors.textDim, + color: colors.palette.neutral400, } const $resetButton: ViewStyle = { From 1737db169169ec050becc1755cf0c0f17ac3023e Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:16:35 +0200 Subject: [PATCH 03/14] TabNav default route home --- app/navigators/TabNavigator.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/app/navigators/TabNavigator.tsx b/app/navigators/TabNavigator.tsx index 1fd1c95e..d162de55 100644 --- a/app/navigators/TabNavigator.tsx +++ b/app/navigators/TabNavigator.tsx @@ -41,6 +41,7 @@ export function TabNavigator() { tabBarHideOnKeyboard: true, }} tabBar={(props) => } + initialRouteName="Home" > Date: Sun, 11 Jun 2023 22:16:57 +0200 Subject: [PATCH 04/14] AIChannelItem --- app/components/AIChannelItem.tsx | 112 +++++++++++++++++++++++++++++++ app/components/index.ts | 1 + 2 files changed, 113 insertions(+) create mode 100644 app/components/AIChannelItem.tsx diff --git a/app/components/AIChannelItem.tsx b/app/components/AIChannelItem.tsx new file mode 100644 index 00000000..56cc65aa --- /dev/null +++ b/app/components/AIChannelItem.tsx @@ -0,0 +1,112 @@ +import React, { useEffect } from "react" +import { AutoImage } from "app/components" +import { StyleSheet, Pressable, View, Text } from "react-native" +import { spacing } from "app/theme" +import { useNavigation } from "@react-navigation/native" +import { Channel } from "app/models" +import { ChannelManager } from "app/arclib/src" +import { observer } from "mobx-react-lite" +import { formatCreatedAt } from "app/utils/formatCreatedAt" +import { shortenKey } from "app/utils/shortenKey" + +const colors = { + borderBottomColor: "#232324", + borderColor: "#232324", + messageContentAbout: "#7B7C7F", + messageContentName: "white", + messageContentTime: "#7B7C7F", + messageUsername: "white", + unreadMessagesBadge: "#666", + unreadMessagesText: "#000", +} + +export const AIChannelItem = observer(function ChannelItem({ channel }: { channel: Channel }) { + const { navigate } = useNavigation() + const createdAt = formatCreatedAt(channel.lastMessageAt) + + return ( + navigate("Chat", { id: "ai-demo" })} style={styles.$messageItem}> + + + + {channel.name || "No name"} + {createdAt} + + {/* + {channel.lastMessagePubkey ? shortenKey(channel.lastMessagePubkey) : channel.id} + */} + + {channel.lastMessage || channel.about || "No about"} + + + + + ) +}) + +const styles = StyleSheet.create({ + $divider: { + borderBottomColor: colors.borderBottomColor, + borderBottomWidth: 1, + marginVertical: 8, + }, + $messageAvatar: { + borderColor: colors.borderColor, + borderRadius: 100, + borderWidth: 0.6, + height: 50, + marginRight: spacing.small, + marginTop: 2, + width: 50, + }, + $messageContent: { + flex: 1, + }, + $messageContentAbout: { + color: colors.messageContentAbout, + marginTop: 8, + marginBottom: 6, + maxWidth: 250, + }, + $messageContentHeading: { + alignItems: "center", + flexDirection: "row", + justifyContent: "space-between", + }, + $messageContentName: { + color: colors.messageContentName, + fontWeight: "bold", + }, + $messageContentRight: { + position: "absolute", + right: 0, + top: 25, + }, + $messageContentTime: { + color: colors.messageContentTime, + }, + $messageItem: { + flex: 1, + flexDirection: "row", + }, + $messageUsername: { + color: colors.messageUsername, + marginTop: 2, + maxWidth: 250, + }, + $unreadMessagesBadge: { + alignItems: "center", + backgroundColor: colors.unreadMessagesBadge, + borderRadius: 100, + justifyContent: "center", + minWidth: 20, + padding: 3, + }, + $unreadMessagesText: { + color: colors.unreadMessagesText, + fontSize: 12, + }, +}) diff --git a/app/components/index.ts b/app/components/index.ts index 668151f7..d92bef93 100644 --- a/app/components/index.ts +++ b/app/components/index.ts @@ -21,6 +21,7 @@ export * from "./OfferForm" export * from "./RelayProvider" export * from "./Spotlight" export * from "./ChannelItem" +export * from "./AIChannelItem" export * from "./ScreenWithSidebar" export * from "./ContactItem" export * from "./ActivityIndicator" From ec95b431188f0e4a3b01f27cb03bfe5df4853804 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:17:07 +0200 Subject: [PATCH 05/14] Don't say no-about --- app/components/ChannelItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/components/ChannelItem.tsx b/app/components/ChannelItem.tsx index 05a2ff72..4849e98a 100644 --- a/app/components/ChannelItem.tsx +++ b/app/components/ChannelItem.tsx @@ -59,7 +59,7 @@ export const ChannelItem = observer(function ChannelItem({ {channel.lastMessagePubkey ? shortenKey(channel.lastMessagePubkey) : channel.id} - {channel.lastMessage || channel.about || "No about"} + {channel.lastMessage || channel.about || ""} From 52178ee289219f3619093f35f73d8c7cd42e8718 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:17:21 +0200 Subject: [PATCH 06/14] homemessages handle aidemo --- app/screens/HomeMessagesScreen.tsx | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/app/screens/HomeMessagesScreen.tsx b/app/screens/HomeMessagesScreen.tsx index 465195a2..89aed2e4 100644 --- a/app/screens/HomeMessagesScreen.tsx +++ b/app/screens/HomeMessagesScreen.tsx @@ -3,7 +3,7 @@ import { observer } from "mobx-react-lite" import { View, StyleSheet } from "react-native" import { NativeStackScreenProps } from "@react-navigation/native-stack" import { AppStackScreenProps } from "app/navigators" -import { ScreenWithSidebar, ChannelItem, Text, RelayContext } from "app/components" +import { ScreenWithSidebar, AIChannelItem, ChannelItem, Text, RelayContext } from "app/components" import { FlashList } from "@shopify/flash-list" import { useStores } from "app/models" import { ChannelManager, NostrPool } from "app/arclib/src" @@ -39,7 +39,21 @@ export const HomeMessagesScreen: FC = observer( }, []), ) - const data = [...getChannels, ...privMessages].sort( + const aiRooms = [ + { + id: " ", + name: "Spirit of Satoshi", + about: "Awaiting your questions...", + kind: 911911, + lastMessageAt: Date.now() - 1600000000000, + lastMessage: "", + lastMessageBy: "", + lastMessageByAvatar: "", + picture: "https://pbs.twimg.com/profile_images/1655658089989693440/KXx1NU9i_400x400.jpg", + }, + ] + + const data = [...getChannels, ...privMessages, ...aiRooms].sort( (a: any, b: any) => b.lastMessageAt - a.lastMessageAt, ) @@ -48,6 +62,8 @@ export const HomeMessagesScreen: FC = observer( {item.kind === 4 ? ( + ) : item.kind === 911911 ? ( + ) : ( )} From 5f782499c0f2b2afbbc00d88a7932f7b1a7c3fb8 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:18:25 +0200 Subject: [PATCH 07/14] hacky channelstore but lets remove this --- app/models/ChannelStore.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/app/models/ChannelStore.ts b/app/models/ChannelStore.ts index 61a68231..59092fe7 100644 --- a/app/models/ChannelStore.ts +++ b/app/models/ChannelStore.ts @@ -13,6 +13,18 @@ export const ChannelStoreModel = types .actions(withSetPropAction) .views((self) => ({ getChannel(id: string) { + console.log("trying to getCHannel:", id) + if (id === "ai-demo") { + return { + id: "0", + privkey: "", + messages: [], + fetchMessages: () => {}, + updateLastMessage: () => {}, + reset: () => {}, + back: () => {}, + } as Channel + } return resolveIdentifier(ChannelModel, self, id) }, })) // eslint-disable-line @typescript-eslint/no-unused-vars From 04e7ae8607823289defd9e73b3420f6472becc99 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:18:39 +0200 Subject: [PATCH 08/14] axe that --- app/models/ChannelStore.ts | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/app/models/ChannelStore.ts b/app/models/ChannelStore.ts index 59092fe7..61a68231 100644 --- a/app/models/ChannelStore.ts +++ b/app/models/ChannelStore.ts @@ -13,18 +13,6 @@ export const ChannelStoreModel = types .actions(withSetPropAction) .views((self) => ({ getChannel(id: string) { - console.log("trying to getCHannel:", id) - if (id === "ai-demo") { - return { - id: "0", - privkey: "", - messages: [], - fetchMessages: () => {}, - updateLastMessage: () => {}, - reset: () => {}, - back: () => {}, - } as Channel - } return resolveIdentifier(ChannelModel, self, id) }, })) // eslint-disable-line @typescript-eslint/no-unused-vars From 8c9a1e33863b0641ce98d65306bbc6dba559b1fd Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:22:51 +0200 Subject: [PATCH 09/14] plist --- ios/arcade/Info.plist | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ios/arcade/Info.plist b/ios/arcade/Info.plist index 4eee1ad3..c3100bcc 100644 --- a/ios/arcade/Info.plist +++ b/ios/arcade/Info.plist @@ -21,7 +21,7 @@ CFBundleSignature ???? CFBundleVersion - 63 + 64 ITSAppUsesNonExemptEncryption LSRequiresIPhoneOS From f63ba2f139e4c49d1063f2d01b6a4ebd03939ffb Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:34:28 +0200 Subject: [PATCH 10/14] plist --- app/components/AIChannelItem.tsx | 3 +- app/navigators/AppNavigator.tsx | 1 + app/screens/AIChatScreen.tsx | 174 +++++++++++++++++++++++++++++++ app/screens/index.ts | 1 + ios/arcade/Info.plist | 2 +- 5 files changed, 179 insertions(+), 2 deletions(-) create mode 100644 app/screens/AIChatScreen.tsx diff --git a/app/components/AIChannelItem.tsx b/app/components/AIChannelItem.tsx index 56cc65aa..7cc3775a 100644 --- a/app/components/AIChannelItem.tsx +++ b/app/components/AIChannelItem.tsx @@ -25,7 +25,7 @@ export const AIChannelItem = observer(function ChannelItem({ channel }: { channe const createdAt = formatCreatedAt(channel.lastMessageAt) return ( - navigate("Chat", { id: "ai-demo" })} style={styles.$messageItem}> + navigate("AIChat")} style={styles.$messageItem}> + diff --git a/app/screens/AIChatScreen.tsx b/app/screens/AIChatScreen.tsx new file mode 100644 index 00000000..75a99cdf --- /dev/null +++ b/app/screens/AIChatScreen.tsx @@ -0,0 +1,174 @@ +import React, { FC, useCallback, useEffect, useLayoutEffect } from "react" +import { observer } from "mobx-react-lite" +import { Pressable, TextStyle, View, ViewStyle } from "react-native" +import { NativeStackScreenProps } from "@react-navigation/native-stack" +import { AppStackScreenProps } from "app/navigators" +import { Header, Screen, Text, User, ChannelMessageForm } from "app/components" +import { useFocusEffect, useNavigation } from "@react-navigation/native" +import { colors, spacing } from "app/theme" +import { FlashList } from "@shopify/flash-list" +import { BottomSheetModalProvider } from "@gorhom/bottom-sheet" +import TextWithImage from "app/components/TextWithImage" +import { LogOutIcon, UserPlusIcon } from "lucide-react-native" +import { NostrEvent } from "app/arclib/src" +import { Message } from "app/models" + +interface ChatScreenProps extends NativeStackScreenProps> {} + +export const AIChatScreen: FC = observer(function ChatScreen() { + const navigation = useNavigation() + + const back = () => { + navigation.goBack() + } + + useLayoutEffect(() => { + navigation.setOptions({ + headerShown: true, + header: () => ( +
back()} + RightActionComponent={ + + {}}> + + + console.log("nah")}> + + + + } + /> + ), + }) + }, []) + + useFocusEffect( + useCallback(() => { + function handleNewMessage(event: NostrEvent) { + console.log("new message", event) + // channel.addMessage(event) + } + + async function subscribe() { + // console.log("subscribe") + // return await channelManager.sub({ + // channel_id: channel.id, + // callback: handleNewMessage, + // filter: { + // since: Math.floor(Date.now() / 1000), + // }, + // privkey: channel.privkey, + // }) + } + + // subscribe for new messages + subscribe().catch(console.error) + + return () => { + console.log("unsubscribe") + // pool.unsub(handleNewMessage) + } + }, []), + ) + + useEffect(() => { + // fetch messages + // channel.fetchMessages(channelManager) + }, []) + + const renderItem = useCallback(({ item }: { item: Message }) => { + return ( + + + + + + + ) + }, []) + + return ( + + + + + item.id} + renderItem={renderItem} + ListEmptyComponent={ + + + + } + removeClippedSubviews={true} + estimatedItemSize={60} + inverted={true} + /> + + + + + + + + ) +}) + +const $root: ViewStyle = { + flex: 1, +} + +const $headerRightActions: ViewStyle = { + flexDirection: "row", + gap: spacing.medium, + paddingRight: spacing.medium, +} + +const $container: ViewStyle = { + height: "100%", + justifyContent: "space-between", + paddingHorizontal: spacing.medium, +} + +const $main: ViewStyle = { + flex: 1, +} + +const $form: ViewStyle = { + flexShrink: 0, + paddingTop: spacing.small, +} + +const $messageItem: ViewStyle = { + flex: 1, + paddingVertical: spacing.extraSmall, +} + +const $messageContentWrapper: ViewStyle = { + paddingLeft: 48, + marginTop: -24, +} + +const $messageContent: TextStyle = { + color: "#fff", +} + +const $emptyState: ViewStyle = { + alignSelf: "center", + transform: [{ scaleY: -1 }], + paddingVertical: spacing.medium, +} diff --git a/app/screens/index.ts b/app/screens/index.ts index 5302e48f..02aeea8a 100644 --- a/app/screens/index.ts +++ b/app/screens/index.ts @@ -1,3 +1,4 @@ +export * from "./AIChatScreen" export * from "./CascadeDemo" export * from "./ChannelsScreen" export * from "./ChatScreen" diff --git a/ios/arcade/Info.plist b/ios/arcade/Info.plist index c3100bcc..b5d1087d 100644 --- a/ios/arcade/Info.plist +++ b/ios/arcade/Info.plist @@ -21,7 +21,7 @@ CFBundleSignature ???? CFBundleVersion - 64 + 65 ITSAppUsesNonExemptEncryption LSRequiresIPhoneOS From ff9d25d7b1ca85ee7396080982212b2fe46803f8 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:34:38 +0200 Subject: [PATCH 11/14] more plist --- ios/arcade/Info.plist | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ios/arcade/Info.plist b/ios/arcade/Info.plist index b5d1087d..f596636d 100644 --- a/ios/arcade/Info.plist +++ b/ios/arcade/Info.plist @@ -21,7 +21,7 @@ CFBundleSignature ???? CFBundleVersion - 65 + 66 ITSAppUsesNonExemptEncryption LSRequiresIPhoneOS From ba656eb8cf6d4260ddd3c9b629cb393d54267a9f Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:39:33 +0200 Subject: [PATCH 12/14] loading indicator centered --- app/screens/AIChatScreen.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/app/screens/AIChatScreen.tsx b/app/screens/AIChatScreen.tsx index 75a99cdf..6e2c595c 100644 --- a/app/screens/AIChatScreen.tsx +++ b/app/screens/AIChatScreen.tsx @@ -10,6 +10,7 @@ import { FlashList } from "@shopify/flash-list" import { BottomSheetModalProvider } from "@gorhom/bottom-sheet" import TextWithImage from "app/components/TextWithImage" import { LogOutIcon, UserPlusIcon } from "lucide-react-native" +import { ActivityIndicator } from "app/components" import { NostrEvent } from "app/arclib/src" import { Message } from "app/models" @@ -107,7 +108,7 @@ export const AIChatScreen: FC = observer(function ChatScreen() renderItem={renderItem} ListEmptyComponent={ - + } removeClippedSubviews={true} @@ -171,4 +172,5 @@ const $emptyState: ViewStyle = { alignSelf: "center", transform: [{ scaleY: -1 }], paddingVertical: spacing.medium, + height: 470, } From 910b5eeb94fcb83045a9dc4265974dfdef682e23 Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:40:20 +0200 Subject: [PATCH 13/14] no logout icon there --- app/screens/AIChatScreen.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/screens/AIChatScreen.tsx b/app/screens/AIChatScreen.tsx index 6e2c595c..e580c06d 100644 --- a/app/screens/AIChatScreen.tsx +++ b/app/screens/AIChatScreen.tsx @@ -38,9 +38,9 @@ export const AIChatScreen: FC = observer(function ChatScreen() {}}> - console.log("nah")}> + {/* console.log("nah")}> - + */} } /> From 7836467d9029686c5709bf09c87f8807a00877ea Mon Sep 17 00:00:00 2001 From: Christopher David Date: Sun, 11 Jun 2023 22:48:41 +0200 Subject: [PATCH 14/14] lint --- app/components/AIChannelItem.tsx | 6 ++---- app/screens/AIChatScreen.tsx | 18 +++++------------- 2 files changed, 7 insertions(+), 17 deletions(-) diff --git a/app/components/AIChannelItem.tsx b/app/components/AIChannelItem.tsx index 7cc3775a..b5eda155 100644 --- a/app/components/AIChannelItem.tsx +++ b/app/components/AIChannelItem.tsx @@ -1,13 +1,11 @@ -import React, { useEffect } from "react" +import React from "react" import { AutoImage } from "app/components" import { StyleSheet, Pressable, View, Text } from "react-native" import { spacing } from "app/theme" import { useNavigation } from "@react-navigation/native" import { Channel } from "app/models" -import { ChannelManager } from "app/arclib/src" import { observer } from "mobx-react-lite" import { formatCreatedAt } from "app/utils/formatCreatedAt" -import { shortenKey } from "app/utils/shortenKey" const colors = { borderBottomColor: "#232324", @@ -67,8 +65,8 @@ const styles = StyleSheet.create({ }, $messageContentAbout: { color: colors.messageContentAbout, - marginTop: 8, marginBottom: 6, + marginTop: 8, maxWidth: 250, }, $messageContentHeading: { diff --git a/app/screens/AIChatScreen.tsx b/app/screens/AIChatScreen.tsx index e580c06d..23730560 100644 --- a/app/screens/AIChatScreen.tsx +++ b/app/screens/AIChatScreen.tsx @@ -1,17 +1,15 @@ import React, { FC, useCallback, useEffect, useLayoutEffect } from "react" import { observer } from "mobx-react-lite" -import { Pressable, TextStyle, View, ViewStyle } from "react-native" +import { TextStyle, View, ViewStyle } from "react-native" import { NativeStackScreenProps } from "@react-navigation/native-stack" import { AppStackScreenProps } from "app/navigators" -import { Header, Screen, Text, User, ChannelMessageForm } from "app/components" +import { Header, Screen, User, ChannelMessageForm, ActivityIndicator } from "app/components" import { useFocusEffect, useNavigation } from "@react-navigation/native" import { colors, spacing } from "app/theme" import { FlashList } from "@shopify/flash-list" import { BottomSheetModalProvider } from "@gorhom/bottom-sheet" import TextWithImage from "app/components/TextWithImage" -import { LogOutIcon, UserPlusIcon } from "lucide-react-native" -import { ActivityIndicator } from "app/components" -import { NostrEvent } from "app/arclib/src" +import { UserPlusIcon } from "lucide-react-native" import { Message } from "app/models" interface ChatScreenProps extends NativeStackScreenProps> {} @@ -35,9 +33,8 @@ export const AIChatScreen: FC = observer(function ChatScreen() onLeftPress={() => back()} RightActionComponent={ - {}}> - - + + {/* console.log("nah")}> */} @@ -50,11 +47,6 @@ export const AIChatScreen: FC = observer(function ChatScreen() useFocusEffect( useCallback(() => { - function handleNewMessage(event: NostrEvent) { - console.log("new message", event) - // channel.addMessage(event) - } - async function subscribe() { // console.log("subscribe") // return await channelManager.sub({