trails-cool/trails
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #606 from trails-cool/feat/planner-computing-overlay

Browse source 
feat(planner): move "computing route" indicator from topbar to a map overlay
This commit is contained in:
Ullrich Schäfer 2026-07-16 01:16:09 +02:00 • committed by GitHub
commit 6d905c152f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 13 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

17
apps/planner/app/components/SessionView.tsx
View file

@ -236,7 +236,6 @@ export function SessionView({ sessionId, hasJournalCallback, returnUrl, initialW
canRedo={canRedo}
onUndo={undo}
onRedo={redo}
computing={computing}
profileSlot={<ProfileSelector yjs={yjs} />}
actions={
<>
@ -255,11 +254,19 @@ export function SessionView({ sessionId, hasJournalCallback, returnUrl, initialW
<main className="flex-1 flex flex-col">
<div className="relative flex-1">
{computing && (
<div className="absolute inset-x-0 top-0 z-[1000]">
<div className="h-1 w-full overflow-hidden bg-blue-100">
<div className="h-full w-1/3 animate-[slide_1s_ease-in-out_infinite] bg-blue-500" />
<>
{/* Ambient indeterminate progress along the top edge */}
<div className="absolute inset-x-0 top-0 z-[1000]">
<div className="h-0.5 w-full overflow-hidden bg-accent-bg">
<div className="h-full w-1/3 animate-[slide_1s_ease-in-out_infinite] bg-accent" />
</div>
</div>
</div>
{/* Floating status pill — overlays the map without shifting layout */}
<div className="pointer-events-none absolute left-1/2 top-3 z-[1000] flex -translate-x-1/2 items-center gap-2 rounded-full border border-border bg-bg-raised px-3 py-1 text-xs font-medium text-text-md shadow-md">
<span className="h-3 w-3 shrink-0 animate-spin rounded-full border-2 border-accent border-t-transparent" aria-hidden />
{t("computingRoute")}
</div>
</>
)}
<Suspense
fallback={

7
apps/planner/app/components/Topbar.tsx
View file

@ -14,7 +14,6 @@ interface TopbarProps {
canRedo: boolean;
onUndo: () => void;
onRedo: () => void;
computing?: boolean;
/** App-specific interactive slot (profile selector). */
profileSlot?: ReactNode;
/** Right-aligned action slot (save-to-journal, export). */
@ -43,7 +42,6 @@ export function Topbar({
canRedo,
onUndo,
onRedo,
computing = false,
profileSlot,
actions,
}: TopbarProps) {
@ -86,11 +84,6 @@ export function Topbar({
</div>
<div className="flex shrink-0 items-center gap-2 sm:gap-3">
{actions}
{computing && (
<span className="hidden text-xs text-accent sm:inline">
{t("computingRoute")}
</span>
)}
<span className="hidden items-center gap-1.5 text-sm text-text-md sm:inline-flex">
<span
className={`inline-block h-1.5 w-1.5 rounded-full ${connected ? "bg-accent" : "bg-text-lo"}`}