mirror of
https://github.com/gethomepage/homepage.git
synced 2026-08-31 01:15:53 -07:00
Compare commits
12 Commits
v2.1.2
...
793ad699b6
| Author | SHA1 | Date | |
|---|---|---|---|
| 793ad699b6 | |||
| e6ad43a76c | |||
| c46b3e6cff | |||
| e913243149 | |||
| 99e16c6da0 | |||
| c0b6eb3501 | |||
| a17763ca9f | |||
| bd39fb48b9 | |||
| f2dc80e39e | |||
| 7d48b7ea78 | |||
| 4c361422ca | |||
| 7c26cf6d97 |
@@ -10,6 +10,7 @@ version-resolver:
|
||||
- 'breaking-change'
|
||||
minor:
|
||||
labels:
|
||||
- 'minor'
|
||||
- 'enhancement'
|
||||
- 'feature'
|
||||
patch:
|
||||
|
||||
@@ -10,6 +10,10 @@ on:
|
||||
]
|
||||
branches: [ dev ]
|
||||
|
||||
permissions:
|
||||
contents: write
|
||||
pull-requests: write
|
||||
|
||||
jobs:
|
||||
synchronize-with-crowdin:
|
||||
name: Crowdin Sync
|
||||
@@ -19,7 +23,7 @@ jobs:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
|
||||
- name: crowdin action
|
||||
uses: crowdin/github-action@c7af9bc98b01694653031fef2a0dc6c7888ce9bc # v2
|
||||
uses: crowdin/github-action@8f01d54f70f1713ee3f09d82c2bbb2daeac28689 # v2
|
||||
with:
|
||||
upload_translations: false
|
||||
download_translations: true
|
||||
|
||||
@@ -17,6 +17,8 @@ on:
|
||||
env:
|
||||
IMAGE_NAME: ${{ github.repository }}
|
||||
|
||||
permissions: {}
|
||||
|
||||
jobs:
|
||||
|
||||
|
||||
@@ -27,7 +29,6 @@ jobs:
|
||||
permissions:
|
||||
contents: read
|
||||
packages: write
|
||||
id-token: write
|
||||
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
@@ -101,7 +102,7 @@ jobs:
|
||||
uses: docker/setup-qemu-action@96fe6ef7f33517b61c61be40b68a1882f3264fb8 # v4.2.0
|
||||
|
||||
- name: Setup Docker buildx
|
||||
uses: docker/setup-buildx-action@bb05f3f5519dd87d3ba754cc423b652a5edd6d2c # v4
|
||||
uses: docker/setup-buildx-action@37fe631027851001ddb9b187196cc803df7f5f0e # v4
|
||||
|
||||
- name: Build and push Docker image
|
||||
id: build-and-push
|
||||
|
||||
@@ -10,8 +10,6 @@ on:
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
pages: write
|
||||
id-token: write
|
||||
|
||||
jobs:
|
||||
|
||||
@@ -25,7 +23,7 @@ jobs:
|
||||
with:
|
||||
python-version-file: ".python-version"
|
||||
- name: Install uv
|
||||
uses: astral-sh/setup-uv@ae62891fec2bb8e7d6c99fc78c9fec3a63790f8d # v10.0.0
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
- run: sudo apt-get install pngquant
|
||||
- name: Test Docs Build
|
||||
run: uv run --frozen zensical build --clean
|
||||
@@ -33,6 +31,10 @@ jobs:
|
||||
name: Build & Deploy Docs
|
||||
if: github.repository == 'gethomepage/homepage' && github.event_name != 'pull_request' && github.ref == 'refs/heads/main'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
contents: read
|
||||
pages: write
|
||||
id-token: write
|
||||
environment:
|
||||
name: github-pages
|
||||
url: ${{ steps.deployment.outputs.page_url }}
|
||||
@@ -43,7 +45,7 @@ jobs:
|
||||
with:
|
||||
python-version-file: ".python-version"
|
||||
- name: Install uv
|
||||
uses: astral-sh/setup-uv@ae62891fec2bb8e7d6c99fc78c9fec3a63790f8d # v10.0.0
|
||||
uses: astral-sh/setup-uv@20cfd1bf945f4377ade1205e4dbc17946fc9a30d # v10.0.1
|
||||
- run: sudo apt-get install pngquant
|
||||
- name: Build Docs
|
||||
run: uv run --frozen zensical build --clean
|
||||
|
||||
@@ -6,15 +6,15 @@ on:
|
||||
discussion:
|
||||
types: [labeled]
|
||||
|
||||
permissions:
|
||||
discussions: write
|
||||
issues: write
|
||||
permissions: {}
|
||||
|
||||
jobs:
|
||||
close-needs-discussion:
|
||||
name: Issues Need Discussion
|
||||
if: github.event_name == 'issues' && github.event.label.name == 'needs-discussion'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
issues: write
|
||||
steps:
|
||||
- uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
|
||||
with:
|
||||
@@ -49,6 +49,8 @@ jobs:
|
||||
name: Discussions Need Information
|
||||
if: github.event_name == 'discussion' && github.event.label.name == 'needs-information'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
discussions: write
|
||||
steps:
|
||||
- uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
|
||||
with:
|
||||
|
||||
@@ -6,6 +6,9 @@ on:
|
||||
workflow_dispatch:
|
||||
merge_group:
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
lint:
|
||||
name: Linting Checks
|
||||
|
||||
@@ -2,7 +2,6 @@ name: PR Quality
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
issues: read
|
||||
pull-requests: write
|
||||
|
||||
on:
|
||||
|
||||
@@ -5,7 +5,6 @@ on:
|
||||
types: [labeled]
|
||||
|
||||
permissions:
|
||||
issues: write
|
||||
pull-requests: write
|
||||
|
||||
jobs:
|
||||
|
||||
@@ -5,10 +5,7 @@ on:
|
||||
- cron: '0 3 * * *'
|
||||
workflow_dispatch:
|
||||
|
||||
permissions:
|
||||
issues: write
|
||||
pull-requests: write
|
||||
discussions: write
|
||||
permissions: {}
|
||||
|
||||
concurrency:
|
||||
group: lock
|
||||
@@ -17,6 +14,9 @@ jobs:
|
||||
stale:
|
||||
name: 'Stale'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
issues: write
|
||||
pull-requests: write
|
||||
steps:
|
||||
- uses: actions/stale@1e223db275d687790206a7acac4d1a11bd6fe629 # v10
|
||||
with:
|
||||
@@ -31,6 +31,10 @@ jobs:
|
||||
lock-threads:
|
||||
name: 'Lock Old Threads'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
discussions: write
|
||||
issues: write
|
||||
pull-requests: write
|
||||
steps:
|
||||
- uses: dessant/lock-threads@89ae32b08ed1a541efecbab17912962a5e38981c # v6.0.2
|
||||
with:
|
||||
@@ -56,6 +60,8 @@ jobs:
|
||||
close-answered-discussions:
|
||||
name: 'Close Answered Discussions'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
discussions: write
|
||||
steps:
|
||||
- uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
|
||||
with:
|
||||
@@ -112,6 +118,8 @@ jobs:
|
||||
close-outdated-discussions:
|
||||
name: 'Close Outdated Discussions'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
discussions: write
|
||||
steps:
|
||||
- uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
|
||||
with:
|
||||
@@ -203,6 +211,8 @@ jobs:
|
||||
close-unsupported-feature-requests:
|
||||
name: 'Close Unsupported Feature Requests'
|
||||
runs-on: ubuntu-latest
|
||||
permissions:
|
||||
discussions: write
|
||||
steps:
|
||||
- uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
|
||||
with:
|
||||
|
||||
@@ -5,6 +5,9 @@ on:
|
||||
push:
|
||||
workflow_dispatch:
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
|
||||
jobs:
|
||||
vitest:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
@@ -85,6 +85,7 @@ To ensure cohesiveness of various widgets, the following should be used as a gui
|
||||
- Note that we reserve the right to decline widgets for projects that are very young (eg < ~1y) or those with a small reach (eg low GitHub stars). Again, this is in an effort to keep overall widget maintenance under control.
|
||||
- Widgets should be only one row of blocks
|
||||
- Widgets should be no more than 4 blocks wide and generally conform to the styling / design choices of other widgets
|
||||
- Use `withWidgetFields(service, defaultFields)` from `utils/widget-fields` to apply default fields and cap configured fields without mutating the service. The helper limits widgets to 4 fields.
|
||||
- Minimize the number of API calls
|
||||
- Avoid the use of custom proxy unless absolutely necessary
|
||||
- Widgets should be 'read-only', as in they should not make write changes using the relevant tool's API. Homepage widgets are designed to surface information, not to be a (usually worse) replacement for the tool itself.
|
||||
|
||||
@@ -15,5 +15,5 @@ widget:
|
||||
url: https://proxmoxbackupserver.host:port
|
||||
username: api_token_id
|
||||
password: api_token_secret
|
||||
datastore: datastore_name #optional; if ommitted, will display a combination of all datastores used / total
|
||||
datastore: datastore_name #optional; if omitted, will display a combination of all datastores used / total
|
||||
```
|
||||
|
||||
@@ -65,24 +65,6 @@ export default defineConfig([
|
||||
allowElseIf: true,
|
||||
},
|
||||
],
|
||||
|
||||
// Keep the pre-eslint-plugin-react-hooks v6 lint policy until rules are adopted incrementally
|
||||
"react-hooks/config": "off",
|
||||
"react-hooks/error-boundaries": "off",
|
||||
"react-hooks/exhaustive-deps": "warn",
|
||||
"react-hooks/gating": "off",
|
||||
"react-hooks/globals": "off",
|
||||
"react-hooks/immutability": "off",
|
||||
"react-hooks/incompatible-library": "off",
|
||||
"react-hooks/preserve-manual-memoization": "off",
|
||||
"react-hooks/purity": "off",
|
||||
"react-hooks/refs": "off",
|
||||
"react-hooks/rules-of-hooks": "error",
|
||||
"react-hooks/set-state-in-effect": "off",
|
||||
"react-hooks/set-state-in-render": "off",
|
||||
"react-hooks/static-components": "off",
|
||||
"react-hooks/unsupported-syntax": "off",
|
||||
"react-hooks/use-memo": "off",
|
||||
},
|
||||
},
|
||||
// Vitest tests often intentionally place imports after `vi.mock(...)` to ensure
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10"><circle cx="5" cy="5" r="4"/></svg>
|
||||
|
After Width: | Height: | Size: 96 B |
@@ -39,7 +39,9 @@
|
||||
"wait": "Wag asseblief"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Soek…"
|
||||
"placeholder": "Soek…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "SVE",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "الرجاء الإنتظار"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "بحث …"
|
||||
"placeholder": "بحث …",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "المعالج",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Моля изчакайте"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Търсене…"
|
||||
"placeholder": "Търсене…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Процесор",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Si us plau, espereu"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Cerca…"
|
||||
"placeholder": "Cerca…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Počkejte prosím"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Hledat…"
|
||||
"placeholder": "Hledat…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Využití procesoru",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Vent venligst"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Søg…"
|
||||
"placeholder": "Søg…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Bitte warten"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Suche…"
|
||||
"placeholder": "Suche…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Παρακαλώ περιμένετε"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Αναζήτηση…"
|
||||
"placeholder": "Αναζήτηση…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Επεξεργαστής",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Please wait"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Search…"
|
||||
"placeholder": "Search…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Bonvolu atendi"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Serĉi…"
|
||||
"placeholder": "Serĉi…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Ĉefprocesoro",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Espera, por favor"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Buscar…"
|
||||
"placeholder": "Buscar…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Itxaron mesedez"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Bilatu…"
|
||||
"placeholder": "Bilatu…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Odota, ole hyvä"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Hae…"
|
||||
"placeholder": "Hae…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Veuillez patienter"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Recherche…"
|
||||
"placeholder": "Recherche…",
|
||||
"provider": "Moteur de recherche : {{name}}",
|
||||
"select_provider": "Sélectionnez un moteur de recherche"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "המתן בבקשה"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "חיפוש…"
|
||||
"placeholder": "חיפוש…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "מעבד",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Please wait"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Search…"
|
||||
"placeholder": "Search…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Pričekaj"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Traži …"
|
||||
"placeholder": "Traži …",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Kérjük várjon"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Keresés…"
|
||||
"placeholder": "Keresés…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Processzor",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Harap tunggu"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Telusuri…"
|
||||
"placeholder": "Telusuri…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Attendi per favore"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Cerca…"
|
||||
"placeholder": "Cerca…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "お待ちください"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "検索…"
|
||||
"placeholder": "検索…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "잠시만 기다리세요"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "검색…"
|
||||
"placeholder": "검색…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
@@ -472,7 +474,7 @@
|
||||
"users": "사용자",
|
||||
"loginsLast24H": "로그인 (24시간)",
|
||||
"failedLoginsLast24H": "실패한 로그인 (24시간)",
|
||||
"authorizationsLast24H": "Auths (24h)"
|
||||
"authorizationsLast24H": "인증(24시간)"
|
||||
},
|
||||
"proxmox": {
|
||||
"mem": "메모리",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Lūdzu, uzgaidiet"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Meklēt…"
|
||||
"placeholder": "Meklēt…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Sila tunggu"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Carian…"
|
||||
"placeholder": "Carian…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Even geduld"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Zoeken…"
|
||||
"placeholder": "Zoeken…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Vennligst vent"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Søk…"
|
||||
"placeholder": "Søk…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Proszę czekać"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Szukaj…"
|
||||
"placeholder": "Szukaj…",
|
||||
"provider": "Wyszukiwarka: {{name}}",
|
||||
"select_provider": "Wybierz wyszukiwarkę"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Procesor",
|
||||
@@ -472,7 +474,7 @@
|
||||
"users": "Użytkownicy",
|
||||
"loginsLast24H": "Logowania (24h)",
|
||||
"failedLoginsLast24H": "Nieudane logowania (24h)",
|
||||
"authorizationsLast24H": "Auths (24h)"
|
||||
"authorizationsLast24H": "Uwierzytelnienia (24h)"
|
||||
},
|
||||
"proxmox": {
|
||||
"mem": "RAM",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Por favor aguarde"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Pesquisar…"
|
||||
"placeholder": "Pesquisar…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Por favor, aguarde"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Pesquisar…"
|
||||
"placeholder": "Pesquisar…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Va rugăm așteptați"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Caută…"
|
||||
"placeholder": "Caută…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Procesor",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Пожалуйста, подождите"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Поиск…"
|
||||
"placeholder": "Поиск…",
|
||||
"provider": "Поисковая система: {{name}}",
|
||||
"select_provider": "Выберите поисковую систему"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "ЦП",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Počkajte prosím"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Hľadať…"
|
||||
"placeholder": "Hľadať…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Prosimo počakajte"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Iskanje…"
|
||||
"placeholder": "Iskanje…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Молим сачекајте"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Претражи…"
|
||||
"placeholder": "Претражи…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "Процесор",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Vänligen vänta"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Sök…"
|
||||
"placeholder": "Sök…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "దయచేసి వేచి ఉండండి"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "వెతకండి…"
|
||||
"placeholder": "వెతకండి…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "సీపియూ",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "โปรดรอ"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "ค้นหา…"
|
||||
"placeholder": "ค้นหา…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "ซีพียู",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Lütfen bekleyin"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Ara…"
|
||||
"placeholder": "Ara…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "İşlemci",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Будь ласка, зачекайте"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Пошук…"
|
||||
"placeholder": "Пошук…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "ЦП",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "Vui lòng chờ"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "Tìm kiếm…"
|
||||
"placeholder": "Tìm kiếm…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "請稍後"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "搜索緊…"
|
||||
"placeholder": "搜索緊…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "请稍候"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "搜索…"
|
||||
"placeholder": "搜索…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -39,7 +39,9 @@
|
||||
"wait": "請稍候"
|
||||
},
|
||||
"search": {
|
||||
"placeholder": "搜尋…"
|
||||
"placeholder": "搜尋…",
|
||||
"provider": "Search engine: {{name}}",
|
||||
"select_provider": "Select search engine"
|
||||
},
|
||||
"resources": {
|
||||
"cpu": "CPU",
|
||||
|
||||
@@ -73,6 +73,7 @@ describe("pages/api/auth/[...nextauth]", () => {
|
||||
it("routes sanitized NextAuth logs through the Homepage logger", async () => {
|
||||
const mod = await import("pages/api/auth/[...nextauth]");
|
||||
const sensitiveMetadata = {
|
||||
error: Object.assign(new Error("State cookie was missing."), { access_token: "sensitive-access-token" }),
|
||||
clientSecret: "sensitive-client-secret",
|
||||
access_token: "sensitive-access-token",
|
||||
id_token: "sensitive-id-token",
|
||||
@@ -82,7 +83,7 @@ describe("pages/api/auth/[...nextauth]", () => {
|
||||
mod.authOptions.logger.warn("NEXTAUTH_URL", sensitiveMetadata);
|
||||
mod.authOptions.logger.debug("OAUTH_CALLBACK_RESPONSE", sensitiveMetadata);
|
||||
|
||||
expect(errorMock).toHaveBeenCalledWith("%s", "OAUTH_CALLBACK_ERROR");
|
||||
expect(errorMock).toHaveBeenCalledWith("%s: %s", "OAUTH_CALLBACK_ERROR", "State cookie was missing.");
|
||||
expect(warnMock).toHaveBeenCalledWith("%s", "NEXTAUTH_URL");
|
||||
expect(debugMock).toHaveBeenCalledWith("%s", "OAUTH_CALLBACK_RESPONSE");
|
||||
expect(JSON.stringify([...errorMock.mock.calls, ...warnMock.mock.calls, ...debugMock.mock.calls])).not.toContain(
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
// @vitest-environment jsdom
|
||||
|
||||
import { fireEvent, render, screen, waitFor } from "@testing-library/react";
|
||||
import { act, fireEvent, render, screen, waitFor } from "@testing-library/react";
|
||||
import { beforeEach, describe, expect, it, vi } from "vitest";
|
||||
|
||||
import { ColorContext } from "utils/contexts/color";
|
||||
@@ -25,6 +25,7 @@ const {
|
||||
throwIn: null,
|
||||
validateData: [],
|
||||
hashData: null,
|
||||
hashConfig: null,
|
||||
mutateHash: vi.fn(),
|
||||
servicesData: [],
|
||||
bookmarksData: [],
|
||||
@@ -59,9 +60,12 @@ const {
|
||||
const serverSideTranslations = vi.fn(async (language) => ({ _translations: language }));
|
||||
const logger = { error: vi.fn() };
|
||||
|
||||
const useSWR = vi.fn((key) => {
|
||||
const useSWR = vi.fn((key, config) => {
|
||||
if (key === "/api/validate") return { data: state.validateData };
|
||||
if (key === "/api/hash") return { data: state.hashData, mutate: state.mutateHash };
|
||||
if (key === "/api/hash") {
|
||||
state.hashConfig = config;
|
||||
return { data: state.hashData, mutate: state.mutateHash };
|
||||
}
|
||||
if (key === "/api/services") return { data: state.servicesData };
|
||||
if (key === "/api/bookmarks") return { data: state.bookmarksData };
|
||||
if (key === "/api/widgets") return { data: state.widgetsData };
|
||||
@@ -172,6 +176,7 @@ describe("pages/index getStaticProps", () => {
|
||||
state.throwIn = null;
|
||||
state.validateData = [];
|
||||
state.hashData = null;
|
||||
state.hashConfig = null;
|
||||
state.servicesData = [];
|
||||
state.bookmarksData = [];
|
||||
state.widgetsData = [];
|
||||
@@ -351,6 +356,7 @@ describe("pages/index Index routing + SWR branches", () => {
|
||||
}
|
||||
|
||||
await renderIndex({ initialSettings: { title: "Homepage", layout: {} }, settings: { layout: {} } });
|
||||
act(() => state.hashConfig.onSuccess(state.hashData));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(fetchSpy).toHaveBeenCalledWith("/api/revalidate");
|
||||
@@ -379,11 +385,24 @@ describe("pages/index Index routing + SWR branches", () => {
|
||||
localStorage.removeItem("hash");
|
||||
|
||||
await renderIndex({ initialSettings: { title: "Homepage", layout: {} }, settings: { layout: {} } });
|
||||
act(() => state.hashConfig.onSuccess(state.hashData));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(localStorage.getItem("hash")).toBe("first-hash");
|
||||
});
|
||||
});
|
||||
|
||||
it("ignores a hash response without a hash", async () => {
|
||||
state.validateData = [];
|
||||
localStorage.setItem("hash", "old-hash");
|
||||
|
||||
await renderIndex({ initialSettings: { title: "Homepage", layout: {} }, settings: { layout: {} } });
|
||||
|
||||
expect(() => act(() => state.hashConfig.onSuccess(null))).not.toThrow();
|
||||
expect(() => act(() => state.hashConfig.onSuccess({}))).not.toThrow();
|
||||
expect(localStorage.getItem("hash")).toBe("old-hash");
|
||||
expect(document.querySelector(".animate-spin")).toBeFalsy();
|
||||
});
|
||||
});
|
||||
|
||||
describe("pages/index Home behavior", () => {
|
||||
@@ -419,11 +438,27 @@ describe("pages/index Home behavior", () => {
|
||||
|
||||
fireEvent.keyDown(document.body, { key: "a" });
|
||||
expect(screen.getByTestId("quicklaunch")).toHaveTextContent("open:3");
|
||||
expect(state.quickLaunchProps.searchString).toBe("a");
|
||||
|
||||
fireEvent.keyDown(document.body, { key: "Escape" });
|
||||
expect(screen.getByTestId("quicklaunch")).toHaveTextContent("closed:3");
|
||||
});
|
||||
|
||||
it("opens search on space without seeding the query with whitespace", async () => {
|
||||
await renderIndex({
|
||||
initialSettings: { title: "Homepage", layout: {} },
|
||||
settings: { title: "Homepage", layout: {}, language: "en" },
|
||||
});
|
||||
|
||||
await waitFor(() => {
|
||||
expect(state.quickLaunchProps).toBeTruthy();
|
||||
});
|
||||
|
||||
fireEvent.keyDown(document.body, { key: " " });
|
||||
expect(screen.getByTestId("quicklaunch")).toHaveTextContent("open:3");
|
||||
expect(state.quickLaunchProps.searchString).toBe("");
|
||||
});
|
||||
|
||||
it("renders services and bookmark groups when present", async () => {
|
||||
await renderIndex({
|
||||
initialSettings: { title: "Homepage", layout: {} },
|
||||
@@ -489,7 +524,7 @@ describe("pages/index Home behavior", () => {
|
||||
state.widgetsData = [];
|
||||
|
||||
const { setTheme, setColor, setSettings } = await renderIndex({
|
||||
initialSettings: { title: "Homepage", layout: {} },
|
||||
initialSettings: { title: "Homepage", layout: {}, favicon: "/x.ico" },
|
||||
settings: {
|
||||
title: "Homepage",
|
||||
layout: {},
|
||||
@@ -498,7 +533,6 @@ describe("pages/index Home behavior", () => {
|
||||
color: "emerald",
|
||||
disableIndexing: true,
|
||||
base: "/base/",
|
||||
favicon: "/x.ico",
|
||||
},
|
||||
theme: "dark",
|
||||
color: "slate",
|
||||
@@ -516,6 +550,20 @@ describe("pages/index Home behavior", () => {
|
||||
expect(document.querySelector('link[rel="icon"]')?.getAttribute("href")).toBe("/x.ico");
|
||||
});
|
||||
|
||||
// Safari reads the head without running JS, so the favicon has to be there before the
|
||||
// settings context is populated, and mask-icon must not be
|
||||
it("renders a custom favicon before the settings context is populated", async () => {
|
||||
await renderIndex({
|
||||
initialSettings: { title: "Homepage", layout: {}, favicon: "/x.ico" },
|
||||
settings: {},
|
||||
});
|
||||
|
||||
expect(document.querySelector('link[rel="icon"]')?.getAttribute("href")).toBe("/x.ico");
|
||||
expect(document.querySelector('link[rel="apple-touch-icon"]')?.getAttribute("href")).toBe("/x.ico");
|
||||
expect(document.querySelector('link[rel="mask-icon"]')).toBeNull();
|
||||
expect(document.querySelector('link[rel="shortcut icon"]')).toBeNull();
|
||||
});
|
||||
|
||||
it("marks information widgets as right-aligned for known widget types", async () => {
|
||||
await renderIndex({
|
||||
initialSettings: { title: "Homepage", layout: {} },
|
||||
|
||||
+110
-91
@@ -15,6 +15,69 @@ const MOBILE_BUTTON_POSITIONS = {
|
||||
"bottom-right": "bottom-4 right-4",
|
||||
};
|
||||
|
||||
function parseUrl(searchString) {
|
||||
if (!/.+[.:].+/.test(searchString)) return null; // basic test for probably a url
|
||||
|
||||
try {
|
||||
return new URL(searchString.toLowerCase().startsWith("http") ? searchString : `https://${searchString}`);
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function getSearchResults({
|
||||
hideVisitURL,
|
||||
searchDescriptions,
|
||||
searchProvider,
|
||||
searchString,
|
||||
searchSuggestions,
|
||||
servicesAndBookmarks,
|
||||
t,
|
||||
url,
|
||||
}) {
|
||||
if (searchString.trim().length === 0) return [];
|
||||
|
||||
const results = servicesAndBookmarks.flatMap((result) => {
|
||||
const nameMatch = result.name.toLowerCase().includes(searchString);
|
||||
const descriptionMatch = searchDescriptions && result.description?.toLowerCase().includes(searchString);
|
||||
|
||||
if (!nameMatch && !descriptionMatch) return [];
|
||||
return [{ ...result, ...(searchDescriptions && { priority: nameMatch ? 2 : +descriptionMatch }) }];
|
||||
});
|
||||
|
||||
if (searchDescriptions) {
|
||||
results.sort((a, b) => b.priority - a.priority);
|
||||
}
|
||||
|
||||
if (searchProvider) {
|
||||
results.push({
|
||||
href: searchProvider.url + encodeURIComponent(searchString),
|
||||
name: `${searchProvider.name ?? t("quicklaunch.custom")} ${t("quicklaunch.search")}`,
|
||||
type: "search",
|
||||
});
|
||||
|
||||
if (searchProvider.showSearchSuggestions && searchProvider.suggestionUrl && searchSuggestions[1]) {
|
||||
results.push(
|
||||
...searchSuggestions[1].map((suggestion) => ({
|
||||
href: searchProvider.url + encodeURIComponent(suggestion),
|
||||
name: suggestion,
|
||||
type: "searchSuggestion",
|
||||
})),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if (!hideVisitURL && url) {
|
||||
results.unshift({
|
||||
href: url.toString(),
|
||||
name: `${t("quicklaunch.visit")} URL`,
|
||||
type: "url",
|
||||
});
|
||||
}
|
||||
|
||||
return results;
|
||||
}
|
||||
|
||||
export default function QuickLaunch({ servicesAndBookmarks, searchString, setSearchString, isOpen, setSearching }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
@@ -23,9 +86,8 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
|
||||
const searchField = useRef();
|
||||
|
||||
const [results, setResults] = useState([]);
|
||||
const [currentItemIndex, setCurrentItemIndex] = useState(null);
|
||||
const [url, setUrl] = useState(null);
|
||||
const url = parseUrl(searchString);
|
||||
const [searchSuggestions, setSearchSuggestions] = useState([]);
|
||||
|
||||
const { data: widgets } = useSWR("/api/widgets");
|
||||
@@ -62,7 +124,7 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
: null;
|
||||
|
||||
function openCurrentItem(newWindow) {
|
||||
const result = results[currentItemIndex];
|
||||
const result = results[activeItemIndex];
|
||||
window.open(
|
||||
result.href,
|
||||
newWindow ? "_blank" : (result.target ?? searchProvider?.target ?? settings.target ?? "_blank"),
|
||||
@@ -81,17 +143,9 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
|
||||
function handleSearchChange(event) {
|
||||
const rawSearchString = event.target.value;
|
||||
try {
|
||||
if (!/.+[.:].+/g.test(rawSearchString)) throw new Error(); // basic test for probably a url
|
||||
let urlString = rawSearchString;
|
||||
if (urlString.toLowerCase().indexOf("http") !== 0) urlString = `https://${rawSearchString}`;
|
||||
setUrl(new URL(urlString)); // basic validation
|
||||
setSearchString(rawSearchString);
|
||||
return;
|
||||
} catch (e) {
|
||||
setUrl(null);
|
||||
}
|
||||
setSearchString(rawSearchString.toLowerCase());
|
||||
setCurrentItemIndex(null);
|
||||
// urls keep their casing, everything else is lowercased for matching
|
||||
setSearchString(parseUrl(rawSearchString) ? rawSearchString : rawSearchString.toLowerCase());
|
||||
}
|
||||
|
||||
function handleSearchKeyDown(event) {
|
||||
@@ -103,18 +157,19 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
} else if (event.key === "Enter" && results.length) {
|
||||
closeAndReset();
|
||||
openCurrentItem(event.metaKey);
|
||||
} else if (event.key === "ArrowDown" && results[currentItemIndex + 1]) {
|
||||
setCurrentItemIndex(currentItemIndex + 1);
|
||||
} else if (event.key === "ArrowDown" && results[activeItemIndex + 1]) {
|
||||
setCurrentItemIndex(activeItemIndex + 1);
|
||||
event.preventDefault();
|
||||
} else if (event.key === "ArrowUp" && currentItemIndex > 0) {
|
||||
setCurrentItemIndex(currentItemIndex - 1);
|
||||
} else if (event.key === "ArrowUp" && activeItemIndex > 0) {
|
||||
setCurrentItemIndex(activeItemIndex - 1);
|
||||
event.preventDefault();
|
||||
} else if (
|
||||
event.key === "ArrowRight" &&
|
||||
results[currentItemIndex] &&
|
||||
results[currentItemIndex].type === "searchSuggestion"
|
||||
results[activeItemIndex] &&
|
||||
results[activeItemIndex].type === "searchSuggestion"
|
||||
) {
|
||||
setSearchString(results[currentItemIndex].name);
|
||||
setCurrentItemIndex(null);
|
||||
setSearchString(results[activeItemIndex].name);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -138,33 +193,17 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (
|
||||
searchString.trim().length === 0 ||
|
||||
!searchProvider?.showSearchSuggestions ||
|
||||
!searchProvider.suggestionUrl ||
|
||||
searchString.trim() === searchSuggestions[0]?.trim()
|
||||
) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const abortController = new AbortController();
|
||||
|
||||
if (searchString.trim().length === 0) setResults([]);
|
||||
else {
|
||||
let newResults = servicesAndBookmarks.filter((r) => {
|
||||
const nameMatch = r.name.toLowerCase().includes(searchString);
|
||||
let descriptionMatch;
|
||||
if (searchDescriptions) {
|
||||
descriptionMatch = r.description?.toLowerCase().includes(searchString);
|
||||
r.priority = nameMatch ? 2 * +nameMatch : +descriptionMatch;
|
||||
}
|
||||
return nameMatch || descriptionMatch;
|
||||
});
|
||||
|
||||
if (searchDescriptions) {
|
||||
newResults = newResults.sort((a, b) => b.priority - a.priority);
|
||||
}
|
||||
|
||||
if (searchProvider) {
|
||||
newResults.push({
|
||||
href: searchProvider.url + encodeURIComponent(searchString),
|
||||
name: `${searchProvider.name ?? t("quicklaunch.custom")} ${t("quicklaunch.search")}`,
|
||||
type: "search",
|
||||
});
|
||||
|
||||
if (searchProvider.showSearchSuggestions && searchProvider.suggestionUrl) {
|
||||
if (searchString.trim() !== searchSuggestions[0]?.trim()) {
|
||||
fetch(
|
||||
`/api/search/searchSuggestion?query=${encodeURIComponent(searchString)}&providerName=${
|
||||
searchProvider.name ?? "Custom"
|
||||
@@ -175,51 +214,30 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
const newSearchSuggestions = await searchSuggestionResult.json();
|
||||
|
||||
if (newSearchSuggestions) {
|
||||
if (newSearchSuggestions[1].length > 4) {
|
||||
newSearchSuggestions[1] = newSearchSuggestions[1].splice(0, 4);
|
||||
}
|
||||
setSearchSuggestions(newSearchSuggestions);
|
||||
setCurrentItemIndex(null);
|
||||
setSearchSuggestions([newSearchSuggestions[0], newSearchSuggestions[1].slice(0, 4)]);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
// If there is an error, just ignore it. There just will be no search suggestions.
|
||||
});
|
||||
}
|
||||
|
||||
if (searchSuggestions[1]) {
|
||||
newResults = newResults.concat(
|
||||
searchSuggestions[1].map((suggestion) => ({
|
||||
href: searchProvider.url + encodeURIComponent(suggestion),
|
||||
name: suggestion,
|
||||
type: "searchSuggestion",
|
||||
})),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
return () => abortController.abort();
|
||||
}, [searchProvider, searchString, searchSuggestions]);
|
||||
|
||||
if (!hideVisitURL && url) {
|
||||
newResults.unshift({
|
||||
href: url.toString(),
|
||||
name: `${t("quicklaunch.visit")} URL`,
|
||||
type: "url",
|
||||
const results = getSearchResults({
|
||||
hideVisitURL,
|
||||
searchDescriptions,
|
||||
searchProvider,
|
||||
searchString,
|
||||
searchSuggestions,
|
||||
servicesAndBookmarks,
|
||||
t,
|
||||
url,
|
||||
});
|
||||
}
|
||||
|
||||
setResults(newResults);
|
||||
const activeItemIndex = currentItemIndex ?? (results.length ? 0 : null);
|
||||
|
||||
if (newResults.length) {
|
||||
setCurrentItemIndex(0);
|
||||
}
|
||||
}
|
||||
|
||||
return () => {
|
||||
abortController.abort();
|
||||
};
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [searchString, servicesAndBookmarks, searchDescriptions, hideVisitURL, searchSuggestions, searchProvider, url]);
|
||||
|
||||
const [hidden, setHidden] = useState(true);
|
||||
useEffect(() => {
|
||||
function handleBackdropClick(event) {
|
||||
if (event.target?.tagName === "DIV") closeAndReset();
|
||||
@@ -228,14 +246,11 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
if (isOpen) {
|
||||
searchField.current.focus();
|
||||
document.body.addEventListener("click", handleBackdropClick);
|
||||
setHidden(false);
|
||||
} else {
|
||||
document.body.removeEventListener("click", handleBackdropClick);
|
||||
searchField.current.blur();
|
||||
setTimeout(() => {
|
||||
setHidden(true);
|
||||
}, 300); // disable on close
|
||||
}
|
||||
|
||||
return () => document.body.removeEventListener("click", handleBackdropClick);
|
||||
}, [isOpen, closeAndReset]);
|
||||
|
||||
function highlightText(text) {
|
||||
@@ -259,13 +274,17 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
<>
|
||||
<div
|
||||
className={classNames(
|
||||
"relative z-40 ease-in-out duration-300 transition-opacity",
|
||||
hidden && !isOpen && "hidden",
|
||||
!hidden && isOpen && "opacity-100",
|
||||
!isOpen && "opacity-0",
|
||||
"relative z-40 ease-in-out",
|
||||
isOpen ? "visible opacity-100" : "invisible opacity-0 pointer-events-none",
|
||||
)}
|
||||
style={{
|
||||
transitionProperty: "opacity, visibility",
|
||||
transitionDuration: "300ms, 0s",
|
||||
transitionDelay: isOpen ? "0s, 0s" : "0s, 300ms",
|
||||
}}
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-hidden={!isOpen}
|
||||
>
|
||||
<div className="fixed inset-0 bg-gray-500 opacity-50" />
|
||||
<div className="fixed inset-0 z-20 overflow-y-auto">
|
||||
@@ -297,7 +316,7 @@ export default function QuickLaunch({ servicesAndBookmarks, searchString, setSea
|
||||
onKeyDown={handleItemKeyDown}
|
||||
className={classNames(
|
||||
"flex flex-row w-full items-center justify-between rounded-md text-sm md:text-xl py-2 px-4 cursor-pointer text-theme-700 dark:text-theme-200",
|
||||
i === currentItemIndex && "bg-theme-300/50 dark:bg-theme-700/50",
|
||||
i === activeItemIndex && "bg-theme-300/50 dark:bg-theme-700/50",
|
||||
)}
|
||||
>
|
||||
<div className="flex flex-row items-center mr-4 pointer-events-none">
|
||||
|
||||
@@ -46,6 +46,17 @@ function Wrapper({ servicesAndBookmarks = [], initialOpen = true } = {}) {
|
||||
const [isOpen, setSearching] = useState(initialOpen);
|
||||
|
||||
return (
|
||||
<>
|
||||
<button
|
||||
type="button"
|
||||
data-testid="seed-key"
|
||||
onClick={() => {
|
||||
setSearchString((current) => `${current}g`);
|
||||
setSearching(true);
|
||||
}}
|
||||
>
|
||||
seed
|
||||
</button>
|
||||
<QuickLaunch
|
||||
servicesAndBookmarks={servicesAndBookmarks}
|
||||
searchString={searchString}
|
||||
@@ -53,6 +64,7 @@ function Wrapper({ servicesAndBookmarks = [], initialOpen = true } = {}) {
|
||||
isOpen={isOpen}
|
||||
setSearching={setSearching}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -151,6 +163,35 @@ describe("components/quicklaunch", () => {
|
||||
openSpy.mockRestore();
|
||||
});
|
||||
|
||||
it("does not carry a previous url result into a search seeded by a keypress", async () => {
|
||||
renderWithProviders(<Wrapper />, {
|
||||
settings: {
|
||||
target: "_self",
|
||||
quicklaunch: {
|
||||
provider: "duckduckgo",
|
||||
showSearchSuggestions: false,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const input = screen.getByPlaceholderText("Search");
|
||||
await waitFor(() => expect(input).toHaveFocus());
|
||||
|
||||
fireEvent.change(input, { target: { value: "example.com" } });
|
||||
expect(await screen.findByText("quicklaunch.visit URL")).toBeInTheDocument();
|
||||
|
||||
fireEvent.keyDown(input, { key: "Escape" });
|
||||
await act(async () => {
|
||||
await new Promise((r) => setTimeout(r, 350));
|
||||
});
|
||||
|
||||
// reopen by "typing" a character, the way pages/index does
|
||||
fireEvent.click(screen.getByTestId("seed-key"));
|
||||
|
||||
expect(input).toHaveValue("g");
|
||||
expect(screen.queryByText("quicklaunch.visit URL")).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("closes on Escape and clears the search string after the timeout", async () => {
|
||||
renderWithProviders(<Wrapper />, {
|
||||
settings: {
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useMemo } from "react";
|
||||
|
||||
import Container from "../widget/container";
|
||||
import Raw from "../widget/raw";
|
||||
|
||||
import useCurrentTime from "utils/hooks/use-current-time";
|
||||
|
||||
const textSizes = {
|
||||
"4xl": "text-4xl",
|
||||
"3xl": "text-3xl",
|
||||
@@ -18,17 +20,10 @@ const textSizes = {
|
||||
export default function DateTime({ options }) {
|
||||
const { text_size: textSize, locale, format } = options;
|
||||
const { i18n } = useTranslation();
|
||||
const [date, setDate] = useState("");
|
||||
const dateLocale = locale ?? i18n.language;
|
||||
|
||||
useEffect(() => {
|
||||
const dateFormat = new Intl.DateTimeFormat(dateLocale, { ...format });
|
||||
setDate(dateFormat.format(new Date()));
|
||||
const interval = setInterval(() => {
|
||||
setDate(dateFormat.format(new Date()));
|
||||
}, 1000);
|
||||
return () => clearInterval(interval);
|
||||
}, [date, setDate, dateLocale, format]);
|
||||
const currentTime = useCurrentTime(1000);
|
||||
const dateFormatter = useMemo(() => new Intl.DateTimeFormat(dateLocale, { ...format }), [dateLocale, format]);
|
||||
const date = currentTime === null ? "" : dateFormatter.format(new Date(currentTime));
|
||||
|
||||
return (
|
||||
<Container options={options} additionalClassNames="information-widget-datetime">
|
||||
|
||||
@@ -7,9 +7,9 @@ import Resource from "../widget/resource";
|
||||
|
||||
export default function Network({ options, refresh = 1500 }) {
|
||||
const { t } = useTranslation();
|
||||
if (options.network === true) options.network = "default";
|
||||
const network = options.network === true ? "default" : options.network;
|
||||
|
||||
const { data, error } = useSWR(`/api/widgets/resources?type=network&interfaceName=${options.network}`, {
|
||||
const { data, error } = useSWR(`/api/widgets/resources?type=network&interfaceName=${network}`, {
|
||||
refreshInterval: refresh,
|
||||
});
|
||||
|
||||
|
||||
@@ -22,10 +22,12 @@ describe("components/widgets/resources/network", () => {
|
||||
|
||||
it("normalizes options.network=true to default interfaceName in the request", () => {
|
||||
useSWR.mockReturnValue({ data: undefined, error: undefined });
|
||||
const options = Object.freeze({ network: true });
|
||||
|
||||
render(<Network options={{ network: true }} />);
|
||||
render(<Network options={options} />);
|
||||
|
||||
expect(useSWR).toHaveBeenCalledWith(expect.stringContaining("interfaceName=default"), expect.any(Object));
|
||||
expect(options.network).toBe(true);
|
||||
});
|
||||
|
||||
it("renders rates and usage percentage when data is present", () => {
|
||||
|
||||
@@ -11,7 +11,7 @@ import {
|
||||
} from "@headlessui/react";
|
||||
import classNames from "classnames";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
import { Fragment, useEffect, useMemo, useState } from "react";
|
||||
import { Fragment, useEffect, useMemo, useState, useSyncExternalStore } from "react";
|
||||
import { BiLogoBing } from "react-icons/bi";
|
||||
import { FiSearch } from "react-icons/fi";
|
||||
import { SiBaidu, SiBrave, SiDuckduckgo, SiGoogle } from "react-icons/si";
|
||||
@@ -79,24 +79,32 @@ export function getStoredProvider() {
|
||||
return null;
|
||||
}
|
||||
|
||||
function subscribeToStoredProvider(onStoreChange) {
|
||||
const handleStorage = (event) => {
|
||||
if (event.key === localStorageKey) onStoreChange();
|
||||
};
|
||||
|
||||
window.addEventListener("storage", handleStorage);
|
||||
return () => window.removeEventListener("storage", handleStorage);
|
||||
}
|
||||
|
||||
export default function Search({ options }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
// options is a fresh object each render, so memo on provider itself
|
||||
const availableProviderIds = useMemo(() => getAvailableProviderIds(options.provider) ?? [], [options.provider]);
|
||||
const storedProvider = useSyncExternalStore(subscribeToStoredProvider, getStoredProvider, () => null);
|
||||
const storedProviderId = Object.keys(searchProviders).find(
|
||||
(providerId) => searchProviders[providerId] === storedProvider,
|
||||
);
|
||||
const initialProvider = availableProviderIds.includes(storedProviderId)
|
||||
? storedProvider
|
||||
: searchProviders[availableProviderIds[0] ?? "google"];
|
||||
|
||||
const [query, setQuery] = useState("");
|
||||
const [selectedProvider, setSelectedProvider] = useState(searchProviders[availableProviderIds[0] ?? "google"]);
|
||||
const [providerOverride, setProviderOverride] = useState(null);
|
||||
const [searchSuggestions, setSearchSuggestions] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
const storedProvider = getStoredProvider();
|
||||
let storedProviderKey = null;
|
||||
storedProviderKey = Object.keys(searchProviders).find((pkey) => searchProviders[pkey] === storedProvider);
|
||||
if (storedProvider && availableProviderIds.includes(storedProviderKey)) {
|
||||
setSelectedProvider(storedProvider);
|
||||
}
|
||||
}, [availableProviderIds]);
|
||||
const selectedProvider = providerOverride ?? initialProvider;
|
||||
|
||||
useEffect(() => {
|
||||
const abortController = new AbortController();
|
||||
@@ -130,8 +138,6 @@ export default function Search({ options }) {
|
||||
};
|
||||
}, [selectedProvider, options, query, searchSuggestions]);
|
||||
|
||||
let currentSuggestion;
|
||||
|
||||
function doSearch(value) {
|
||||
const q = encodeURIComponent(value);
|
||||
const { url } = selectedProvider;
|
||||
@@ -142,13 +148,11 @@ export default function Search({ options }) {
|
||||
}
|
||||
|
||||
setQuery("");
|
||||
currentSuggestion = null;
|
||||
}
|
||||
|
||||
const handleSearchKeyDown = (event) => {
|
||||
const useSuggestion = searchSuggestions.length && currentSuggestion;
|
||||
if (event.key === "Enter") {
|
||||
doSearch(useSuggestion ? currentSuggestion : event.target.value);
|
||||
if (event.key === "Enter" && !searchSuggestions[1]?.length) {
|
||||
doSearch(event.target.value);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -157,7 +161,7 @@ export default function Search({ options }) {
|
||||
}
|
||||
|
||||
const onChangeProvider = (provider) => {
|
||||
setSelectedProvider(provider);
|
||||
setProviderOverride(provider);
|
||||
localStorage.setItem(localStorageKey, provider.name);
|
||||
};
|
||||
|
||||
@@ -166,7 +170,7 @@ export default function Search({ options }) {
|
||||
<Raw>
|
||||
<div className="flex-col relative h-8 my-4 min-w-fit z-20">
|
||||
<div className="flex absolute inset-y-0 left-0 items-center pl-3 pointer-events-none w-full text-theme-800 dark:text-white" />
|
||||
<Combobox value={query}>
|
||||
<Combobox value={query} onChange={doSearch}>
|
||||
<ComboboxInput
|
||||
type="text"
|
||||
className="
|
||||
@@ -178,6 +182,7 @@ export default function Search({ options }) {
|
||||
focus:border-theme-500 dark:focus:border-white/50
|
||||
border border-theme-300 dark:border-theme-200/50"
|
||||
placeholder={t("search.placeholder")}
|
||||
aria-label={t("search.placeholder")}
|
||||
onChange={(event) => {
|
||||
setQuery(event.target.value);
|
||||
}}
|
||||
@@ -204,8 +209,8 @@ export default function Search({ options }) {
|
||||
bg-theme-600/40 dark:bg-white/10
|
||||
focus:ring-theme-500 dark:focus:ring-white/50"
|
||||
>
|
||||
<selectedProvider.icon className="text-white w-3 h-3" />
|
||||
<span className="sr-only">{t("search.search")}</span>
|
||||
<selectedProvider.icon className="text-white w-3 h-3" aria-hidden="true" />
|
||||
<span className="sr-only">{t("search.provider", { name: selectedProvider.name })}</span>
|
||||
</ListboxButton>
|
||||
</div>
|
||||
<Transition
|
||||
@@ -218,6 +223,7 @@ export default function Search({ options }) {
|
||||
leaveTo="transform opacity-0 scale-95"
|
||||
>
|
||||
<ListboxOptions
|
||||
aria-label={t("search.select_provider")}
|
||||
className="absolute right-0 z-10 mt-1 origin-top-right rounded-md
|
||||
bg-theme-100 dark:bg-theme-600 shadow-lg
|
||||
ring-1 ring-black ring-opacity-5 focus:outline-hidden"
|
||||
@@ -234,7 +240,8 @@ export default function Search({ options }) {
|
||||
active ? "bg-theme-600/10 dark:bg-white/10 dark:text-gray-900" : "dark:text-gray-100",
|
||||
)}
|
||||
>
|
||||
<p.icon className="h-4 w-4 mx-4 my-2" />
|
||||
<p.icon className="h-4 w-4 mx-4 my-2" aria-hidden="true" />
|
||||
<span className="sr-only">{p.name}</span>
|
||||
</li>
|
||||
)}
|
||||
</ListboxOption>
|
||||
@@ -248,19 +255,12 @@ export default function Search({ options }) {
|
||||
{searchSuggestions[1]?.length > 0 && (
|
||||
<ComboboxOptions className="mt-1 rounded-md bg-theme-50 dark:bg-theme-800 border border-theme-300 dark:border-theme-200/30 cursor-pointer shadow-lg">
|
||||
<div className="p-1 bg-white/50 dark:bg-white/10 text-theme-900/90 dark:text-white/90 text-xs">
|
||||
<ComboboxOption key={query} value={query} />
|
||||
<ComboboxOption key={query} value={query}>
|
||||
<span className="sr-only">{query}</span>
|
||||
</ComboboxOption>
|
||||
{searchSuggestions[1].map((suggestion) => (
|
||||
<ComboboxOption
|
||||
key={suggestion}
|
||||
value={suggestion}
|
||||
onMouseDown={() => {
|
||||
doSearch(suggestion);
|
||||
}}
|
||||
className="flex w-full"
|
||||
>
|
||||
{({ active }) => {
|
||||
if (active) currentSuggestion = suggestion;
|
||||
return (
|
||||
<ComboboxOption key={suggestion} value={suggestion} className="flex w-full">
|
||||
{({ active }) => (
|
||||
<div
|
||||
className={classNames(
|
||||
"px-2 py-1 rounded-md w-full flex-nowrap",
|
||||
@@ -272,8 +272,7 @@ export default function Search({ options }) {
|
||||
{suggestion.indexOf(query) === 0 ? suggestion.substring(query.length) : suggestion}
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
)}
|
||||
</ComboboxOption>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@@ -9,6 +9,7 @@ import { renderWithProviders } from "test-utils/render-with-providers";
|
||||
vi.mock("@headlessui/react", async () => {
|
||||
const React = await import("react");
|
||||
const { Fragment, createContext, useContext } = React;
|
||||
const ComboboxContext = createContext(null);
|
||||
const ListboxContext = createContext(null);
|
||||
|
||||
function passthrough({ as: As = "div", children, ...props }) {
|
||||
@@ -18,9 +19,21 @@ vi.mock("@headlessui/react", async () => {
|
||||
}
|
||||
|
||||
return {
|
||||
Combobox: passthrough,
|
||||
Combobox: ({ onChange, children }) => (
|
||||
<ComboboxContext.Provider value={{ onChange }}>
|
||||
<div>{children}</div>
|
||||
</ComboboxContext.Provider>
|
||||
),
|
||||
ComboboxInput: (props) => <input {...props} />,
|
||||
ComboboxOption: passthrough,
|
||||
ComboboxOption: ({ as: As = "div", value, children, ...props }) => {
|
||||
const ctx = useContext(ComboboxContext);
|
||||
const content = typeof children === "function" ? children({ active: false }) : children;
|
||||
return (
|
||||
<As value={value} onMouseDown={() => ctx?.onChange?.(value)} {...props}>
|
||||
{content}
|
||||
</As>
|
||||
);
|
||||
},
|
||||
ComboboxOptions: passthrough,
|
||||
Listbox: ({ value, onChange, children, ...props }) => (
|
||||
<ListboxContext.Provider value={{ value, onChange }}>
|
||||
@@ -165,6 +178,28 @@ describe("components/widgets/search", () => {
|
||||
openSpy.mockRestore();
|
||||
});
|
||||
|
||||
it("gives every provider option an accessible name", () => {
|
||||
renderWithProviders(
|
||||
<Search options={{ provider: ["google", "duckduckgo", "brave"], showSearchSuggestions: false }} />,
|
||||
{ settings: {} },
|
||||
);
|
||||
|
||||
expect(screen.getAllByRole("option").map((option) => option.textContent)).toEqual([
|
||||
"Google",
|
||||
"DuckDuckGo",
|
||||
"Brave",
|
||||
]);
|
||||
});
|
||||
|
||||
it("labels the search input and the provider button", () => {
|
||||
renderWithProviders(<Search options={{ provider: ["google", "duckduckgo"], showSearchSuggestions: false }} />, {
|
||||
settings: {},
|
||||
});
|
||||
|
||||
expect(screen.getByRole("textbox")).toHaveAccessibleName("search.placeholder");
|
||||
expect(screen.getByRole("button")).toHaveAccessibleName(/search\.provider/);
|
||||
});
|
||||
|
||||
it("fetches search suggestions and triggers a search when a suggestion is selected", async () => {
|
||||
const openSpy = vi.spyOn(window, "open").mockImplementation(() => null);
|
||||
|
||||
|
||||
@@ -14,11 +14,11 @@ import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
export default function Widget({ options }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
options.service_group = options.service_name = "unifi_console";
|
||||
const { data: statsData, error: statsError } = useWidgetAPI(options, "stat/sites", { index: options.index });
|
||||
const widgetOptions = { ...options, service_group: "unifi_console", service_name: "unifi_console" };
|
||||
const { data: statsData, error: statsError } = useWidgetAPI(widgetOptions, "stat/sites", { index: options.index });
|
||||
|
||||
if (statsError) {
|
||||
return <Error options={options} />;
|
||||
return <Error options={widgetOptions} />;
|
||||
}
|
||||
|
||||
const defaultSite = options.site
|
||||
@@ -27,27 +27,27 @@ export default function Widget({ options }) {
|
||||
|
||||
if (!defaultSite) {
|
||||
return (
|
||||
<Container options={options} additionalClassNames="information-widget-unifi-console">
|
||||
<Container options={widgetOptions} additionalClassNames="information-widget-unifi-console">
|
||||
<PrimaryText>{t("unifi.wait")}</PrimaryText>
|
||||
<WidgetIcon icon={SiUbiquiti} />
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
|
||||
const wan = defaultSite.health.find((h) => h.subsystem === "wan");
|
||||
const lan = defaultSite.health.find((h) => h.subsystem === "lan");
|
||||
const wlan = defaultSite.health.find((h) => h.subsystem === "wlan");
|
||||
[wan, lan, wlan].forEach((s) => {
|
||||
s.up = s.status === "ok";
|
||||
s.show = s.status !== "unknown";
|
||||
});
|
||||
const getHealth = (subsystem) => {
|
||||
const health = defaultSite.health.find((item) => item.subsystem === subsystem) ?? { status: "unknown" };
|
||||
return { ...health, up: health.status === "ok", show: health.status !== "unknown" };
|
||||
};
|
||||
const wan = getHealth("wan");
|
||||
const lan = getHealth("lan");
|
||||
const wlan = getHealth("wlan");
|
||||
const name = wan.gw_name ?? defaultSite.desc;
|
||||
const uptime = wan["gw_system-stats"] ? wan["gw_system-stats"].uptime : null;
|
||||
|
||||
const dataEmpty = !(wan.show || lan.show || wlan.show || uptime);
|
||||
|
||||
return (
|
||||
<Container options={options} additionalClassNames="information-widget-unifi-console">
|
||||
<Container options={widgetOptions} additionalClassNames="information-widget-unifi-console">
|
||||
<Raw>
|
||||
<div className="flex-none flex flex-row items-center mr-3 py-1.5">
|
||||
<div className="flex flex-col">
|
||||
|
||||
@@ -40,15 +40,21 @@ describe("components/widgets/unifi_console", () => {
|
||||
|
||||
it("renders a wait state when no site is available yet", () => {
|
||||
useWidgetAPI.mockReturnValue({ data: undefined, error: undefined });
|
||||
const options = Object.freeze({ index: 0 });
|
||||
|
||||
renderWithProviders(<UnifiConsole options={{ index: 0 }} />, { settings: { target: "_self" } });
|
||||
renderWithProviders(<UnifiConsole options={options} />, { settings: { target: "_self" } });
|
||||
|
||||
expect(screen.getByText("unifi.wait")).toBeInTheDocument();
|
||||
expect(useWidgetAPI).toHaveBeenCalledWith(
|
||||
{ index: 0, service_group: "unifi_console", service_name: "unifi_console" },
|
||||
"stat/sites",
|
||||
{ index: 0 },
|
||||
);
|
||||
expect(options).toEqual({ index: 0 });
|
||||
});
|
||||
|
||||
it("renders site name and uptime when data is available", () => {
|
||||
useWidgetAPI.mockReturnValue({
|
||||
data: {
|
||||
const data = {
|
||||
data: [
|
||||
{
|
||||
name: "default",
|
||||
@@ -65,7 +71,10 @@ describe("components/widgets/unifi_console", () => {
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
const originalData = structuredClone(data);
|
||||
useWidgetAPI.mockReturnValue({
|
||||
data,
|
||||
error: undefined,
|
||||
});
|
||||
|
||||
@@ -75,6 +84,7 @@ describe("components/widgets/unifi_console", () => {
|
||||
// common.number is mocked to return the numeric value as a string.
|
||||
expect(screen.getByText("2")).toBeInTheDocument();
|
||||
expect(screen.getByText("unifi.days")).toBeInTheDocument();
|
||||
expect(data).toEqual(originalData);
|
||||
});
|
||||
|
||||
it("selects a site by description when options.site is set", () => {
|
||||
|
||||
@@ -71,6 +71,16 @@ function logFailedPasswordSignIn() {
|
||||
createLogger("nextauth").warn("Failed password sign-in attempt");
|
||||
}
|
||||
|
||||
function logNextAuthError(code, metadata) {
|
||||
const error = metadata instanceof Error ? metadata : metadata?.error;
|
||||
|
||||
if (error?.message) {
|
||||
createLogger("nextauth").error("%s: %s", code, error.message);
|
||||
} else {
|
||||
createLogger("nextauth").error("%s", code);
|
||||
}
|
||||
}
|
||||
|
||||
let providers = [];
|
||||
if (authEnabled) {
|
||||
if (hasOidcConfig) {
|
||||
@@ -140,7 +150,7 @@ export const authOptions = {
|
||||
signIn: "/auth/signin",
|
||||
},
|
||||
logger: {
|
||||
error: (code) => createLogger("nextauth").error("%s", code),
|
||||
error: logNextAuthError,
|
||||
warn: (code) => createLogger("nextauth").warn("%s", code),
|
||||
debug: (code) => createLogger("nextauth").debug("%s", code),
|
||||
},
|
||||
|
||||
+22
-15
@@ -12,7 +12,7 @@ import dynamic from "next/dynamic";
|
||||
import Head from "next/head";
|
||||
import { useRouter } from "next/router";
|
||||
import Script from "next/script";
|
||||
import { useContext, useEffect, useMemo, useState } from "react";
|
||||
import { useCallback, useContext, useEffect, useMemo, useState } from "react";
|
||||
import { BiError } from "react-icons/bi";
|
||||
import useSWR, { SWRConfig } from "swr";
|
||||
import { ColorContext } from "utils/contexts/color";
|
||||
@@ -102,17 +102,10 @@ function Index({ initialSettings, fallback }) {
|
||||
const [stale, setStale] = useState(false);
|
||||
const { data: errorsData } = useSWR("/api/validate");
|
||||
const { error: validateError } = errorsData || {};
|
||||
const { data: hashData, mutate: mutateHash } = useSWR("/api/hash");
|
||||
|
||||
useEffect(() => {
|
||||
if (windowFocused) {
|
||||
mutateHash();
|
||||
}
|
||||
}, [windowFocused, mutateHash]);
|
||||
const handleHashData = useCallback((hashData) => {
|
||||
if (typeof window === "undefined" || !hashData?.hash) return;
|
||||
|
||||
useEffect(() => {
|
||||
if (hashData) {
|
||||
if (typeof window !== "undefined") {
|
||||
const previousHash = localStorage.getItem("hash");
|
||||
|
||||
if (!previousHash) {
|
||||
@@ -129,9 +122,15 @@ function Index({ initialSettings, fallback }) {
|
||||
}
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
const { mutate: mutateHash } = useSWR("/api/hash", { onSuccess: handleHashData });
|
||||
|
||||
useEffect(() => {
|
||||
if (windowFocused) {
|
||||
mutateHash();
|
||||
}
|
||||
}
|
||||
}, [hashData]);
|
||||
}, [windowFocused, mutateHash]);
|
||||
|
||||
if (validateError) {
|
||||
return (
|
||||
@@ -264,6 +263,13 @@ function Home({ initialSettings }) {
|
||||
e.key.match(/([à-ü]|[À-Ü]|!)/g) ||
|
||||
(e.key === "v" && (e.ctrlKey || e.metaKey))
|
||||
) {
|
||||
if (e.key.length === 1 && !(e.key === "v" && (e.ctrlKey || e.metaKey))) {
|
||||
e.preventDefault();
|
||||
// whitespace opens the search but shouldn't be in it
|
||||
if (e.key.trim()) {
|
||||
setSearchString((currentSearchString) => currentSearchString + e.key);
|
||||
}
|
||||
}
|
||||
setSearching(true);
|
||||
} else if (e.key === "Escape") {
|
||||
setSearchString("");
|
||||
@@ -420,10 +426,11 @@ function Home({ initialSettings }) {
|
||||
/>
|
||||
{settings.disableIndexing && <meta name="robots" content="noindex, nofollow" />}
|
||||
{settings.base && <base href={settings.base} />}
|
||||
{settings.favicon ? (
|
||||
{/* from props, not context so its set before running JS */}
|
||||
{initialSettings.favicon ? (
|
||||
<>
|
||||
<link rel="icon" href={settings.favicon} />
|
||||
<link rel="apple-touch-icon" sizes="180x180" href={settings.favicon} />
|
||||
<link rel="icon" href={initialSettings.favicon} />
|
||||
<link rel="apple-touch-icon" sizes="180x180" href={initialSettings.favicon} />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
|
||||
@@ -30,10 +30,6 @@ export function ColorProvider({ initialTheme, children }) {
|
||||
lastColor = rawColor;
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (initialTheme !== undefined) setColor(initialTheme ?? getInitialColor());
|
||||
}, [initialTheme]);
|
||||
|
||||
useEffect(() => {
|
||||
rawSetColor(color);
|
||||
}, [color]);
|
||||
|
||||
@@ -1,14 +1,10 @@
|
||||
import { createContext, useEffect, useMemo, useState } from "react";
|
||||
import { createContext, useMemo, useState } from "react";
|
||||
|
||||
export const SettingsContext = createContext();
|
||||
|
||||
export function SettingsProvider({ initialSettings, children }) {
|
||||
const [settings, setSettings] = useState(() => initialSettings ?? {});
|
||||
|
||||
useEffect(() => {
|
||||
if (initialSettings !== undefined) setSettings(initialSettings ?? {});
|
||||
}, [initialSettings]);
|
||||
|
||||
const value = useMemo(() => ({ settings, setSettings }), [settings]);
|
||||
|
||||
return <SettingsContext.Provider value={value}>{children}</SettingsContext.Provider>;
|
||||
|
||||
@@ -1,14 +1,10 @@
|
||||
import { createContext, useEffect, useMemo, useState } from "react";
|
||||
import { createContext, useMemo, useState } from "react";
|
||||
|
||||
export const TabContext = createContext();
|
||||
|
||||
export function TabProvider({ initialTab, children }) {
|
||||
const [activeTab, setActiveTab] = useState(() => initialTab ?? false);
|
||||
|
||||
useEffect(() => {
|
||||
if (initialTab !== undefined) setActiveTab(initialTab ?? false);
|
||||
}, [initialTab]);
|
||||
|
||||
const value = useMemo(() => ({ activeTab, setActiveTab }), [activeTab]);
|
||||
|
||||
return <TabContext.Provider value={value}>{children}</TabContext.Provider>;
|
||||
|
||||
@@ -31,10 +31,6 @@ export function ThemeProvider({ initialTheme, children }) {
|
||||
localStorage.setItem("theme-mode", rawTheme);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (initialTheme !== undefined) setTheme(initialTheme ?? getInitialTheme());
|
||||
}, [initialTheme]);
|
||||
|
||||
useEffect(() => {
|
||||
rawSetTheme(theme);
|
||||
}, [theme]);
|
||||
|
||||
@@ -0,0 +1,45 @@
|
||||
import { useSyncExternalStore } from "react";
|
||||
|
||||
const MINUTE = 60_000;
|
||||
const stores = new Map();
|
||||
|
||||
function getStore(refreshInterval) {
|
||||
const existing = stores.get(refreshInterval);
|
||||
if (existing) return existing;
|
||||
|
||||
const listeners = new Set();
|
||||
let now = null; // null until mounted, so SSR and hydration render the same thing
|
||||
let timer = null;
|
||||
|
||||
const store = {
|
||||
getSnapshot: () => now,
|
||||
subscribe: (onStoreChange) => {
|
||||
listeners.add(onStoreChange);
|
||||
|
||||
if (!timer) {
|
||||
now = Date.now();
|
||||
timer = setInterval(() => {
|
||||
now = Date.now();
|
||||
listeners.forEach((listener) => listener());
|
||||
}, refreshInterval);
|
||||
}
|
||||
|
||||
return () => {
|
||||
listeners.delete(onStoreChange);
|
||||
if (!listeners.size) {
|
||||
clearInterval(timer);
|
||||
timer = null;
|
||||
}
|
||||
};
|
||||
},
|
||||
};
|
||||
|
||||
stores.set(refreshInterval, store);
|
||||
return store;
|
||||
}
|
||||
|
||||
// Returns null on the server and during hydration, then the current time.
|
||||
export default function useCurrentTime(refreshInterval = MINUTE) {
|
||||
const { subscribe, getSnapshot } = getStore(refreshInterval);
|
||||
return useSyncExternalStore(subscribe, getSnapshot, () => null);
|
||||
}
|
||||
@@ -0,0 +1,32 @@
|
||||
// @vitest-environment jsdom
|
||||
|
||||
import { act, render, screen } from "@testing-library/react";
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
|
||||
|
||||
import useCurrentTime from "./use-current-time";
|
||||
|
||||
function CurrentTime({ refreshInterval }) {
|
||||
return <span>{useCurrentTime(refreshInterval)}</span>;
|
||||
}
|
||||
|
||||
describe("utils/hooks/use-current-time", () => {
|
||||
beforeEach(() => {
|
||||
vi.useFakeTimers();
|
||||
vi.setSystemTime(1_000);
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.useRealTimers();
|
||||
});
|
||||
|
||||
it("updates at the requested interval", () => {
|
||||
render(<CurrentTime refreshInterval={5_000} />);
|
||||
expect(screen.getByText("1000")).toBeInTheDocument();
|
||||
|
||||
act(() => {
|
||||
vi.advanceTimersByTime(5_000);
|
||||
});
|
||||
|
||||
expect(screen.getByText("6000")).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
@@ -1,26 +1,17 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { useSyncExternalStore } from "react";
|
||||
|
||||
const hasFocus = () => typeof document !== "undefined" && document.hasFocus();
|
||||
|
||||
const useWindowFocus = () => {
|
||||
const [focused, setFocused] = useState(hasFocus);
|
||||
|
||||
useEffect(() => {
|
||||
setFocused(hasFocus());
|
||||
|
||||
const onFocus = () => setFocused(true);
|
||||
const onBlur = () => setFocused(false);
|
||||
|
||||
window.addEventListener("focus", onFocus);
|
||||
window.addEventListener("blur", onBlur);
|
||||
const subscribe = (onFocusChange) => {
|
||||
window.addEventListener("focus", onFocusChange);
|
||||
window.addEventListener("blur", onFocusChange);
|
||||
|
||||
return () => {
|
||||
window.removeEventListener("focus", onFocus);
|
||||
window.removeEventListener("blur", onBlur);
|
||||
window.removeEventListener("focus", onFocusChange);
|
||||
window.removeEventListener("blur", onFocusChange);
|
||||
};
|
||||
}, []);
|
||||
|
||||
return focused;
|
||||
};
|
||||
|
||||
const useWindowFocus = () => useSyncExternalStore(subscribe, hasFocus, () => false);
|
||||
|
||||
export default useWindowFocus;
|
||||
|
||||
@@ -12,15 +12,17 @@ function Fixture() {
|
||||
|
||||
describe("utils/hooks/window-focus", () => {
|
||||
it("tracks focus/blur events", async () => {
|
||||
vi.spyOn(document, "hasFocus").mockReturnValue(true);
|
||||
const hasFocus = vi.spyOn(document, "hasFocus").mockReturnValue(true);
|
||||
|
||||
render(<Fixture />);
|
||||
|
||||
expect(screen.getByTestId("focused")).toHaveTextContent("true");
|
||||
|
||||
hasFocus.mockReturnValue(false);
|
||||
window.dispatchEvent(new Event("blur"));
|
||||
await waitFor(() => expect(screen.getByTestId("focused")).toHaveTextContent("false"));
|
||||
|
||||
hasFocus.mockReturnValue(true);
|
||||
window.dispatchEvent(new Event("focus"));
|
||||
await waitFor(() => expect(screen.getByTestId("focused")).toHaveTextContent("true"));
|
||||
});
|
||||
|
||||
@@ -2,13 +2,13 @@ import useSWR from "swr";
|
||||
|
||||
import { formatProxyUrl } from "./api-helpers";
|
||||
|
||||
export default function useWidgetAPI(widget, ...options) {
|
||||
const config = {};
|
||||
if (options && options[1]?.refreshInterval) {
|
||||
config.refreshInterval = options[1].refreshInterval;
|
||||
export default function useWidgetAPI(widget, endpoint, queryParams, swrConfig = {}) {
|
||||
const config = { ...swrConfig };
|
||||
if (queryParams?.refreshInterval) {
|
||||
config.refreshInterval = queryParams.refreshInterval;
|
||||
}
|
||||
let url = formatProxyUrl(widget, ...options);
|
||||
if (options[0] === "") {
|
||||
let url = formatProxyUrl(widget, endpoint, queryParams);
|
||||
if (endpoint === "") {
|
||||
url = null;
|
||||
}
|
||||
const { data, error, mutate } = useSWR(url, config);
|
||||
|
||||
@@ -28,6 +28,18 @@ describe("utils/proxy/use-widget-api", () => {
|
||||
expect(result.mutate).toBe("m");
|
||||
});
|
||||
|
||||
it("passes additional SWR configuration separately from the proxy query", () => {
|
||||
useSWR.mockReturnValue({ data: undefined, error: undefined, mutate: vi.fn() });
|
||||
|
||||
const widget = { service_group: "g", service_name: "s", index: 0 };
|
||||
const onSuccess = vi.fn();
|
||||
useWidgetAPI(widget, "status", { refreshInterval: 123 }, { onSuccess });
|
||||
|
||||
const [url, config] = useSWR.mock.calls[0];
|
||||
expect(url).not.toContain("onSuccess");
|
||||
expect(config).toEqual({ refreshInterval: 123, onSuccess });
|
||||
});
|
||||
|
||||
it("returns data.error as the top-level error", () => {
|
||||
const dataError = { message: "nope" };
|
||||
useSWR.mockReturnValue({ data: { error: dataError }, error: undefined, mutate: vi.fn() });
|
||||
|
||||
@@ -0,0 +1,12 @@
|
||||
export default function withWidgetFields(service, defaultFields, maxFields = 4) {
|
||||
const configuredFields = service.widget.fields;
|
||||
const fields = (configuredFields?.length ? configuredFields : defaultFields).slice(0, maxFields);
|
||||
|
||||
return {
|
||||
...service,
|
||||
widget: {
|
||||
...service.widget,
|
||||
fields,
|
||||
},
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
import { describe, expect, it } from "vitest";
|
||||
|
||||
import withWidgetFields from "./widget-fields";
|
||||
|
||||
describe("utils/widget-fields", () => {
|
||||
it("applies defaults without modifying the service", () => {
|
||||
const service = { name: "Example", widget: { type: "example" } };
|
||||
|
||||
const normalizedService = withWidgetFields(service, ["one", "two"]);
|
||||
|
||||
expect(normalizedService).toEqual({
|
||||
name: "Example",
|
||||
widget: { type: "example", fields: ["one", "two"] },
|
||||
});
|
||||
expect(service).toEqual({ name: "Example", widget: { type: "example" } });
|
||||
});
|
||||
|
||||
it("treats an explicitly empty fields list as unset", () => {
|
||||
const service = { widget: { type: "example", fields: [] } };
|
||||
|
||||
const normalizedService = withWidgetFields(service, ["one", "two"]);
|
||||
|
||||
expect(normalizedService.widget.fields).toEqual(["one", "two"]);
|
||||
});
|
||||
|
||||
it("copies and limits configured fields", () => {
|
||||
const service = { widget: { type: "example", fields: ["one", "two", "three"] } };
|
||||
|
||||
const normalizedService = withWidgetFields(service, ["default"], 2);
|
||||
|
||||
expect(normalizedService.widget.fields).toEqual(["one", "two"]);
|
||||
expect(normalizedService.widget.fields).not.toBe(service.widget.fields);
|
||||
expect(service.widget.fields).toEqual(["one", "two", "three"]);
|
||||
});
|
||||
});
|
||||
@@ -3,19 +3,15 @@ import Container from "components/services/widget/container";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import withWidgetFields from "utils/widget-fields";
|
||||
|
||||
const MAX_FIELDS = 4;
|
||||
const DEFAULT_FIELDS = ["running", "stopped", "total", "image_updates"];
|
||||
|
||||
export default function Component({ service }) {
|
||||
export default function Component({ service: configuredService }) {
|
||||
const { t } = useTranslation();
|
||||
const service = withWidgetFields(configuredService, DEFAULT_FIELDS);
|
||||
const { widget } = service;
|
||||
|
||||
if (!widget.fields) {
|
||||
widget.fields = ["running", "stopped", "total", "image_updates"];
|
||||
} else if (widget.fields.length > MAX_FIELDS) {
|
||||
widget.fields = widget.fields.slice(0, MAX_FIELDS);
|
||||
}
|
||||
|
||||
const envNotSet = widget.env == null || widget.env === "";
|
||||
|
||||
const { data: containers, error: containersError } = useWidgetAPI(widget, envNotSet ? "" : "containers");
|
||||
|
||||
@@ -57,7 +57,7 @@ describe("widgets/arcane/component", () => {
|
||||
expect(screen.getByText("arcane.image_updates")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("truncates custom fields to the max allowed", () => {
|
||||
it("renders only the first four custom fields without mutating the input", () => {
|
||||
useWidgetAPI.mockImplementation(() => ({ data: undefined, error: undefined }));
|
||||
|
||||
const service = {
|
||||
@@ -65,7 +65,8 @@ describe("widgets/arcane/component", () => {
|
||||
};
|
||||
const { container } = renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
// sliced to first four entries
|
||||
// The helper caps the copied fields used for rendering and leaves the configured service unchanged.
|
||||
expect(service.widget.fields).toEqual(["running", "stopped", "total", "images", "images_unused"]);
|
||||
expect(container.querySelectorAll(".service-block")).toHaveLength(4);
|
||||
expect(screen.getByText("docker.running")).toBeInTheDocument();
|
||||
expect(screen.getByText("dockhand.stopped")).toBeInTheDocument();
|
||||
|
||||
@@ -2,19 +2,14 @@ import Block from "components/services/widget/block";
|
||||
import Container from "components/services/widget/container";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import withWidgetFields from "utils/widget-fields";
|
||||
|
||||
export default function Component({ service }) {
|
||||
const DEFAULT_FIELDS = ["apps", "synced", "outOfSync", "healthy"];
|
||||
|
||||
export default function Component({ service: configuredService }) {
|
||||
const service = withWidgetFields(configuredService, DEFAULT_FIELDS);
|
||||
const { widget } = service;
|
||||
|
||||
if (!widget.fields) {
|
||||
widget.fields = ["apps", "synced", "outOfSync", "healthy"];
|
||||
}
|
||||
|
||||
const MAX_ALLOWED_FIELDS = 4;
|
||||
if (widget.fields.length > MAX_ALLOWED_FIELDS) {
|
||||
widget.fields = widget.fields.slice(0, MAX_ALLOWED_FIELDS);
|
||||
}
|
||||
|
||||
const { data: appsData, error: appsError } = useWidgetAPI(widget, "applications");
|
||||
|
||||
const appCounts = widget.fields.map((status) => {
|
||||
|
||||
@@ -25,7 +25,7 @@ describe("widgets/argocd/component", () => {
|
||||
const service = { widget: { type: "argocd", fields: ["apps", "synced", "outOfSync", "healthy", "extra"] } };
|
||||
const { container } = renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
expect(service.widget.fields).toEqual(["apps", "synced", "outOfSync", "healthy"]);
|
||||
expect(service.widget.fields).toEqual(["apps", "synced", "outOfSync", "healthy", "extra"]);
|
||||
expect(container.querySelectorAll(".service-block")).toHaveLength(4);
|
||||
expect(screen.getByText("argocd.apps")).toBeInTheDocument();
|
||||
expect(screen.getByText("argocd.synced")).toBeInTheDocument();
|
||||
|
||||
@@ -2,10 +2,14 @@ import Block from "components/services/widget/block";
|
||||
import Container from "components/services/widget/container";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
|
||||
import useCurrentTime from "utils/hooks/use-current-time";
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
|
||||
const DAY = 24 * 60 * 60 * 1000;
|
||||
|
||||
export default function Component({ service }) {
|
||||
const { t } = useTranslation();
|
||||
const currentTime = useCurrentTime();
|
||||
|
||||
const { widget } = service;
|
||||
const isV2 = widget.version === 2;
|
||||
@@ -45,7 +49,7 @@ export default function Component({ service }) {
|
||||
switch (widget.version) {
|
||||
// v1 is default
|
||||
default:
|
||||
const yesterday = new Date(Date.now()).setHours(-24);
|
||||
const yesterday = currentTime - DAY;
|
||||
loginsLast24H = loginsData.reduce(
|
||||
(total, current) => (current.x_cord >= yesterday ? total + current.y_cord : total),
|
||||
0,
|
||||
|
||||
@@ -71,7 +71,8 @@ describe("widgets/authentik/component", () => {
|
||||
|
||||
it("computes v1 login/failed counts for entries within the last 24h window", () => {
|
||||
vi.useFakeTimers();
|
||||
vi.setSystemTime(new Date("2026-01-02T00:00:00Z"));
|
||||
// Use midday so a mistaken previous-midnight cutoff would include the 25-hour-old entries.
|
||||
vi.setSystemTime(new Date("2026-01-02T12:00:00Z"));
|
||||
|
||||
const now = Date.now();
|
||||
const oneHourAgo = now - 60 * 60 * 1000;
|
||||
|
||||
@@ -3,13 +3,14 @@ import Container from "components/services/widget/container";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import withWidgetFields from "utils/widget-fields";
|
||||
|
||||
const BACKREST_DEFAULT_FIELDS = ["num_success_latest", "num_failure_latest", "num_failure_30", "bytes_added_30"];
|
||||
const MAX_ALLOWED_FIELDS = 4;
|
||||
|
||||
export default function Component({ service }) {
|
||||
export default function Component({ service: configuredService }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const service = withWidgetFields(configuredService, BACKREST_DEFAULT_FIELDS);
|
||||
const { widget } = service;
|
||||
|
||||
const { data, error } = useWidgetAPI(widget, "summary");
|
||||
@@ -18,12 +19,6 @@ export default function Component({ service }) {
|
||||
return <Container service={service} error={error} />;
|
||||
}
|
||||
|
||||
if (!widget.fields?.length) {
|
||||
widget.fields = BACKREST_DEFAULT_FIELDS;
|
||||
} else if (widget.fields.length > MAX_ALLOWED_FIELDS) {
|
||||
widget.fields = widget.fields.slice(0, MAX_ALLOWED_FIELDS);
|
||||
}
|
||||
|
||||
if (!data) {
|
||||
return (
|
||||
<Container service={service}>
|
||||
|
||||
@@ -24,12 +24,7 @@ describe("widgets/backrest/component", () => {
|
||||
const service = { widget: { type: "backrest" } };
|
||||
const { container } = renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
expect(service.widget.fields).toEqual([
|
||||
"num_success_latest",
|
||||
"num_failure_latest",
|
||||
"num_failure_30",
|
||||
"bytes_added_30",
|
||||
]);
|
||||
expect(service.widget.fields).toBeUndefined();
|
||||
expect(container.querySelectorAll(".service-block")).toHaveLength(4);
|
||||
|
||||
expect(screen.getByText("backrest.num_success_latest")).toBeInTheDocument();
|
||||
@@ -48,7 +43,7 @@ describe("widgets/backrest/component", () => {
|
||||
|
||||
renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
expect(service.widget.fields).toEqual(["a", "b", "c", "d"]);
|
||||
expect(service.widget.fields).toEqual(["a", "b", "c", "d", "e"]);
|
||||
});
|
||||
|
||||
it("renders values and respects field filtering", () => {
|
||||
|
||||
@@ -3,23 +3,21 @@ import Container from "components/services/widget/container";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import withWidgetFields from "utils/widget-fields";
|
||||
|
||||
export default function Component({ service }) {
|
||||
const SUMMARY_FIELDS = ["systems", "up"];
|
||||
const SYSTEM_FIELDS = ["name", "status", "cpu", "memory"];
|
||||
|
||||
export default function Component({ service: configuredService }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const defaultFields = configuredService.widget.systemId ? SYSTEM_FIELDS : SUMMARY_FIELDS;
|
||||
const service = withWidgetFields(configuredService, defaultFields);
|
||||
const { widget } = service;
|
||||
const { systemId } = widget;
|
||||
|
||||
const { data: systems, error: systemsError } = useWidgetAPI(widget, "systems");
|
||||
|
||||
const MAX_ALLOWED_FIELDS = 4;
|
||||
if (!widget.fields?.length > 0) {
|
||||
widget.fields = systemId ? ["name", "status", "cpu", "memory"] : ["systems", "up"];
|
||||
}
|
||||
if (widget.fields?.length > MAX_ALLOWED_FIELDS) {
|
||||
widget.fields = widget.fields.slice(0, MAX_ALLOWED_FIELDS);
|
||||
}
|
||||
|
||||
let system = null;
|
||||
let finalError = systemsError;
|
||||
|
||||
|
||||
@@ -23,7 +23,7 @@ describe("widgets/beszel/component", () => {
|
||||
const service = { widget: { type: "beszel" } };
|
||||
const { container } = renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
expect(service.widget.fields).toEqual(["systems", "up"]);
|
||||
expect(service.widget.fields).toBeUndefined();
|
||||
expect(container.querySelectorAll(".service-block")).toHaveLength(2);
|
||||
expect(screen.getByText("beszel.systems")).toBeInTheDocument();
|
||||
expect(screen.getByText("beszel.up")).toBeInTheDocument();
|
||||
@@ -66,7 +66,7 @@ describe("widgets/beszel/component", () => {
|
||||
const service = { widget: { type: "beszel", systemId: "sys1" } };
|
||||
const { container } = renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
expect(service.widget.fields).toEqual(["name", "status", "cpu", "memory"]);
|
||||
expect(service.widget.fields).toBeUndefined();
|
||||
expect(container.querySelectorAll(".service-block")).toHaveLength(4);
|
||||
|
||||
expectBlockValue(container, "beszel.name", "MySystem");
|
||||
|
||||
@@ -38,16 +38,16 @@ const colorVariants = {
|
||||
export default function Component({ service }) {
|
||||
const { widget } = service;
|
||||
const { i18n } = useTranslation();
|
||||
const [showDate, setShowDate] = useState(null);
|
||||
const [events, setEvents] = useState({});
|
||||
const nowDate = DateTime.now().setLocale(i18n.language);
|
||||
const currentDate = widget?.timezone ? nowDate.setZone(widget?.timezone).startOf("day") : nowDate;
|
||||
const [showDate, setShowDate] = useState(null);
|
||||
const { settings } = useContext(SettingsContext);
|
||||
|
||||
useEffect(() => {
|
||||
if (!showDate) {
|
||||
setShowDate(currentDate);
|
||||
}
|
||||
// seeded after mount, not during render: "today" is client-only and would break hydration
|
||||
// eslint-disable-next-line react-hooks/set-state-in-effect
|
||||
if (!showDate) setShowDate(currentDate);
|
||||
}, [showDate, currentDate]);
|
||||
|
||||
// params for API fetch
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import ICAL from "ical.js";
|
||||
import { DateTime } from "luxon";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
import { useEffect } from "react";
|
||||
import { useEffect, useMemo } from "react";
|
||||
|
||||
import Error from "../../../components/services/widget/error";
|
||||
import useWidgetAPI from "../../../utils/proxy/use-widget-api";
|
||||
@@ -17,26 +17,7 @@ function simpleHash(str) {
|
||||
return Math.abs(hash).toString(36);
|
||||
}
|
||||
|
||||
export default function Integration({ config, params, setEvents, hideErrors, timezone }) {
|
||||
const { t } = useTranslation();
|
||||
const { data: icalData, error: icalError } = useWidgetAPI(config, config.name, {
|
||||
refreshInterval: 300000, // 5 minutes
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const { showName = false } = config?.params || {};
|
||||
let events = [];
|
||||
|
||||
if (!icalError && icalData && !icalData.error) {
|
||||
if (!icalData.data) {
|
||||
icalData.error = { message: `'${config.name}': ${t("calendar.errorWhenLoadingData")}` };
|
||||
return;
|
||||
}
|
||||
|
||||
const jCal = ICAL.parse(icalData.data);
|
||||
const vCalendar = new ICAL.Component(jCal);
|
||||
|
||||
const buildEvent = (event, type) => {
|
||||
function buildEvent(event, type) {
|
||||
return {
|
||||
id: event.getFirstPropertyValue("uid"),
|
||||
type,
|
||||
@@ -56,26 +37,47 @@ export default function Integration({ config, params, setEvents, hideErrors, tim
|
||||
status: event.getFirstPropertyValue("status"),
|
||||
url: event.getFirstPropertyValue("url"),
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
const getEvents = () => {
|
||||
const vEvents = vCalendar.getAllSubcomponents("vevent").map((event) => buildEvent(event, "vevent"));
|
||||
export default function Integration({ config, params, setEvents, hideErrors, timezone }) {
|
||||
const { t } = useTranslation();
|
||||
const { data: icalData, error: icalError } = useWidgetAPI(config, config.name, {
|
||||
refreshInterval: 300000, // 5 minutes
|
||||
});
|
||||
|
||||
const vTodos = vCalendar.getAllSubcomponents("vtodo").map((todo) => buildEvent(todo, "vtodo"));
|
||||
|
||||
return [...vEvents, ...vTodos];
|
||||
};
|
||||
|
||||
events = getEvents();
|
||||
if (events.length === 0) {
|
||||
icalData.error = { message: `'${config.name}': ${t("calendar.noEventsFound")}` };
|
||||
const { events, dataError } = useMemo(() => {
|
||||
if (icalError || !icalData || icalData.error) {
|
||||
return { events: [], dataError: undefined };
|
||||
}
|
||||
|
||||
if (!icalData.data) {
|
||||
return {
|
||||
events: [],
|
||||
dataError: { message: `'${config.name}': ${t("calendar.errorWhenLoadingData")}` },
|
||||
};
|
||||
}
|
||||
|
||||
const jCal = ICAL.parse(icalData.data);
|
||||
const vCalendar = new ICAL.Component(jCal);
|
||||
const parsedEvents = [
|
||||
...vCalendar.getAllSubcomponents("vevent").map((event) => buildEvent(event, "vevent")),
|
||||
...vCalendar.getAllSubcomponents("vtodo").map((todo) => buildEvent(todo, "vtodo")),
|
||||
];
|
||||
|
||||
return {
|
||||
events: parsedEvents,
|
||||
dataError:
|
||||
parsedEvents.length === 0 ? { message: `'${config.name}': ${t("calendar.noEventsFound")}` } : undefined,
|
||||
};
|
||||
}, [icalData, icalError, config.name, t]);
|
||||
|
||||
useEffect(() => {
|
||||
const { showName = false } = config?.params || {};
|
||||
|
||||
const startDate = DateTime.fromISO(params.start);
|
||||
const endDate = DateTime.fromISO(params.end);
|
||||
|
||||
if (icalError || events.length === 0 || !startDate.isValid || !endDate.isValid) {
|
||||
if (events.length === 0 || !startDate.isValid || !endDate.isValid) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -113,7 +115,7 @@ export default function Integration({ config, params, setEvents, hideErrors, tim
|
||||
return occurrences;
|
||||
};
|
||||
|
||||
const eventsToAdd = [];
|
||||
const eventsToAdd = {};
|
||||
events.forEach((event) => {
|
||||
const occurrences = getOcurrencesFromRange(event);
|
||||
|
||||
@@ -154,8 +156,8 @@ export default function Integration({ config, params, setEvents, hideErrors, tim
|
||||
});
|
||||
|
||||
setEvents((prevEvents) => ({ ...prevEvents, ...eventsToAdd }));
|
||||
}, [icalData, icalError, config, params, setEvents, timezone, t]);
|
||||
}, [events, config, params, setEvents, timezone]);
|
||||
|
||||
const error = icalError ?? icalData?.error;
|
||||
const error = icalError ?? icalData?.error ?? dataError;
|
||||
return error && !hideErrors && <Error error={{ message: `${config.type}: ${error.message ?? error}` }} />;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
// @vitest-environment jsdom
|
||||
|
||||
import { render, waitFor } from "@testing-library/react";
|
||||
import { render, screen, waitFor } from "@testing-library/react";
|
||||
import { describe, expect, it, vi } from "vitest";
|
||||
|
||||
const { useWidgetAPI } = vi.hoisted(() => ({
|
||||
@@ -12,6 +12,45 @@ vi.mock("utils/proxy/use-widget-api", () => ({ default: useWidgetAPI }));
|
||||
import Integration from "./ical";
|
||||
|
||||
describe("widgets/calendar/integrations/ical", () => {
|
||||
it("reports a missing calendar payload without mutating the response", () => {
|
||||
const data = {};
|
||||
useWidgetAPI.mockReturnValue({ data, error: undefined });
|
||||
|
||||
render(
|
||||
<Integration
|
||||
config={{ name: "Work", type: "ical" }}
|
||||
params={{ start: "2099-01-01", end: "2099-01-02" }}
|
||||
setEvents={vi.fn()}
|
||||
hideErrors={false}
|
||||
timezone="utc"
|
||||
/>,
|
||||
);
|
||||
|
||||
expect(screen.getByText(/'Work': calendar\.errorWhenLoadingData/)).toBeInTheDocument();
|
||||
expect(data).toEqual({});
|
||||
});
|
||||
|
||||
it("reports a calendar with no events without mutating the response", () => {
|
||||
const data = {
|
||||
data: ["BEGIN:VCALENDAR", "VERSION:2.0", "PRODID:-//Test//EN", "END:VCALENDAR", ""].join("\n"),
|
||||
};
|
||||
const originalData = structuredClone(data);
|
||||
useWidgetAPI.mockReturnValue({ data, error: undefined });
|
||||
|
||||
render(
|
||||
<Integration
|
||||
config={{ name: "Empty", type: "ical" }}
|
||||
params={{ start: "2099-01-01", end: "2099-01-02" }}
|
||||
setEvents={vi.fn()}
|
||||
hideErrors={false}
|
||||
timezone="utc"
|
||||
/>,
|
||||
);
|
||||
|
||||
expect(screen.getByText(/'Empty': calendar\.noEventsFound/)).toBeInTheDocument();
|
||||
expect(data).toEqual(originalData);
|
||||
});
|
||||
|
||||
it("adds parsed events within the date range", async () => {
|
||||
useWidgetAPI.mockReturnValue({
|
||||
data: {
|
||||
|
||||
@@ -3,19 +3,15 @@ import Container from "components/services/widget/container";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import withWidgetFields from "utils/widget-fields";
|
||||
|
||||
const MAX_FIELDS = 4;
|
||||
const DEFAULT_FIELDS = ["running", "total", "cpu", "memory"];
|
||||
|
||||
export default function Component({ service }) {
|
||||
export default function Component({ service: configuredService }) {
|
||||
const { t } = useTranslation();
|
||||
const service = withWidgetFields(configuredService, DEFAULT_FIELDS);
|
||||
const { widget } = service;
|
||||
|
||||
if (!widget.fields) {
|
||||
widget.fields = ["running", "total", "cpu", "memory"];
|
||||
} else if (widget.fields.length > MAX_FIELDS) {
|
||||
widget.fields = widget.fields.slice(0, MAX_FIELDS);
|
||||
}
|
||||
|
||||
const { data: stats, error: statsError } = useWidgetAPI(widget, "dashboard/stats");
|
||||
|
||||
if (statsError) {
|
||||
|
||||
@@ -22,7 +22,11 @@ describe("widgets/dockhand/component", () => {
|
||||
const service = { widget: { type: "dockhand" } };
|
||||
const { container } = renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
expect(service.widget.fields).toEqual(["running", "total", "cpu", "memory"]);
|
||||
expect(service.widget.fields).toBeUndefined();
|
||||
expect(useWidgetAPI).toHaveBeenCalledWith(
|
||||
{ type: "dockhand", fields: ["running", "total", "cpu", "memory"] },
|
||||
"dashboard/stats",
|
||||
);
|
||||
expect(container.querySelectorAll(".service-block")).toHaveLength(4);
|
||||
expect(screen.getByText("dockhand.running")).toBeInTheDocument();
|
||||
expect(screen.getByText("dockhand.total")).toBeInTheDocument();
|
||||
|
||||
@@ -3,19 +3,15 @@ import Container from "components/services/widget/container";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import withWidgetFields from "utils/widget-fields";
|
||||
|
||||
const DEFAULT_FIELDS = ["jobs", "errors", "lastBackup", "nextRun"];
|
||||
|
||||
export default function Component({ service }) {
|
||||
export default function Component({ service: configuredService }) {
|
||||
const { t } = useTranslation();
|
||||
const service = withWidgetFields(configuredService, DEFAULT_FIELDS);
|
||||
const { widget } = service;
|
||||
|
||||
if (!widget.fields?.length) {
|
||||
widget.fields = DEFAULT_FIELDS;
|
||||
} else if (widget.fields?.length > 4) {
|
||||
widget.fields = widget.fields.slice(0, 4);
|
||||
}
|
||||
|
||||
const { data, error } = useWidgetAPI(widget);
|
||||
|
||||
if (error) {
|
||||
|
||||
@@ -3,10 +3,14 @@ import Container from "components/services/widget/container";
|
||||
import { useTranslation } from "next-i18next/pages";
|
||||
|
||||
import useWidgetAPI from "utils/proxy/use-widget-api";
|
||||
import withWidgetFields from "utils/widget-fields";
|
||||
|
||||
export default function Component({ service }) {
|
||||
const DEFAULT_FIELDS = ["online", "offline", "offline_alt", "total"];
|
||||
|
||||
export default function Component({ service: configuredService }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const service = withWidgetFields(configuredService, DEFAULT_FIELDS);
|
||||
const { widget } = service;
|
||||
const { data: resultData, error: resultError } = useWidgetAPI(widget);
|
||||
|
||||
@@ -14,12 +18,6 @@ export default function Component({ service }) {
|
||||
return <Container service={service} error={resultError} />;
|
||||
}
|
||||
|
||||
if (!widget.fields || widget.fields.length === 0) {
|
||||
widget.fields = ["online", "offline", "offline_alt", "total"];
|
||||
} else if (widget.fields.length > 4) {
|
||||
widget.fields = widget.fields.slice(0, 4);
|
||||
}
|
||||
|
||||
if (!resultData) {
|
||||
return (
|
||||
<Container service={service}>
|
||||
|
||||
@@ -22,7 +22,7 @@ describe("widgets/esphome/component", () => {
|
||||
const service = { widget: { type: "esphome" } };
|
||||
const { container } = renderWithProviders(<Component service={service} />, { settings: { hideErrors: false } });
|
||||
|
||||
expect(service.widget.fields).toEqual(["online", "offline", "offline_alt", "total"]);
|
||||
expect(service.widget.fields).toBeUndefined();
|
||||
expect(container.querySelectorAll(".service-block")).toHaveLength(4);
|
||||
expect(screen.getByText("esphome.online")).toBeInTheDocument();
|
||||
expect(screen.getByText("esphome.offline")).toBeInTheDocument();
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user