diff --git a/docs/configs/docker.md b/docs/configs/docker.md index 51f6b523..7cea1fdc 100644 --- a/docs/configs/docker.md +++ b/docs/configs/docker.md @@ -153,6 +153,18 @@ labels: - homepage.widget.fields=["field1","field2"] # optional ``` +Multiple widgets can be specified by incrementing the index, e.g. + +```yaml +labels: ... + - homepage.widget[0].type=emby + - homepage.widget[0].url=http://emby.home + - homepage.widget[0].key=yourembyapikeyhere + - homepage.widget[1].type=uptimekuma + - homepage.widget[1].url=http://uptimekuma.home + - homepage.widget[1].slug=youreventslughere +``` + You can add specify fields for e.g. the [CustomAPI](../widgets/services/customapi.md) widget by using array-style dot notation: ```yaml diff --git a/docs/configs/service-widgets.md b/docs/configs/service-widgets.md index 9c54964e..df696f61 100644 --- a/docs/configs/service-widgets.md +++ b/docs/configs/service-widgets.md @@ -5,7 +5,7 @@ description: Service Widget Configuration Unless otherwise noted, URLs should not end with a `/` or other API path. Each widget will handle the path on its own. -Each service can have one widget attached to it (often matching the service type, but that's not forced). +Each service can have widgets attached to it (often matching the service type, but that's not forced). In addition to the href of the service, you can also specify the target location in which to open that link. See [Link Target](settings.md#link-target) for more details. @@ -22,6 +22,24 @@ Using Emby as an example, this is how you would attach the Emby service widget. key: apikeyapikeyapikeyapikeyapikey ``` +## Multiple Widgets + +Each service can have multiple widgets attached to it, for example: + +```yaml +- Emby: + icon: emby.png + href: http://emby.host.or.ip/ + description: Movies & TV Shows + widgets: + - type: emby + url: http://emby.host.or.ip + key: apikeyapikeyapikeyapikeyapikey + - type: uptimekuma + url: http://uptimekuma.host.or.ip:port + slug: statuspageslug +``` + ## Field Visibility Each widget can optionally provide a list of which fields should be visible via the `fields` widget property. If no fields are specified, then all fields will be displayed. The `fields` property must be a valid YAML array of strings. As an example, here is the entry for Sonarr showing only a couple of fields. diff --git a/docs/widgets/index.md b/docs/widgets/index.md index 8b81ee40..4bd45af7 100644 --- a/docs/widgets/index.md +++ b/docs/widgets/index.md @@ -19,10 +19,13 @@ Service widgets are used to display the status of a service, often a web service description: Watch movies and TV shows. server: localhost container: plex - widget: - type: tautulli - url: http://172.16.1.1:8181 - key: aabbccddeeffgghhiijjkkllmmnnoo + widgets: + - type: tautulli + url: http://172.16.1.1:8181 + key: aabbccddeeffgghhiijjkkllmmnnoo + - type: uptimekuma + url: http://172.16.1.2:8080 + slug: aaaaaaabbbbb ``` ## Info Widgets diff --git a/src/components/services/group.jsx b/src/components/services/group.jsx index cdbb89f3..f25f7ec1 100644 --- a/src/components/services/group.jsx +++ b/src/components/services/group.jsx @@ -3,12 +3,13 @@ import classNames from "classnames"; import { Disclosure, Transition } from "@headlessui/react"; import { MdKeyboardArrowDown } from "react-icons/md"; +import { columnMap } from "../../utils/layout/columns"; + import List from "components/services/list"; import ResolvedIcon from "components/resolvedicon"; export default function ServicesGroup({ group, - services, layout, fiveColumns, disableCollapse, @@ -23,7 +24,7 @@ export default function ServicesGroup({ return (
)}

- {services.name} + {group.name}

- + + {group.groups?.length > 0 && ( +
+ {group.groups.map((subgroup) => ( + + ))} +
+ )}
diff --git a/src/components/services/item.jsx b/src/components/services/item.jsx index a38dfaa3..adf5fc97 100644 --- a/src/components/services/item.jsx +++ b/src/components/services/item.jsx @@ -12,7 +12,7 @@ import Kubernetes from "widgets/kubernetes/component"; import { SettingsContext } from "utils/contexts/settings"; import ResolvedIcon from "components/resolvedicon"; -export default function Item({ service, group, useEqualHeights }) { +export default function Item({ service, groupName, useEqualHeights }) { const hasLink = service.href && service.href !== "#"; const { settings } = useContext(SettingsContext); const showStats = service.showStats === false ? false : settings.showStats; @@ -90,14 +90,14 @@ export default function Item({ service, group, useEqualHeights }) { > {service.ping && (
- + Ping status
)} {service.siteMonitor && (
- + Site monitor status
)} @@ -154,7 +154,9 @@ export default function Item({ service, group, useEqualHeights }) {
)} - {service.widget && } + {service.widgets.map((widget) => ( + + ))} ); diff --git a/src/components/services/list.jsx b/src/components/services/list.jsx index f3fd6e2a..c15d6aed 100644 --- a/src/components/services/list.jsx +++ b/src/components/services/list.jsx @@ -4,7 +4,7 @@ import { columnMap } from "../../utils/layout/columns"; import Item from "components/services/item"; -export default function List({ group, services, layout, useEqualHeights }) { +export default function List({ groupName, services, layout, useEqualHeights }) { return (