Bring daily check-ins forward with compact workspace layout

This commit is contained in:
syntaxbullet
2026-09-05 07:52:28 +02:00
parent 419bdce36b
commit 7ebbf4ed6c
4 changed files with 54 additions and 9 deletions

View File

@@ -166,6 +166,7 @@ function Dashboard({ user, onExpired }: { user: PublicUser; onExpired: () => voi
const [revision, setRevision] = useState(0);
const [attempt, setAttempt] = useState(0);
const [loading, setLoading] = useState(true);
const [habitView, setHabitView] = useState<"today" | "all">("today");
const [adding, setAdding] = useState(false);
const [sharing, setSharing] = useState(false);
const [settings, setSettings] = useState(false);
@@ -300,6 +301,8 @@ function Dashboard({ user, onExpired }: { user: PublicUser; onExpired: () => voi
const refreshed = await habitRequest<TodayResponse>("/today");
if (mounted.current) {
setToday(refreshed);
// Keep a habit reachable when an edit makes it unscheduled (including an empty routine).
if (refreshed.habits.some(item => item.habitId === habit.habitId && !item.due)) setHabitView("all");
setNeedsRefresh(false);
setRevision((value) => value + 1);
}
@@ -337,6 +340,7 @@ function Dashboard({ user, onExpired }: { user: PublicUser; onExpired: () => voi
return (
<>
<WelcomePanel
compact
name={user.displayName || user.username}
avatarUrl={user.avatarUrl}
date={today?.date}
@@ -379,7 +383,6 @@ function Dashboard({ user, onExpired }: { user: PublicUser; onExpired: () => voi
{today.habits.length > 0 && (
<>
<Button id="open-sharing" aria-haspopup="dialog" variant="secondary" disabled={busy || loading || needsRefresh || sharing} aria-expanded={sharing} aria-controls={sharing ? "share-progress" : undefined} onClick={() => setSharing(true)}>Share progress</Button>
<ButtonLink href="#habits-title">View your habits </ButtonLink>
</>
)}
</div>
@@ -421,6 +424,7 @@ function Dashboard({ user, onExpired }: { user: PublicUser; onExpired: () => voi
focusAddAfterRefresh.current = true;
setAdding(false);
setNotice(`${name} created.`);
setHabitView("all");
setAttempt((value) => value + 1);
}}
/>
@@ -440,13 +444,18 @@ function Dashboard({ user, onExpired }: { user: PublicUser; onExpired: () => voi
id="habits-title"
title={
<>
One day <em>at a time.</em>
Today, <em>at your pace.</em>
</>
}
/>
</div>
<div className="ds-habit-chart-grid">
{today.habits.map((habit) => (
<div className="ds-action-row ds-habit-filters" role="group" aria-label="Show habits">
<Button variant={habitView === "today" ? "primary" : "text"} aria-pressed={habitView === "today"} onClick={() => setHabitView("today")}>Today · {today.due}</Button>
<Button variant={habitView === "all" ? "primary" : "text"} aria-pressed={habitView === "all"} onClick={() => setHabitView("all")}>All habits · {today.habits.length}</Button>
</div>
{habitView === "today" && today.due === 0 && <p className="ds-supporting-copy">Youre all set for today. Choose All habits to view or edit your routines.</p>}
<div className="ds-habit-chart-grid ds-habit-list">
{today.habits.filter(habit => habitView === "all" || habit.due).map((habit) => (
<SavedHabit
key={habit.habitId}
habit={habit}
@@ -579,6 +588,7 @@ function SavedHabit({
>
{habit.method === "count" ? (
<Counter
key={date}
label={habit.name ?? "habit count"}
value={habit.value}
target={habit.target ?? 0}