76 lines
2.0 KiB
TypeScript
76 lines
2.0 KiB
TypeScript
import { LanguageSelection } from "@/components/LanguageSelection";
|
|
import { Link, Stack } from "expo-router";
|
|
import { useState } from "react";
|
|
import { Image, Text, View, StyleSheet, Button, Pressable } from "react-native";
|
|
import { Translator, language_matrix_entry } from "./i18n/api";
|
|
import ConversationThread from "@/components/ConversationThread";
|
|
import { Conversation } from "./lib/conversation";
|
|
|
|
function LogoTitle() {
|
|
return (
|
|
<Image
|
|
style={styles.image}
|
|
source={{ uri: "https://reactnative.dev/img/tiny_logo.png" }}
|
|
/>
|
|
);
|
|
}
|
|
|
|
export default function Home() {
|
|
const [lang, setLang] = useState<language_matrix_entry | undefined>();
|
|
const [conversation, setConversation] = useState<Conversation | undefined>();
|
|
const [setShowSettings, showSettings] = useState<boolean>(false);
|
|
|
|
function onLangSelected(lang: language_matrix_entry | undefined) {
|
|
console.log("Language %s selected", lang?.code);
|
|
setLang(lang);
|
|
if (!lang?.code) return;
|
|
setConversation(
|
|
new Conversation(
|
|
new Translator("en", lang.code),
|
|
{ id: "host", language: "en" },
|
|
{ id: "guest", language: lang.code }
|
|
)
|
|
);
|
|
}
|
|
|
|
function onGoBack() {
|
|
setConversation(undefined);
|
|
}
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<Pressable>
|
|
<Text>Settings</Text>
|
|
</Pressable>
|
|
<Stack.Screen
|
|
options={{
|
|
title: "My home",
|
|
headerStyle: { backgroundColor: "#f4511e" },
|
|
headerTintColor: "#fff",
|
|
headerTitleStyle: {
|
|
fontWeight: "bold",
|
|
},
|
|
}}
|
|
/>
|
|
<Text>Home Screen</Text>
|
|
{conversation ? (
|
|
<ConversationThread conversation={conversation} onGoBack={onGoBack} />
|
|
) : (
|
|
<LanguageSelection onLangSelected={onLangSelected} />
|
|
)}
|
|
)
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
justifyContent: "flex-start",
|
|
},
|
|
image: {
|
|
width: 50,
|
|
height: 50,
|
|
},
|
|
});
|