merge dev into v2
This commit is contained in:
396 files changed
+56438
-26777
No files matched your search
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: "Audio Stats"
|
||||
description: "Displays library statistics from Navidrome or Audiobookshelf, adapting its display based on the linked integration."
|
||||
description: "Displays media and listening statistics from Navidrome or Audiobookshelf, adapting its display based on the linked integration."
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
@@ -16,7 +16,7 @@ import { audiobookshelfIntegration } from "@site/docs/integrations/audiobookshel
|
||||
|
||||
This widget adapts its display based on the linked integration:
|
||||
|
||||
- **Navidrome**: Shows artist, album, and song counts, plus a now playing section with active streams
|
||||
- **Navidrome**: Shows artist, album, and song counts
|
||||
- **Audiobookshelf**: Shows library count, audiobook/podcast totals, listening time, and active sessions
|
||||
|
||||
Only options relevant to your linked integration are shown in the configuration panel.
|
||||
@@ -27,7 +27,7 @@ Only options relevant to your linked integration are shown in the configuration
|
||||
items={[
|
||||
{
|
||||
integration: navidromeIntegration,
|
||||
note: "Displays music library stats and now playing",
|
||||
note: "Displays music library statistics",
|
||||
},
|
||||
{
|
||||
integration: audiobookshelfIntegration,
|
||||
|
||||
@@ -27,24 +27,6 @@ export const audioStatsWidget: WidgetDefinition = {
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "yes",
|
||||
},
|
||||
{
|
||||
name: "Show now playing",
|
||||
description: "Displays currently playing tracks (Navidrome only)",
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "yes",
|
||||
},
|
||||
{
|
||||
name: "Show now playing list",
|
||||
description: "Displays a detailed list of now playing tracks (Navidrome only)",
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "yes",
|
||||
},
|
||||
{
|
||||
name: "Max now playing items",
|
||||
description: "Maximum number of now playing tracks to display (Navidrome only)",
|
||||
values: "Number (1-5)",
|
||||
defaultValue: "3",
|
||||
},
|
||||
{
|
||||
name: "Show library count",
|
||||
description: "Displays the number of libraries (Audiobookshelf only)",
|
||||
|
||||
@@ -15,7 +15,7 @@ import beszelSystemStats from "./img/beszel-system-stats.png";
|
||||
|
||||
<WidgetHeader widget={beszelSystemStatsWidget} categories={["System Monitoring", "Charts"]} />
|
||||
|
||||
This widget displays time-series charts for a selected Beszel system, including CPU, memory, disk, network, and Docker container metrics. The Disk Usage chart combines the root disk and every extra filesystem reported by Beszel. You can use the realtime Live view or select a historical period ranging from 1 hour to 30 days. If the live stream drops, the widget now shows the connection failure state immediately and can switch back to historical data.
|
||||
This widget displays time-series charts for a selected Beszel system, including CPU, memory, disk, network, and Docker container metrics. The Disk Usage chart combines the root disk and every extra filesystem reported by Beszel. You can use the realtime Live view or select a historical period ranging from 1 hour to 30 days. Live view keeps a one-minute window and pauses while the browser tab is hidden. If the live stream drops, the widget now shows the connection failure state immediately and can switch back to historical data.
|
||||
|
||||
### Screenshots
|
||||
|
||||
|
||||
@@ -13,10 +13,17 @@ import { beszelIntegration } from "@site/docs/integrations/beszel";
|
||||
|
||||
<WidgetHeader widget={beszelSystemTableWidget} categories={["System Monitoring"]} />
|
||||
|
||||
This widget displays all your Beszel-monitored systems in a sortable data table. Each row shows system metrics like CPU, memory, disk, network, temperature, and more. Columns can be toggled on or off, and the table supports sorting by any column. When Beszel reports extra filesystems, the disk column adds a hover breakdown for each mount alongside the root disk.
|
||||
This widget displays all your Beszel-monitored systems in a sortable data table. Each row shows system metrics like CPU, memory, disk, network, temperature, and more. Columns can be toggled on or off, dragged into a different order, and resized from their headers. Column order and widths are saved automatically for each widget. When Beszel reports extra filesystems, the disk column adds a hover breakdown for each mount alongside the root disk.
|
||||
|
||||
Select a system row to open the complete statistics view, including system, filesystem, Docker, historical, and realtime charts.
|
||||
|
||||
### Interactions
|
||||
|
||||
- **Reorder columns** by hovering a header to reveal its grab handle, then dragging it
|
||||
- **Resize columns** by dragging a header's right edge
|
||||
- **Sort systems** by selecting a sortable column header
|
||||
- **Open system statistics** by selecting a row
|
||||
|
||||
### Supported Integrations
|
||||
|
||||
<WidgetIntegrations
|
||||
|
||||
@@ -40,13 +40,19 @@ import dockerTable from "./img/table.png";
|
||||
|
||||
### Interactions
|
||||
|
||||
Each container row has an action menu (accessible via the three-dot icon) with the following options:
|
||||
Hover a column header to reveal its grab handle, then drag it to reorder the table or drag the header's edge to resize it. The layout is saved automatically for each widget instance and restored after a reload. These controls are disabled while the board is in edit mode.
|
||||
|
||||
Each container row has an action menu, accessible via the three-dot icon or by right-clicking the row, with the following options:
|
||||
|
||||
- **View logs** - opens a dedicated terminal page streaming the container's logs
|
||||
- **Start** / **Stop** / **Restart** - manage the container's state
|
||||
- **Remove** - remove the container
|
||||
- **Remove** - permanently remove the container after a second confirmation click
|
||||
- **Add to Homarr** - create a bookmark app from the container
|
||||
|
||||
### Adding the widget
|
||||
|
||||
<AddingWidget />
|
||||
|
||||
### Configuration
|
||||
|
||||
<WidgetConfig configuration={dockerContainersWidget.configuration} />
|
||||
@@ -8,6 +8,12 @@ export const dockerContainersWidget: WidgetDefinition = {
|
||||
path: "../../widgets/docker-containers",
|
||||
configuration: {
|
||||
items: [
|
||||
{
|
||||
name: "Columns to show",
|
||||
description: "Select which columns are visible in the table",
|
||||
values: "Name, State, Host, CPU usage, Memory usage, and Actions",
|
||||
defaultValue: "All columns",
|
||||
},
|
||||
{
|
||||
name: "Enable items sorting",
|
||||
description: "Allows to sort containers by clicking on the column headers",
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 210 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 122 KiB |
@@ -4,69 +4,86 @@ description: "Allows you to view and manage your Downloads from both Torrent and
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
import { delugeIntegration } from "@site/docs/integrations/deluge";
|
||||
import { nzbgetIntegration } from "@site/docs/integrations/nzbget";
|
||||
import { qBittorentIntegration } from "@site/docs/integrations/q-bittorent";
|
||||
import { sabnzbdIntegration } from "@site/docs/integrations/sabnzbd";
|
||||
import { transmissionIntegration } from "@site/docs/integrations/transmission";
|
||||
import { slskdIntegration } from "@site/docs/integrations/slskd";
|
||||
import { AddingWidget } from "@site/src/components/widgets/adding";
|
||||
import { WidgetConfig } from "@site/src/components/widgets/configuration";
|
||||
import { WidgetHeader } from "@site/src/components/widgets/header";
|
||||
import { WidgetIntegrations } from "@site/src/components/widgets/integrations";
|
||||
import { IconAd } from "@tabler/icons-react";
|
||||
import TabItem from "@theme/TabItem";
|
||||
import Tabs from "@theme/Tabs";
|
||||
import { downloadsWidget } from ".";
|
||||
import { aria2Integration } from '@site/docs/integrations/aria2';
|
||||
import { delugeIntegration } from '@site/docs/integrations/deluge';
|
||||
import { nzbgetIntegration } from '@site/docs/integrations/nzbget';
|
||||
import { qBittorentIntegration } from '@site/docs/integrations/q-bittorent';
|
||||
import { sabnzbdIntegration } from '@site/docs/integrations/sabnzbd';
|
||||
import { transmissionIntegration } from '@site/docs/integrations/transmission';
|
||||
import { slskdIntegration } from '@site/docs/integrations/slskd';
|
||||
import { AddingWidget } from '@site/src/components/widgets/adding';
|
||||
import { WidgetConfig } from '@site/src/components/widgets/configuration';
|
||||
import { WidgetHeader } from '@site/src/components/widgets/header';
|
||||
import { WidgetIntegrations } from '@site/src/components/widgets/integrations';
|
||||
import { downloadsWidget } from '.';
|
||||
|
||||
<WidgetHeader widget={downloadsWidget} categories={["Torrent client", "Usenet client", "Downloads"]} />
|
||||
|
||||
This widget displays a list of torrents or usenet-articles that are currently being downloaded, along with their progress and other relevant information.
|
||||
This widget displays a list of torrents or usenet-articles that are currently being downloaded, along with their progress and other relevant information. It supports 7 download client integrations and provides a rich, responsive table interface.
|
||||
|
||||
### Screenshots
|
||||
|
||||
import downloadsCard from "./img/screenshot.png";
|
||||
import downloadsCard from './img/screenshot.png';
|
||||
import contextMenuImg from './img/context-menu.png';
|
||||
|
||||
<div>
|
||||
<img src={downloadsCard} alt="downloads" width={128 * 4} />
|
||||
<img src={downloadsCard} alt="Downloads widget showing torrent and usenet items" width={128 * 4} />
|
||||
</div>
|
||||
|
||||
#### Right-click context menu
|
||||
|
||||
<div>
|
||||
<img src={contextMenuImg} alt="Downloads widget context menu with pause, delete, and copy actions" width={128 * 4} />
|
||||
</div>
|
||||
|
||||
### Features
|
||||
|
||||
- **Responsive table** — columns automatically adapt to widget width, hiding less important columns at smaller sizes
|
||||
- **Sortable columns** — click any column header to sort ascending/descending
|
||||
- **Column customization** — choose which columns to display, then hover a header to reveal its grab handle for reordering or drag its edge to resize it; layouts save automatically per widget
|
||||
- **Right-click context menu** — pause, resume, delete downloads, or copy download names directly from the context menu
|
||||
- **Row expansion** — click any row to see full details inline without opening a separate modal
|
||||
- **Hover tooltips** — hover a download name to see size, speeds, ETA, ratio, and category
|
||||
- **Global stats bar** — toggle a summary bar showing queue progress, total size, speeds, ratio, and per-state counts
|
||||
- **Client filtering** — filter downloads by integration or status using the footer filter panel
|
||||
- **Global controls** — pause/resume all downloads across all clients from the footer bar
|
||||
- **Status indicators** — color-coded badges show download state at a glance
|
||||
- **Speed overview** — total download and upload speeds displayed in the footer
|
||||
|
||||
### Supported Integrations
|
||||
|
||||
<WidgetIntegrations
|
||||
items={[
|
||||
{
|
||||
integration: sabnzbdIntegration,
|
||||
note: "Usenet client",
|
||||
},
|
||||
{
|
||||
integration: nzbgetIntegration,
|
||||
note: "Usenet client",
|
||||
},
|
||||
{
|
||||
integration: delugeIntegration,
|
||||
note: "Torrent client",
|
||||
},
|
||||
{
|
||||
integration: transmissionIntegration,
|
||||
note: "Torrent client",
|
||||
},
|
||||
{
|
||||
integration: qBittorentIntegration,
|
||||
note: "Torrent client",
|
||||
},
|
||||
{
|
||||
integration: slskdIntegration,
|
||||
note: "Soulseek client",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<WidgetIntegrations items={[{
|
||||
integration: sabnzbdIntegration,
|
||||
note: "Usenet client"
|
||||
}, {
|
||||
integration: nzbgetIntegration,
|
||||
note: "Usenet client"
|
||||
}, {
|
||||
integration: delugeIntegration,
|
||||
note: "Torrent client"
|
||||
}, {
|
||||
integration: transmissionIntegration,
|
||||
note: "Torrent client"
|
||||
}, {
|
||||
integration: qBittorentIntegration,
|
||||
note: "Torrent client"
|
||||
}, {
|
||||
integration: aria2Integration,
|
||||
note: "Multi-protocol download client"
|
||||
}, {
|
||||
integration: slskdIntegration,
|
||||
note: "Soulseek client (read-only)"
|
||||
}]} />
|
||||
|
||||
### Interactions
|
||||
|
||||
- Pause / Resume one download by clicking on the according icon.
|
||||
- Delete one download by clicking on the trash icon. (Can also delete the files)
|
||||
- Pause / Resume all downloads by using the bottom button.
|
||||
- **Right-click** any download to open a context menu with pause/resume, delete, and copy actions
|
||||
- **Click** any row to expand it and see full download details inline
|
||||
- **Hover** a download name for a quick stats tooltip
|
||||
- **Stats toggle** — show or hide the global stats bar from the footer
|
||||
- **Pause / Resume** all downloads using the footer controls
|
||||
- **Filter** by integration or status using the filter button in the footer
|
||||
- **Sort** by clicking column headers (with persistent sort direction)
|
||||
|
||||
### Adding the widget
|
||||
|
||||
|
||||
@@ -2,26 +2,23 @@ import { WidgetDefinition } from "@site/src/types";
|
||||
import { IconDownload } from "@tabler/icons-react";
|
||||
|
||||
const columnsList = [
|
||||
"id",
|
||||
"actions",
|
||||
"added",
|
||||
"category",
|
||||
"downSpeed",
|
||||
"index",
|
||||
"integration",
|
||||
"name",
|
||||
"progress",
|
||||
"size",
|
||||
"downSpeed",
|
||||
"upSpeed",
|
||||
"time",
|
||||
"state",
|
||||
"added",
|
||||
"ratio",
|
||||
"received",
|
||||
"sent",
|
||||
"size",
|
||||
"state",
|
||||
"time",
|
||||
"category",
|
||||
"integration",
|
||||
"index",
|
||||
"type",
|
||||
"upSpeed",
|
||||
];
|
||||
const sortingExclusion = ["actions", "id", "state"];
|
||||
const columnsSort = columnsList.filter((column) => !sortingExclusion.some((exclusion) => exclusion === column));
|
||||
const sortColumns = columnsList.filter((c) => !["state", "category", "integration"].includes(c));
|
||||
|
||||
export const downloadsWidget: WidgetDefinition = {
|
||||
icon: IconDownload,
|
||||
@@ -32,25 +29,20 @@ export const downloadsWidget: WidgetDefinition = {
|
||||
items: [
|
||||
{
|
||||
name: "Columns to show",
|
||||
description: "Select the columns you want to display in the widget.",
|
||||
description:
|
||||
"Select the columns you want to display in the widget. Columns automatically hide/show based on widget width.",
|
||||
values: `List of columns: ${columnsList.join(", ")}`,
|
||||
defaultValue: ["integration", "name", "progress", "time", "actions"].join(", "),
|
||||
defaultValue: ["name", "progress", "downSpeed", "time", "state"].join(", "),
|
||||
},
|
||||
{
|
||||
name: "Enable items sorting",
|
||||
description: "Enables the sorting in the table.",
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "no",
|
||||
},
|
||||
{
|
||||
name: "Column used for sorting by default",
|
||||
description: "By default it will sort by this column.",
|
||||
defaultValue: "type",
|
||||
values: `List of columns: ${columnsSort.join(", ")}`,
|
||||
name: "Default sort column",
|
||||
description: "The column used for initial sorting when the widget loads.",
|
||||
defaultValue: "progress",
|
||||
values: `List of columns: ${sortColumns.join(", ")}`,
|
||||
},
|
||||
{
|
||||
name: "Invert sorting",
|
||||
description: "This will invert the sorting order of the table.",
|
||||
description: "This will invert the default sorting order.",
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "no",
|
||||
},
|
||||
@@ -76,13 +68,13 @@ export const downloadsWidget: WidgetDefinition = {
|
||||
name: "Hide completed torrent under this threshold (in kiB/s)",
|
||||
description:
|
||||
"This will hide completed torrent entries that have a download speed below the specified threshold.",
|
||||
values: "Any number above 1, 0 to disable",
|
||||
values: "Any number above 0, 0 to disable",
|
||||
defaultValue: "0",
|
||||
},
|
||||
{
|
||||
name: "Categories/names to filter",
|
||||
description: "You can filter the items by categories or names. Use a comma to separate multiple values.",
|
||||
values: "Comma-separated list of categories or names",
|
||||
name: "Categories/labels to filter",
|
||||
description: "You can filter the items by categories or labels. Use a comma to separate multiple values.",
|
||||
values: "Comma-separated list of categories or labels",
|
||||
defaultValue: "-",
|
||||
},
|
||||
{
|
||||
@@ -94,13 +86,13 @@ export const downloadsWidget: WidgetDefinition = {
|
||||
},
|
||||
{
|
||||
name: "Use filter to calculate Ratio",
|
||||
description: "This will use the filter to calculate the ratio of items shown in the widget.",
|
||||
description: "This will use the category filter when calculating the global torrent ratio.",
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "yes",
|
||||
},
|
||||
{
|
||||
name: "Limit items per integration",
|
||||
description: "This will limit the number of items shown per integration, not globally",
|
||||
description: "This will limit the number of items shown per integration, not globally.",
|
||||
values: "Any number above 1",
|
||||
defaultValue: "50",
|
||||
},
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: "Immich Album Carousel"
|
||||
description: "Shows a slideshow of your album pictures from Immich"
|
||||
title: 'Immich Album Carousel'
|
||||
description: 'Shows a slideshow of pictures from an Immich album or your full library'
|
||||
hide_title: true
|
||||
---
|
||||
|
||||
@@ -34,5 +34,4 @@ import screen from "./img/screen.png";
|
||||
<AddingWidget />
|
||||
|
||||
### Configuration
|
||||
|
||||
<WidgetConfig configuration={immichAlbumCarouselWidget.configuration} />
|
||||
@@ -4,15 +4,16 @@ import { IconPhoto } from "@tabler/icons-react";
|
||||
export const immichAlbumCarouselWidget: WidgetDefinition = {
|
||||
icon: IconPhoto,
|
||||
name: "Immich Album",
|
||||
description: "Shows a slideshow of your album pictures from Immich",
|
||||
description: "Shows a slideshow of pictures from an Immich album or your full library",
|
||||
path: "../../widgets/immich-album-carousel",
|
||||
configuration: {
|
||||
items: [
|
||||
{
|
||||
name: "Album",
|
||||
description: "Select the Immich album to show in the slideshow.",
|
||||
description:
|
||||
"Select an Immich album or All photos. An empty selection also shows random photos from your full library.",
|
||||
values: { type: "string" },
|
||||
defaultValue: "",
|
||||
defaultValue: "All photos",
|
||||
},
|
||||
{
|
||||
name: "Interval in seconds",
|
||||
|
||||
@@ -9,12 +9,13 @@ import { AddingWidget } from "@site/src/components/widgets/adding";
|
||||
import { WidgetConfig } from "@site/src/components/widgets/configuration";
|
||||
import { WidgetIntegrations } from "@site/src/components/widgets/integrations";
|
||||
import { IconAd } from "@tabler/icons-react";
|
||||
import Tabs from "@theme/Tabs";
|
||||
import TabItem from "@theme/TabItem";
|
||||
import { mediaServerWidget } from ".";
|
||||
import { embyIntegration } from "@site/docs/integrations/emby";
|
||||
import { jellyfinIntegration } from "@site/docs/integrations/jellyfin";
|
||||
import { plexIntegration } from "@site/docs/integrations/plex";
|
||||
import Tabs from '@theme/Tabs';
|
||||
import TabItem from '@theme/TabItem';
|
||||
import { mediaServerWidget } from '.';
|
||||
import { embyIntegration } from '@site/docs/integrations/emby';
|
||||
import { jellyfinIntegration } from '@site/docs/integrations/jellyfin';
|
||||
import { navidromeIntegration } from '@site/docs/integrations/navidrome';
|
||||
import { plexIntegration } from '@site/docs/integrations/plex';
|
||||
|
||||
<WidgetHeader widget={mediaServerWidget} categories={["Media server"]} />
|
||||
|
||||
@@ -29,25 +30,21 @@ import mediaTable from "./img/table.png";
|
||||
|
||||
### Supported Integrations
|
||||
|
||||
<WidgetIntegrations
|
||||
items={[
|
||||
{
|
||||
integration: embyIntegration,
|
||||
},
|
||||
{
|
||||
integration: jellyfinIntegration,
|
||||
},
|
||||
{
|
||||
integration: plexIntegration,
|
||||
note: "Will always show only currently playing streams, not all active sessions.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<WidgetIntegrations items={[{
|
||||
integration: embyIntegration,
|
||||
}, {
|
||||
integration: jellyfinIntegration,
|
||||
}, {
|
||||
integration: navidromeIntegration,
|
||||
note: "Will always show only currently playing audio streams, not all active sessions."
|
||||
}, {
|
||||
integration: plexIntegration,
|
||||
note: "Will always show only currently playing streams, not all active sessions."
|
||||
}]} />
|
||||
|
||||
### Adding the widget
|
||||
|
||||
<AddingWidget />
|
||||
|
||||
### Configuration
|
||||
|
||||
<WidgetConfig configuration={mediaServerWidget.configuration} />
|
||||
@@ -10,7 +10,7 @@ export const mediaServerWidget: WidgetDefinition = {
|
||||
items: [
|
||||
{
|
||||
name: "Show only currently playing",
|
||||
description: "Disabling this will not work for plex.",
|
||||
description: "Plex and Navidrome always show only currently playing streams.",
|
||||
values: { type: "boolean" },
|
||||
defaultValue: "yes",
|
||||
},
|
||||
|
||||
Reference in new issue
Block a user