mirror of
https://github.com/hansjone/netx.git
synced 2026-10-10 04:40:45 +08:00
feat(web): NetX workbench, UME-only UI, i18n, and header status
- Replace sidebar app with workbench home and module tabs (openOrFocusModule) - Remove legacy pages; add module registry, shared tab channel, WEB.md - Add zh/en i18n, global ToastProvider, restore oclaw bridge pill in header Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
parent
664775927b
commit
282dbe75af
33 changed files with 1631 additions and 1677 deletions
67
web/src/components/HeaderMenu.tsx
Normal file
67
web/src/components/HeaderMenu.tsx
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
import { useEffect, useRef, useState } from "react";
|
||||
import { useI18n, type Locale } from "../i18n";
|
||||
|
||||
export function HeaderMenu() {
|
||||
const { t, locale, setLocale } = useI18n();
|
||||
const [open, setOpen] = useState(false);
|
||||
const rootRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!open) return;
|
||||
const onDocClick = (ev: MouseEvent) => {
|
||||
if (!rootRef.current?.contains(ev.target as Node)) setOpen(false);
|
||||
};
|
||||
const onKey = (ev: KeyboardEvent) => {
|
||||
if (ev.key === "Escape") setOpen(false);
|
||||
};
|
||||
document.addEventListener("mousedown", onDocClick);
|
||||
document.addEventListener("keydown", onKey);
|
||||
return () => {
|
||||
document.removeEventListener("mousedown", onDocClick);
|
||||
document.removeEventListener("keydown", onKey);
|
||||
};
|
||||
}, [open]);
|
||||
|
||||
const pick = (next: Locale) => {
|
||||
setLocale(next);
|
||||
setOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="header-menu header-menu--on-brand" ref={rootRef}>
|
||||
<button
|
||||
type="button"
|
||||
className="header-menu__trigger header-menu__trigger--on-brand"
|
||||
aria-label={t("layout.moreMenu")}
|
||||
aria-haspopup="menu"
|
||||
aria-expanded={open}
|
||||
onClick={() => setOpen((v) => !v)}
|
||||
>
|
||||
⋯
|
||||
</button>
|
||||
{open ? (
|
||||
<div className="header-menu__panel header-menu__panel--light" role="menu">
|
||||
<div className="header-menu__label header-menu__label--light">{t("layout.language")}</div>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitemradio"
|
||||
className={`header-menu__item header-menu__item--light${locale === "zh" ? " header-menu__item--active-light" : ""}`}
|
||||
aria-checked={locale === "zh"}
|
||||
onClick={() => pick("zh")}
|
||||
>
|
||||
{t("layout.langZh")}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitemradio"
|
||||
className={`header-menu__item header-menu__item--light${locale === "en" ? " header-menu__item--active-light" : ""}`}
|
||||
aria-checked={locale === "en"}
|
||||
onClick={() => pick("en")}
|
||||
>
|
||||
{t("layout.langEn")}
|
||||
</button>
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue