feat(docs): migrate documentation site into monorepo (#5912)

apps/docs/docs/integrations/_category_.json

@@ -0,0 +1,10 @@
+{
+  "label": "Integrations",
+  "collapsed": true,
+  "position": 3,
+  "link": {
+    "type": "generated-index",
+    "title": "Integrations",
+    "description": "Integration are a principal part of homarr, it's where you can connect your other apps to interact with them with widgets or other capabilities, Homarr currently integrates with the following applications:"
+  }
+}

apps/docs/docs/integrations/adguard-home/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'AdGuard Home'
+description: "AdGuard Home is a network-wide software for blocking ads and trackers, providing a safer and faster internet experience."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconAd, IconDeviceGamepad } from "@tabler/icons-react";
+import { adguardHomeIntegration } from '.';
+import { dnsHoleSummaryWidget } from '@site/docs/widgets/dns-hole-summary';
+import { dnsHoleControlsWidget } from '@site/docs/widgets/dns-hole-controls';
+
+<IntegrationHeader
+    integration={adguardHomeIntegration}
+    categories={['DNS Hole']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: dnsHoleSummaryWidget,
+    },{
+        widget: dnsHoleControlsWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['username', 'password'],
+    steps: []
+}]} />

apps/docs/docs/integrations/adguard-home/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const adguardHomeIntegration: IntegrationDefinition = {
+  name: "AdGuard Home",
+  description:
+    "AdGuard Home is a network-wide software for blocking ads and trackers, providing a safer and faster internet experience.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/adguard-home.svg",
+  path: "../../integrations/adguard-home",
+};

apps/docs/docs/integrations/anchor/index.mdx

@@ -0,0 +1,40 @@
+---
+title: 'Anchor'
+description: "Anchor is a self-hosted note-taking application."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { anchorIntegration } from '.';
+import { anchorNoteWidget } from '@site/docs/widgets/anchor-note';
+
+
+<IntegrationHeader
+  integration={anchorIntegration}
+  categories={['Notes']}
+/>
+
+The Anchor integration lets Homarr connect to your Anchor instance so you can display and edit selected notes directly from your dashboard.
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+  items={[{
+    widget: anchorNoteWidget
+  }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+  credentials: ['apiKey'],
+  steps: [
+    'Open your Anchor instance.',
+    'Generate or copy an API key from Anchor settings.',
+    'Paste that key into the API Key secret field in Homarr.'
+  ]
+}]} />

apps/docs/docs/integrations/anchor/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const anchorIntegration: IntegrationDefinition = {
+  name: "Anchor",
+  description:
+    "Anchor is a self-hosted note-taking application. The Anchor integration lets Homarr display and edit selected notes directly from the dashboard.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/anchor.svg",
+  path: "../../integrations/anchor",
+};

apps/docs/docs/integrations/aria2/index.mdx

@@ -0,0 +1,38 @@
+---
+title: 'Aria2'
+description: "Lightweight multiprotocol & multi-source command-line download utility. It supports HTTP/HTTPS, FTP, SFTP, BitTorrent and Metalink"
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { aria2Integration } from '.';
+import { downloadsWidget } from '@site/docs/widgets/downloads';
+
+<IntegrationHeader
+  integration={aria2Integration}
+  categories={['Download', 'Multiprotocol', 'Multi-source']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+  items={[{
+    widget: downloadsWidget,
+  }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[
+  {
+    credentials: ['apiKey'],
+    steps: []
+  },
+  {
+    credentials: [],
+    steps: []
+  }]} />

apps/docs/docs/integrations/aria2/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const aria2Integration: IntegrationDefinition = {
+  name: "Aria2",
+  description:
+    "Lightweight multi-protocol & multi-source command-line download utility. It supports HTTP/HTTPS, FTP, SFTP, BitTorrent and Metalink",
+  iconUrl: "https://cdn.jsdelivr.net/gh/PapirusDevelopmentTeam/papirus_icons@latest/src/system_downloads_3.svg",
+  path: "../../integrations/aria2",
+};

apps/docs/docs/integrations/audiobookshelf/index.mdx

@@ -0,0 +1,41 @@
+---
+title: 'Audiobookshelf'
+description: "Audiobookshelf is a self-hosted audiobook and podcast server that lets you manage and stream your audio library."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { audiobookshelfIntegration } from '.';
+import { audioStatsWidget } from '@site/docs/widgets/audio-stats';
+
+
+<IntegrationHeader
+    integration={audiobookshelfIntegration}
+    categories={['Media']}
+/>
+
+Audiobookshelf provides library statistics including audiobook and podcast counts, listening time, and active sessions.
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: audioStatsWidget },
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: [
+        'Open your Audiobookshelf instance',
+        'Go to Settings → Users',
+        'Click on your user account',
+        'Copy the API token from the user details',
+    ]
+}]} />

apps/docs/docs/integrations/audiobookshelf/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const audiobookshelfIntegration: IntegrationDefinition = {
+  name: "Audiobookshelf",
+  description:
+    "Audiobookshelf is a self-hosted audiobook and podcast server that lets you manage and stream your audio library.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/audiobookshelf.svg",
+  path: "../../integrations/audiobookshelf",
+};

apps/docs/docs/integrations/codeberg/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'Codeberg'
+description: "Codeberg is a non-profit, community-driven platform for hosting and collaborating on software projects."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { codebergIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={codebergIntegration}
+    categories={['Version Control', 'Software']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}, {
+    credentials: ['personalAccessToken'],
+    steps: []
+}]} />

apps/docs/docs/integrations/codeberg/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const codebergIntegration: IntegrationDefinition = {
+  name: "Codeberg",
+  description:
+    "Codeberg is a non-profit, community-driven platform for hosting and collaborating on software projects.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/codeberg.svg",
+  path: "../../integrations/codeberg",
+};

apps/docs/docs/integrations/coolify/index.mdx

@@ -0,0 +1,46 @@
+---
+title: 'Coolify'
+description: 'Self-hosted PaaS and deployment platform'
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { coolifyIntegration } from '.';
+import { coolifyWidget } from '../../widgets/coolify';
+
+<IntegrationHeader
+  integration={coolifyIntegration}
+  categories={['System monitoring', 'Deployment']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+  items={[
+    { widget: coolifyWidget }
+  ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+:::info URL configuration
+Use the root URL of your Coolify instance, for example `https://coolify.example.com`. Homarr calls Coolify endpoints under `/api` and `/api/v1` automatically.
+:::
+
+### Secrets
+<IntegrationSecrets secrets={[{
+  credentials: ['apiKey'],
+  steps: [
+    'Open your Coolify instance and make sure you are in the team you want Homarr to monitor.',
+    (<span>Enable API access under <strong>Settings &gt; Advanced</strong> if it is disabled.</span>),
+    (<span>Go to <strong>Security &gt; API Tokens</strong>.</span>),
+    'Enter a name, e.g. "Homarr".',
+    (<span>Select the <code>read</code> permission. The Coolify widget only reads version, server, project, application, and service data.</span>),
+    'Click "Create".',
+    'Copy the generated token immediately. Coolify only shows it once.',
+    'Paste the token into the API Key field in Homarr.'
+  ]
+}]} />

apps/docs/docs/integrations/coolify/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const coolifyIntegration: IntegrationDefinition = {
+  name: "Coolify",
+  description: "Self-hosted PaaS and deployment platform",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons@master/svg/coolify.svg",
+  path: "../../integrations/coolify",
+};

apps/docs/docs/integrations/dash-dot/index.mdx

@@ -0,0 +1,32 @@
+---
+title: 'Dash.'
+description: "Dash. is a system performance and resource monitoring tool"
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconHeartRateMonitor } from "@tabler/icons-react";
+import { dashDotIntegration } from '.';
+import { healthMonitoringWidget } from '@site/docs/widgets/health-monitoring';
+import { systemResourcesWidget } from '@site/docs/widgets/system-resources';
+
+
+<IntegrationHeader
+  integration={dashDotIntegration}
+  categories={['System monitoring']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+      widget: healthMonitoringWidget
+    }, {
+      widget: systemResourcesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />

apps/docs/docs/integrations/dash-dot/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const dashDotIntegration: IntegrationDefinition = {
+  name: "Dash.",
+  description: "Dash. is a system performance and resource monitoring tool",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/png/dashdot.png",
+  path: "../../integrations/dash-dot",
+};

apps/docs/docs/integrations/deluge/index.mdx

@@ -0,0 +1,36 @@
+---
+title: 'Deluge'
+description: "Deluge is a lightweight, Free Software, cross-platform BitTorrent client."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { IconDownload } from "@tabler/icons-react";
+import Alert from '@theme/Admonition';
+import { delugeIntegration } from '.';
+import { downloadsWidget } from '@site/docs/widgets/downloads';
+
+
+<IntegrationHeader
+    integration={delugeIntegration}
+    categories={['Torrent client']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: downloadsWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['password'],
+    steps: [],
+}]} />

apps/docs/docs/integrations/deluge/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const delugeIntegration: IntegrationDefinition = {
+  name: "Deluge",
+  description: "Deluge is a lightweight, Free Software, cross-platform BitTorrent client.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/deluge.svg",
+  path: "../../integrations/deluge",
+};

apps/docs/docs/integrations/docker-hub/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'Docker Hub'
+description: "Docker Hub is a cloud-based registry service for sharing and managing Docker images."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { dockerHubIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={dockerHubIntegration}
+    categories={['Container Management', 'Software']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}, {
+    credentials: ['username', 'personalAccessToken'],
+    steps: []
+}]} />

apps/docs/docs/integrations/docker-hub/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const dockerHubIntegration: IntegrationDefinition = {
+  name: "Docker Hub",
+  description: "Docker Hub is a cloud-based registry service for sharing and managing Docker images.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/docker.svg",
+  path: "../../integrations/docker-hub",
+};

apps/docs/docs/integrations/docker/index.mdx

@@ -0,0 +1,156 @@
+---
+title: 'Docker'
+description: "Docker is a platform where you can run your applications in containers, allowing for easy deployment and management of applications."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconBrandDocker, IconTool } from "@tabler/icons-react";
+import { dockerIntegration } from '.';
+import { dockerContainersWidget } from '@site/docs/widgets/docker-containers';
+
+
+<IntegrationHeader
+  integration={dockerIntegration}
+  categories={['Containers']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+      widget: dockerContainersWidget,
+      note: "This widget can only be used with administrator privileges"
+    }]}
+/>
+
+
+## Enabling the Docker integration
+This integration must first be enabled.
+If you directly run on the host system and you have docker installed, it will be enabled by default.
+Otherwise, you'll need to mount the [docker socket](https://docs.docker.com/engine/security/protect-access/) to the Homarr container,
+so Homarr can interact with the Docker service.
+
+In Docker Compose, you can simply add this line:
+
+```yaml {10}
+#---------------------------------------------------------------------#
+#     Homarr - A simple, yet powerful dashboard for your server.      #
+#---------------------------------------------------------------------#
+services:
+  homarr:
+    container_name: homarr
+    image: ghcr.io/homarr-labs/homarr:latest
+    restart: unless-stopped
+    volumes:
+      - /var/run/docker.sock:/var/run/docker.sock # <--- add this line here!
+      - ./homarr/appdata:/appdata
+    environment:
+      - SECRET_ENCRYPTION_KEY=your_64_character_hex_string # <--- can be generated with `openssl rand -hex 32`
+    ports:
+      - '7575:7575'
+```
+
+With docker run, add this parameter: `-v /var/run/docker.sock:/var/run/docker.sock`.
+In Windows, you'll need to adjust the slashes: `-v //var/run/docker.sock:/var/run/docker.sock`
+
+### Managing your Docker containers within Homarr
+Homarr allows you to interact with Docker containers running on your system.
+Each container row has an action menu with the following options:
+- **View logs** — opens a dedicated logs page with a live terminal
+- **Start** — start a stopped container
+- **Stop** — stop a running container
+- **Restart** — restart a container
+- **Remove** — remove a container
+- **Add to Homarr** — create a bookmark app from the container
+
+You can also search and filter containers by **container** or **image** name:
+
+![Container and Image Search](img/container-and-image-search.png)
+
+#### Viewing container logs
+
+You can view the real-time logs of any container by selecting **View logs** from the row action menu.
+This opens a dedicated page with an xterm.js terminal that streams the container's log output.
+
+#### CPU and Memory columns
+
+The Docker management table supports optional **CPU usage** and **Memory usage** columns.
+These columns are hidden by default and can be toggled on from the table column visibility settings.
+
+#### Add apps from containers
+
+Homarr also lets you add apps from containers. You can simply select all containers you want to add an app for and then click the `Add to Homarr` button.
+This will open a dialog where you can specify the web addresses for all of them:
+
+![Dialog for addding apps to Homarr](img/add-to-homarr-dialog.png)
+
+Once you've changed the web addresses, click the `Add` button to add the apps to Homarr.
+They are then available in the app list and can be used as normally added apps.
+
+![Apps added from containers](img/add-to-homarr-apps.png)
+
+### Configuration
+
+Currently Homarr supports one label for configuration of the containers:
+
+- **homarr.hide:** If set to any value, the container will be hidden from the Docker Containers widget and tools page.
+
+### Security
+Mounting docker sockets can be risky, as they permit full control over your docker service.
+As an example, a thread actor could abuse Homarr use the socket to start, stop or delete containers on your system.
+
+Therefore we recommend the usage of a socket proxy, which can prohibit certain actions.
+A few examples include:
+- https://github.com/linuxserver/docker-socket-proxy
+- https://github.com/Tecnativa/docker-socket-proxy
+
+See documentation of the respective proxies on how to configure them.
+Homarr may behave in unexpected ways when you use proxies.
+
+#### Permissions
+Homarr needs the following permissions from the Docker API:
+- Containers/Start
+- Containers/Stop
+- Containers/Restart
+- Containers/Remove
+
+For socket proxies, you will need these permissions:
+- `CONTAINERS=1`
+- `POST=1`
+
+**Caution:** `POST` access is security critical as it provides extensive capabilities to modify your docker environment. Please leave it disabled if you're concerned about this.
+
+As a workaround, you can use [LSIO's socket proxy](https://github.com/linuxserver/docker-socket-proxy) and set the following:
+- ALLOW_START=1
+- ALLOW_STOP=1
+- ALLOW_RESTARTS=1
+
+These will work even with `POST=0`. 
+
+You lose the ability to remove containers, but start, stop and restarts should work just fine.
+
+#### Connecting to Docker via Socket Proxies
+To connect to Docker via a socket proxy, you'll need to add these two environment variables in the compose file:
+- `DOCKER_HOSTNAMES=<name of the socket proxy container>`
+- `DOCKER_PORTS=<socket proxy port, usually 2375>`
+
+Refer: https://homarr.dev/docs/advanced/environment-variables/
+
+You will also need to add Homarr to the network of your socket proxy. You can do it like this:
+1. Add the network to your compose file (with appropriate changes):
+```yaml
+networks:
+  socket-proxy:
+    name: socket-proxy # <--- change this to the name of the network as set up by the socket proxy
+    external: true
+```
+
+2. Add the network to the homarr service in the compose file:
+```yaml
+networks:
+  - socket-proxy
+```
+
+3. Finally, if it is present, remove the default docker socket connection under `volumes` in the homarr service.

apps/docs/docs/integrations/docker/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const dockerIntegration: IntegrationDefinition = {
+  name: "Docker",
+  description:
+    "Docker is a platform where you can run your applications in containers, allowing for easy deployment and management of applications.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/docker.svg",
+  path: "../../integrations/docker",
+};

apps/docs/docs/integrations/emby/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'Emby'
+description: "Emby is a media server platform that allows you to organize, manage, and stream your personal media collection."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconVideo, IconTicket } from "@tabler/icons-react";
+import { embyIntegration } from '.';
+import { mediaServerWidget } from '@site/docs/widgets/media-server';
+import { mediaReleasesWidget } from '@site/docs/widgets/media-releases';
+
+
+<IntegrationHeader
+    integration={embyIntegration}
+    categories={['Media server']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: mediaServerWidget }, 
+        { widget: mediaReleasesWidget }
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/emby/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const embyIntegration: IntegrationDefinition = {
+  name: "Emby",
+  description:
+    "Emby is a media server platform that allows you to organize, manage, and stream your personal media collection.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/emby.svg",
+  path: "../../integrations/emby",
+};

apps/docs/docs/integrations/github-containerregistry/index.mdx

@@ -0,0 +1,42 @@
+---
+title: 'GitHub Container Registry'
+description: "GitHub Container Registry is a platform for hosting and managing packages."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { gitHubContainerRegistryIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={gitHubContainerRegistryIntegration}
+    categories={['Package Management', 'Software']}
+/>
+
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}, {
+    credentials: ["personalAccessToken"],
+    steps: []
+}, {
+    tabLabel: "GitHub App",
+    credentials: ['githubAppId', 'githubInstallationId', 'privateKey'],
+    steps: ['Create GitHub App', 'Create a private key for it', 'Install it to your organization / user']
+}]} />

apps/docs/docs/integrations/github-containerregistry/index.ts

@@ -0,0 +1,11 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const gitHubContainerRegistryIntegration: IntegrationDefinition = {
+  name: "GitHub Container Registry",
+  description: "GitHub Container Registry is a platform for hosting and managing packages.",
+  iconUrl: {
+    light: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/github.svg",
+    dark: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/github-light.svg",
+  },
+  path: "../../integrations/github-packages",
+};

apps/docs/docs/integrations/github/index.mdx

@@ -0,0 +1,41 @@
+---
+title: 'GitHub'
+description: "GitHub is a web-based platform for version control and collaboration."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { githubIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={githubIntegration}
+    categories={['Version Control', 'Software']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}, {
+    credentials: ['personalAccessToken'],
+    steps: []
+}, {
+    tabLabel: "GitHub App",
+    credentials: ['githubAppId', 'githubInstallationId', 'privateKey'],
+    steps: ['Create GitHub App', 'Create a private key for it', 'Install it to your organization / user']
+}]} />

apps/docs/docs/integrations/github/index.ts

@@ -0,0 +1,11 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const githubIntegration: IntegrationDefinition = {
+  name: "GitHub",
+  description: "GitHub is a web-based platform for version control and collaboration.",
+  iconUrl: {
+    light: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/github.svg",
+    dark: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/github-light.svg",
+  },
+  path: "../../integrations/github",
+};

apps/docs/docs/integrations/gitlab/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'GitLab'
+description: "GitLab is a web-based DevOps lifecycle tool that provides a Git repository manager."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { gitlabIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={gitlabIntegration}
+    categories={['Version Control', 'Software']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}, {
+    credentials: ['personalAccessToken'],
+    steps: []
+}]} />

apps/docs/docs/integrations/gitlab/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const gitlabIntegration: IntegrationDefinition = {
+  name: "GitLab",
+  description: "GitLab is a web-based DevOps lifecycle tool that provides a Git repository manager.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/gitlab.svg",
+  path: "../../integrations/gitlab",
+};

apps/docs/docs/integrations/glances/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'Glances'
+description: "Glances is a cross-platform system monitoring tool."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { glancesIntegration } from '.';
+import { systemResourcesWidget } from '@site/docs/widgets/system-resources';
+import { healthMonitoringWidget } from '@site/docs/widgets/health-monitoring';
+
+
+<IntegrationHeader
+    integration={glancesIntegration}
+    categories={['System Monitoring']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: systemResourcesWidget
+    }, {
+        widget: healthMonitoringWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}]} />

apps/docs/docs/integrations/glances/index.ts

@@ -0,0 +1,11 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const glancesIntegration: IntegrationDefinition = {
+  name: "Glances",
+  description: "Glances is a cross-platform system monitoring tool.",
+  iconUrl: {
+    light: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/glances.svg",
+    dark: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/glances-light.svg",
+  },
+  path: "../../integrations/glances",
+};

apps/docs/docs/integrations/home-assistant/index.mdx

@@ -0,0 +1,45 @@
+---
+title: 'Home Assistant'
+description: "Home Assistant is an open-source home automation platform that focuses on privacy and local control, allowing you to automate and control your smart home devices."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconBinaryTree } from "@tabler/icons-react";
+import { homeAssistantIntegration } from '.';
+import { smartHomeEntityStateWidget } from '@site/docs/widgets/smart-home-entity-state';
+import { smartHomeExecuteAutomationWidget } from '@site/docs/widgets/smart-home-execute-automation';
+
+
+<IntegrationHeader
+    integration={homeAssistantIntegration}
+    categories={['Smart Home', 'Automation']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: smartHomeEntityStateWidget
+    }, {
+        widget: smartHomeExecuteAutomationWidget,
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: [
+        "Click on your profile in the bottom left corner of Home Assistant.",
+        "Switch to the Security tab.",
+        "Scroll down to the Long-lived access tokens section.",
+        "Click on the Create Token button.",
+        "Enter a name for the token (e.g., 'Homarr Integration') and click Create.",
+        "Copy the generated token and paste it into the Homarr integration settings.",
+    ]
+}]} />

apps/docs/docs/integrations/home-assistant/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const homeAssistantIntegration: IntegrationDefinition = {
+  name: "Home Assistant",
+  description:
+    "Home Assistant is an open-source home automation platform that focuses on privacy and local control, allowing you to automate and control your smart home devices.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/home-assistant.svg",
+  path: "../../integrations/home-assistant",
+};

apps/docs/docs/integrations/ical/index.mdx

@@ -0,0 +1,38 @@
+---
+title: 'iCal'
+description: "iCal is a standard for calendar data exchange, allowing users to share and manage calendar events across different platforms."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconZoomQuestion, IconChartBar, IconSearch } from "@tabler/icons-react";
+import { icalIntegration } from '.';
+import { calendarWidget } from '@site/docs/widgets/calendar';
+
+<IntegrationHeader
+  integration={icalIntegration}
+  categories={['Calendar']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+      widget: calendarWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['url'],
+    steps: []
+}]} />
+
+## Using the iCal integration
+
+The iCal integration allows you to add external calendars to Homarr. Any calendar that provides a public iCal URL can be integrated, such as Google Calendar, Apple Calendar, or Outlook.

apps/docs/docs/integrations/ical/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const icalIntegration: IntegrationDefinition = {
+  name: "iCal",
+  description:
+    "iCal is a standard for calendar data exchange, allowing users to share and manage calendar events across different platforms.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/ical.svg",
+  path: "../../integrations/ical",
+};

apps/docs/docs/integrations/immich/index.mdx

@@ -0,0 +1,51 @@
+---
+title: 'Immich'
+description: "Self-hosted photo and video management solution"
+hide_title: true
+---
+
+import { immichAlbumCarouselWidget } from '../../widgets/immich-album-carousel';import {
+  IntegrationHeader
+} from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { immichIntegration } from '.';
+import { immichServerStatsWidget } from '../../widgets/immich-server-stats';
+
+
+<IntegrationHeader
+  integration={immichIntegration}
+  categories={['Photo server']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+  items={[
+    { widget: immichAlbumCarouselWidget },
+    { widget: immichServerStatsWidget }
+  ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+  credentials: ['apiKey'],
+  steps: [
+    'Navigate to your Immich instance', 
+    'Open your account settings or navigate to https://YOUR_IMMICH/user-settings', 
+    'Scroll down to "API Keys"', 
+    'Click "New API Key"', 
+    'Enter a name, e.g. "Homarr"', 
+    (<span>
+      Select the following permissions:{" "}
+      <code>album.read</code>,{" "}
+      <code>user.read</code>,{" "}
+      <code>server.statistics</code>,{" "}
+      <code>asset.download</code>
+    </span>), 
+    'Create the integration in Homarr and copy the API key to there'
+    ]
+}]} />

apps/docs/docs/integrations/immich/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const immichIntegration: IntegrationDefinition = {
+  name: "Immich",
+  description: "Self-hosted photo and video management solution",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/immich.svg",
+  path: "../../integrations/immich",
+};

apps/docs/docs/integrations/jellyfin/index.mdx

@@ -0,0 +1,40 @@
+---
+title: 'Jellyfin'
+description: "Jellyfin is a free and open-source media server software that allows you to organize, manage, and share your media files."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconVideo, IconTicket } from "@tabler/icons-react";
+import { jellyfinIntegration } from '.';
+import { mediaServerWidget } from '@site/docs/widgets/media-server';
+import { mediaReleasesWidget } from '@site/docs/widgets/media-releases';
+
+
+<IntegrationHeader
+    integration={jellyfinIntegration}
+    categories={['Media server']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: mediaServerWidget }, 
+        { widget: mediaReleasesWidget }
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+},{
+    credentials: ['username', 'password'],
+    steps: []
+}]} />

apps/docs/docs/integrations/jellyfin/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const jellyfinIntegration: IntegrationDefinition = {
+  name: "Jellyfin",
+  description:
+    "Jellyfin is a free and open-source media server software that allows you to organize, manage, and share your media files.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/jellyfin.svg",
+  path: "../../integrations/jellyfin",
+};

apps/docs/docs/integrations/jellyseerr/index.mdx

@@ -0,0 +1,45 @@
+---
+title: 'Jellyseerr'
+description: "Jellyseerr is a self-hosted media request management system that integrates with Jellyfin and other media servers."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconZoomQuestion, IconChartBar, IconSearch } from "@tabler/icons-react";
+import { jellyseerrIntegration } from '.';
+import { mediaRequestListWidget } from '@site/docs/widgets/media-request-list';
+import { mediaRequestStatsWidget } from '@site/docs/widgets/media-request-stats';
+
+
+<IntegrationHeader
+  integration={jellyseerrIntegration}
+  categories={['Media requests']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: mediaRequestListWidget,
+    },{
+        widget: mediaRequestStatsWidget,
+    }, {
+        capability: {
+            icon: IconSearch,
+            name: "Media Search",
+            description: "Search for movies and TV shows directly from Spotlight and request them.",
+            path: "../../management/search-engines/#media-request-search"
+        }
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/jellyseerr/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const jellyseerrIntegration: IntegrationDefinition = {
+  name: "Jellyseerr",
+  description:
+    "Jellyseerr is a self-hosted media request management system that integrates with Jellyfin and other media servers.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/jellyseerr.svg",
+  path: "../../integrations/jellyseerr",
+};

apps/docs/docs/integrations/kubernetes/index.mdx

@@ -0,0 +1,62 @@
+---
+title: 'Kubernetes'
+description: "Kubernetes is a powerful container orchestration platform that automates the deployment, scaling, and management of containerized applications."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconBrandDocker, IconTool } from "@tabler/icons-react";
+import { kubernetesIntegration } from '.';
+
+
+<IntegrationHeader
+  integration={kubernetesIntegration}
+  categories={['Containers']}
+/>
+
+Homarr provides a user-friendly Kubernetes dashboard that offers an overview of your cluster’s resources in a clear and structured interface. It allows users to view key Kubernetes objects, including `Pods`, `Services`, `Ingresses`, `Nodes`, `ConfigMaps`, `Secrets`, `Namespaces`, and `Volumes`, as well as basic metrics when the Kubernetes Metrics Server is enabled.
+
+:::warning[Read only]
+This integration is read-only, meaning Homarr does not modify or manage cluster resources but serves as an informational tool to enhance visibility into your Kubernetes environment.
+:::
+
+![Dashboard](img/dashboard.jpeg)
+
+### Prerequisites
+
+Before deploying Homarr in Kubernetes, ensure the following prerequisites are met:
+
+- Kubernetes (Version >= 1.24.0)
+- Metrics Server ([Install from here](https://github.com/kubernetes-sigs/metrics-server))
+- RBAC Enabled (Required for Homarr Helm chart)
+
+### Configuring RBAC in Helm Chart
+
+To enable RBAC for Homarr, configure the Helm chart values file as follows:
+
+```yaml
+rbac:
+  enabled: true
+```
+
+:::tip[What Does rbac.enabled Do?]
+Enabling RBAC in the Helm chart creates the necessary Kubernetes Role-Based Access Control (RBAC) resources to allow Homarr to view various Kubernetes objects. These include:
+
+- Service Account: A dedicated service account for Homarr.
+- Role & RoleBinding: Grants permissions within a specific namespace to list, watch, and get pods, services, secrets, configmaps, and more.
+- ClusterRole & ClusterRoleBinding: Extends the same permissions cluster-wide for additional flexibility.
+:::
+
+### Homarr Dashboard Overview
+
+Once deployed, Homarr provides a dashboard displaying Kubernetes metrics and resource information. The main page includes:
+
+- Pods: Lists running and pending pods.
+- Services: Shows available services and their configurations.
+- Ingresses: Displays ingress rules and associated routes.
+- Nodes: Provides an overview of cluster nodes and their status.
+- ConfigMaps & Secrets: Lists configuration data and secrets used within the cluster.
+- Namespaces: Displays all available namespaces in the cluster.
+- Volumes: Shows persistent and ephemeral storage resources.

apps/docs/docs/integrations/kubernetes/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const kubernetesIntegration: IntegrationDefinition = {
+  name: "Kubernetes",
+  description:
+    "Kubernetes is a powerful container orchestration platform that automates the deployment, scaling, and management of containerized applications.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/kubernetes.svg",
+  path: "../../integrations/kubernetes",
+};

apps/docs/docs/integrations/lidarr/index.mdx

@@ -0,0 +1,35 @@
+---
+title: 'Lidarr'
+description: "Lidarr is a music management tool that automates the process of downloading, sorting, and renaming music."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconCalendar } from "@tabler/icons-react";
+import { lidarrIntegration } from '.';
+import { calendarWidget } from '@site/docs/widgets/calendar';
+
+
+<IntegrationHeader
+    integration={lidarrIntegration}
+    categories={['Media manager', "Servarr"]}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: calendarWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/lidarr/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const lidarrIntegration: IntegrationDefinition = {
+  name: "Lidarr",
+  description:
+    "Lidarr is a music management tool that automates the process of downloading, sorting, and renaming music.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/lidarr.svg",
+  path: "../../integrations/lidarr",
+};

apps/docs/docs/integrations/linux-server-io/index.mdx

@@ -0,0 +1,34 @@
+---
+title: 'LinuxServer.io'
+description: "LinuxServer.io is a platform for managing and deploying containerized applications."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { linuxServerIoIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={linuxServerIoIntegration}
+    categories={['Container Management', 'Software']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}]} />

apps/docs/docs/integrations/linux-server-io/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const linuxServerIoIntegration: IntegrationDefinition = {
+  name: "LinuxServer.io",
+  description: "LinuxServer.io is a platform for managing and deploying containerized applications.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons@master/svg/linuxserver-io.svg",
+  path: "../../integrations/linux-server-io",
+};

apps/docs/docs/integrations/navidrome/index.mdx

@@ -0,0 +1,39 @@
+---
+title: 'Navidrome'
+description: "Navidrome is a self-hosted music server and streamer compatible with the Subsonic API."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { navidromeIntegration } from '.';
+import { audioStatsWidget } from '@site/docs/widgets/audio-stats';
+
+
+<IntegrationHeader
+    integration={navidromeIntegration}
+    categories={['Media']}
+/>
+
+Navidrome provides music library statistics including artist, album, and song counts, as well as now playing information via the Subsonic API.
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: audioStatsWidget },
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['username', 'password'],
+    steps: [
+        'Use the same credentials you use to log in to Navidrome',
+        'The user must have access to the Subsonic API (enabled by default)',
+    ]
+}]} />

apps/docs/docs/integrations/navidrome/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const navidromeIntegration: IntegrationDefinition = {
+  name: "Navidrome",
+  description: "Navidrome is a self-hosted music server and streamer compatible with the Subsonic API.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/navidrome.svg",
+  path: "../../integrations/navidrome",
+};

apps/docs/docs/integrations/nextcloud/index.mdx

@@ -0,0 +1,40 @@
+---
+title: 'Nextcloud'
+description: "Nextcloud is a self-hosted productivity platform that provides file storage, collaboration tools, and more."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconCalendar } from "@tabler/icons-react";
+import Alert from '@theme/Admonition';
+import { nextcloudIntegration } from '.';
+import { calendarWidget } from '@site/docs/widgets/calendar';
+import { notificationsWidget } from '@site/docs/widgets/notifications';
+
+<IntegrationHeader
+  integration={nextcloudIntegration}
+  categories={['Calendar', 'Notifications']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: calendarWidget },
+        { widget: notificationsWidget }
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['username', 'password'],
+    steps: [],
+    header: <Alert type="info">
+      Users who use 2FA will have to use Nextcloud's App Password tool to grant Homarr access, as 2FA breaks the traditional process. For more information, see [Nextcloud's Documentation](https://docs.nextcloud.com/server/stable/admin_manual/configuration_user/authentication.html#app-passwords)
+    </Alert>,
+}]} />

apps/docs/docs/integrations/nextcloud/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const nextcloudIntegration: IntegrationDefinition = {
+  name: "Nextcloud",
+  description:
+    "Nextcloud is a self-hosted productivity platform that provides file storage, collaboration tools, and more.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/nextcloud.svg",
+  path: "../../integrations/nextcloud",
+};

apps/docs/docs/integrations/npm/index.mdx

@@ -0,0 +1,34 @@
+---
+title: 'NPM'
+description: "NPM is a package manager for the JavaScript programming language, primarily used for managing Node.js packages."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { npmIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={npmIntegration}
+    categories={['Package Management', 'Software']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}]} />

apps/docs/docs/integrations/npm/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const npmIntegration: IntegrationDefinition = {
+  name: "NPM",
+  description:
+    "NPM is a package manager for the JavaScript programming language, primarily used for managing Node.js packages.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/npm.svg",
+  path: "../../integrations/npm",
+};

apps/docs/docs/integrations/ntfy/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'Ntfy'
+description: "Ntfy is a simple, open-source notification service that allows you to send and receive notifications across devices."
+hide_title: true
+---
+
+import { notificationsWidget } from '@site/docs/widgets/notifications';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { IconMessage } from "@tabler/icons-react";
+import { ntfyIntegration } from '.';
+
+<IntegrationHeader
+    integration={ntfyIntegration}
+    categories={['Notifications', 'Messaging']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: notificationsWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['topic'],
+    steps: []
+}, {
+    credentials: ['topic', 'apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/ntfy/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const ntfyIntegration: IntegrationDefinition = {
+  name: "Ntfy",
+  description:
+    "Ntfy is a simple, open-source notification service that allows you to send and receive notifications across devices.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/ntfy.svg",
+  path: "../../integrations/ntfy",
+};

apps/docs/docs/integrations/nzbget/index.mdx

@@ -0,0 +1,36 @@
+---
+title: 'NZBGet'
+description: "NZBGet is a lightweight and efficient Usenet downloader."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { IconDownload } from "@tabler/icons-react";
+import { nzbgetIntegration } from '.';
+import Alert from '@theme/Admonition';
+import { downloadsWidget } from '@site/docs/widgets/downloads';
+
+
+<IntegrationHeader
+  integration={nzbgetIntegration}
+  categories={['Usenet client']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: downloadsWidget,
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['username', 'password'],
+    steps: [],
+}]} />

apps/docs/docs/integrations/nzbget/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const nzbgetIntegration: IntegrationDefinition = {
+  name: "NZBGet",
+  description: "NZBGet is a lightweight and efficient Usenet downloader.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/nzbget.svg",
+  path: "../../integrations/nzbget",
+};

apps/docs/docs/integrations/open-media-vault/index.mdx

@@ -0,0 +1,42 @@
+---
+title: 'Open Media Vault'
+description: "Open Media Vault is a free network-attached storage server based on the Debian operating system."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconHeartRateMonitor } from "@tabler/icons-react";
+import { openMediaVaultIntegration } from '.';
+import Alert from '@theme/Admonition'
+import { healthMonitoringWidget } from '@site/docs/widgets/health-monitoring';
+import { systemResourcesWidget } from '@site/docs/widgets/system-resources';
+
+<IntegrationHeader
+  integration={openMediaVaultIntegration}
+  categories={['System monitoring']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: healthMonitoringWidget,
+        note: "To use this widget, you must have the OpenMediaVault plugin openmediavault-cputemp installed.",
+    }, {
+      widget: systemResourcesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['username', 'password'],
+    steps: [],
+    body: <Alert type="caution">
+        The user used here must have administrative permissions or Homarr won't be able to read the system performance and resource data.
+    </Alert>
+}]} />

apps/docs/docs/integrations/open-media-vault/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const openMediaVaultIntegration: IntegrationDefinition = {
+  name: "Open Media Vault",
+  description: "Open Media Vault is a free network-attached storage server based on the Debian operating system.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/openmediavault.svg",
+  path: "../../integrations/open-media-vault",
+};

apps/docs/docs/integrations/opnsense/index.mdx

@@ -0,0 +1,65 @@
+---
+title: 'OPNsense'
+description: "OPNsense is an open-source, easy-to-use, and easy-to-build firewall and routing platform."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconHeartRateMonitor } from "@tabler/icons-react";
+import { opnsenseIntegration } from '.';
+import Alert from '@theme/Admonition'
+import { firewallWidget } from '../../widgets/firewall';
+
+<IntegrationHeader
+  integration={opnsenseIntegration}
+  categories={['Firewall']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: firewallWidget,
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    tabLabel: "ApiKey (Key & Secret)",
+    credentials: ['opnsenseApiKey', 'opnsenseApiSecret'],
+    header: <Alert type="info">
+                This integration does not require full API access to the firewall. The following guide outlines the process for creating a restricted OPNsense user with a scrambled password, designed exclusively for API access. This ensures minimal permissions and prevents local login capability.
+    </Alert>,
+    steps: [
+        "Log in to the OPNsense web interface as an administrator",
+        "Navigate to System → Access → Users",
+        "Click the + (Add) button to create a new user",
+        <>
+        Fill in the user details:
+            <ul>
+                <li>Username: Enter a unique name</li>
+                <li>Password: Leave empty</li>
+                <li>Scrambled Password: Enable this option</li>
+                <li>Full name: (Optional) Add a descriptive name</li>
+            </ul>
+        </>,
+        <>
+        In Privileges section → Select the option below:
+            <ul>
+                <li>Lobby: Dashboard</li>
+                <li>Reporting: Traffic</li>
+            </ul>
+        </>,
+        "Click Save",
+        "Return to the Users list",
+        "Find the user and click the ticket icon in the Commands column",
+        "Click Yes in the popup to confirm",
+        "A txt file will download automatically, containing: Key and Secret",
+        "Save this file securely—this information will only be shown once"
+    ],
+}]} />

apps/docs/docs/integrations/opnsense/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const opnsenseIntegration: IntegrationDefinition = {
+  name: "OPNsense",
+  description: "OPNsense is an open-source, easy-to-use, and easy-to-build firewall and routing platform",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/opnsense.svg",
+  path: "../../integrations/opnsense",
+};

apps/docs/docs/integrations/overseerr/index.mdx

@@ -0,0 +1,45 @@
+---
+title: 'Overseerr'
+description: "Overseerr is a self-hosted media request management system that integrates with Plex."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconZoomQuestion, IconChartBar, IconSearch } from "@tabler/icons-react";
+import { overseerrIntegration } from '.';
+import { mediaRequestListWidget } from '@site/docs/widgets/media-request-list';
+import { mediaRequestStatsWidget } from '@site/docs/widgets/media-request-stats';
+
+
+<IntegrationHeader
+  integration={overseerrIntegration}
+  categories={['Media requests']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: mediaRequestListWidget
+    }, {
+        widget: mediaRequestStatsWidget
+    }, {
+        capability: {
+            icon: IconSearch,
+            name: "Media Search",
+            description: "Search for movies and TV shows directly from Spotlight and request them.",
+            path: "../../management/search-engines/#media-request-search"
+        }
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/overseerr/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const overseerrIntegration: IntegrationDefinition = {
+  name: "Overseerr",
+  description: "Overseerr is a self-hosted media request management system that integrates with Plex.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/overseerr.svg",
+  path: "../../integrations/overseerr",
+};

apps/docs/docs/integrations/paperless-ngx/index.mdx

@@ -0,0 +1,41 @@
+---
+title: 'Paperless-ngx'
+description: "Paperless-ngx is a document management system that transforms your physical documents into a searchable online archive."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { paperlessNgxIntegration } from '.';
+import { paperlessNgxWidget } from '@site/docs/widgets/paperless-ngx';
+
+
+<IntegrationHeader
+    integration={paperlessNgxIntegration}
+    categories={['Documents']}
+/>
+
+Paperless-ngx provides document statistics including total documents, inbox count, correspondents, tags, and document types.
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: paperlessNgxWidget },
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: [
+        'Open your Paperless-ngx instance',
+        'Navigate to Settings → Django Admin → Tokens',
+        'Create a new token for your user',
+        'Copy the token value',
+    ]
+}]} />

apps/docs/docs/integrations/paperless-ngx/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const paperlessNgxIntegration: IntegrationDefinition = {
+  name: "Paperless-ngx",
+  description:
+    "Paperless-ngx is a document management system that transforms your physical documents into a searchable online archive.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/paperless-ngx.svg",
+  path: "../../integrations/paperless-ngx",
+};

apps/docs/docs/integrations/peanut/index.mdx

@@ -0,0 +1,48 @@
+---
+title: 'PeaNUT'
+description: 'A tiny dashboard for Network UPS Tools (NUT) servers.'
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { peaNutIntegration } from '.';
+import { upsWidget } from '@site/docs/widgets/ups';
+
+<IntegrationHeader
+  integration={peaNutIntegration}
+  categories={['UPS', 'Hardware']}
+/>
+
+[PeaNUT](https://github.com/Brandawg93/PeaNUT) exposes the data of your [Network UPS Tools](https://networkupstools.org/) servers
+over a REST API, which Homarr reads to display the status of your UPS devices.
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+      widget: upsWidget,
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+PeaNUT secures its API with HTTP Basic authentication when the `WEB_USERNAME` and `WEB_PASSWORD` environment variables
+are set on the PeaNUT instance. Provide the same credentials here. If the instance runs with `AUTH_DISABLED=true`, no
+secrets are required.
+
+<IntegrationSecrets secrets={[{
+    credentials: ['username', 'password'],
+    steps: [
+      "Set WEB_USERNAME and WEB_PASSWORD on your PeaNUT instance.",
+      "Create an integration in Homarr with the PeaNUT URL and those credentials.",
+    ],
+},{
+    credentials: [],
+    steps: [
+      "If PeaNUT runs with AUTH_DISABLED=true, create the integration with no credentials.",
+    ],
+}]} />

apps/docs/docs/integrations/peanut/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const peaNutIntegration: IntegrationDefinition = {
+  name: "PeaNUT",
+  description: "A tiny dashboard for Network UPS Tools (NUT) servers.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/peanut.svg",
+  path: "../../integrations/peanut",
+};

apps/docs/docs/integrations/pi-hole/index.mdx

@@ -0,0 +1,47 @@
+---
+title: 'Pi-hole'
+description: "Pi-hole is a network-wide ad blocker that acts as a DNS sinkhole, blocking unwanted content and improving your browsing experience."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { IconAd, IconDeviceGamepad } from "@tabler/icons-react";
+import Alert from '@theme/Admonition';
+import { dnsHoleSummaryWidget } from '@site/docs/widgets/dns-hole-summary';
+import { dnsHoleControlsWidget } from '@site/docs/widgets/dns-hole-controls';
+import { piHoleIntegration } from '.';
+
+
+<IntegrationHeader
+    integration={piHoleIntegration}
+    categories={['DNS Hole']}
+/>
+
+<Alert type="note" className='my-2'>
+    Homarr supports both Pi-hole v5 and v6. It automatically detects the version and uses the correct API.
+</Alert>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: dnsHoleSummaryWidget,
+    },{
+        widget: dnsHoleControlsWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: [],
+    body: "Please note, that in v6 of Pi-hole you no longer specify an API key, but instead either a password or application password. We suggest to use the application password when possible."
+}, {
+    credentials: [],
+    steps: []
+}]} />

apps/docs/docs/integrations/pi-hole/index.ts

@@ -0,0 +1,9 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const piHoleIntegration: IntegrationDefinition = {
+  name: "Pi-hole",
+  description:
+    "Pi-hole is a network-wide ad blocker that acts as a DNS sinkhole, blocking unwanted content and improving your browsing experience.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/pi-hole.svg",
+  path: "../../integrations/pi-hole",
+};

apps/docs/docs/integrations/plex/index.mdx

@@ -0,0 +1,41 @@
+---
+title: 'Plex'
+description: "Plex is a media server platform that allows you to organize, manage, and stream your personal media collection."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconVideo, IconTicket } from "@tabler/icons-react";
+import { plexIntegration } from '.';
+import { mediaServerWidget } from '@site/docs/widgets/media-server';
+import { mediaReleasesWidget } from '@site/docs/widgets/media-releases';
+
+
+<IntegrationHeader
+  integration={plexIntegration}
+  categories={['Media server']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: mediaServerWidget }, 
+        { widget: mediaReleasesWidget }
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: [
+        <span>
+            Follow the official <a href="https://support.plex.tv/articles/204059436-finding-an-authentication-token-x-plex-token/" target="_blank" rel="noopener noreferrer">Plex documentation</a> to find your authentication token.
+        </span>
+    ]
+}]} />

apps/docs/docs/integrations/plex/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const plexIntegration: IntegrationDefinition = {
+  name: "Plex",
+  description:
+    "Plex is a media server platform that allows you to organize, manage, and stream your personal media collection.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/plex.svg",
+  path: "../../integrations/plex",
+};

apps/docs/docs/integrations/prowlarr/index.mdx

@@ -0,0 +1,32 @@
+---
+title: 'Prowlarr'
+description: "Prowlarr is an indexer manager for Usenet and BitTorrent, providing a unified interface to manage your indexers."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconHeartRateMonitor } from "@tabler/icons-react";
+import { prowlarrIntegration } from '.';
+import { indexerManagerWidget } from '@site/docs/widgets/indexer-manager';
+
+<IntegrationHeader
+  integration={prowlarrIntegration}
+  categories={['Indexer']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: indexerManagerWidget }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/prowlarr/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const prowlarrIntegration: IntegrationDefinition = {
+  name: "Prowlarr",
+  description:
+    "Prowlarr is an indexer manager for Usenet and BitTorrent, providing a unified interface to manage your indexers.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons@master/svg/prowlarr.svg",
+  path: "../../integrations/prowlarr",
+};

apps/docs/docs/integrations/proxmox/index.mdx

@@ -0,0 +1,103 @@
+---
+title: 'Proxmox'
+description: "Proxmox is a powerful open-source virtualization platform that allows you to run virtual machines and containers."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconHeartRateMonitor } from "@tabler/icons-react";
+import { proxmoxIntegration } from '.';
+import Alert from '@theme/Admonition'
+import { healthMonitoringWidget } from '@site/docs/widgets/health-monitoring';
+import { systemResourcesWidget } from '@site/docs/widgets/system-resources';
+
+<IntegrationHeader
+  integration={proxmoxIntegration}
+  categories={['System monitoring']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[
+        { widget: healthMonitoringWidget },
+        
+    ]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    header: <Alert type="caution">
+        The Proxmox API may not work with Linux PAM standard authentication. It is strongly recommended to use the Proxmox VE authentication server realm when creating your API user.
+    </Alert>,
+    credentials: ['username', 'tokenId', 'realm', 'apiKey'],
+    steps: [
+        "Navigate to the Proxmox portal, click on Datacenter",
+        "Expand Permissions, click on Groups",
+        "Click the Create button",
+        "Name the group something informative, like api-users",
+        "Click on the Permissions 'folder'",
+        <>
+            Click Add {"->"} Group Permission
+            <ul>
+                <li>Path: /</li>
+                <li>Group: group from Step 4 above</li>
+                <li>Role: PVEAuditor</li>
+                <li>Propagate: Checked</li>
+            </ul>
+        </>,
+        "Expand Permissions, click on Users",
+        <>
+            Click the Add button
+            <ul>
+                <li>User name: something informative like api</li>
+                <li>Realm: Proxmox VE authentication server</li>
+                <li>Password: create a secure password for the user</li>
+                <li>Confirm Password: re-enter the password</li>
+                <li>Group: group from Step 4 above</li>
+            </ul>
+        </>,
+        "Expand Permissions, click on API Tokens",
+        <>
+            Click the Add button
+            <ul>
+                <li>User: user from Step 8 above</li>
+                <li>Token ID: something informative like the application or purpose like homarr</li>
+                <li>Privilege Separation: unchecked</li>
+            </ul>
+        </>,
+        "Copy the Secret that is shown in Step 10 because it is only shown once",
+        "Go back to the 'Permissions' menu",
+        <>
+            Click Add {"->"} API Token Permission
+            <ul>
+                <li>Path: /</li>
+                <li>API Token: select the API token created in Step 10</li>
+                <li>Role: PVE Auditor</li>
+                <li>Propagate: Checked</li>
+            </ul>
+        </>,
+        ],
+    body: <>
+        <span>
+            Sometimes you'll also find the <code>api@pve!homarr</code> format, 
+            within Homarr you'll have to split it up into:
+        </span>
+        <ul>
+            <li>
+                <b>Username:</b> api
+            </li>
+            <li>
+                <b>Realm:</b> pve
+            </li>
+            <li>
+                <b>Token ID:</b> homarr
+            </li>
+        </ul>
+    </>
+}]} />

apps/docs/docs/integrations/proxmox/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const proxmoxIntegration: IntegrationDefinition = {
+  name: "Proxmox",
+  description:
+    "Proxmox is a powerful open-source virtualization platform that allows you to run virtual machines and containers.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/proxmox.svg",
+  path: "../../integrations/proxmox",
+};

apps/docs/docs/integrations/q-bittorent/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'qBittorrent'
+description: "qBittorrent is a free and open-source BitTorrent client."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { IconDownload } from "@tabler/icons-react";
+import { qBittorentIntegration } from '.';
+import Alert from '@theme/Admonition';
+import { downloadsWidget } from '@site/docs/widgets/downloads';
+
+
+<IntegrationHeader
+  integration={qBittorentIntegration}
+  categories={['Torrent client']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: downloadsWidget }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+},{
+    credentials: ['username', 'password'],
+    steps: [],
+}]} />

apps/docs/docs/integrations/q-bittorent/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const qBittorentIntegration: IntegrationDefinition = {
+  name: "qBittorrent",
+  description: "qBittorrent is a free and open-source BitTorrent client.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/qbittorrent.svg",
+  path: "../../integrations/q-bittorent",
+};

apps/docs/docs/integrations/quay/index.mdx

@@ -0,0 +1,37 @@
+---
+title: 'Quay'
+description: "Quay is a container registry for storing and managing container images."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { quayIntegration } from '.';
+import { releasesWidget } from '@site/docs/widgets/releases';
+
+
+<IntegrationHeader
+    integration={quayIntegration}
+    categories={['Container Registry', 'Software']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: releasesWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: [],
+    steps: []
+}, {
+    credentials: ["personalAccessToken"],
+    steps: []
+}]} />

apps/docs/docs/integrations/quay/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const quayIntegration: IntegrationDefinition = {
+  name: "Quay",
+  description: "Quay is a container registry for storing and managing container images.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons@master/png/quay.png",
+  path: "../../integrations/quay",
+};

apps/docs/docs/integrations/radarr/index.mdx

@@ -0,0 +1,33 @@
+---
+title: 'Radarr'
+description: "Radarr is a movie management tool that automates the process of downloading, sorting, and renaming movies."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconCalendar } from "@tabler/icons-react";
+import { radarrIntegration } from '.';
+import { calendarWidget } from '@site/docs/widgets/calendar';
+
+
+<IntegrationHeader
+  integration={radarrIntegration}
+  categories={['Media manager', "Servarr"]}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: calendarWidget }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/radarr/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const radarrIntegration: IntegrationDefinition = {
+  name: "Radarr",
+  description:
+    "Radarr is a movie management tool that automates the process of downloading, sorting, and renaming movies.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/radarr.svg",
+  path: "../../integrations/radarr",
+};

apps/docs/docs/integrations/readarr/index.mdx

@@ -0,0 +1,33 @@
+---
+title: 'Readarr'
+description: "Readarr is a book management tool that automates the process of downloading, sorting, and renaming books."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconCalendar } from "@tabler/icons-react";
+import { readarrIntegration } from '.';
+import { calendarWidget } from '@site/docs/widgets/calendar';
+
+
+<IntegrationHeader
+  integration={readarrIntegration}
+  categories={['Media manager', "Servarr"]}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: calendarWidget }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/readarr/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const readarrIntegration: IntegrationDefinition = {
+  name: "Readarr",
+  description:
+    "Readarr is a book management tool that automates the process of downloading, sorting, and renaming books.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/readarr.svg",
+  path: "../../integrations/readarr",
+};

apps/docs/docs/integrations/sabnzbd/index.mdx

@@ -0,0 +1,34 @@
+---
+title: 'SABnzbd'
+description: "SABnzbd is an Open Source Binary Newsreader."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { IconDownload } from "@tabler/icons-react";
+import { sabnzbdIntegration } from '.';
+import Alert from '@theme/Admonition';
+import { downloadsWidget } from '@site/docs/widgets/downloads';
+
+
+<IntegrationHeader
+  integration={sabnzbdIntegration}
+  categories={['Usenet client']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: downloadsWidget}]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: [],
+}]} />

apps/docs/docs/integrations/sabnzbd/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const sabnzbdIntegration: IntegrationDefinition = {
+  name: "SABnzbd",
+  description: "SABnzbd is an Open Source Binary Newsreader.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/sabnzbd.svg",
+  path: "../../integrations/sabnzbd",
+};

apps/docs/docs/integrations/search-ch/index.mdx

@@ -0,0 +1,28 @@
+---
+title: 'Search.ch'
+description: "Search.ch supports searching for timetables in Switzerland."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { IconDownload } from "@tabler/icons-react";
+import { searchChIntegration } from '.';
+import Alert from '@theme/Admonition';
+import { timetableWidget } from '@site/docs/widgets/timetable';
+
+
+<IntegrationHeader
+  integration={searchChIntegration}
+  categories={['Timetable']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: timetableWidget }]}
+/>
+
+### Adding the integration
+<AddingIntegration />

apps/docs/docs/integrations/search-ch/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const searchChIntegration: IntegrationDefinition = {
+  name: "Search.ch",
+  description: "Search.ch supports searching for timetables in Switzerland.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/png/search-ch.png",
+  path: "../../integrations/search-ch",
+};

apps/docs/docs/integrations/seerr/index.mdx

@@ -0,0 +1,45 @@
+---
+title: 'Seerr'
+description: "Seerr is a self-hosted media request management system that integrates with various media servers."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconZoomQuestion, IconChartBar, IconSearch } from "@tabler/icons-react";
+import { seerrIntegration } from '.';
+import { mediaRequestListWidget } from '@site/docs/widgets/media-request-list';
+import { mediaRequestStatsWidget } from '@site/docs/widgets/media-request-stats';
+
+
+<IntegrationHeader
+  integration={seerrIntegration}
+  categories={['Media requests']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: mediaRequestListWidget
+    }, {
+        widget: mediaRequestStatsWidget
+    }, {
+        capability: {
+            icon: IconSearch,
+            name: "Media Search",
+            description: "Search for movies and TV shows directly from Spotlight and request them.",
+            path: "../../management/search-engines/#media-request-search"
+        }
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/seerr/index.ts

@@ -0,0 +1,7 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const seerrIntegration: IntegrationDefinition = {
+  name: "Seerr",
+  description: "Seerr is a self-hosted media request management system that integrates with various media servers.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/seerr.svg",
+  path: "../../integrations/seerr",
+};

apps/docs/docs/integrations/slskd/index.mdx

@@ -0,0 +1,34 @@
+---
+title: 'Slskd'
+description: "A modern client-server application for the Soulseek file sharing network."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { slskdIntegration } from '.';
+import { downloadsWidget } from '@site/docs/widgets/downloads';
+
+
+<IntegrationHeader
+    integration={slskdIntegration}
+    categories={['System Monitoring']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: downloadsWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ["apiKey"],
+    steps: []
+}]} />

apps/docs/docs/integrations/slskd/index.ts

@@ -0,0 +1,11 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const slskdIntegration: IntegrationDefinition = {
+  name: "Slskd",
+  description: "A modern client-server application for the Soulseek file sharing network.",
+  iconUrl: {
+    light: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/slskd.svg",
+    dark: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/slskd.svg",
+  },
+  path: "../../integrations/slskd",
+};

apps/docs/docs/integrations/sonarr/index.mdx

@@ -0,0 +1,33 @@
+---
+title: 'Sonarr'
+description: "Sonarr is a TV series management tool that automates the process of downloading, sorting, and renaming episodes."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconCalendar } from "@tabler/icons-react";
+import { sonarrIntegration } from '.';
+import { calendarWidget } from '@site/docs/widgets/calendar';
+
+
+<IntegrationHeader
+  integration={sonarrIntegration}
+  categories={['Media manager', "Servarr"]}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: calendarWidget }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/sonarr/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+export const sonarrIntegration: IntegrationDefinition = {
+  name: "Sonarr",
+  description:
+    "Sonarr is a TV series management tool that automates the process of downloading, sorting, and renaming episodes.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/sonarr.svg",
+  path: "../../integrations/sonarr",
+};

apps/docs/docs/integrations/speedtest-tracker/index.mdx

@@ -0,0 +1,34 @@
+---
+title: 'Speedtest Tracker'
+description: 'Speedtest Tracker is a self-hosted internet performance tracking application.'
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import { IntegrationSecrets } from '@site/src/components/integrations/secrets';
+import { speedtestTrackerIntegration } from '.';
+import { speedtestTrackerWidget } from '@site/docs/widgets/speedtest-tracker';
+
+
+<IntegrationHeader
+    integration={speedtestTrackerIntegration}
+    categories={['Speedtest']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{
+        widget: speedtestTrackerWidget
+    }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}]} />

apps/docs/docs/integrations/speedtest-tracker/index.ts

@@ -0,0 +1,8 @@
+import { IntegrationDefinition } from "@site/src/types";
+
+export const speedtestTrackerIntegration: IntegrationDefinition = {
+  name: "Speedtest Tracker",
+  description: "Speedtest Tracker is a self-hosted internet performance tracking application.",
+  iconUrl: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/png/speedtest-tracker.png",
+  path: "../../integrations/speedtest-tracker",
+};

apps/docs/docs/integrations/tdarr/index.mdx

@@ -0,0 +1,36 @@
+---
+title: 'Tdarr'
+description: "Tdarr is a distributed media transcoding system that allows you to process and optimize your media files across multiple nodes."
+hide_title: true
+---
+
+import { IntegrationHeader } from '@site/src/components/integrations/header';
+import { IntegrationCapabilites } from '@site/src/components/integrations/widgets';
+import { AddingIntegration } from '@site/src/components/integrations/adding';
+import {IntegrationSecrets} from '@site/src/components/integrations/secrets';
+import { IconTransform } from "@tabler/icons-react";
+import { tdarrIntegration } from '.';
+import { mediaTranscodingWidget } from '@site/docs/widgets/media-transcoding';
+
+
+<IntegrationHeader
+  integration={tdarrIntegration}
+  categories={['Media Transcoding']}
+/>
+
+### Widgets & Capabilities
+<IntegrationCapabilites
+    items={[{ widget: mediaTranscodingWidget }]}
+/>
+
+### Adding the integration
+<AddingIntegration />
+
+### Secrets
+<IntegrationSecrets secrets={[{
+    credentials: ['apiKey'],
+    steps: []
+}, {
+    credentials: [],
+    steps: []
+}]} />