Compare commits

...

4 Commits

Author SHA1 Message Date
alex 96e6177d86 docs: refresh README 2026-07-27 15:24:01 +02:00
Developer 0866dc4136 feat(qbittorrent): show share ratio for active torrents 2026-07-21 12:36:03 +00:00
Developer 11f093cd2c fix(qbittorrent): preserve torrent metadata in incremental updates 2026-07-21 12:27:04 +00:00
Developer 1bf8a34a97 fix(charting): remove duplicate range selector 2026-07-15 19:15:06 +00:00
14 changed files with 155 additions and 164 deletions
+89 -135
View File
@@ -1,62 +1,67 @@
# Manage
Manage is a media and server operations tool with Jellyfin integration, SSH file inspection, server monitoring, and safe remote job templates.
Manage is a media and server-operations application with Jellyfin integration, SSH file inspection, monitoring integrations, safe remote-job templates, a FastAPI backend, and a React single-page application.
See `docs/REQUIREMENTS.md` for the living requirements, decisions, and planning history.
See `docs/MIGRATION_PLAN.md` for the FastAPI + React architecture plan.
It includes a configurable dashboard, service registry, per-machine settings, a SQLite-indexed media library, a read-only Users view with optional Jellyseerr enrichment, remote file browsing with `ffprobe`, and SSH-based job execution.
Project policy/docs:
## Architecture and scope
- License: `LICENSE` (MIT)
- Contributing guide: `CONTRIBUTING.md`
- `backend/` is the FastAPI API.
- `frontend/` is the React and TypeScript SPA.
- `archive/` retains the original Streamlit prototype for reference.
## Architecture
The root Compose files deploy **only** Manage's backend and frontend. Manage can expose `/metrics` and optional Alertmanager proxy endpoints, but it does not deploy Grafana, Prometheus, Loki, Alertmanager, Alloy, or Node Exporter as part of its normal stack. Configure service instances in the app's Services page.
The project consists of two subprojects:
## Prerequisites
- **`backend/`** — FastAPI Python API (see `backend/README.md`)
- **`frontend/`** — React + TypeScript SPA (see `frontend/README.md`)
- **`archive/`** — Original Streamlit prototype (preserved for reference)
- Docker and Docker Compose for the supplied Compose stacks.
- Python 3.11 or newer for manual backend development.
- Node.js and npm for manual frontend development.
- A valid Fernet key for `MANAGE_ENCRYPTION_KEY`, including in development Compose.
- For production: an existing external Docker network named `web`, Traefik, DNS/TLS configuration, and an OIDC provider.
## Features
## Local development with Compose
- Configurable dashboard with persisted widgets (Jellyfin activity, backups summary, Grafana deep-links, Prometheus metrics, Alertmanager alerts, SSH task output, static text) and shortcuts
- Thin-dashboard observability: Alertmanager alerts, Prometheus target health, machine status, and Grafana deep-links (no in-app charting)
- Service registry: configure Jellyfin, Jellyseerr, Alertmanager, Grafana, Prometheus, Nextcloud, and SSH task runner instances in the UI
- Per-machine settings for SSH, monitoring targets, and file browsing
- SQLite-indexed media table with full-library sort/filter
- Read-only Users tab with Jellyfin as the base source and optional Jellyseerr enrichment
- Remote file browser with ffprobe preview and job execution
- Jellyfin API integration for library metadata and user identity data
- SSH-based file inspection and safe remote job templates
1. Create `.env` from the template and set a valid `MANAGE_ENCRYPTION_KEY`. Docker Compose automatically reads `.env` for interpolation; alternatively, export the same variables in the shell.
## Quick Start
```bash
cp .env.example .env
```
### Docker Compose (recommended)
Generate a Fernet key if needed:
Production-style deployment with the frontend serving the SPA and proxying `/api` to the backend. The compose files rely on environment-variable interpolation, so export the required values in your shell before running them (no `env_file` is needed):
```bash
python -c "from cryptography.fernet import Fernet; print(Fernet.generate_key().decode())"
```
2. Start the development stack:
```bash
docker compose -f docker-compose.dev.yml up --build
```
The development frontend is available at <http://localhost:5173> and the backend at <http://localhost:8000>. Development Compose sets `AUTH_ENABLED=false` and `VITE_OIDC_ENABLED=false`, but still requires `MANAGE_ENCRYPTION_KEY`. The backend cache, settings database, media index, saved SSH keys, tasks, and dashboard widgets persist outside rebuilt containers.
## Production-style deployment
The root [`docker-compose.yml`](docker-compose.yml) is designed for deployment behind Traefik; it does not publish localhost ports. Before starting it, configure `.env` (or shell variables) with the required values:
- `BACKEND_APP_HOST`, `FRONTEND_APP_HOST`, and `CERT_RESOLVER` for Traefik routing and certificates.
- `OIDC_ISSUER_URL` and `OIDC_AUDIENCE` for backend authentication.
- `VITE_OIDC_ISSUER`, `VITE_OIDC_CLIENT_ID`, `VITE_OIDC_REDIRECT_URI`, and `VITE_OIDC_POST_LOGOUT_REDIRECT_URI` for the frontend build.
- `MANAGE_ENCRYPTION_KEY`, a valid Fernet key used to encrypt service secrets at rest.
Then run:
```bash
docker compose up --build
```
Open the app at <http://localhost:8080>.
The production Compose file requires its external `web` network to exist. It is not a standalone local deployment; access is through the configured Traefik hostnames.
The production Compose file requires OIDC and Traefik variables; see [Configuration](#configuration) below. Copy `.env.example` to `.env`, fill in the required values, and export them in your shell before running `docker compose up`.
## Manual development
> **Observability is external.** Manage only ships its **backend** and **frontend**. It does **not** deploy Grafana, Prometheus, Loki, Alertmanager, Alloy, or Node Exporter. The backend exposes a `/metrics` endpoint and optional Alertmanager proxy endpoints so an *existing* observability deployment can scrape and consume them. For a ready-to-run example stack you can deploy alongside Manage, see [`docker-compose.observability.yml`](docker-compose.observability.yml) and [`docs/observability-runbooks.md`](docs/observability-runbooks.md).
Local development with hot reload:
```bash
docker compose -f docker-compose.dev.yml up --build
```
Frontend runs on <http://localhost:5173> and the backend on <http://localhost:8000>. Dev compose disables OIDC by default (`AUTH_ENABLED=false`), so you can open it directly without an identity provider.
The backend media index and settings database (including monitoring machines, SSH keys, saved tasks, and dashboard widgets) are persisted in Docker volumes so rebuilds and container restarts do not reset state.
### Manual backend/frontend development
### Backend
```bash
cd backend
@@ -66,126 +71,75 @@ pip install -e '.[dev]'
uvicorn media_library_viewer_api.main:app --reload --port 8000
```
### Frontend
```bash
cd frontend
npm install
npm run dev
```
## Configuration
The Compose files use environment-variable interpolation. Export the required variables in your shell or pass them inline; a `.env` file is optional, not required.
### Compose examples
Production-style example with shell exports:
## Tests and quality checks
```bash
export BACKEND_APP_HOST=api.manage.example.com
export FRONTEND_APP_HOST=manage.example.com
export CERT_RESOLVER=letsencrypt
export VITE_OIDC_ISSUER=https://auth.example.com/application/o/manage/
export VITE_OIDC_CLIENT_ID=manage
export VITE_OIDC_REDIRECT_URI=https://manage.example.com/oidc/callback
export VITE_OIDC_POST_LOGOUT_REDIRECT_URI=https://manage.example.com/
export MANAGE_ENCRYPTION_KEY=$(python -c "from cryptography.fernet import Fernet; print(Fernet.generate_key().decode())")
# Backend
cd backend
ruff check .
python -m pytest
docker compose up --build
# Frontend
cd ../frontend
npm run lint
npm run build
npm run test
```
> Observability services (Grafana, Prometheus, Alertmanager) are configured in
> the app on the **Services** page — no env vars for them.
A focused frontend typecheck can be run with `npx tsc --noEmit` from `frontend/`.
Inline one-liner example:
## Configuration and operations
```bash
BACKEND_APP_HOST=api.manage.example.com FRONTEND_APP_HOST=manage.example.com CERT_RESOLVER=letsencrypt VITE_OIDC_ISSUER=https://auth.example.com/application/o/manage/ VITE_OIDC_CLIENT_ID=manage VITE_OIDC_REDIRECT_URI=https://manage.example.com/oidc/callback VITE_OIDC_POST_LOGOUT_REDIRECT_URI=https://manage.example.com/ docker compose up --build
```
[`.env.example`](.env.example) is a template; do not commit real credentials or encryption keys. The Compose files interpolate environment values directly. Some template entries are for the optional observability example and are not consumed by the normal Manage Compose stack.
For local development, no SSH key is required unless you want to connect to remote SSH machines later:
Optional SMTP settings (`SMTP_HOST`, `SMTP_PORT`, `SMTP_USERNAME`, `SMTP_PASSWORD`, `SMTP_FROM_ADDRESS`, `SMTP_FROM_NAME`, `SMTP_USE_TLS`, `SMTP_USE_SSL`, and `SMTP_TIMEOUT`) support the Users message popup.
```bash
docker compose -f docker-compose.dev.yml up --build
```
### Remote servers
Example environment variables:
```bash
# Optional backend logging level
LOG_LEVEL=INFO
# Optional SMTP settings for the Users -> message popup
SMTP_HOST=smtp.example.com
SMTP_PORT=587
SMTP_USERNAME=your-smtp-username
SMTP_PASSWORD=your-smtp-password
SMTP_FROM_ADDRESS=no-reply@example.com
SMTP_FROM_NAME=Manage
SMTP_USE_TLS=true
SMTP_USE_SSL=false
SMTP_TIMEOUT=30
# Jellyfin, Jellyseerr, and SSH targets are now configured per machine in the app's Settings tab.
# The backend seeds a local machine automatically, so no global Jellyfin or SSH env vars are required.
#
# Remote SSH machines can store their private key and optional passphrase directly in Settings,
# so no SSH key mount is required for normal use.
# Authentik / OIDC
AUTH_ENABLED=true
OIDC_ISSUER_URL=https://auth.example.com/application/o/manage/
OIDC_AUDIENCE=manage
OIDC_JWKS_URL=
OIDC_CLOCK_SKEW_SECONDS=30
# Frontend OIDC settings
VITE_OIDC_ENABLED=true
VITE_OIDC_ISSUER=https://auth.example.com/application/o/manage/
VITE_OIDC_CLIENT_ID=manage
VITE_OIDC_SCOPE=openid profile email
VITE_OIDC_REDIRECT_URI=https://manage.example.com/oidc/callback
VITE_OIDC_POST_LOGOUT_REDIRECT_URI=https://manage.example.com/
# Observability services (Grafana, Prometheus, Alertmanager) are configured in
# the app on the Services page. The only observability env var is the optional
# PROMETHEUS_ENABLED toggle (defaults on) for Manage's own /metrics endpoint.
# Required: master key encrypting service secrets (API keys/tokens) at rest.
# Generate one with: python -c "from cryptography.fernet import Fernet; print(Fernet.generate_key().decode())"
MANAGE_ENCRYPTION_KEY=replace-with-a-fernet-key
```
## Remote server requirements
The remote server needs:
- `/bin/sh` (POSIX shell)
- `python3`, `ffprobe`, `find`, `stat`, `df`, `awk` for file inspection and job templates
- SSH access with a key configured in the app's Settings tab
The SSH client rejects unknown host keys. Connect manually once first:
A managed remote server needs a POSIX `/bin/sh`, `python3`, `ffprobe`, `find`, `stat`, `df`, and `awk`. Configure its SSH credentials in Manage's Settings. Unknown SSH host keys are rejected; establish trust first, for example:
```bash
ssh user@host
```
## Development
SSH commands run through `/bin/sh -c` regardless of the remote login shell.
### Optional observability example
[`docker-compose.observability.yml`](docker-compose.observability.yml) is a separate, optional stack for Grafana, Prometheus, Loki, Alertmanager, Alloy, and Node Exporter. It is not required by Manage. Its header documents required `*_ROOT` persistence directories, `CERT_RESOLVER`, and Grafana/Prometheus/Alertmanager host variables. With those prepared, run:
```bash
# Backend (lint + tests)
cd backend && .venv/bin/ruff check . && .venv/bin/python -m pytest
# Frontend (lint + typecheck/build + tests)
cd frontend && npm run lint && npm run build && npm run test
docker compose -f docker-compose.observability.yml up -d
```
Focused frontend typecheck: `npx tsc --noEmit`.
Set a non-default `GRAFANA_ADMIN_USER` and a strong, secret `GRAFANA_ADMIN_PASSWORD` before deploying this stack. Do not expose the example observability services with their defaults.
## Notes
See [`docs/observability-runbooks.md`](docs/observability-runbooks.md) for its operational documentation.
- Jellyfin server root URL required (not `/web`). The client strips trailing `/web` defensively.
- SSH commands run through `/bin/sh -c` regardless of remote login shell.
- Job templates are shell-quoted. Add new templates in `backend/src/media_library_viewer_api/jobs.py`.
- Root-level Docker Compose files are provided for production (`docker-compose.yml`) and local development (`docker-compose.dev.yml`), and both rely on Compose interpolation rather than `env_file` entries. They deploy **only** the backend and frontend; Manage never deploys its own observability stack (see `docker-compose.observability.yml` for an optional standalone example).
- The configurable dashboard stores widget instances in the backend SQLite settings database. New installs seed default Jellyfin activity and Backups widgets automatically.
- Grafana, Prometheus, and Alertmanager are configured as **service instances** in the app (Services page); their widget adapters resolve URLs from service records, and no observability URLs/credentials live in env vars. No credentials are stored in widget config; service API keys are encrypted at rest with `MANAGE_ENCRYPTION_KEY`. When no alertmanager service is configured, the alert proxy endpoints return graceful "not configured" responses.
## Repository layout
```text
.
├── backend/ # FastAPI API and tests
├── frontend/ # React/TypeScript SPA and tests
├── archive/ # Preserved Streamlit prototype
├── docs/ # Requirements, migration, and operations docs
├── docker-compose.yml # Traefik-backed production-style stack
├── docker-compose.dev.yml # Local hot-reload development stack
└── docker-compose.observability.yml # Optional standalone observability example
```
## Project documents
- [Requirements and planning history](docs/REQUIREMENTS.md)
- [FastAPI + React migration plan](docs/MIGRATION_PLAN.md)
- [Contributing guide](CONTRIBUTING.md)
- [MIT license](LICENSE)
@@ -220,7 +220,12 @@ class QbittorrentClient:
if fields is None:
snap["torrents"].pop(hash_, None)
else:
snap["torrents"][hash_] = fields
previous = snap["torrents"].get(hash_)
snap["torrents"][hash_] = (
{**previous, **fields}
if isinstance(previous, dict) and isinstance(fields, dict)
else fields
)
for hash_ in update.get("torrents_removed") or []:
snap["torrents"].pop(hash_, None)
categories = update.get("categories")
@@ -547,6 +547,7 @@ class QbittorrentWidgetSource:
"direction": direction,
"size": torrent.get("size"),
"progress": torrent.get("progress"),
"ratio": torrent.get("ratio"),
"dl_speed": torrent.get("dlspeed"),
"up_speed": torrent.get("upspeed"),
}
+17 -5
View File
@@ -125,13 +125,21 @@ class QbittorrentClientTests(unittest.TestCase):
"rid": 10,
"full_update": True,
"server_state": {"dl_info_speed": 100},
"torrents": {"a": {"name": "A", "state": "downloading"}},
"torrents": {
"a": {
"name": "A",
"state": "downloading",
"size": 1_024,
"progress": 0.5,
"dlspeed": 100,
}
},
}
partial = {
"rid": 11,
"full_update": False,
"server_state": {"dl_info_speed": 200},
"torrents": {"a": {"name": "A", "state": "pausedDL"}},
"torrents": {"a": {"dlspeed": 200}},
}
self.session.get.side_effect = [self._get_response(full), self._get_response(partial)]
@@ -143,7 +151,11 @@ class QbittorrentClientTests(unittest.TestCase):
r2 = self.client.maindata()
self.assertEqual(self.session.get.call_args_list[1].kwargs["params"].get("rid"), 10)
self.assertEqual(r2["server_state"]["dl_info_speed"], 200) # merged
self.assertEqual(r2["torrents"]["a"]["state"], "pausedDL") # merged
self.assertEqual(r2["torrents"]["a"]["dlspeed"], 200)
self.assertEqual(r2["torrents"]["a"]["name"], "A")
self.assertEqual(r2["torrents"]["a"]["state"], "downloading")
self.assertEqual(r2["torrents"]["a"]["size"], 1_024)
self.assertEqual(r2["torrents"]["a"]["progress"], 0.5)
def test_maindata_caches_concurrent_calls_within_ttl(self) -> None:
"""Two calls within the TTL collapse to a single HTTP fetch."""
@@ -227,8 +239,8 @@ class QbittorrentClientTests(unittest.TestCase):
self.session.post.return_value = self._login_response()
self.client._login()
call_kwargs = self.session.post.call_args.kwargs
assert call_kwargs["timeout"] == (5.0, 5.0)
assert not isinstance(call_kwargs["timeout"], int)
self.assertEqual(call_kwargs["timeout"], (5.0, 5.0))
self.assertNotIsInstance(call_kwargs["timeout"], int)
def test_login_fails_message_names_bad_credentials(self) -> None:
"""'Fails.' body yields a clear 'invalid username or password' error."""
+3
View File
@@ -1085,6 +1085,7 @@ def _fake_qbit_maindata():
"state": "downloading",
"size": 1000,
"progress": 0.5,
"ratio": 1.25,
"dlspeed": 500,
"upspeed": 10,
},
@@ -1093,6 +1094,7 @@ def _fake_qbit_maindata():
"state": "uploading",
"size": 2000,
"progress": 1.0,
"ratio": 0.5,
"dlspeed": 0,
"upspeed": 100,
},
@@ -1178,6 +1180,7 @@ async def test_qbittorrent_active_filters_current_transfers_only():
assert len(active) == 2
names = [torrent["name"] for torrent in active]
assert names == ["Movie.mkv", "Show.mkv"]
assert [torrent["ratio"] for torrent in active] == [1.25, 0.5]
assert all((torrent["dl_speed"] or 0) > 0 or (torrent["up_speed"] or 0) > 0 for torrent in active)
+6 -1
View File
@@ -46,7 +46,7 @@ fully removed (web-ui-rework; see decision log 2026-06-17).
### Tables
- All in-app time-series widgets should use the shared range-aware `LineSeriesChart` component so range controls, filtering, and display formatting remain consistent across Prometheus and qBittorrent charts. The selector offers 5 minutes, 15 minutes, 30 minutes, 1 hour, 3 hours, 6 hours, 12 hours, 24 hours, 2 days, 7 days, 14 days, 30 days, and **All values**; sources with bounded local retention expose the finite windows they can retain plus all retained values.
- All in-app time-series widgets should use the shared range-aware `LineSeriesChart` component so filtering and display formatting remain consistent across Prometheus and qBittorrent charts. A dashboard widget's configured window is its single source of range selection and the card renders the complete configured response; the standalone qBittorrent service-history page retains an interactive selector with **All values** for all retained samples.
- Tabular surfaces use **TanStack Table** (`@tanstack/react-table`) behind a `DataTable`
wrapper (`components/ui/data-table.tsx`).
@@ -321,6 +321,11 @@ These do not reference a service.
- The scheduler should run immediately after startup with per-service staggering, use fixed-delay execution, prevent overlap/backlog, and reconcile configuration changes without a backend restart.
- Poll failures should remain enabled, be persisted, and retry with bounded exponential backoff. A successful scheduled or manual run should clear backoff.
- The qBittorrent widget-data endpoint must become read-only; only the scheduler may contact qBittorrent and append samples.
- The qBittorrent client must merge incremental torrent patches with the prior
snapshot so active-transfer rows retain their name, size, progress, and state
when only throughput changes.
- Active-torrent entries must show each torrent's qBittorrent share ratio
(uploaded ÷ downloaded) alongside its size and completion progress.
- The service UI should expose polling settings, current status, stale-data state, a manual `Run now` action, the shared selectable chart windows, an **All values** option that fetches every retained speed sample, and paginated scheduled-action history.
- Scheduled-action runs should use dedicated generic records, retain at most 30 days or 1,000 runs per service/action, and never store secrets or raw credentials.
- Disabling a qBittorrent service pauses polling while retaining history; deleting the service purges its samples and scheduler history through the existing cascade-delete behavior.
+7 -3
View File
@@ -76,6 +76,8 @@ interface LineSeriesChartProps {
scale?: MetricScale;
/** Available displayed time ranges. Defaults to the shared range choices. */
rangeOptions?: readonly ChartRangeOption[];
/** Whether to render the interactive range selector. */
showRangeSelector?: boolean;
/** Initial uncontrolled range. Defaults to the largest numeric option. */
defaultRangeSeconds?: ChartRangeValue;
/** Controlled range for consumers that refetch when the selection changes. */
@@ -90,6 +92,7 @@ export function LineSeriesChart({
unit = "none",
scale = "auto",
rangeOptions = DEFAULT_CHART_RANGES,
showRangeSelector = true,
defaultRangeSeconds,
rangeSeconds,
onRangeChange,
@@ -98,8 +101,9 @@ export function LineSeriesChart({
defaultRangeSeconds ??
[...rangeOptions].reverse().find((range) => typeof range.value === "number")
?.value;
const [localRangeSeconds, setLocalRangeSeconds] =
useState<ChartRangeValue | undefined>(initialRange);
const [localRangeSeconds, setLocalRangeSeconds] = useState<
ChartRangeValue | undefined
>(initialRange);
const selectedRangeSeconds = rangeSeconds ?? localRangeSeconds;
const latestTimestamp = series.reduce(
(max, seriesItem) =>
@@ -140,7 +144,7 @@ export function LineSeriesChart({
return (
<div className="space-y-2">
{rangeOptions.length > 0 && (
{showRangeSelector && rangeOptions.length > 0 && (
<div className="flex justify-end">
<Select
value={
@@ -38,6 +38,13 @@ describe("LineSeriesChart", () => {
).toHaveTextContent("2 hours");
});
it("can hide the interactive selector for configured widgets", () => {
render(<LineSeriesChart series={[]} showRangeSelector={false} />);
expect(
screen.queryByRole("combobox", { name: "Chart range" }),
).not.toBeInTheDocument();
});
it("offers all loaded values and reports that selection", () => {
const onRangeChange = vi.fn();
render(
+1 -7
View File
@@ -1,10 +1,6 @@
import { Alert, AlertDescription } from "@/components/ui/alert";
import { Skeleton } from "@/components/ui/skeleton";
import { LineSeriesChart } from "../components/LineSeriesChart";
import {
chartRangesThrough,
rangeSecondsFromWindow,
} from "../components/chartRanges";
import type { ChartSeries } from "../components/LineSeriesChart";
import type { MetricScale, MetricUnit } from "../lib/metricFormat";
import { SectionCard } from "../components/SectionCard";
@@ -24,7 +20,6 @@ export function MetricChartWidget({
}: Props) {
const { data, isLoading } = useWidgetData(widget.id, refreshIntervalMs);
const series = data?.data?.series as ChartSeries[] | undefined;
const maxRangeSeconds = rangeSecondsFromWindow(widget.config.window);
return (
<SectionCard title={widget.title} description={description}>
@@ -39,8 +34,7 @@ export function MetricChartWidget({
series={series}
unit={widget.config.unit as MetricUnit}
scale={widget.config.scale as MetricScale}
rangeOptions={chartRangesThrough(maxRangeSeconds)}
defaultRangeSeconds={maxRangeSeconds}
showRangeSelector={false}
/>
) : (
<Alert>
@@ -17,6 +17,7 @@ interface ActiveTorrent {
direction?: "downloading" | "uploading";
size: number | null;
progress: number | null;
ratio: number | null;
dl_speed: number | null;
up_speed: number | null;
}
@@ -40,6 +41,12 @@ function formatProgress(progress: number | null): string {
return `${Math.round(progress * 100)}% complete`;
}
function formatRatio(ratio: number | null): string {
if (ratio === null || !Number.isFinite(ratio) || ratio < 0)
return "Ratio unknown";
return `Ratio ${ratio.toFixed(2)}`;
}
function formatState(
state: string | null,
direction?: ActiveTorrent["direction"],
@@ -103,7 +110,8 @@ export function QbittorrentActiveTorrentsWidget({
</p>
<p className="text-xs text-muted-foreground">
{formatSize(torrent.size)} ·{" "}
{formatProgress(torrent.progress)}
{formatProgress(torrent.progress)} ·{" "}
{formatRatio(torrent.ratio)}
</p>
</div>
<Badge
@@ -1,10 +1,6 @@
import { Alert, AlertDescription } from "@/components/ui/alert";
import { Skeleton } from "@/components/ui/skeleton";
import { LineSeriesChart } from "../components/LineSeriesChart";
import {
chartRangesThrough,
type ChartRangeValue,
} from "../components/chartRanges";
import type { ChartSeries } from "../components/LineSeriesChart";
import type { MetricScale, MetricUnit } from "../lib/metricFormat";
import { SectionCard } from "../components/SectionCard";
@@ -27,11 +23,6 @@ export function QbittorrentSpeedWidget({
// Source returns raw bytes/sec; default to bytes/sec + auto scale (MB/s, …).
const unit = (widget.config.unit as MetricUnit) || "bytes_per_sec";
const scale = (widget.config.scale as MetricScale) || "auto";
const configuredRange = widget.config.window_seconds;
const maxRangeSeconds =
configuredRange === "all" ? 86_400 : Number(configuredRange) || 1800;
const defaultRangeSeconds: ChartRangeValue =
configuredRange === "all" ? "all" : maxRangeSeconds;
return (
<SectionCard title={widget.title} description={description}>
@@ -47,8 +38,7 @@ export function QbittorrentSpeedWidget({
unit={unit}
scale={scale}
height={220}
rangeOptions={chartRangesThrough(maxRangeSeconds)}
defaultRangeSeconds={defaultRangeSeconds}
showRangeSelector={false}
/>
) : (
<Alert>
@@ -56,6 +56,9 @@ describe("MetricChartWidget", () => {
render(<MetricChartWidget widget={widget} refreshIntervalMs={60000} />);
// recharts renders an SVG; the title from SectionCard should be present.
expect(screen.getByText("CPU Usage")).toBeInTheDocument();
expect(
screen.queryByRole("combobox", { name: "Chart range" }),
).not.toBeInTheDocument();
});
it("shows error Alert on error", () => {
@@ -54,6 +54,7 @@ describe("QbittorrentActiveTorrentsWidget", () => {
state: "downloading",
size: 1000,
progress: 0.5,
ratio: 1.25,
dl_speed: 500000,
up_speed: 1000,
},
@@ -77,6 +78,7 @@ describe("QbittorrentActiveTorrentsWidget", () => {
expect(screen.getByText("Show.mkv")).toBeInTheDocument();
expect(screen.getByText("Downloading")).toBeInTheDocument();
expect(screen.getByText("Uploading")).toBeInTheDocument();
expect(screen.getByText(/Ratio 1\.25/)).toBeInTheDocument();
});
it("shows empty state when no active torrents", () => {
@@ -52,6 +52,9 @@ describe("QbittorrentSpeedWidget", () => {
<QbittorrentSpeedWidget widget={widget} refreshIntervalMs={5000} />,
);
expect(screen.getByText("Speed Chart")).toBeInTheDocument();
expect(
screen.queryByRole("combobox", { name: "Chart range" }),
).not.toBeInTheDocument();
expect(container.firstChild).not.toBeNull();
});