fix(status): harden presets after review

Address findings from 2 review agents on the status-presets feature:

- Presence-echo race: a heartbeat can echo the previous status just after
  a new one is saved, reverting the input. Track the last-applied value
  and ignore non-matching echoes until our own echo lands or a 15s window
  elapses (bounded so a dropped echo can't block real cross-device
  updates). Applies to Save, preset apply, and Clear.

- Duplicate chips: a saved custom preset that matches a built-in is now
  hidden from "Your presets" (it already shows under Quick statuses).

- a11y: the two preset rows use aria-labelledby tied to their visible
  headings instead of mismatched hardcoded aria-labels.

- Visual grouping: a custom preset's chip and its delete X now sit with
  gap=0 as one unit while the row separates presets with gap=200, so a
  chip and its delete no longer read as two separate presets. Delete/Plus
  icons bumped to size=100 to match the folds chip-icon convention.

- Parity: addPreset/removePreset promises are now caught like the other
  account-data call sites.

Docs updated to the exact 11-preset built-in list.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

LOTUS_FEATURES.md

@@ -910,7 +910,7 @@ A presence status selector in the user panel offering five modes:
 - Optional auto-clear timer with presets: 30 minutes, 1 hour, 4 hours, 1 day, 3 days, 7 days
 - Status is broadcast via `mx.setPresence({ status_msg: ... })`
 - Character counter appears at 56/64 characters remaining to warn of the limit
-- **Status presets**: a "Quick statuses" row of built-in presets spanning gaming/social/life/work (🎮 Gaming, 🎧 In a party, 🏆 Ranked grind, 😴 AFK, 🍿 Watching, 🗓️ In a meeting, 🏠 Working remotely, 🍽️ Lunch, 🌴 On vacation, 🤒 Out sick…). Clicking a preset applies its message + suggested auto-clear in one click. Users can also save the current status as a reusable custom preset (stored in `io.lotus.status_presets` account data, synced across devices, de-duped by label, capped at 20) and delete presets inline. Built-in list + pure `upsertPreset` de-dupe/cap logic live in `src/app/utils/statusPresets.ts` (unit-tested); persistence in `src/app/hooks/useStatusPresets.ts`.
+- **Status presets**: a "Quick statuses" row of 11 built-in presets spanning gaming/social/life/work — 🎮 Gaming, 🎧 In a party, 🏆 Ranked grind, 😴 AFK, 🍿 Watching, 🍽️ Lunch, 🗓️ In a meeting, 🏠 Working remotely, 🎯 Focusing, 🌴 On vacation, 🤒 Out sick (see `BUILT_IN_STATUS_PRESETS`). Clicking a preset applies its message + suggested auto-clear in one click. Users can also save the current status as a reusable custom preset (stored in `io.lotus.status_presets` account data, synced across devices, de-duped by label, capped at 20; a saved preset matching a built-in is hidden to avoid a duplicate chip) and delete presets inline. Built-in list + pure `upsertPreset` de-dupe/cap logic live in `src/app/utils/statusPresets.ts` (unit-tested); persistence in `src/app/hooks/useStatusPresets.ts`.
 
 ### Presence Badges
 

src/app/features/settings/account/Profile.tsx

@@ -62,6 +62,7 @@ import {
   BUILT_IN_STATUS_PRESETS,
   StatusPreset,
   makePresetId,
+  normalizeLabel,
 } from '../../../utils/statusPresets';
 
 type ProfileProps = {
@@ -368,6 +369,12 @@ function ProfileStatus() {
   // True while the user has unsaved local edits — prevents a server presence
   // echo from overwriting what the user is currently typing/inserting.
   const statusDirtyRef = useRef(false);
+  // The value we most recently applied (with the apply time). A presence
+  // heartbeat can echo the PREVIOUS status just after we save the new one; that
+  // stale echo would otherwise revert the input. We ignore non-matching echoes
+  // until our own echo lands or a short window elapses (bounded so a genuinely
+  // dropped echo can't block real cross-device updates forever).
+  const pendingAppliedRef = useRef<{ value: string; ts: number } | null>(null);
   const [clearAfter, setClearAfter] = useState('0');
   const [emojiAnchor, setEmojiAnchor] = useState<RectCords>();
   const { presets, addPreset, removePreset } = useStatusPresets();
@@ -383,6 +390,16 @@ function ProfileStatus() {
     // wipe the saved status on every invisible toggle.
     if (presence.presence === Presence.Offline) return;
     const remoteStatus = presence.status ?? '';
+    const pending = pendingAppliedRef.current;
+    if (pending) {
+      if (remoteStatus === pending.value) {
+        pendingAppliedRef.current = null; // our own echo landed — accept it
+      } else if (Date.now() - pending.ts < 15_000) {
+        return; // stale echo of the previous status; ignore within the window
+      } else {
+        pendingAppliedRef.current = null; // window elapsed — accept external changes
+      }
+    }
     if (remoteStatus) {
       setStatusMsg(remoteStatus);
       localStorage.setItem(STATUS_MSG_KEY(userId), remoteStatus);
@@ -427,6 +444,8 @@ function ProfileStatus() {
     (rawMsg: string, clearAfterValue: string) => {
       statusDirtyRef.current = false;
       const msg = rawMsg.trim();
+      // Guard against a stale presence echo reverting this value (see the sync effect).
+      pendingAppliedRef.current = { value: msg, ts: Date.now() };
       saveStatus(msg).catch(() => undefined);
 
       if (msg) {
@@ -467,11 +486,19 @@ function ProfileStatus() {
   const handleSaveCurrent = useCallback(() => {
     const label = statusMsg.trim();
     if (!label) return;
-    addPreset({ id: makePresetId(), label, clearAfter });
+    addPreset({ id: makePresetId(), label, clearAfter }).catch(() => undefined);
   }, [statusMsg, clearAfter, addPreset]);
 
+  // Hide any saved preset that duplicates a built-in (it already shows under
+  // "Quick statuses"), so the same status can't appear as two chips.
+  const customPresets = useMemo(() => {
+    const builtInLabels = new Set(BUILT_IN_STATUS_PRESETS.map((p) => normalizeLabel(p.label)));
+    return presets.filter((p) => !builtInLabels.has(normalizeLabel(p.label)));
+  }, [presets]);
+
   const handleClear = () => {
     statusDirtyRef.current = false;
+    pendingAppliedRef.current = { value: '', ts: Date.now() };
     setStatusMsg('');
     localStorage.removeItem(STATUS_MSG_KEY(userId));
     localStorage.removeItem(STATUS_EXPIRY_KEY(userId));
@@ -500,10 +527,10 @@ function ProfileStatus() {
       <Box direction="Column" grow="Yes" gap="200">
         {/* Quick statuses — built-in presets, one click applies message + timer */}
         <Box direction="Column" gap="100">
-          <Text size="T200" priority="300">
+          <Text id="status-quick-heading" size="T200" priority="300">
             Quick statuses
           </Text>
-          <Box gap="100" wrap="Wrap" role="group" aria-label="Built-in status presets">
+          <Box gap="100" wrap="Wrap" role="group" aria-labelledby="status-quick-heading">
             {BUILT_IN_STATUS_PRESETS.map((preset) => (
               <Chip
                 key={preset.id}
@@ -524,12 +551,14 @@ function ProfileStatus() {
 
         {/* Your presets — saved from the current status; synced via account data */}
         <Box direction="Column" gap="100">
-          <Text size="T200" priority="300">
+          <Text id="status-custom-heading" size="T200" priority="300">
             Your presets
           </Text>
-          <Box gap="100" wrap="Wrap" role="group" aria-label="Your saved status presets">
+          <Box gap="200" wrap="Wrap" role="group" aria-labelledby="status-custom-heading">
-            {presets.map((preset) => (
+            {customPresets.map((preset) => (
-              <Box key={preset.id} alignItems="Center" gap="100">
+              // gap="0" keeps the chip and its delete X reading as one unit; the
+              // parent row's larger gap="200" separates one preset from the next.
+              <Box key={preset.id} alignItems="Center" gap="0">
                 <Chip
                   type="button"
                   variant="Secondary"
@@ -549,9 +578,9 @@ function ProfileStatus() {
                   variant="Secondary"
                   fill="None"
                   aria-label={`Delete preset ${preset.label}`}
-                  onClick={() => removePreset(preset.id)}
+                  onClick={() => removePreset(preset.id).catch(() => undefined)}
                 >
-                  <Icon size="50" src={Icons.Cross} />
+                  <Icon size="100" src={Icons.Cross} />
                 </IconButton>
               </Box>
             ))}
@@ -563,7 +592,7 @@ function ProfileStatus() {
               outlined
               disabled={saving || !statusMsg.trim()}
               onClick={handleSaveCurrent}
-              before={<Icon size="50" src={Icons.Plus} />}
+              before={<Icon size="100" src={Icons.Plus} />}
             >
               <Text as="span" size="B300">
                 Save current