64 lines
1.7 KiB
TypeScript
64 lines
1.7 KiB
TypeScript
import { useNavigation } from '@react-navigation/native';
|
|
import { useState } from "react";
|
|
import { Image, Text, View, StyleSheet, Button, Pressable } from "react-native";
|
|
import { LanguageServer, Translator, language_matrix_entry } from "./i18n/api";
|
|
import { Conversation } from "./lib/conversation";
|
|
import { LanguageSelection } from "@/components/LanguageSelection";
|
|
import { Link } from 'expo-router';
|
|
|
|
function LogoTitle() {
|
|
return (
|
|
<Image
|
|
style={styles.image}
|
|
source={{ uri: "https://reactnative.dev/img/tiny_logo.png" }}
|
|
/>
|
|
);
|
|
}
|
|
|
|
export default function Home() {
|
|
const navigation = useNavigation();
|
|
|
|
const [lang, setLang] = useState<language_matrix_entry | undefined>();
|
|
const [conversation, setConversation] = useState<Conversation | undefined>();
|
|
const [setShowSettings, showSettings] = useState<boolean>(false);
|
|
|
|
async function onLangSelected(lang: language_matrix_entry) {
|
|
console.log("Language %s selected", lang.code);
|
|
setLang(lang);
|
|
if (!lang?.code) return;
|
|
const langServer = await LanguageServer.getDefault();
|
|
const conversation = new Conversation(
|
|
new Translator("en", lang.code, langServer),
|
|
{ id: "host", language: "en" },
|
|
{ id: "guest", language: lang.code }
|
|
);
|
|
navigation.navigate("Conversation", {
|
|
conversation,
|
|
});
|
|
}
|
|
|
|
function onGoBack() {
|
|
setConversation(undefined);
|
|
}
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<Pressable onPress={() => navigation.navigate("Settings")}>
|
|
<Text>Settings</Text>
|
|
</Pressable>
|
|
<LanguageSelection onLangSelected={onLangSelected} />
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
justifyContent: "flex-start",
|
|
},
|
|
image: {
|
|
width: 50,
|
|
height: 50,
|
|
},
|
|
});
|