yuriandClaude Opus 5.5
9749da5ae7
Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
40 lines
1.5 KiB
TypeScript
40 lines
1.5 KiB
TypeScript
import { useQuery } from '@tanstack/react-query';
|
|
import { Send } from 'lucide-react';
|
|
import { api, type Me } from '../api.ts';
|
|
import { PageTitle } from '../components/ui.tsx';
|
|
import { TelegramLink } from '../pages/Settings.tsx';
|
|
import { useAcc } from './i18n.ts';
|
|
|
|
/** Тариф без веб-кабинета, открыт браузер: объясняем, что работа идёт в Telegram, и помогаем туда попасть. */
|
|
export function TelegramOnlyPage({ me }: { me: Me }) {
|
|
const { a } = useAcc();
|
|
const m = a.mini;
|
|
const { data } = useQuery({
|
|
queryKey: ['config'],
|
|
queryFn: () => api<{ telegramBotUsername: string | null }>('/config'),
|
|
staleTime: Infinity,
|
|
});
|
|
const bot = data?.telegramBotUsername;
|
|
return (
|
|
<>
|
|
<PageTitle title={m.title} sub={m.sub} />
|
|
<ol className="max-w-2xl space-y-4">
|
|
<li className="card p-5">
|
|
<p className="mb-3 font-medium"><span className="mr-2 text-signal tabular-nums">1</span>{m.step1}</p>
|
|
<TelegramLink linked={me.user.telegramLinked} />
|
|
</li>
|
|
<li className="card p-5">
|
|
<p className="mb-3 font-medium"><span className="mr-2 text-signal tabular-nums">2</span>{m.step2}</p>
|
|
{bot && (
|
|
<a className="btn btn-primary" href={`https://t.me/${bot}`} target="_blank" rel="noopener noreferrer">
|
|
<Send size={16} aria-hidden="true" />
|
|
{m.open}
|
|
</a>
|
|
)}
|
|
</li>
|
|
</ol>
|
|
<p className="mt-6 max-w-2xl text-sm text-muted">{m.upgrade}</p>
|
|
</>
|
|
);
|
|
}
|