feat(meetings): center clock, fullscreen toggle, quick-note tab (#583)
- Replace HeaderClock with richer analog+weekday+digital block, always
centered in the header (both president and normal views). Drop the
PresidentClockBar render from the toolbar; the dead helper is left
in place but unused.
- Lift fullscreen state to ExecutiveMeetingsPageInner with
sessionStorage persistence, Esc handler, auto-exit when the user
leaves the schedule tab. Hide the page header when active and show a
floating "Exit fullscreen" pill. New Maximize/Minimize toggle in the
schedule toolbar portal.
- Add MeetingsQuickNoteTab: a fixed amber vertical pill pinned to the
left edge of the schedule view that navigates to /notes?new=1.
- notes.tsx: detect ?new=1, switch to the Active tab, bump a numeric
openTrigger that the top Composer reacts to by opening + focusing
the textarea, then scrub the query param so navigation doesn't
re-trigger.
- i18n: add executiveMeetings.fullscreen.{enter,exit} and
executiveMeetings.quickNote.label in ar.json and en.json.
tsc clean. Push to Gitea still blocked by Tailscale; user to retry.
This commit is contained in:
@@ -783,34 +783,6 @@ export default function ExecutiveMeetingsPage() {
|
||||
);
|
||||
}
|
||||
|
||||
function PresidentClockBar({ date, lang }: { date: string; lang: "ar" | "en" }) {
|
||||
const [now, setNow] = useState<Date>(() => new Date());
|
||||
useEffect(() => {
|
||||
const id = window.setInterval(() => setNow(new Date()), 1000);
|
||||
return () => window.clearInterval(id);
|
||||
}, []);
|
||||
return (
|
||||
<div
|
||||
className="flex items-center gap-2 sm:gap-3 ps-2 sm:ps-3 ms-1 border-s border-gray-200"
|
||||
data-testid="em-president-clock-bar"
|
||||
>
|
||||
<AnalogClock size={40} />
|
||||
<div className="leading-tight">
|
||||
<div className="flex items-center gap-2 text-[#0B1E3F] font-semibold text-sm sm:text-base">
|
||||
<span data-testid="em-president-weekday">{formatWeekday(date, lang, "long")}</span>
|
||||
<span className="text-muted-foreground/60">·</span>
|
||||
<span className="tabular-nums" data-testid="em-president-digital-time">
|
||||
{formatTimeI18n(now, lang, { hour: "2-digit", minute: "2-digit", second: "2-digit", hour12: true })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-xs sm:text-sm text-muted-foreground tabular-nums" data-testid="em-president-date">
|
||||
{formatDate(date, lang)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function HeaderClock({ lang, date }: { lang: "ar" | "en"; date: string }) {
|
||||
const [now, setNow] = useState<Date>(() => new Date());
|
||||
useEffect(() => {
|
||||
@@ -842,11 +814,9 @@ function HeaderClock({ lang, date }: { lang: "ar" | "en"; date: string }) {
|
||||
|
||||
function MeetingsQuickNoteTab({
|
||||
lang,
|
||||
isRtl,
|
||||
onClick,
|
||||
}: {
|
||||
lang: "ar" | "en";
|
||||
isRtl: boolean;
|
||||
onClick: () => void;
|
||||
}) {
|
||||
const { t } = useTranslation();
|
||||
@@ -1038,7 +1008,6 @@ function ExecutiveMeetingsPageInner() {
|
||||
{section === "schedule" && !isFullscreen && !bulkToolbarActive && (
|
||||
<MeetingsQuickNoteTab
|
||||
lang={lang}
|
||||
isRtl={isRtl}
|
||||
onClick={() => setLocation("/notes?new=1")}
|
||||
/>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user