50 lines
2.0 KiB
TypeScript
50 lines
2.0 KiB
TypeScript
import { useQuery } from "@tanstack/react-query";
|
||
import { Link, useRouter } from "expo-router";
|
||
import React, { useEffect, useRef } from "react";
|
||
import { ScrollView, Text, View } from "react-native";
|
||
import { useApp } from "../../src/app-context";
|
||
import { AppHeader } from "../../src/components/AppHeader";
|
||
import { ScreenShell } from "../../src/components/ScreenShell";
|
||
import { dialogApi } from "../../src/services";
|
||
import { ErrorNotice, Loading, styles } from "../../src/ui";
|
||
import { spacing } from "../../src/theme";
|
||
|
||
export default function DialogsScreen() {
|
||
const app = useApp();
|
||
const router = useRouter();
|
||
const requestKey = useRef(crypto.randomUUID());
|
||
const chat = useQuery({
|
||
queryKey: ["current-dialog", requestKey.current],
|
||
queryFn: () => dialogApi.create(requestKey.current),
|
||
enabled: app.authStatus === "authenticated",
|
||
});
|
||
|
||
useEffect(() => {
|
||
if (chat.data) router.replace(`/dialogs/${chat.data.dialog_id}`);
|
||
}, [chat.data, router]);
|
||
|
||
if (app.authStatus !== "authenticated") {
|
||
return (
|
||
<ScreenShell>
|
||
<AppHeader guestLabel="Гость" />
|
||
<View style={{ flex: 1, padding: spacing.lg, justifyContent: "center", gap: spacing.md }}>
|
||
<Text accessibilityRole="header" style={styles.title}>Чат</Text>
|
||
<Text style={styles.text}>Чат с компанией доступен после авторизации. Отправьте сообщение на главной странице, чтобы войти.</Text>
|
||
<Link href="/" style={styles.link}>На главную</Link>
|
||
</View>
|
||
</ScreenShell>
|
||
);
|
||
}
|
||
|
||
return (
|
||
<ScreenShell>
|
||
<AppHeader />
|
||
<View style={{ flex: 1, padding: spacing.lg, justifyContent: "center" }}>
|
||
<Text accessibilityRole="header" style={styles.title}>Открываем чат…</Text>
|
||
{chat.isLoading && <Loading />}
|
||
{chat.error && <ErrorNotice error={chat.error} retry={() => void chat.refetch()} />}
|
||
</View>
|
||
</ScreenShell>
|
||
);
|
||
}
|