gloomberb 0.18.2 → 0.18.3

package/src/components/layout/header.tsx

@@ -26,7 +26,8 @@ import {
 } from "../command-bar/panel/prompt-binding";
 import { useAppDispatch, useAppSelector, type AppState } from "../../state/app/context";
 import { useViewport } from "../../react/input";
-import { canRetryUpdate } from "../../app/global-shortcuts";
+import { canRetryUpdate } from "../../updater";
+import { updateFailureReason } from "../../updater/failure";
 import { t, tf } from "../../i18n";
 import { displayWidth, truncateToDisplayWidth } from "../../utils/format";
 import { ClippedText, NATIVE_CLIP_STYLE } from "../ui/display";
@@ -43,8 +44,12 @@ const UPDATE_NOTICE_DURATION_MS = 5_000;
  * The retry hint gives way before the message goes under it.
  */
 const UPDATE_ERROR_MIN_COLUMNS = 12;
-/** Kept clear after the failed-update banner, so its last character never touches the Help pill. */
-const UPDATE_ERROR_GAP_COLUMNS = 1;
+/** Kept clear after the terminal update status, so its last character never touches the Help pill. */
+const UPDATE_STATUS_GAP_COLUMNS = 1;
+/** Below this many characters of the reason, the terminal banner says "Update failed" and the retry key instead. */
+const UPDATE_REASON_MIN_COLUMNS = 8;
+/** A terminal line about an update narrower than this is left out rather than shown as a stub. */
+const UPDATE_TEXT_MIN_COLUMNS = 8;
 /** Left padding of the update status's slot, in cells; the desktop's title-bar layout also pads its right. */
 const UPDATE_SLOT_PADDING_COLUMNS = 2;
 /** The Help pill's own props, shared by its button and the width the update status leaves it. */
@@ -315,6 +320,9 @@ type UpdateStatusView =
   | { kind: "restart"; text: string; version: string }
   | { kind: "failed"; message: string; parts: StatusPart[]; retry: boolean };
 
+/** The failed banner's words without the reason, for a terminal slot too narrow to read one. */
+const UPDATE_FAILED_SHORT = "Update failed";
+
 /**
  * A line of the status in the pieces the desktop may treat apart: a `cut`
  * piece ends in an ellipsis and gives way, the rest stays whole. The download
@@ -372,8 +380,13 @@ function resolveUpdateStatusView({
       return { kind: "text", text: t(updateProgress.message ?? "Update ready, restart to apply") };
     }
     if (updateProgress.phase === "error") {
-      // One line: an error that carries a stack or a command's output must not grow the header.
-      const error = (updateProgress.error ?? "Unknown error").replace(/\s+/g, " ").trim();
+      // The reason in a few words; the whole error is in the command bar's Check
+      // for Updates and the log. An error without one (from an older desktop
+      // process) is shown on one line: a stack or a command's output must not
+      // grow the header.
+      const error = updateProgress.failure
+        ? t(updateFailureReason(updateProgress.failure))
+        : (updateProgress.error ?? "Unknown error").replace(/\s+/g, " ").trim();
       return {
         kind: "failed",
         message: tf("Update failed: {error}", { error }),
@@ -411,24 +424,16 @@ function resolveUpdateStatusView({
 }
 
 /**
- * What the header says about an update. The terminal cuts it to `columns`,
- * the room its slot is guaranteed; the desktop and the web let the browser fit
- * it to the room the bar leaves (NativeUpdateStatus). Either way it never runs
- * into the Help pill or the market cluster beside it.
+ * What the header says about an update, and the key that acts on it (Restart
+ * for a downloaded update, retry for a failed one). A passing notice goes
+ * after its time.
  */
-function UpdateStatus({ columns, onRestart, trailingGap = false }: {
-  columns: number;
-  onRestart?: () => void;
-  /** The desktop title bar keeps a gap after the status as well as before it. */
-  trailingGap?: boolean;
-}) {
-  const { nativePaneChrome = false } = useUiCapabilities();
+function useUpdateStatus(canRestart: boolean): { view: UpdateStatusView | null; updateKey: string } {
   const dispatch = useAppDispatch();
   const updateAvailable = useAppSelector((state) => state.updateAvailable);
   const updateProgress = useAppSelector((state) => state.updateProgress);
   const updateCheckInProgress = useAppSelector((state) => state.updateCheckInProgress);
   const updateNotice = useAppSelector((state) => state.updateNotice);
-  // One key: Restart for a downloaded update, retry for a failed one.
   const updateKey = useActionShortcut("install-update");
 
   useEffect(() => {
@@ -440,12 +445,65 @@ function UpdateStatus({ columns, onRestart, trailingGap = false }: {
   }, [dispatch, updateAvailable, updateCheckInProgress, updateNotice, updateProgress]);
 
   const view = resolveUpdateStatusView({
-    canRestart: !!onRestart,
+    canRestart,
     updateAvailable,
     updateCheckInProgress,
     updateNotice,
     updateProgress,
   });
+  return { view, updateKey };
+}
+
+/** The retry key after a failed update's message, when there is something to retry. */
+function retryHint(view: Extract<UpdateStatusView, { kind: "failed" }>, updateKey: string): string {
+  return updateKey && view.retry ? `  ${updateKey} ${t("retry")}` : "";
+}
+
+/**
+ * Columns the terminal status takes when nothing is cut: the header gives the
+ * slot that much from the closed prompt's empty room before it cuts anything.
+ */
+function terminalUpdateStatusColumns(view: UpdateStatusView, updateKey: string): number {
+  return UPDATE_STATUS_GAP_COLUMNS + terminalUpdateStatusContentColumns(view, updateKey);
+}
+
+function terminalUpdateStatusContentColumns(view: UpdateStatusView, updateKey: string): number {
+  switch (view.kind) {
+    case "busy":
+      return 2 + displayWidth(view.text);
+    case "restart":
+      return displayWidth(view.text) + 1 + terminalButtonColumns({ label: "Restart", shortcut: updateKey || undefined, compact: true });
+    case "failed":
+      return displayWidth(view.message) + displayWidth(retryHint(view, updateKey));
+    case "text":
+      return displayWidth(view.text);
+  }
+}
+
+/**
+ * The narrowest the closed terminal prompt goes to make room for an update's
+ * status: its caret and the whole placeholder, which sells the command bar to
+ * a first-time user, without the key hint (resolveHeaderPromptContent).
+ */
+function terminalClosedPromptFloor(): number {
+  return 2 + PROMPT_CARET.length + t("Search or run a command").length;
+}
+
+/**
+ * What the header says about an update. The terminal cuts it to `columns`,
+ * the room its slot is guaranteed; the desktop and the web let the browser fit
+ * it to the room the bar leaves (NativeUpdateStatus). Either way it never runs
+ * into the Help pill or the market cluster beside it.
+ */
+function UpdateStatus({ columns, onRestart, status, trailingGap = false }: {
+  columns: number;
+  onRestart?: () => void;
+  status: { view: UpdateStatusView | null; updateKey: string };
+  /** The desktop title bar keeps a gap after the status as well as before it. */
+  trailingGap?: boolean;
+}) {
+  const { nativePaneChrome = false } = useUiCapabilities();
+  const { view, updateKey } = status;
   if (!view) return null;
   return nativePaneChrome
     ? <NativeUpdateStatus view={view} onRestart={onRestart} trailingGap={trailingGap} updateKey={updateKey} />
@@ -458,39 +516,115 @@ function TerminalUpdateStatus({ columns, onRestart, updateKey, view }: {
   updateKey: string;
   view: UpdateStatusView;
 }) {
-  const colors = useThemeColors();
+  const content = terminalUpdateStatusContent({ room: columns - UPDATE_STATUS_GAP_COLUMNS, onRestart, updateKey, view });
+  if (!content) return null;
+  return (
+    <Box flexDirection="row" overflow="hidden" paddingRight={UPDATE_STATUS_GAP_COLUMNS}>
+      {content}
+    </Box>
+  );
+}
+
+/** The status cut to `room` columns, or null when nothing of it would read. */
+function terminalUpdateStatusContent({ onRestart, room, updateKey, view }: {
+  onRestart?: () => void;
+  room: number;
+  updateKey: string;
+  view: UpdateStatusView;
+}): ReactNode {
   if (view.kind === "busy") {
-    return (
-      <Box flexDirection="row" gap={1}>
-        <SpinnerMark name="dots" color={colors.headerText} />
-        <Text fg={colors.headerText}>{view.text}</Text>
-      </Box>
-    );
+    // The spinner and a cell after it, then the words, cut to what is left.
+    if (room < 2 + UPDATE_TEXT_MIN_COLUMNS) return null;
+    return <TerminalBusyStatus text={fitStatusParts(view.parts, room - 2)} />;
   }
   if (view.kind === "restart") {
-    return (
-      <Box flexDirection="row" gap={1} alignItems="center">
-        <Text fg={colors.headerText}>{view.text}</Text>
-        <Button compact label="Restart" shortcut={updateKey || undefined} onPress={onRestart} stopPropagation />
-      </Box>
-    );
+    // The button stays when the words do not fit beside it.
+    const buttonColumns = terminalButtonColumns({ label: "Restart", shortcut: updateKey || undefined, compact: true });
+    if (room < buttonColumns) return null;
+    const showText = displayWidth(view.text) + 1 + buttonColumns <= room;
+    return <TerminalRestartStatus text={showText ? view.text : null} onRestart={onRestart} updateKey={updateKey} />;
   }
   if (view.kind === "failed") {
-    const hint = updateKey && view.retry ? `  ${updateKey} ${t("retry")}` : "";
+    const hint = retryHint(view, updateKey);
     const hintColumns = displayWidth(hint);
-    // The message goes first, and keeps its room before the hint takes any.
-    const room = columns - UPDATE_ERROR_GAP_COLUMNS;
-    const showHint = hintColumns > 0 && room - hintColumns >= UPDATE_ERROR_MIN_COLUMNS;
-    const messageColumns = room - (showHint ? hintColumns : 0);
-    if (messageColumns < UPDATE_ERROR_MIN_COLUMNS) return null;
-    return (
-      <Box flexDirection="row" overflow="hidden" paddingRight={UPDATE_ERROR_GAP_COLUMNS}>
-        <ClippedText fg={colors.headerText} text={view.message} width={messageColumns} />
-        {showHint ? <Text fg={blendHex(colors.headerText, colors.header, 0.62)}>{hint}</Text> : null}
-      </Box>
-    );
+    const messageColumns = displayWidth(view.message);
+    const short = t(UPDATE_FAILED_SHORT);
+    const reasonRoom = room - displayWidth(view.parts[0]?.cut === false ? view.parts[0].text : "");
+    // The whole message with its key, then the message alone, then as much of
+    // the reason as reads, then "Update failed" with its key; never less.
+    let text: string;
+    let showHint = false;
+    if (messageColumns + hintColumns <= room) {
+      text = view.message;
+      showHint = hintColumns > 0;
+    } else if (messageColumns <= room) {
+      text = view.message;
+    } else if (reasonRoom >= UPDATE_REASON_MIN_COLUMNS) {
+      text = truncateToDisplayWidth(view.message, room);
+    } else if (displayWidth(short) + hintColumns <= room) {
+      text = short;
+      showHint = hintColumns > 0;
+    } else if (room >= UPDATE_ERROR_MIN_COLUMNS) {
+      text = truncateToDisplayWidth(short, room);
+    } else {
+      return null;
+    }
+    return <TerminalFailedStatus text={text} hint={showHint ? hint : ""} />;
   }
-  return <Text fg={colors.headerText}>{view.text}</Text>;
+  // A notice or a line about the update: cut to the slot, never past it.
+  if (room < UPDATE_TEXT_MIN_COLUMNS) return null;
+  return <TerminalTextStatus text={view.text} width={room} />;
+}
+
+/**
+ * A status line in `width` columns: the pieces that stay whole (a download's
+ * percent) keep their room, and the rest is cut to what they leave.
+ */
+function fitStatusParts(parts: StatusPart[], width: number): string {
+  const whole = parts.reduce((total, part) => total + (part.cut ? 0 : displayWidth(part.text)), 0);
+  const cutRoom = Math.max(0, width - whole);
+  const cutTotal = parts.reduce((total, part) => total + (part.cut ? displayWidth(part.text) : 0), 0);
+  if (cutTotal <= cutRoom) return parts.map((part) => part.text).join("");
+  // A cut piece keeps a space before the whole one after it: "Downloading v... 42%".
+  const cut = (part: StatusPart, index: number) => index < parts.length - 1
+    ? `${truncateToDisplayWidth(part.text.trimEnd(), Math.max(0, cutRoom - 1))} `
+    : truncateToDisplayWidth(part.text, cutRoom);
+  return truncateToDisplayWidth(parts.map((part, index) => (part.cut ? cut(part, index) : part.text)).join(""), width);
+}
+
+function TerminalBusyStatus({ text }: { text: string }) {
+  const colors = useThemeColors();
+  return (
+    <Box flexDirection="row" gap={1}>
+      <SpinnerMark name="dots" color={colors.headerText} />
+      <Text fg={colors.headerText}>{text}</Text>
+    </Box>
+  );
+}
+
+function TerminalRestartStatus({ onRestart, text, updateKey }: { onRestart?: () => void; text: string | null; updateKey: string }) {
+  const colors = useThemeColors();
+  return (
+    <Box flexDirection="row" gap={1} alignItems="center">
+      {text ? <Text fg={colors.headerText}>{text}</Text> : null}
+      <Button compact label="Restart" shortcut={updateKey || undefined} onPress={onRestart} stopPropagation />
+    </Box>
+  );
+}
+
+function TerminalFailedStatus({ hint, text }: { hint: string; text: string }) {
+  const colors = useThemeColors();
+  return (
+    <>
+      <Text fg={colors.headerText}>{text}</Text>
+      {hint ? <Text fg={blendHex(colors.headerText, colors.header, 0.62)}>{hint}</Text> : null}
+    </>
+  );
+}
+
+function TerminalTextStatus({ text, width }: { text: string; width: number }) {
+  const colors = useThemeColors();
+  return <ClippedText fg={colors.headerText} text={text} width={width} />;
 }
 
 /**
@@ -510,6 +644,23 @@ function nativeCutTextStyle(alone: boolean) {
     maxWidth: "max-content",
   } as const;
 }
+/**
+ * A failed update's reason on the desktop: whole when the line has room for it,
+ * so the retry key after it moves to the hidden line first; never wider than
+ * what the words before it leave, so when even that is too little it stays on
+ * the line and ends in an ellipsis instead of leaving with the key.
+ */
+function nativeReasonStyle(leadColumns: number) {
+  return {
+    ...NATIVE_CLIP_STYLE,
+    flexGrow: 0,
+    flexShrink: 1,
+    flexBasis: "auto",
+    minWidth: `${NATIVE_STATUS_PIECE_MIN_CH}ch`,
+    maxWidth: `calc(100% - ${leadColumns}ch)`,
+  } as const;
+}
+
 /** One cell between the parts of the desktop status, as `gap={1}` puts it in the terminal. */
 const NATIVE_STATUS_GAP = "var(--cell-w)";
 
@@ -597,12 +748,16 @@ function NativeUpdateStatus({ onRestart, trailingGap, updateKey, view }: {
     );
   }
   if (view.kind === "failed") {
-    // The words that say it failed, then as much of the error as reads, then the retry key.
-    const hint = updateKey && view.retry ? `  ${updateKey} ${t("retry")}` : "";
-    const alone = view.parts.every((part) => part.cut);
+    // The words that say it failed, then the reason, then the retry key, which
+    // gives way first, as in the terminal: the reason is cut only once the key
+    // is gone and it still does not fit (nativeReasonStyle).
+    const hint = retryHint(view, updateKey);
+    const lead = view.parts.reduce((total, part) => total + (part.cut ? 0 : displayWidth(part.text)), 0);
     return (
       <NativeStatusRow trailingGap={trailingGap}>
-        {view.parts.map((part, index) => nativeStatusPiece(part, index, { alone, color, title: view.message }))}
+        {view.parts.map((part, index) => part.cut
+          ? <Text key={index} fg={color} title={view.message} style={nativeReasonStyle(lead)}>{part.text}</Text>
+          : nativeStatusPiece(part, index, { alone: false, color, title: view.message }))}
         {hint ? <Text fg={colors.textMuted}>{hint}</Text> : null}
       </NativeStatusRow>
     );
@@ -698,14 +853,32 @@ export function Header({
     windowFullscreen,
   });
   const shortcutLabel = useCommandBarShortcut();
+  const updateStatus = useUpdateStatus(!!onRestartForUpdate);
   // The terminal lays the header out by cell counts, so it works out what is left
   // for the update status once the Help pill and the slot's padding are paid for.
-  const updateStatusColumns = Math.max(
+  let updateStatusColumns = Math.max(
     0,
     prompt.updateColumns
       - (onOpenHelp ? terminalButtonColumns(helpButtonProps()) + TERMINAL_HELP_PADDING_COLUMNS : 0)
       - UPDATE_SLOT_PADDING_COLUMNS * (titleBarOverlay ? 2 : 1),
   );
+  // Short of that, the closed prompt gives the status its empty room, down to
+  // its placeholder, as the desktop's does: at 80 to 160 columns the slot alone
+  // is too narrow to say anything. Open, the prompt is the command bar's input
+  // and keeps its width.
+  // The prompt's own right padding then stands for one of the slot's.
+  let promptWidth = prompt.width;
+  let terminalSlotPadding = UPDATE_SLOT_PADDING_COLUMNS;
+  if (!nativePaneChrome && !commandBarOpen && updateStatus.view) {
+    const need = terminalUpdateStatusColumns(updateStatus.view, updateStatus.updateKey);
+    if (need > updateStatusColumns) {
+      const spare = Math.max(0, prompt.width - terminalClosedPromptFloor());
+      const given = Math.min(need - updateStatusColumns - 1, spare);
+      promptWidth -= Math.max(0, given);
+      terminalSlotPadding -= 1;
+      updateStatusColumns += 1 + Math.max(0, given);
+    }
+  }
   // Desktop has its own window chrome to sit on; the terminal has none, so the
   // bar itself wears the prompt's fill and reads as a single strip.
   const headerBg = nativePaneChrome ? colors.header : headerSurface(colors);
@@ -727,7 +900,7 @@ export function Header({
       onOpen={openCommandBar}
       open={commandBarOpen}
       shortcutLabel={shortcutLabel}
-      width={prompt.width}
+      width={promptWidth}
     />
   );
   const marketSummary = prompt.marketColumns > 0
@@ -748,7 +921,7 @@ export function Header({
       data-gloom-role="header-update-status"
       style={{ alignSelf: "stretch" }}
     >
-      <UpdateStatus columns={updateStatusColumns} onRestart={onRestartForUpdate} trailingGap={!!titleBarOverlay} />
+      <UpdateStatus columns={updateStatusColumns} onRestart={onRestartForUpdate} status={updateStatus} trailingGap={!!titleBarOverlay} />
     </Box>
   ) : null;
 
@@ -771,8 +944,8 @@ export function Header({
         <Box width={prompt.left} />
         {commandPrompt}
         {nativeUpdateSlot ?? (
-          <Box flexGrow={1} paddingLeft={UPDATE_SLOT_PADDING_COLUMNS} paddingRight={UPDATE_SLOT_PADDING_COLUMNS} minWidth={0}>
-            <UpdateStatus columns={updateStatusColumns} onRestart={onRestartForUpdate} />
+          <Box flexGrow={1} paddingLeft={terminalSlotPadding} paddingRight={UPDATE_SLOT_PADDING_COLUMNS} minWidth={0}>
+            <UpdateStatus columns={updateStatusColumns} onRestart={onRestartForUpdate} status={updateStatus} />
           </Box>
         )}
         {onOpenHelp ? <HeaderHelpButton nativePaneChrome onPress={onOpenHelp} /> : null}
@@ -795,8 +968,8 @@ export function Header({
       <Box width={prompt.left} />
       {commandPrompt}
       {nativeUpdateSlot ?? (
-        <Box flexGrow={1} minWidth={0} paddingLeft={UPDATE_SLOT_PADDING_COLUMNS}>
-          <UpdateStatus columns={updateStatusColumns} onRestart={onRestartForUpdate} />
+        <Box flexGrow={1} minWidth={0} paddingLeft={terminalSlotPadding}>
+          <UpdateStatus columns={updateStatusColumns} onRestart={onRestartForUpdate} status={updateStatus} />
         </Box>
       )}
       {onOpenHelp ? <HeaderHelpButton nativePaneChrome={nativePaneChrome} onPress={onOpenHelp} /> : null}

package/src/components/layout/pane/header.tsx

@@ -10,7 +10,6 @@ import type { PaneHeaderTabsRegistration } from "./header-tabs";
 import { nativePaneHeaderRows } from "./sizing";
 
 const PANE_HEADER_HEIGHT = 1;
-/** Space above desktop title-bar tabs, in px. */
 const PANE_HEADER_GRIP = ":: ";
 export const PANE_HEADER_ACTION = " ... ";
 /** The pane's docs: the same width shown or blank, so the title never shifts. */
@@ -38,6 +37,8 @@ interface PaneHeaderProps {
   quickSettings?: PaneHeaderQuickSetting[];
   /** Desktop only: the pane's primary tab strip, drawn as title-bar tabs. */
   tabs?: PaneHeaderTabsRegistration | null;
+  /** The body colour the active title-bar tab opens into. */
+  bodyBackground?: string;
   /**
    * Desktop: a 1px line is drawn over the header's first row (a dock divider
    * above it, or a floating pane's border). The header mirrors it with padding
@@ -131,6 +132,7 @@ export function PaneHeader({
   showActions = false,
   quickSettings = [],
   tabs = null,
+  bodyBackground,
   topRule = false,
   titleBar = null,
   onHeaderMouseMove,
@@ -262,9 +264,14 @@ export function PaneHeader({
               marginTop: -topInset,
               marginBottom: -1,
               marginLeft: "var(--gloom-space-sm)",
-              // Undoes the negative top margin for controls centred in the
-              // strip (the overflow chevron).
+              // Undoes the negative top margin for what is centred in the strip:
+              // the overflow chevron, and the tab labels (styles.css).
               "--pane-tab-top-inset": `${topInset}px`,
+              // The active tab's box opens into the pane over the bottom rule
+              // (styles.css), drawn in the rule's colour so the two are one line.
+              "--pane-tab-border": ruleColor,
+              // Until the strip has measured the surface under the tab (top-surface.ts).
+              "--pane-tab-active-bg": bodyBackground ?? colors.bg,
               // The active tab reads as active whenever the pane is focused, even
               // while a detail or field inside the pane owns the keyboard.
               "--pane-tab-active-fg": visuallyFocused ? colors.textBright : colors.text,

package/src/components/layout/pane/index.tsx

@@ -119,6 +119,7 @@ export function PaneWrapper({
           showActions={showActions}
           quickSettings={quickSettings}
           tabs={headerTabs}
+          bodyBackground={bg}
           topRule={topRule}
           onHeaderMouseMove={onHeaderMouseMove}
           onHeaderMouseDown={onHeaderMouseDown}

package/src/components/layout/pane/pane-tabs.tsx

@@ -25,7 +25,15 @@ export interface PaneTabs {
  * A pane's primary tab strip in one call. It registers the strip with the
  * chrome, which draws it in the desktop title bar, and otherwise returns the
  * row the body draws first, so the tabs are described once. Call it above any
- * early return, and pass null while the pane has no strip (a sign-in wall).
+ * early return, and draw `strip` above every body state, loading and error
+ * included.
+ *
+ * The strip is chrome: it is there from the first frame and stays while a tab,
+ * a filter or a refresh loads, fails or comes back empty, so switching never
+ * takes it away. Pass null only while there is nothing to choose between: a
+ * sign-in or plan wall, no ticker or portfolio yet, a detail that replaces the
+ * tabs by design. A conditional call is listed with its reason in
+ * `src/architecture/pane-tabs-allowlist.json`.
  */
 export function usePaneTabs(options: PaneTabsOptions | null): PaneTabs {
   const inHeader = usePaneHeaderTabs(options);

package/src/components/ui/stat-grid.tsx

@@ -28,6 +28,13 @@ export interface StatItem {
   label: string;
   value: string;
   detail?: string;
+  /**
+   * Shorter forms of `detail`, longest first (an empty one shows none). The
+   * grid sizes its columns by the shortest, so a detail that grows with the
+   * data (a stamp outside regular hours) never takes a column from the band,
+   * and shows the longest form that fits the cell.
+   */
+  detailVariants?: readonly string[];
   tone?: StatTone;
   /** A domain colour (a price change, a series). Wins over `tone`. */
   color?: string;
@@ -55,9 +62,22 @@ function labelChars(items: StatItem[]): number {
   return Math.min(MAX_LABEL_CHARS, Math.max(4, ...items.map((item) => displayWidth(t(item.label)))));
 }
 
+/** The form of the detail the columns are sized by: the shortest. */
+function sizingDetail(item: StatItem): string | undefined {
+  return item.detailVariants?.length ? item.detailVariants[item.detailVariants.length - 1] : item.detail;
+}
+
+/** The longest form of a cell's detail that fits `room` cells, else its shortest. */
+function fittingStatDetail(item: Pick<StatItem, "detail" | "detailVariants">, room: number): string | undefined {
+  if (!item.detail || !item.detailVariants?.length) return item.detail;
+  const forms = [item.detail, ...item.detailVariants];
+  return forms.find((form) => displayWidth(form) <= room) ?? forms[forms.length - 1];
+}
+
 function naturalWidth(item: StatItem, labels: number): number {
   // A split bar takes the room the cell has left and is not counted here.
-  const detail = item.detail ? displayWidth(item.detail) + 2 : 0;
+  const sized = sizingDetail(item);
+  const detail = sized ? displayWidth(sized) + 2 : 0;
   return labels + 1 + displayWidth(item.value) + detail + CELL_GAP;
 }
 
@@ -132,9 +152,14 @@ export function StatGrid({ items, width, columns: columnsProp }: StatGridProps)
             const barRoom = valueWidth - displayWidth(value) - 1;
             const barCells = !item.split ? 0 : nativePaneChrome ? SPLIT_BAR_CELLS : barRoom >= 4 ? Math.min(SPLIT_BAR_CELLS, barRoom) : 0;
             const detailWidth = valueWidth - displayWidth(value) - (barCells ? barCells + 1 : 0) - 2;
-            const detail = !item.detail
+            // The desktop cell has no gap between cells: its label column, inset and gaps take the room
+            // (measured short, as a cell is wider than a character, so a form that fits is never clipped).
+            const shownDetail = fittingStatDetail(item, nativePaneChrome
+              ? width + (item.wide ? 0 : CELL_GAP) - labels - displayWidth(value) - (barCells ? barCells + 1 : 0) - 4
+              : detailWidth);
+            const detail = !shownDetail
               ? ""
-              : nativePaneChrome ? item.detail : detailWidth > 1 ? truncateToDisplayWidth(item.detail, detailWidth) : "";
+              : nativePaneChrome ? shownDetail : detailWidth > 1 ? truncateToDisplayWidth(shownDetail, detailWidth) : "";
             return (
               <Box
                 key={item.id ?? `${rowIndex}:${index}`}

package/src/components/ui/status.tsx

@@ -334,7 +334,9 @@ export function PaneStatusBody({
         <EmptyStateBody
           status={status}
           title={status === "error" ? errorTitle ?? (subject ? unavailableText(subject) : error!) : emptyTitle ?? t("Nothing to show yet.")}
-          message={status === "error" ? (errorTitle || subject ? error! : undefined) : emptyMessage}
+          message={status === "error"
+            ? ((errorTitle || subject) && error && error !== (errorTitle ?? unavailableText(subject!)) ? error : undefined)
+            : emptyMessage}
           actions={actions}
           retry={retry}
           feedback={feedback}

package/src/core/app-services.ts

@@ -26,6 +26,10 @@ export function createAppServices({ config, plugins, externalPlugins }: AppServi
           name: "News",
           provider: {
             fetchNews: async (query) => (await newsService.load(query)).articles,
+            fetchNewsPage: async (query) => {
+              const { articles, error, nextCursor } = await newsService.load(query);
+              return { articles, error, nextCursor };
+            },
             getCachedNews: (query) => newsService.getQueryState(query).articles,
           },
         }),

package/src/i18n/es.ts

@@ -1006,6 +1006,28 @@ export const es: Record<string, string> = {
   "Checking for updates...": "Buscando actualizaciones...",
   "Downloading v{version}: {percent}%": "Descargando v{version}: {percent}%",
   "Update failed: {error}": "Error al actualizar: {error}",
+  "Update failed": "Error al actualizar",
+  "Update check failed: {reason}": "Error al buscar actualizaciones: {reason}",
+  "no connection": "sin conexión",
+  "connection timed out": "se agotó el tiempo de conexión",
+  "GitHub rate limit": "límite de GitHub",
+  "release server error": "error del servidor de versiones",
+  "unreadable release data": "datos de versión ilegibles",
+  "no build for this system": "no hay versión para este sistema",
+  "download interrupted": "descarga interrumpida",
+  "download corrupted": "descarga dañada",
+  "no permission to replace the app": "sin permiso para reemplazar la app",
+  "move the app to Applications": "mueve la app a Aplicaciones",
+  "app and update on different disks": "la app y la actualización están en discos distintos",
+  "install folder is read-only": "la carpeta de instalación es de solo lectura",
+  "disk full": "disco lleno",
+  "app files in use": "archivos de la app en uso",
+  "downloaded update missing": "falta la actualización descargada",
+  "check failed": "falló la búsqueda",
+  "download failed": "falló la descarga",
+  "could not verify the download": "no se pudo verificar la descarga",
+  "could not install": "no se pudo instalar",
+  "could not restart": "no se pudo reiniciar",
   "v{version} available — run {command}": "v{version} disponible — ejecuta {command}",
   "v{version} available, update through the package manager that installed Gloomberb": "v{version} disponible, actualiza con el gestor de paquetes que instaló Gloomberb",
   "v{version} available — starting download...": "v{version} disponible — iniciando descarga...",

package/src/i18n/ja.ts

@@ -1020,6 +1020,28 @@ export const ja: Record<string, string> = {
   "Checking for updates...": "アップデートを確認中...",
   "Downloading v{version}: {percent}%": "v{version} をダウンロード中: {percent}%",
   "Update failed: {error}": "更新に失敗しました: {error}",
+  "Update failed": "更新に失敗しました",
+  "Update check failed: {reason}": "アップデートの確認に失敗しました: {reason}",
+  "no connection": "接続がありません",
+  "connection timed out": "接続がタイムアウトしました",
+  "GitHub rate limit": "GitHub のレート制限",
+  "release server error": "リリースサーバーのエラー",
+  "unreadable release data": "リリース情報を読み取れません",
+  "no build for this system": "このシステム向けのビルドがありません",
+  "download interrupted": "ダウンロードが中断されました",
+  "download corrupted": "ダウンロードが破損しています",
+  "no permission to replace the app": "アプリを置き換える権限がありません",
+  "move the app to Applications": "アプリをアプリケーションフォルダに移動してください",
+  "app and update on different disks": "アプリとアップデートが別のディスクにあります",
+  "install folder is read-only": "インストール先が読み取り専用です",
+  "disk full": "ディスクがいっぱいです",
+  "app files in use": "アプリのファイルが使用中です",
+  "downloaded update missing": "ダウンロードした更新が見つかりません",
+  "check failed": "確認に失敗しました",
+  "download failed": "ダウンロードに失敗しました",
+  "could not verify the download": "ダウンロードを検証できません",
+  "could not install": "インストールできません",
+  "could not restart": "再起動できません",
   "v{version} available — run {command}": "v{version} が利用可能 — {command} を実行",
   "v{version} available, update through the package manager that installed Gloomberb": "v{version} が利用可能です。Gloomberb をインストールしたパッケージマネージャーで更新してください",
   "v{version} available — starting download...": "v{version} が利用可能 — ダウンロードを開始しています...",

package/src/i18n/ko.ts

@@ -1018,6 +1018,28 @@ export const ko: Record<string, string> = {
   "Checking for updates...": "업데이트 확인 중...",
   "Downloading v{version}: {percent}%": "v{version} 다운로드 중: {percent}%",
   "Update failed: {error}": "업데이트 실패: {error}",
+  "Update failed": "업데이트 실패",
+  "Update check failed: {reason}": "업데이트 확인 실패: {reason}",
+  "no connection": "연결 없음",
+  "connection timed out": "연결 시간 초과",
+  "GitHub rate limit": "GitHub 요청 한도",
+  "release server error": "릴리스 서버 오류",
+  "unreadable release data": "릴리스 정보를 읽을 수 없음",
+  "no build for this system": "이 시스템용 빌드 없음",
+  "download interrupted": "다운로드 중단됨",
+  "download corrupted": "다운로드 손상됨",
+  "no permission to replace the app": "앱을 교체할 권한 없음",
+  "move the app to Applications": "앱을 응용 프로그램 폴더로 옮기세요",
+  "app and update on different disks": "앱과 업데이트가 서로 다른 디스크에 있습니다",
+  "install folder is read-only": "설치 폴더가 읽기 전용임",
+  "disk full": "디스크 공간 부족",
+  "app files in use": "앱 파일이 사용 중임",
+  "downloaded update missing": "다운로드한 업데이트 없음",
+  "check failed": "확인 실패",
+  "download failed": "다운로드 실패",
+  "could not verify the download": "다운로드를 확인할 수 없음",
+  "could not install": "설치할 수 없음",
+  "could not restart": "다시 시작할 수 없음",
   "v{version} available — run {command}": "v{version} 사용 가능 — {command} 실행",
   "v{version} available, update through the package manager that installed Gloomberb": "v{version} 사용 가능, Gloomberb를 설치한 패키지 관리자로 업데이트하세요",
   "v{version} available — starting download...": "v{version} 사용 가능 — 다운로드 시작 중...",