From 8a44451c72b59e4cd32efe3946240134909a0580 Mon Sep 17 00:00:00 2001 From: ajnart Date: Fri, 14 Aug 2026 03:45:03 +0200 Subject: [PATCH] docs: simplify advanced view guidance --- .../advanced/keyboard-shortcuts/index.mdx | 8 ++- .../src/components/widgets/interactions.tsx | 65 ++----------------- 2 files changed, 10 insertions(+), 63 deletions(-) diff --git a/apps/docs/docs/advanced/keyboard-shortcuts/index.mdx b/apps/docs/docs/advanced/keyboard-shortcuts/index.mdx index eeec4ee6d..30b61fcf6 100644 --- a/apps/docs/docs/advanced/keyboard-shortcuts/index.mdx +++ b/apps/docs/docs/advanced/keyboard-shortcuts/index.mdx @@ -15,6 +15,11 @@ Homarr has the following keyboard shortcuts: | `Shift` + `Enter` on a supported widget | Opens its advanced view until it is closed | | `Esc` | Stops keyboard tile editing, cancels an active pointer or touch move/resize, or closes an open advanced view or board menu | +## Widget advanced view + +Supported widgets open a temporary advanced view when you hold `Shift` over them for 500 ms. Focus a widget and press +`Shift` + `Enter`, or use its menu, to keep the advanced view open. + ## Board editing `MOD` + `E` enters edit mode. Homarr keeps the current board visible while the editor prepares; movement and resizing become available when it is ready. @@ -51,9 +56,6 @@ Commands at a grid boundary or at the tile's minimum size are ignored and announ Here `MOD` refers to the modifier key, which is `Ctrl` on Windows and `Cmd` on macOS. -Advanced view is available outside edit mode. Widgets without a distinct advanced experience adapt to their normal -dimensions instead. A progress ring follows the pointer while the temporary advanced view is preparing to open. - ::: :::note diff --git a/apps/docs/src/components/widgets/interactions.tsx b/apps/docs/src/components/widgets/interactions.tsx index 14fdbf0ee..90480523a 100644 --- a/apps/docs/src/components/widgets/interactions.tsx +++ b/apps/docs/src/components/widgets/interactions.tsx @@ -1,65 +1,10 @@ -import { IconArrowsMaximize, IconLayoutGrid, IconMouse2, IconRefresh } from "@tabler/icons-react"; - -const advancedInteraction = { - icon: IconArrowsMaximize, - title: "Advanced view", - description: - "Supported widgets explicitly opt into advanced view. Focus a widget and press Shift + Enter, hold Shift while hovering for about 500 ms, or choose Open advanced view from its menu. It is unavailable in edit mode and remains compact-only on widgets that do not opt in.", -} as const; - -const standardInteractions = [ - { - icon: IconMouse2, - title: "Widget actions", - description: - "Signed-in users can open the widget context menu outside edit mode when Enable right click on widgets is enabled. App tiles are excluded. Settings, quick options, and integration actions appear or enable only when the widget and your board or integration permissions allow them.", - }, - { - icon: IconLayoutGrid, - title: "Adaptive detail", - description: - "Resize a widget to tune its density. Compact layouts hide lower-priority details and controls as space shrinks; compact-only widgets adapt in place instead of opening a separate advanced view.", - }, - { - icon: IconRefresh, - title: "Data status", - description: - "Widgets distinguish initial loading, successful empty results, terminal errors, stale cached data, and partial integration failures as applicable. Initial loads use a loading state, empty results use an empty state, and terminal failures can offer retry; retained data can stay visible with a stale warning, while healthy integrations can remain visible when another source fails. The shared menu reports Loading while matching active queries fetch, Idle when none are active, Error when any match is in error, otherwise Success with the latest data age when available. Refresh refetches only active queries owned by that widget and view and is disabled while they fetch.", - }, -] as const; - export const WidgetInteractionGuide = ({ advancedView = true }: { advancedView?: boolean }) => { - const interactions = advancedView ? [advancedInteraction, ...standardInteractions] : standardInteractions; + if (!advancedView) return null; return ( -
- - Power-user controls - Show controls - - Hide controls - - -
- {interactions.map(({ icon: Icon, title, description }) => ( -
- -
{title}
-

{description}

-
- ))} -
- {advancedView && ( -

- Advanced view reuses existing data where possible; some widgets request additional or denser data. Hold Shift - while hovering a supported widget for a temporary preview; it opens after about 500 ms and closes when Shift - is released, the pointer leaves, or the window loses focus. For a persistent view, focus the widget and press - Shift + Enter or use Open advanced view from its menu. Manual view closes with Escape after nested menus or - popovers handle their own Escape, its close button, or the backdrop; it restores focus, traps focus, and locks - background scrolling. Shift + wheel scrolls a scrollable advanced panel when it can consume the event. On - touch devices, use the widget menu when available; compact-only widgets adapt in place instead. -

- )} -
+

+ Supports advanced view. See the{" "} + advanced keyboard shortcuts. +

); };