NotBigGhostandClaude Opus 5
462079d835
Страница входа начинается с карточки «Вход» (ник и пароль), в ней же переключатель на регистрацию с повтором пароля. Telegram стоит ниже вторым способом. Под ним подсказка: аккаунт, созданный по паролю, сначала привязывают к Telegram в профиле, иначе вход через Telegram заведёт новый аккаунт. Поле логина без автозаглавной буквы и автоисправления, у полей правильный autocomplete для менеджеров паролей. SetPasswordDialog показывается в AppShell всем, у кого has_password=false: аккаунтам из Telegram и созданным до паролей. Закрыть окно нельзя, только задать пароль или выйти. Успешный ответ кладёт в кэш профиль с has_password=true, и окно исчезает само. Кнопка «Позже (dev)» есть лишь под import.meta.env.DEV: в прод-бандле её строки нет, это проверено по dist. В профиле появилась карточка «Вход в аккаунт»: смена пароля (текущий, если он задан, новый и повтор) и привязка Telegram тем же виджетом, что при входе. У смены ника подсказка, что ник — это и логин. В админке у игрока появилась кнопка «Задать пароль» с вводом в той же строке, как у переименования, а в строке игрока — пометка «без пароля». schema.d.ts перегенерирован с живого бэкенда. #24 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XfTsytzT6TojfmprRDKiV6
61 lines
2.1 KiB
TypeScript
61 lines
2.1 KiB
TypeScript
import { useState } from "react";
|
|
import { Outlet, useLocation, useNavigate } from "react-router-dom";
|
|
|
|
import { useMe } from "../hooks/auth";
|
|
import { useServerEvents } from "../hooks/useServerEvents";
|
|
import { BottomBar } from "./BottomBar";
|
|
import { NotificationBell } from "./NotificationBell";
|
|
import { NotificationToaster } from "./NotificationToaster";
|
|
import { SetPasswordDialog } from "./SetPasswordDialog";
|
|
import { SideMenu } from "./SideMenu";
|
|
|
|
const TITLES: Record<string, string> = {
|
|
"/": "Forbidden Stars",
|
|
"/group": "Группа",
|
|
"/group/settings": "Настройки группы",
|
|
"/account": "Аккаунт",
|
|
"/match/new": "Новая партия",
|
|
"/stats": "Общая статистика",
|
|
"/help": "Справка",
|
|
};
|
|
|
|
export function AppShell() {
|
|
const location = useLocation();
|
|
const navigate = useNavigate();
|
|
const { data: me } = useMe();
|
|
const [menuOpen, setMenuOpen] = useState(false);
|
|
useServerEvents(!!me); // живые обновления (SSE) только при наличии сессии
|
|
const title =
|
|
TITLES[location.pathname] ??
|
|
(location.pathname.startsWith("/u/") ? "Профиль игрока" : "Forbidden Stars");
|
|
const isHome = location.pathname === "/";
|
|
|
|
return (
|
|
<div className="app-shell">
|
|
<header className="top-bar">
|
|
<div className="top-bar-left">
|
|
<button className="top-bar-home" onClick={() => navigate("/")}>
|
|
Forbidden Stars
|
|
</button>
|
|
</div>
|
|
<span className="title small muted top-bar-center">{!isHome ? title : ""}</span>
|
|
<div className="top-bar-right">
|
|
<NotificationBell enabled={!!me} />
|
|
</div>
|
|
</header>
|
|
|
|
<NotificationToaster enabled={!!me} />
|
|
|
|
<main className="app-main">
|
|
<Outlet />
|
|
</main>
|
|
|
|
<SideMenu open={menuOpen} onClose={() => setMenuOpen(false)} />
|
|
<BottomBar onMenu={() => setMenuOpen(true)} />
|
|
|
|
{/* Без пароля дальше не пускаем: логин = ник, пароль нужен для входа. */}
|
|
{me && !me.has_password && <SetPasswordDialog nickname={me.nickname} />}
|
|
</div>
|
|
);
|
|
}
|