Compare commits
50 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 6ae632f577 | |||
| e0cfb4e808 | |||
| c4c43cef40 | |||
| 957c5fe791 | |||
| 380e34e652 | |||
| b1e50d7416 | |||
| 2298de9edd | |||
| 39d85a3596 | |||
| 1421a159dd | |||
| 186f9ef380 | |||
| 2a85f2a3d1 | |||
| c4e3c20a41 | |||
| 50caae256d | |||
| 3784b9b1c8 | |||
| 6760841b22 | |||
| ce32783fe6 | |||
| 3b0287bf19 | |||
| 101b663867 | |||
| 6281dbfa5e | |||
| 48c8ca04c0 | |||
| cc280034f6 | |||
| a2cbd8b496 | |||
| b815ce165d | |||
| 4126439e52 | |||
| 49ed3ea7ff | |||
| deafe68893 | |||
| a6f30bf681 | |||
| 9df30c3943 | |||
| cc3cc81af9 | |||
| d5ab99116c | |||
| 5e330798e1 | |||
| 1559a9ffcd | |||
| bea7eaa67b | |||
| 9a1d7f961f | |||
| e6e2aa63a5 | |||
| dab068a963 | |||
| 244714316f | |||
| b1fa087011 | |||
| bfe926546b | |||
| dccc393857 | |||
| f414dafa28 | |||
| 6e914ad71f | |||
| d923e655fe | |||
| a1ef628fb5 | |||
| b8129a0dbb | |||
| 7facb9be10 | |||
| 1b86407d8b | |||
| 40df014b6b | |||
| b217a8119e | |||
| 818f4bc9cb |
@@ -0,0 +1,28 @@
|
||||
name: E2E
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- main
|
||||
pull_request:
|
||||
|
||||
jobs:
|
||||
e2e:
|
||||
runs-on: ubuntu-latest
|
||||
container: node:20
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Install Chromium
|
||||
run: npx playwright install --with-deps chromium
|
||||
|
||||
- name: Run E2E smoke tests
|
||||
env:
|
||||
HEADLAMP_URL: https://headlamp.animaniacs.farh.net
|
||||
AUTHENTIK_USERNAME: ${{ secrets.AUTHENTIK_USERNAME }}
|
||||
AUTHENTIK_PASSWORD: ${{ secrets.AUTHENTIK_PASSWORD }}
|
||||
run: npx playwright test
|
||||
@@ -18,7 +18,7 @@ jobs:
|
||||
- name: Check if release is already finalized
|
||||
run: |
|
||||
VERSION=${GITHUB_REF_NAME#v}
|
||||
TARBALL_URL="https://github.com/cpfarhood/polaris-headlamp-plugin/releases/download/${GITHUB_REF_NAME}/polaris-headlamp-plugin-${VERSION}.tar.gz"
|
||||
TARBALL_URL="https://github.com/cpfarhood/headlamp-polaris-plugin/releases/download/${GITHUB_REF_NAME}/headlamp-polaris-plugin-${VERSION}.tar.gz"
|
||||
HTTP_CODE=$(curl -sL -o /tmp/release.tar.gz -w "%{http_code}" "$TARBALL_URL" 2>/dev/null)
|
||||
if [ "$HTTP_CODE" = "200" ]; then
|
||||
ACTUAL="sha256:$(sha256sum /tmp/release.tar.gz | awk '{print $1}')"
|
||||
@@ -115,7 +115,7 @@ jobs:
|
||||
continue-on-error: true
|
||||
run: |
|
||||
[ "$SKIP_BUILD" = "true" ] && exit 0
|
||||
GH_API="https://api.github.com/repos/cpfarhood/polaris-headlamp-plugin"
|
||||
GH_API="https://api.github.com/repos/cpfarhood/headlamp-polaris-plugin"
|
||||
# Create release or fetch existing one
|
||||
BODY=$(curl -s -X POST \
|
||||
-H "Authorization: token ${{ secrets.GH_PAT }}" \
|
||||
@@ -153,7 +153,7 @@ jobs:
|
||||
curl -sf -X POST \
|
||||
-H "Authorization: token ${{ secrets.GH_PAT }}" \
|
||||
-H "Content-Type: application/gzip" \
|
||||
"https://uploads.github.com/repos/cpfarhood/polaris-headlamp-plugin/releases/${RELEASE_ID}/assets?name=${TARBALL}" \
|
||||
"https://uploads.github.com/repos/cpfarhood/headlamp-polaris-plugin/releases/${RELEASE_ID}/assets?name=${TARBALL}" \
|
||||
--data-binary "@${TARBALL}"
|
||||
echo "GitHub release updated with same tarball"
|
||||
|
||||
@@ -161,12 +161,13 @@ jobs:
|
||||
run: |
|
||||
[ "$SKIP_BUILD" = "true" ] && exit 0
|
||||
VERSION=${GITHUB_REF_NAME#v}
|
||||
git checkout main
|
||||
sed -i "s|headlamp/plugin/archive-checksum:.*|headlamp/plugin/archive-checksum: sha256:${CHECKSUM}|" artifacthub-pkg.yml
|
||||
sed -i "s|headlamp/plugin/archive-url:.*|headlamp/plugin/archive-url: \"https://github.com/cpfarhood/polaris-headlamp-plugin/releases/download/${GITHUB_REF_NAME}/polaris-headlamp-plugin-${VERSION}.tar.gz\"|" artifacthub-pkg.yml
|
||||
sed -i "s|^version:.*|version: ${VERSION}|" artifacthub-pkg.yml
|
||||
git config user.name "gitea-actions[bot]"
|
||||
git config user.email "gitea-actions[bot]@git.farh.net"
|
||||
git fetch origin main
|
||||
git checkout origin/main -B main
|
||||
sed -i "s|headlamp/plugin/archive-checksum:.*|headlamp/plugin/archive-checksum: sha256:${CHECKSUM}|" artifacthub-pkg.yml
|
||||
sed -i "s|headlamp/plugin/archive-url:.*|headlamp/plugin/archive-url: \"https://github.com/cpfarhood/headlamp-polaris-plugin/releases/download/${GITHUB_REF_NAME}/headlamp-polaris-plugin-${VERSION}.tar.gz\"|" artifacthub-pkg.yml
|
||||
sed -i "s|^version:.*|version: ${VERSION}|" artifacthub-pkg.yml
|
||||
git add artifacthub-pkg.yml
|
||||
git diff --cached --quiet || {
|
||||
git commit -m "ci: update artifact hub metadata for ${GITHUB_REF_NAME}"
|
||||
@@ -178,7 +179,7 @@ jobs:
|
||||
git tag -f ${GITHUB_REF_NAME}
|
||||
git push -f origin ${GITHUB_REF_NAME}
|
||||
# Also push to GitHub directly to avoid waiting for mirror sync
|
||||
git remote add github https://x-access-token:${{ secrets.GH_PAT }}@github.com/cpfarhood/polaris-headlamp-plugin.git 2>/dev/null || true
|
||||
git remote add github https://x-access-token:${{ secrets.GH_PAT }}@github.com/cpfarhood/headlamp-polaris-plugin.git 2>/dev/null || true
|
||||
git push github main 2>/dev/null || true
|
||||
git push -f github ${GITHUB_REF_NAME} 2>/dev/null || true
|
||||
echo "Tag ${GITHUB_REF_NAME} aligned with updated metadata"
|
||||
|
||||
@@ -3,3 +3,6 @@ dist/
|
||||
.headlamp-plugin/
|
||||
.mcp.json
|
||||
*.tar.gz
|
||||
e2e/.auth/
|
||||
test-results/
|
||||
.playwright-mcp/
|
||||
|
||||
+2
-2
@@ -6,5 +6,5 @@ COPY src/ src/
|
||||
RUN npx @kinvolk/headlamp-plugin build
|
||||
|
||||
FROM alpine:3.20
|
||||
COPY --from=build /app/dist/ /plugins/polaris-headlamp-plugin/
|
||||
COPY --from=build /app/package.json /plugins/polaris-headlamp-plugin/
|
||||
COPY --from=build /app/dist/ /plugins/headlamp-polaris-plugin/
|
||||
COPY --from=build /app/package.json /plugins/headlamp-polaris-plugin/
|
||||
|
||||
@@ -1,53 +1,58 @@
|
||||
# polaris-headlamp-plugin
|
||||
# headlamp-polaris-plugin
|
||||
|
||||
[](https://artifacthub.io/packages/headlamp/polaris-headlamp-plugin/polaris-headlamp-plugin)
|
||||
[](https://artifacthub.io/packages/headlamp/polaris/headlamp-polaris-plugin)
|
||||
|
||||
A [Headlamp](https://headlamp.dev/) plugin that surfaces [Fairwinds Polaris](https://polaris.docs.fairwinds.com/) audit results directly in the Headlamp UI.
|
||||
|
||||
## What It Does
|
||||
|
||||
Adds a **Polaris** sidebar entry to Headlamp that displays:
|
||||
Adds a **Polaris** top-level sidebar section to Headlamp with the following views:
|
||||
|
||||
- **Cluster Score** -- overall Polaris score as a percentage (color-coded green/amber/red)
|
||||
- **Check Summary** -- total, pass, warning, and danger counts across all workloads
|
||||
- **Cluster Info** -- node, pod, namespace, and controller counts
|
||||
- **Overview** -- cluster score as a percentage (color-coded green/amber/red), check summary (pass/warning/danger/skipped counts), and cluster info (nodes, pods, namespaces, controllers)
|
||||
- **Namespaces** -- table of all namespaces with per-namespace score, pass/warning/danger/skipped counts; click a namespace to drill down
|
||||
- **Namespace detail** -- per-namespace score, check counts, and a resource table showing pass/warning/danger per workload
|
||||
- **External link** -- quick jump to the native Polaris dashboard via the Kubernetes service proxy (from namespace detail view)
|
||||
|
||||
Data is read from the `ConfigMap/polaris-dashboard` in the `polaris` namespace (key: `dashboard.json`), which is created by the standard Polaris Helm chart. The plugin is read-only -- it never writes to the cluster.
|
||||
Data is fetched from the Polaris dashboard API through the Kubernetes service proxy (`/api/v1/namespaces/polaris/services/polaris-dashboard/proxy/results.json`). The plugin is read-only -- it never writes to the cluster.
|
||||
|
||||
Results are cached and refreshed on a user-configurable interval (1 / 5 / 10 / 30 minutes, default 5). The setting persists in the browser's localStorage.
|
||||
Results are refreshed on a user-configurable interval (1 / 5 / 10 / 30 minutes, default 5). The setting is available in **Settings > Plugins > Polaris** and persists in the browser's localStorage.
|
||||
|
||||
Error states are handled explicitly: RBAC denied (403), Polaris not installed (404), malformed JSON, and loading.
|
||||
Error states are handled explicitly: RBAC denied (403), Polaris not installed (404/503), malformed JSON, and loading.
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- **Headlamp** >= v0.26 deployed in your cluster
|
||||
- **Polaris** installed via the [official Helm chart](https://github.com/FairwindsOps/polaris) with the dashboard component enabled
|
||||
- The Headlamp service account must have RBAC permission to `get` ConfigMaps in the `polaris` namespace
|
||||
| Requirement | Minimum version |
|
||||
|-------------|----------------|
|
||||
| Headlamp | v0.26+ |
|
||||
| Polaris (with dashboard enabled) | Any recent release |
|
||||
| Kubernetes | v1.24+ |
|
||||
|
||||
Polaris must be deployed in the `polaris` namespace with the dashboard component enabled (`dashboard.enabled: true` in the Helm chart, which is the default). The plugin reads from the `polaris-dashboard` ClusterIP service on port 80.
|
||||
|
||||
## Installing
|
||||
|
||||
### Option 1: Artifact Hub + Headlamp plugin manager (recommended)
|
||||
|
||||
The plugin is published on [Artifact Hub](https://artifacthub.io/packages/headlamp/polaris-headlamp-plugin/polaris-headlamp-plugin). Configure Headlamp's `pluginsManager` in your Helm values to install it automatically:
|
||||
The plugin is published on [Artifact Hub](https://artifacthub.io/packages/headlamp/polaris/headlamp-polaris-plugin). Configure Headlamp's `pluginsManager` in your Helm values to install it automatically:
|
||||
|
||||
```yaml
|
||||
pluginsManager:
|
||||
sources:
|
||||
- url: https://artifacthub.io/packages/headlamp/polaris-headlamp-plugin/polaris-headlamp-plugin
|
||||
- url: https://artifacthub.io/packages/headlamp/polaris/headlamp-polaris-plugin
|
||||
```
|
||||
|
||||
Headlamp will fetch and install the plugin on startup.
|
||||
|
||||
### Option 2: Docker init container
|
||||
|
||||
The plugin ships as a container image at `git.farh.net/farhoodliquor/polaris-headlamp-plugin`.
|
||||
The plugin ships as a container image at `git.farh.net/farhoodliquor/headlamp-polaris-plugin`.
|
||||
|
||||
Add it as an init container in your Headlamp Helm values:
|
||||
|
||||
```yaml
|
||||
initContainers:
|
||||
- name: polaris-plugin
|
||||
image: git.farh.net/farhoodliquor/polaris-headlamp-plugin:v0.0.1
|
||||
image: git.farh.net/farhoodliquor/headlamp-polaris-plugin:latest
|
||||
command: ["sh", "-c", "cp -r /plugins/* /headlamp/plugins/"]
|
||||
volumeMounts:
|
||||
- name: plugins
|
||||
@@ -64,10 +69,10 @@ volumeMounts:
|
||||
|
||||
### Option 3: Manual tarball install
|
||||
|
||||
Download the `.tar.gz` from the [GitHub releases page](https://github.com/cpfarhood/polaris-headlamp-plugin/releases) or the [Gitea releases page](https://git.farh.net/farhoodliquor/polaris-headlamp-plugin/releases), then extract into Headlamp's plugin directory:
|
||||
Download the `.tar.gz` from the [GitHub releases page](https://github.com/cpfarhood/headlamp-polaris-plugin/releases) or the [Gitea releases page](https://git.farh.net/farhoodliquor/headlamp-polaris-plugin/releases), then extract into Headlamp's plugin directory:
|
||||
|
||||
```bash
|
||||
tar xzf polaris-headlamp-plugin-0.0.1.tar.gz -C /headlamp/plugins/
|
||||
tar xzf headlamp-polaris-plugin-<version>.tar.gz -C /headlamp/plugins/
|
||||
```
|
||||
|
||||
### Option 4: Build from source
|
||||
@@ -78,42 +83,77 @@ npm run build
|
||||
npx @kinvolk/headlamp-plugin extract . /headlamp/plugins
|
||||
```
|
||||
|
||||
## RBAC
|
||||
## RBAC / Security Setup
|
||||
|
||||
The plugin reads a single ConfigMap. Minimum RBAC required for the Headlamp service account:
|
||||
The plugin fetches audit data through the Kubernetes API server's **service proxy** sub-resource. The identity making the request (Headlamp's service account, or the user's own token in token-auth mode) must be granted:
|
||||
|
||||
| Verb | API Group | Resource | Resource Name | Namespace |
|
||||
|------|-----------|----------|---------------|-----------|
|
||||
| `get` | `""` (core) | `services/proxy` | `polaris-dashboard` | `polaris` |
|
||||
|
||||
### Minimal RBAC manifests
|
||||
|
||||
```yaml
|
||||
apiVersion: rbac.authorization.k8s.io/v1
|
||||
kind: ClusterRole
|
||||
kind: Role
|
||||
metadata:
|
||||
name: headlamp-polaris-reader
|
||||
name: polaris-proxy-reader
|
||||
namespace: polaris
|
||||
rules:
|
||||
- apiGroups: [""]
|
||||
resources: ["configmaps"]
|
||||
resources: ["services/proxy"]
|
||||
resourceNames: ["polaris-dashboard"]
|
||||
verbs: ["get"]
|
||||
---
|
||||
apiVersion: rbac.authorization.k8s.io/v1
|
||||
kind: ClusterRoleBinding
|
||||
kind: RoleBinding
|
||||
metadata:
|
||||
name: headlamp-polaris-reader
|
||||
roleRef:
|
||||
apiGroup: rbac.authorization.k8s.io
|
||||
kind: ClusterRole
|
||||
name: headlamp-polaris-reader
|
||||
name: headlamp-polaris-proxy
|
||||
namespace: polaris
|
||||
subjects:
|
||||
- kind: ServiceAccount
|
||||
name: headlamp
|
||||
namespace: headlamp
|
||||
name: headlamp # adjust to match your Headlamp service account
|
||||
namespace: kube-system # adjust to match the namespace Headlamp runs in
|
||||
roleRef:
|
||||
kind: Role
|
||||
name: polaris-proxy-reader
|
||||
apiGroup: rbac.authorization.k8s.io
|
||||
```
|
||||
|
||||
Apply with `kubectl apply -f polaris-rbac.yaml`.
|
||||
|
||||
### Token-auth mode
|
||||
|
||||
When Headlamp is configured for user-supplied tokens (rather than a fixed service account), **each user** must have the RoleBinding above attached to their own identity. A 403 error in the plugin means the currently logged-in user lacks this binding.
|
||||
|
||||
### NetworkPolicy
|
||||
|
||||
If the `polaris` namespace enforces network policies, ensure ingress is allowed from the Kubernetes API server (which performs the proxy hop) to `polaris-dashboard` on port 80.
|
||||
|
||||
### Read-only access
|
||||
|
||||
The plugin only performs `GET` requests through the service proxy. No `create`, `update`, `delete`, or `patch` verbs are required. Do not grant broader access than `get` on `services/proxy`.
|
||||
|
||||
### Audit logging
|
||||
|
||||
Every proxied request is recorded in Kubernetes API audit logs as a `get` on `services/proxy` in the `polaris` namespace. If the auto-refresh interval generates more audit volume than desired, increase the refresh interval in the plugin settings or adjust your audit policy.
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
| Symptom | Likely cause | Fix |
|
||||
|---------|-------------|-----|
|
||||
| **403 Access Denied** | Missing RBAC binding for `services/proxy` | Apply the Role + RoleBinding from the RBAC section above |
|
||||
| **404 or 503** | Polaris not installed, or dashboard disabled | Install Polaris with `dashboard.enabled: true` in the `polaris` namespace |
|
||||
| **No data** | Polaris running but no workloads scanned yet | Wait for the next Polaris audit cycle or restart the Polaris pod |
|
||||
| **Stale data** | Refresh interval too long | Lower the interval in **Settings > Plugins > Polaris** |
|
||||
|
||||
## Development
|
||||
|
||||
### Setup
|
||||
|
||||
```bash
|
||||
git clone https://github.com/cpfarhood/polaris-headlamp-plugin.git
|
||||
cd polaris-headlamp-plugin
|
||||
git clone https://github.com/cpfarhood/headlamp-polaris-plugin.git
|
||||
cd headlamp-polaris-plugin
|
||||
npm install
|
||||
```
|
||||
|
||||
@@ -129,42 +169,48 @@ This starts the Headlamp plugin dev server. Point a running Headlamp instance at
|
||||
|
||||
```bash
|
||||
npm run build # outputs dist/main.js
|
||||
npm run package # creates polaris-headlamp-plugin-<version>.tar.gz
|
||||
npm run package # creates headlamp-polaris-plugin-<version>.tar.gz
|
||||
```
|
||||
|
||||
### Type-check
|
||||
### Type-check, lint, format, and test
|
||||
|
||||
```bash
|
||||
npm run tsc
|
||||
npm run tsc # type-check without emitting
|
||||
npm run lint # eslint
|
||||
npm run format:check # prettier check
|
||||
npm test # vitest unit tests
|
||||
```
|
||||
|
||||
## Project Structure
|
||||
|
||||
```
|
||||
src/
|
||||
index.tsx -- Entry point. Registers sidebar entry and route at /polaris.
|
||||
index.tsx -- Entry point. Registers sidebar entries and routes.
|
||||
api/
|
||||
polaris.ts -- TypeScript types matching the Polaris AuditData schema,
|
||||
usePolarisData() hook with caching, countResults() utility,
|
||||
and refresh interval settings (localStorage).
|
||||
polaris.ts -- TypeScript types (AuditData schema), usePolarisData hook,
|
||||
countResults utilities, refresh interval settings.
|
||||
polaris.test.ts -- Unit tests for utility functions (vitest).
|
||||
PolarisDataContext.tsx -- React context provider; shared data fetch across views.
|
||||
components/
|
||||
PolarisView.tsx -- Main page component. Score badge, check summary cards,
|
||||
cluster info, error states, refresh interval selector.
|
||||
DashboardView.tsx -- Overview page (score, check summary with skipped, cluster info).
|
||||
NamespacesListView.tsx -- Namespace list with scores and links to detail views.
|
||||
NamespaceDetailView.tsx -- Per-namespace drill-down with resource table.
|
||||
PolarisSettings.tsx -- Plugin settings page (refresh interval selector).
|
||||
vitest.config.mts -- Vitest configuration (jsdom environment).
|
||||
```
|
||||
|
||||
## Data Source
|
||||
|
||||
The plugin reads from:
|
||||
The plugin fetches live audit results from the Polaris dashboard HTTP API via the Kubernetes service proxy:
|
||||
|
||||
- **ConfigMap**: `polaris-dashboard`
|
||||
- **Namespace**: `polaris`
|
||||
- **Key**: `dashboard.json`
|
||||
```
|
||||
GET /api/v1/namespaces/polaris/services/polaris-dashboard/proxy/results.json
|
||||
```
|
||||
|
||||
This ConfigMap is created automatically when Polaris is installed with the dashboard enabled. The JSON structure matches Polaris's `AuditData` schema (`pkg/validator/output.go`):
|
||||
This endpoint is served by the `polaris-dashboard` ClusterIP service, which is created by the Polaris Helm chart when `dashboard.enabled: true`. The JSON response matches Polaris's `AuditData` schema (`pkg/validator/output.go`):
|
||||
|
||||
```
|
||||
AuditData
|
||||
Score -- cluster score (0-100)
|
||||
ClusterInfo -- nodes, pods, namespaces, controllers
|
||||
Results[] -- per-workload results
|
||||
Results{} -- top-level check results (ResultSet)
|
||||
@@ -174,54 +220,44 @@ AuditData
|
||||
Results{} -- container-level check results
|
||||
```
|
||||
|
||||
Each check in a `ResultSet` has `Success` (bool) and `Severity` (`"warning"` or `"danger"`).
|
||||
Each check in a `ResultSet` has `Success` (bool) and `Severity` (`"warning"`, `"danger"`, or `"ignore"`). Checks with `Severity: "ignore"` and `Success: false` are counted as skipped. The cluster score is computed client-side as `pass / total * 100`.
|
||||
|
||||
## Releasing
|
||||
|
||||
Releases are automated via CI. To cut a release:
|
||||
|
||||
```bash
|
||||
# Bump version in package.json and artifacthub-pkg.yml, then:
|
||||
git add package.json package-lock.json artifacthub-pkg.yml
|
||||
git commit -m "chore: bump version to 0.0.2"
|
||||
git tag v0.0.2
|
||||
git push origin main v0.0.2
|
||||
# Bump version in package.json and artifacthub-pkg.yml (version + archive-url), then:
|
||||
git add package.json artifacthub-pkg.yml
|
||||
git commit -m "chore: bump version to X.Y.Z"
|
||||
git tag vX.Y.Z
|
||||
git push origin main vX.Y.Z
|
||||
```
|
||||
|
||||
This triggers two CI pipelines:
|
||||
|
||||
**Gitea Actions** (`.gitea/workflows/release.yaml`):
|
||||
This triggers the **Gitea Actions** release workflow (`.gitea/workflows/release.yaml`):
|
||||
1. Build the plugin in a `node:20` container
|
||||
2. Package a `.tar.gz` tarball
|
||||
3. Build and push a Docker image to `git.farh.net/farhoodliquor/polaris-headlamp-plugin:{tag}` and `:latest`
|
||||
3. Build and push a Docker image to `git.farh.net/farhoodliquor/headlamp-polaris-plugin:{tag}` and `:latest`
|
||||
4. Create a Gitea release with the tarball attached
|
||||
5. Create a GitHub release with the same tarball (for Artifact Hub)
|
||||
6. Update `artifacthub-pkg.yml` checksum on main and force-move the tag to match
|
||||
|
||||
**GitHub Actions** (`.github/workflows/release.yml`):
|
||||
1. Build and package the plugin
|
||||
2. Create a GitHub release with the tarball attached (required for Artifact Hub)
|
||||
|
||||
The Gitea repo push-mirrors to GitHub automatically, so both pipelines trigger from a single `git push`.
|
||||
A guard step prevents infinite loops: if the release tarball checksum already matches the metadata, the build is skipped.
|
||||
|
||||
### CI secrets
|
||||
|
||||
| Secret | Where | Purpose |
|
||||
|---|---|---|
|
||||
| `REGISTRY_TOKEN` | Gitea | Personal access token with `package:write` scope for Docker image push |
|
||||
| `GH_PAT` | Gitea | GitHub personal access token for creating GitHub releases |
|
||||
|
||||
The Gitea release uses the built-in `github.token`. The GitHub release uses the default `GITHUB_TOKEN` with `contents: write` permission.
|
||||
|
||||
### Updating Artifact Hub
|
||||
|
||||
When releasing a new version, update `artifacthub-pkg.yml`:
|
||||
- `version` field
|
||||
- `headlamp/plugin/archive-url` annotation (update the version in the download URL)
|
||||
- `headlamp/plugin/archive-checksum` annotation (SHA256 of the new tarball, printed by the CI build)
|
||||
The Gitea release uses the built-in `github.token`. The `archive-checksum` in `artifacthub-pkg.yml` is updated automatically by the release workflow.
|
||||
|
||||
## Links
|
||||
|
||||
- [Artifact Hub](https://artifacthub.io/packages/headlamp/polaris-headlamp-plugin/polaris-headlamp-plugin)
|
||||
- [GitHub (mirror)](https://github.com/cpfarhood/polaris-headlamp-plugin)
|
||||
- [Gitea (source of truth)](https://git.farh.net/farhoodliquor/polaris-headlamp-plugin)
|
||||
- [Artifact Hub](https://artifacthub.io/packages/headlamp/polaris/headlamp-polaris-plugin)
|
||||
- [GitHub (mirror)](https://github.com/cpfarhood/headlamp-polaris-plugin)
|
||||
- [Gitea (source of truth)](https://git.farh.net/farhoodliquor/headlamp-polaris-plugin)
|
||||
- [Headlamp](https://headlamp.dev/)
|
||||
- [Fairwinds Polaris](https://polaris.docs.fairwinds.com/)
|
||||
|
||||
|
||||
+13
-7
@@ -1,10 +1,16 @@
|
||||
version: 0.0.6
|
||||
name: polaris-headlamp-plugin
|
||||
version: 0.1.5
|
||||
name: headlamp-polaris-plugin
|
||||
displayName: Polaris
|
||||
createdAt: "2026-02-05T19:00:00Z"
|
||||
description: Surfaces Fairwinds Polaris audit results inside the Headlamp UI.
|
||||
description: >-
|
||||
Surfaces Fairwinds Polaris audit results inside the Headlamp UI.
|
||||
Shows cluster score, check summary, and per-namespace drill-downs
|
||||
with per-resource pass/warning/danger breakdowns. Data is fetched
|
||||
read-only via the Kubernetes service proxy to the Polaris dashboard.
|
||||
Requires a Role granting `get` on `services/proxy` for the
|
||||
`polaris-dashboard` service in the `polaris` namespace.
|
||||
license: MIT
|
||||
homeURL: "https://github.com/cpfarhood/polaris-headlamp-plugin"
|
||||
homeURL: "https://github.com/cpfarhood/headlamp-polaris-plugin"
|
||||
category: security
|
||||
keywords:
|
||||
- polaris
|
||||
@@ -15,14 +21,14 @@ keywords:
|
||||
- kubernetes
|
||||
links:
|
||||
- name: Source
|
||||
url: "https://github.com/cpfarhood/polaris-headlamp-plugin"
|
||||
url: "https://github.com/cpfarhood/headlamp-polaris-plugin"
|
||||
- name: Polaris
|
||||
url: "https://polaris.docs.fairwinds.com/"
|
||||
maintainers:
|
||||
- name: cpfarhood
|
||||
email: "chris@farhood.org"
|
||||
annotations:
|
||||
headlamp/plugin/archive-url: "https://github.com/cpfarhood/polaris-headlamp-plugin/releases/download/v0.0.6/polaris-headlamp-plugin-0.0.6.tar.gz"
|
||||
headlamp/plugin/archive-url: "https://github.com/cpfarhood/headlamp-polaris-plugin/releases/download/v0.1.5/headlamp-polaris-plugin-0.1.5.tar.gz"
|
||||
headlamp/plugin/version-compat: ">=0.26"
|
||||
headlamp/plugin/archive-checksum: sha256:12e72b6a64e3f1c73f542b6328d56391c2cc2906a9a9d7eff58fbf27f14a8680
|
||||
headlamp/plugin/archive-checksum: sha256:7e56af04bcd9121e09eab092608c774b3aa2137d1e0338f1bb06149dd3f5c3ce
|
||||
headlamp/plugin/distro-compat: in-cluster
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
repositoryID: fb4c3789-de2b-4667-8fff-34f22e5648da
|
||||
repositoryID: fc3397f6-a75a-4950-ab50-da75c08a8089
|
||||
owners:
|
||||
- name: cpfarhood
|
||||
email: "chris@farhood.org"
|
||||
|
||||
@@ -4,7 +4,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
|
||||
|
||||
## Project Overview
|
||||
|
||||
Headlamp plugin that surfaces Fairwinds Polaris audit results inside the Headlamp UI. Queries the Polaris dashboard API via the Kubernetes service proxy (`/api/v1/namespaces/polaris/services/polaris-dashboard:80/proxy/results.json`). Target Headlamp ≥ v0.26.
|
||||
Headlamp plugin that surfaces Fairwinds Polaris audit results inside the Headlamp UI. Queries the Polaris dashboard API via the Kubernetes service proxy (`/api/v1/namespaces/polaris/services/polaris-dashboard/proxy/results.json`). Target Headlamp ≥ v0.26.
|
||||
|
||||
## Build & Development Commands
|
||||
|
||||
@@ -23,20 +23,75 @@ npx tsc --noEmit
|
||||
|
||||
# Lint
|
||||
npx eslint src/
|
||||
|
||||
# Run tests
|
||||
npm test
|
||||
```
|
||||
|
||||
## Architecture
|
||||
|
||||
```
|
||||
src/
|
||||
├── index.tsx # Entry point: registerSidebarEntry + registerRoute for /polaris
|
||||
├── index.tsx # Entry point: registers sidebar entries + routes
|
||||
├── api/
|
||||
│ └── polaris.ts # Types (AuditData schema), usePolarisData hook, countResults utility, refresh settings
|
||||
│ ├── polaris.ts # Types (AuditData schema), usePolarisData hook, countResults utilities, refresh settings
|
||||
│ ├── polaris.test.ts # Unit tests for utility functions (vitest)
|
||||
│ └── PolarisDataContext.tsx # React context provider for shared data fetch
|
||||
└── components/
|
||||
└── PolarisView.tsx # Main page: score badge, check summary, cluster info, error states, refresh interval selector
|
||||
├── DashboardView.tsx # Overview page (score, check summary with skipped count, cluster info)
|
||||
├── NamespacesListView.tsx # Namespace list with scores and links to detail views
|
||||
├── NamespaceDetailView.tsx # Per-namespace drill-down with resource table
|
||||
└── PolarisSettings.tsx # Plugin settings (refresh interval selector)
|
||||
```
|
||||
|
||||
Single sidebar page at `/polaris`. Data is fetched via `ApiProxy.request` to the Polaris dashboard service proxy and refreshed on a user-configurable interval (stored in localStorage under `polaris-plugin-refresh-interval`, default 5 minutes). Score is computed from result counts (pass/total).
|
||||
Top-level sidebar section at `/polaris` with sub-routes for namespaces list (`/polaris/namespaces`) and per-namespace views (`/polaris/ns/:namespace`). Data is fetched via `ApiProxy.request` to the Polaris dashboard service proxy and refreshed on a user-configurable interval (stored in localStorage under `polaris-plugin-refresh-interval`, default 5 minutes). Score is computed from result counts (pass/total). Skipped checks are always displayed in summaries.
|
||||
|
||||
**Sidebar limitation**: Headlamp's sidebar only supports 2-level nesting (parent → children). The `Collapse` component is driven by route-based selection, not click-to-toggle, so 3-level hierarchies don't expand properly. Namespace navigation is handled via the in-content table on the Namespaces page instead.
|
||||
|
||||
## Security / RBAC Requirements
|
||||
|
||||
The plugin reaches Polaris through the Kubernetes API server's service proxy sub-resource (`/api/v1/namespaces/polaris/services/polaris-dashboard/proxy/...`). The Headlamp service account (or the user's bearer token when Headlamp runs in token-auth mode) must be granted:
|
||||
|
||||
| Verb | API Group | Resource | Resource Name | Namespace |
|
||||
|------|-----------|----------|---------------|-----------|
|
||||
| `get` | `""` (core) | `services/proxy` | `polaris-dashboard` | `polaris` |
|
||||
|
||||
Minimal RBAC example:
|
||||
|
||||
```yaml
|
||||
apiVersion: rbac.authorization.k8s.io/v1
|
||||
kind: Role
|
||||
metadata:
|
||||
name: polaris-proxy-reader
|
||||
namespace: polaris
|
||||
rules:
|
||||
- apiGroups: [""]
|
||||
resources: ["services/proxy"]
|
||||
resourceNames: ["polaris-dashboard"]
|
||||
verbs: ["get"]
|
||||
---
|
||||
apiVersion: rbac.authorization.k8s.io/v1
|
||||
kind: RoleBinding
|
||||
metadata:
|
||||
name: headlamp-polaris-proxy
|
||||
namespace: polaris
|
||||
subjects:
|
||||
- kind: ServiceAccount
|
||||
name: headlamp # adjust to match your Headlamp SA
|
||||
namespace: kube-system
|
||||
roleRef:
|
||||
kind: Role
|
||||
name: polaris-proxy-reader
|
||||
apiGroup: rbac.authorization.k8s.io
|
||||
```
|
||||
|
||||
Additional considerations:
|
||||
|
||||
- **NetworkPolicy**: If the `polaris` namespace enforces network policies, allow ingress from the Headlamp pod (or the API server, since it performs the proxy hop) to `polaris-dashboard` on port 80.
|
||||
- **Polaris dashboard listen address**: The Polaris Helm chart exposes the dashboard on a ClusterIP service (`polaris-dashboard:80`). If the chart is installed with `dashboard.enabled: false`, the service will not be created, resulting in a 404 error for proxy requests.
|
||||
- **No write operations**: The plugin only performs `GET` requests through the proxy. No `create`, `update`, or `delete` verbs are required. Do not grant broader service proxy access than `get`.
|
||||
- **Token-auth mode**: When Headlamp is configured for user-supplied tokens (rather than a fixed service account), each user's own RBAC bindings must include the role above. A 403 from the plugin means the logged-in user lacks the binding.
|
||||
- **Audit logging**: Kubernetes API audit logs will record every proxied request as a `get` on `services/proxy` in the `polaris` namespace. Set an appropriate audit policy level if request volume from the auto-refresh interval is a concern.
|
||||
|
||||
## Key Constraints
|
||||
|
||||
|
||||
@@ -0,0 +1,58 @@
|
||||
# E2E Smoke Tests
|
||||
|
||||
Playwright-based smoke tests that validate the Polaris plugin against a live Headlamp deployment.
|
||||
|
||||
## CI
|
||||
|
||||
E2E tests run automatically in Gitea Actions on pushes to `main` and pull requests. The workflow (`.gitea/workflows/e2e.yaml`) uses Authentik OIDC for authentication via repo secrets.
|
||||
|
||||
### Required Gitea secrets
|
||||
|
||||
| Secret | Description |
|
||||
| -------------------- | -------------------------------------------------------------- |
|
||||
| `AUTHENTIK_USERNAME` | Authentik email or username for a CI user with Headlamp access |
|
||||
| `AUTHENTIK_PASSWORD` | Password for that user |
|
||||
|
||||
## Running Locally
|
||||
|
||||
### Option 1: OIDC via Authentik (same as CI)
|
||||
|
||||
```bash
|
||||
AUTHENTIK_USERNAME=you@example.com AUTHENTIK_PASSWORD=... npm run e2e
|
||||
```
|
||||
|
||||
The default base URL is `https://headlamp.animaniacs.farh.net`. Override with `HEADLAMP_URL` if needed.
|
||||
|
||||
### Option 2: K8s bearer token (port-forward)
|
||||
|
||||
```bash
|
||||
kubectl port-forward -n kube-system svc/headlamp 4466:80
|
||||
export HEADLAMP_TOKEN=$(kubectl create token headlamp -n kube-system)
|
||||
HEADLAMP_URL=http://localhost:4466 npm run e2e
|
||||
```
|
||||
|
||||
Or in headed mode (opens a browser window):
|
||||
|
||||
```bash
|
||||
HEADLAMP_URL=http://localhost:4466 npm run e2e:headed
|
||||
```
|
||||
|
||||
## Environment Variables
|
||||
|
||||
| Variable | Required | Default | Description |
|
||||
| -------------------- | -------- | -------------------------------------- | --------------------------------------- |
|
||||
| `HEADLAMP_URL` | No | `https://headlamp.animaniacs.farh.net` | Base URL of the Headlamp instance |
|
||||
| `AUTHENTIK_USERNAME` | OIDC | — | Authentik email/username |
|
||||
| `AUTHENTIK_PASSWORD` | OIDC | — | Authentik password |
|
||||
| `HEADLAMP_TOKEN` | Token | — | Kubernetes bearer token (fallback auth) |
|
||||
|
||||
Set either `AUTHENTIK_USERNAME` + `AUTHENTIK_PASSWORD` or `HEADLAMP_TOKEN`. OIDC takes priority if both are set.
|
||||
|
||||
## What the Tests Validate
|
||||
|
||||
- **Sidebar entry** — The Polaris sidebar item appears after login
|
||||
- **Overview page** — Cluster score and check distribution render correctly
|
||||
- **Namespaces page** — Table of namespaces loads with clickable links
|
||||
- **Namespace detail** — Clicking a namespace shows its score and resource table
|
||||
|
||||
These are smoke tests against real cluster data. They verify the plugin loads and renders without errors, not specific data values.
|
||||
@@ -0,0 +1,67 @@
|
||||
import { test as setup, expect, Page } from '@playwright/test';
|
||||
|
||||
const AUTH_STATE_PATH = 'e2e/.auth/state.json';
|
||||
|
||||
async function authenticateWithOIDC(page: Page, username: string, password: string): Promise<void> {
|
||||
// Navigate to login — Headlamp redirects / to /c/main/login
|
||||
await page.goto('/');
|
||||
await page.waitForURL('**/login');
|
||||
|
||||
// Click "Sign In" and capture the Authentik popup
|
||||
const popupPromise = page.waitForEvent('popup');
|
||||
await page.getByRole('button', { name: /sign in/i }).click();
|
||||
const popup = await popupPromise;
|
||||
|
||||
// Authentik step 1: fill username
|
||||
await popup.getByRole('textbox', { name: /email or username/i }).fill(username);
|
||||
await popup.getByRole('button', { name: /log in/i }).click();
|
||||
|
||||
// Authentik step 2: fill password
|
||||
await popup.getByRole('textbox', { name: /password/i }).fill(password);
|
||||
await popup.getByRole('button', { name: /continue|log in/i }).click();
|
||||
|
||||
// Wait for the popup to close (Authentik redirects back, Headlamp processes callback)
|
||||
await popup.waitForEvent('close', { timeout: 15_000 });
|
||||
|
||||
// Original page should now be authenticated — wait for sidebar
|
||||
await expect(page.getByRole('navigation', { name: 'Navigation' })).toBeVisible({
|
||||
timeout: 15_000,
|
||||
});
|
||||
}
|
||||
|
||||
async function authenticateWithToken(page: Page, token: string): Promise<void> {
|
||||
// Navigate to login — Headlamp redirects / to /c/main/login
|
||||
await page.goto('/');
|
||||
await page.waitForURL('**/login');
|
||||
|
||||
// Click the token auth option
|
||||
await page.getByRole('button', { name: /use a token/i }).click();
|
||||
await page.waitForURL('**/token');
|
||||
|
||||
// Fill the "ID token" field and submit
|
||||
await page.getByRole('textbox', { name: /id token/i }).fill(token);
|
||||
await page.getByRole('button', { name: /authenticate/i }).click();
|
||||
|
||||
// Wait for the main UI to load
|
||||
await expect(page.getByRole('navigation', { name: 'Navigation' })).toBeVisible({
|
||||
timeout: 15_000,
|
||||
});
|
||||
}
|
||||
|
||||
setup('authenticate with Headlamp', async ({ page }) => {
|
||||
const username = process.env.AUTHENTIK_USERNAME;
|
||||
const password = process.env.AUTHENTIK_PASSWORD;
|
||||
const token = process.env.HEADLAMP_TOKEN;
|
||||
|
||||
if (username && password) {
|
||||
await authenticateWithOIDC(page, username, password);
|
||||
} else if (token) {
|
||||
await authenticateWithToken(page, token);
|
||||
} else {
|
||||
throw new Error(
|
||||
'Set AUTHENTIK_USERNAME + AUTHENTIK_PASSWORD for OIDC auth, or HEADLAMP_TOKEN for token auth'
|
||||
);
|
||||
}
|
||||
|
||||
await page.context().storageState({ path: AUTH_STATE_PATH });
|
||||
});
|
||||
@@ -0,0 +1,61 @@
|
||||
import { test, expect } from '@playwright/test';
|
||||
|
||||
test.describe('Polaris plugin smoke tests', () => {
|
||||
test('sidebar contains Polaris entry', async ({ page }) => {
|
||||
await page.goto('/');
|
||||
// The sidebar is the "Navigation" nav element (not "Appbar Tools")
|
||||
const sidebar = page.getByRole('navigation', { name: 'Navigation' });
|
||||
await expect(sidebar).toBeVisible({ timeout: 15_000 });
|
||||
await expect(sidebar.getByRole('button', { name: 'Polaris' })).toBeVisible();
|
||||
});
|
||||
|
||||
test('overview page renders cluster score', async ({ page }) => {
|
||||
await page.goto('/c/main/polaris');
|
||||
|
||||
// SectionHeader renders a heading
|
||||
await expect(page.getByRole('heading', { name: 'Polaris \u2014 Overview' })).toBeVisible();
|
||||
|
||||
// "Cluster Score" section exists with a percentage
|
||||
await expect(page.getByText('Cluster Score')).toBeVisible();
|
||||
await expect(page.getByText(/%/)).toBeVisible();
|
||||
});
|
||||
|
||||
test('namespaces page renders table with links', async ({ page }) => {
|
||||
await page.goto('/c/main/polaris/namespaces');
|
||||
|
||||
await expect(page.getByRole('heading', { name: 'Polaris \u2014 Namespaces' })).toBeVisible();
|
||||
|
||||
// Table should have at least one row with a namespace link
|
||||
const table = page.locator('table');
|
||||
await expect(table).toBeVisible();
|
||||
const rows = table.locator('tbody tr');
|
||||
await expect(rows.first()).toBeVisible();
|
||||
|
||||
// Each namespace row should contain a link
|
||||
const firstLink = rows.first().locator('a');
|
||||
await expect(firstLink).toBeVisible();
|
||||
});
|
||||
|
||||
test('namespace detail page renders from table link', async ({ page }) => {
|
||||
await page.goto('/c/main/polaris/namespaces');
|
||||
|
||||
// Click the first namespace link in the table
|
||||
const table = page.locator('table');
|
||||
await expect(table).toBeVisible();
|
||||
const firstLink = table.locator('tbody tr').first().locator('a');
|
||||
const namespaceName = await firstLink.textContent();
|
||||
await firstLink.click();
|
||||
|
||||
// Detail page should show the namespace name in the heading
|
||||
await expect(
|
||||
page.getByRole('heading', { name: `Polaris \u2014 ${namespaceName}` })
|
||||
).toBeVisible();
|
||||
|
||||
// "Namespace Score" section should be present
|
||||
await expect(page.getByText('Namespace Score')).toBeVisible();
|
||||
|
||||
// Resources table should exist
|
||||
await expect(page.getByText('Resources')).toBeVisible();
|
||||
await expect(page.locator('table')).toBeVisible();
|
||||
});
|
||||
});
|
||||
Generated
+69
-5
@@ -1,14 +1,15 @@
|
||||
{
|
||||
"name": "polaris-headlamp-plugin",
|
||||
"version": "0.0.5",
|
||||
"name": "headlamp-polaris-plugin",
|
||||
"version": "0.1.3",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "polaris-headlamp-plugin",
|
||||
"version": "0.0.5",
|
||||
"name": "headlamp-polaris-plugin",
|
||||
"version": "0.1.3",
|
||||
"devDependencies": {
|
||||
"@kinvolk/headlamp-plugin": "^0.13.0"
|
||||
"@kinvolk/headlamp-plugin": "^0.13.0",
|
||||
"@playwright/test": "^1.58.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@adobe/css-tools": {
|
||||
@@ -2469,6 +2470,22 @@
|
||||
"node": ">=14"
|
||||
}
|
||||
},
|
||||
"node_modules/@playwright/test": {
|
||||
"version": "1.58.2",
|
||||
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.58.2.tgz",
|
||||
"integrity": "sha512-akea+6bHYBBfA9uQqSYmlJXn61cTa+jbO87xVLCWbTqbWadRVmhxlXATaOjOgcBaWU4ePo0wB41KMFv3o35IXA==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"playwright": "1.58.2"
|
||||
},
|
||||
"bin": {
|
||||
"playwright": "cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/@popperjs/core": {
|
||||
"version": "2.11.8",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
|
||||
@@ -13554,6 +13571,53 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/playwright": {
|
||||
"version": "1.58.2",
|
||||
"resolved": "https://registry.npmjs.org/playwright/-/playwright-1.58.2.tgz",
|
||||
"integrity": "sha512-vA30H8Nvkq/cPBnNw4Q8TWz1EJyqgpuinBcHET0YVJVFldr8JDNiU9LaWAE1KqSkRYazuaBhTpB5ZzShOezQ6A==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"playwright-core": "1.58.2"
|
||||
},
|
||||
"bin": {
|
||||
"playwright": "cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"fsevents": "2.3.2"
|
||||
}
|
||||
},
|
||||
"node_modules/playwright-core": {
|
||||
"version": "1.58.2",
|
||||
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.58.2.tgz",
|
||||
"integrity": "sha512-yZkEtftgwS8CsfYo7nm0KE8jsvm6i/PTgVtB8DL726wNf6H2IMsDuxCpJj59KDaxCtSnrWan2AeDqM7JBaultg==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"bin": {
|
||||
"playwright-core": "cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/playwright/node_modules/fsevents": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"engines": {
|
||||
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/possible-typed-array-names": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
|
||||
|
||||
+9
-4
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "polaris-headlamp-plugin",
|
||||
"version": "0.0.6",
|
||||
"name": "headlamp-polaris-plugin",
|
||||
"version": "0.1.5",
|
||||
"description": "Headlamp plugin for Fairwinds Polaris audit results",
|
||||
"scripts": {
|
||||
"start": "headlamp-plugin start",
|
||||
@@ -10,9 +10,14 @@
|
||||
"lint": "eslint --ext .ts,.tsx src/",
|
||||
"lint:fix": "eslint --ext .ts,.tsx --fix src/",
|
||||
"format": "prettier --write src/",
|
||||
"format:check": "prettier --check src/"
|
||||
"format:check": "prettier --check src/",
|
||||
"test": "vitest run",
|
||||
"test:watch": "vitest",
|
||||
"e2e": "playwright test",
|
||||
"e2e:headed": "playwright test --headed"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@kinvolk/headlamp-plugin": "^0.13.0"
|
||||
"@kinvolk/headlamp-plugin": "^0.13.0",
|
||||
"@playwright/test": "^1.58.2"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
import { defineConfig, devices } from '@playwright/test';
|
||||
|
||||
export default defineConfig({
|
||||
testDir: './e2e',
|
||||
timeout: 30_000,
|
||||
expect: { timeout: 10_000 },
|
||||
fullyParallel: false,
|
||||
forbidOnly: !!process.env.CI,
|
||||
retries: process.env.CI ? 1 : 0,
|
||||
reporter: 'list',
|
||||
use: {
|
||||
baseURL: process.env.HEADLAMP_URL || 'https://headlamp.animaniacs.farh.net',
|
||||
trace: 'on-first-retry',
|
||||
},
|
||||
projects: [
|
||||
{ name: 'setup', testMatch: /auth\.setup\.ts/ },
|
||||
{
|
||||
name: 'chromium',
|
||||
use: {
|
||||
...devices['Desktop Chrome'],
|
||||
storageState: 'e2e/.auth/state.json',
|
||||
},
|
||||
dependencies: ['setup'],
|
||||
},
|
||||
],
|
||||
});
|
||||
@@ -0,0 +1,48 @@
|
||||
import { renderHook } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
import { makeAuditData, makeResult } from '../test-utils';
|
||||
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib', () => ({
|
||||
ApiProxy: { request: vi.fn() },
|
||||
}));
|
||||
|
||||
// Mock usePolarisData so PolarisDataProvider doesn't make real API calls
|
||||
vi.mock('./polaris', async importOriginal => {
|
||||
const actual = await importOriginal<typeof import('./polaris')>();
|
||||
return {
|
||||
...actual,
|
||||
usePolarisData: vi.fn(() => ({
|
||||
data: makeAuditData([makeResult()]),
|
||||
loading: false,
|
||||
error: null,
|
||||
})),
|
||||
};
|
||||
});
|
||||
|
||||
import { PolarisDataProvider, usePolarisDataContext } from './PolarisDataContext';
|
||||
|
||||
describe('usePolarisDataContext', () => {
|
||||
it('throws when used outside PolarisDataProvider', () => {
|
||||
// Suppress console.error from React during expected error
|
||||
const spy = vi.spyOn(console, 'error').mockImplementation(() => {});
|
||||
|
||||
expect(() => {
|
||||
renderHook(() => usePolarisDataContext());
|
||||
}).toThrow('usePolarisDataContext must be used within a PolarisDataProvider');
|
||||
|
||||
spy.mockRestore();
|
||||
});
|
||||
|
||||
it('returns context value when inside PolarisDataProvider', () => {
|
||||
const wrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<PolarisDataProvider>{children}</PolarisDataProvider>
|
||||
);
|
||||
|
||||
const { result } = renderHook(() => usePolarisDataContext(), { wrapper });
|
||||
|
||||
expect(result.current.data).not.toBeNull();
|
||||
expect(result.current.loading).toBe(false);
|
||||
expect(result.current.error).toBeNull();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,25 @@
|
||||
import React from 'react';
|
||||
import { AuditData, getRefreshInterval, usePolarisData } from './polaris';
|
||||
|
||||
interface PolarisDataContextValue {
|
||||
data: AuditData | null;
|
||||
loading: boolean;
|
||||
error: string | null;
|
||||
}
|
||||
|
||||
const PolarisDataContext = React.createContext<PolarisDataContextValue | null>(null);
|
||||
|
||||
export function PolarisDataProvider(props: { children: React.ReactNode }) {
|
||||
const interval = getRefreshInterval();
|
||||
const state = usePolarisData(interval);
|
||||
|
||||
return <PolarisDataContext.Provider value={state}>{props.children}</PolarisDataContext.Provider>;
|
||||
}
|
||||
|
||||
export function usePolarisDataContext(): PolarisDataContextValue {
|
||||
const ctx = React.useContext(PolarisDataContext);
|
||||
if (ctx === null) {
|
||||
throw new Error('usePolarisDataContext must be used within a PolarisDataProvider');
|
||||
}
|
||||
return ctx;
|
||||
}
|
||||
@@ -0,0 +1,390 @@
|
||||
import { act, renderHook, waitFor } from '@testing-library/react';
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import { makeAuditData, makeResult } from '../test-utils';
|
||||
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib', () => ({
|
||||
ApiProxy: { request: vi.fn() },
|
||||
}));
|
||||
|
||||
import { ApiProxy } from '@kinvolk/headlamp-plugin/lib';
|
||||
import {
|
||||
computeScore,
|
||||
countResults,
|
||||
countResultsForItems,
|
||||
filterResultsByNamespace,
|
||||
getNamespaces,
|
||||
getRefreshInterval,
|
||||
Result,
|
||||
ResultCounts,
|
||||
setRefreshInterval,
|
||||
usePolarisData,
|
||||
} from './polaris';
|
||||
|
||||
// --- computeScore ---
|
||||
|
||||
describe('computeScore', () => {
|
||||
it('returns 0 when total is 0', () => {
|
||||
const counts: ResultCounts = { total: 0, pass: 0, warning: 0, danger: 0, skipped: 0 };
|
||||
expect(computeScore(counts)).toBe(0);
|
||||
});
|
||||
|
||||
it('returns 100 when all checks pass', () => {
|
||||
const counts: ResultCounts = { total: 10, pass: 10, warning: 0, danger: 0, skipped: 0 };
|
||||
expect(computeScore(counts)).toBe(100);
|
||||
});
|
||||
|
||||
it('rounds to nearest integer', () => {
|
||||
const counts: ResultCounts = { total: 3, pass: 1, warning: 1, danger: 1, skipped: 0 };
|
||||
expect(computeScore(counts)).toBe(33);
|
||||
});
|
||||
|
||||
it('includes skipped in total denominator', () => {
|
||||
const counts: ResultCounts = { total: 10, pass: 5, warning: 2, danger: 1, skipped: 2 };
|
||||
expect(computeScore(counts)).toBe(50);
|
||||
});
|
||||
});
|
||||
|
||||
// --- countResults / countResultsForItems ---
|
||||
|
||||
describe('countResults', () => {
|
||||
it('returns zero counts for empty results', () => {
|
||||
const data = makeAuditData([]);
|
||||
const counts = countResults(data);
|
||||
expect(counts).toEqual({ total: 0, pass: 0, warning: 0, danger: 0, skipped: 0 });
|
||||
});
|
||||
|
||||
it('counts top-level result set entries', () => {
|
||||
const result = makeResult({
|
||||
Results: {
|
||||
check1: {
|
||||
ID: 'check1',
|
||||
Message: 'ok',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'Security',
|
||||
},
|
||||
check2: {
|
||||
ID: 'check2',
|
||||
Message: 'bad',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'danger',
|
||||
Category: 'Security',
|
||||
},
|
||||
},
|
||||
});
|
||||
const counts = countResults(makeAuditData([result]));
|
||||
expect(counts.total).toBe(2);
|
||||
expect(counts.pass).toBe(1);
|
||||
expect(counts.danger).toBe(1);
|
||||
expect(counts.warning).toBe(0);
|
||||
expect(counts.skipped).toBe(0);
|
||||
});
|
||||
|
||||
it('counts skipped (severity=ignore, success=false) entries', () => {
|
||||
const result = makeResult({
|
||||
Results: {
|
||||
skipped1: {
|
||||
ID: 'skipped1',
|
||||
Message: 'skipped',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'ignore',
|
||||
Category: 'Security',
|
||||
},
|
||||
},
|
||||
});
|
||||
const counts = countResults(makeAuditData([result]));
|
||||
expect(counts.total).toBe(1);
|
||||
expect(counts.skipped).toBe(1);
|
||||
expect(counts.pass).toBe(0);
|
||||
});
|
||||
|
||||
it('counts PodResult and ContainerResults', () => {
|
||||
const result = makeResult({
|
||||
Results: {
|
||||
top: {
|
||||
ID: 'top',
|
||||
Message: 'ok',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'Reliability',
|
||||
},
|
||||
},
|
||||
PodResult: {
|
||||
Name: 'pod-1',
|
||||
Results: {
|
||||
podCheck: {
|
||||
ID: 'podCheck',
|
||||
Message: 'warn',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'warning',
|
||||
Category: 'Reliability',
|
||||
},
|
||||
},
|
||||
ContainerResults: [
|
||||
{
|
||||
Name: 'container-1',
|
||||
Results: {
|
||||
containerCheck: {
|
||||
ID: 'containerCheck',
|
||||
Message: 'danger',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'danger',
|
||||
Category: 'Security',
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
||||
const counts = countResults(makeAuditData([result]));
|
||||
expect(counts.total).toBe(3);
|
||||
expect(counts.pass).toBe(1);
|
||||
expect(counts.warning).toBe(1);
|
||||
expect(counts.danger).toBe(1);
|
||||
});
|
||||
|
||||
it('aggregates across multiple results', () => {
|
||||
const r1 = makeResult({
|
||||
Name: 'deploy-a',
|
||||
Results: {
|
||||
c1: {
|
||||
ID: 'c1',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
});
|
||||
const r2 = makeResult({
|
||||
Name: 'deploy-b',
|
||||
Results: {
|
||||
c2: {
|
||||
ID: 'c2',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
});
|
||||
const counts = countResults(makeAuditData([r1, r2]));
|
||||
expect(counts.total).toBe(2);
|
||||
expect(counts.pass).toBe(1);
|
||||
expect(counts.warning).toBe(1);
|
||||
});
|
||||
});
|
||||
|
||||
describe('countResultsForItems', () => {
|
||||
it('works on a subset of results', () => {
|
||||
const results: Result[] = [
|
||||
makeResult({
|
||||
Results: {
|
||||
a: {
|
||||
ID: 'a',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'danger',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
];
|
||||
const counts = countResultsForItems(results);
|
||||
expect(counts.danger).toBe(1);
|
||||
expect(counts.total).toBe(1);
|
||||
});
|
||||
});
|
||||
|
||||
// --- getNamespaces ---
|
||||
|
||||
describe('getNamespaces', () => {
|
||||
it('returns empty array for no results', () => {
|
||||
expect(getNamespaces(makeAuditData([]))).toEqual([]);
|
||||
});
|
||||
|
||||
it('returns sorted unique namespaces', () => {
|
||||
const data = makeAuditData([
|
||||
makeResult({ Namespace: 'beta' }),
|
||||
makeResult({ Namespace: 'alpha' }),
|
||||
makeResult({ Namespace: 'beta' }),
|
||||
makeResult({ Namespace: 'gamma' }),
|
||||
]);
|
||||
expect(getNamespaces(data)).toEqual(['alpha', 'beta', 'gamma']);
|
||||
});
|
||||
|
||||
it('excludes results with empty namespace (cluster-scoped resources)', () => {
|
||||
const data = makeAuditData([
|
||||
makeResult({ Namespace: '' }),
|
||||
makeResult({ Namespace: 'alpha' }),
|
||||
makeResult({ Namespace: '' }),
|
||||
]);
|
||||
expect(getNamespaces(data)).toEqual(['alpha']);
|
||||
});
|
||||
});
|
||||
|
||||
// --- filterResultsByNamespace ---
|
||||
|
||||
describe('filterResultsByNamespace', () => {
|
||||
it('returns only results matching the namespace', () => {
|
||||
const data = makeAuditData([
|
||||
makeResult({ Name: 'a', Namespace: 'ns1' }),
|
||||
makeResult({ Name: 'b', Namespace: 'ns2' }),
|
||||
makeResult({ Name: 'c', Namespace: 'ns1' }),
|
||||
]);
|
||||
const filtered = filterResultsByNamespace(data, 'ns1');
|
||||
expect(filtered).toHaveLength(2);
|
||||
expect(filtered.map(r => r.Name)).toEqual(['a', 'c']);
|
||||
});
|
||||
|
||||
it('returns empty array for non-existent namespace', () => {
|
||||
const data = makeAuditData([makeResult({ Namespace: 'ns1' })]);
|
||||
expect(filterResultsByNamespace(data, 'ns-missing')).toEqual([]);
|
||||
});
|
||||
});
|
||||
|
||||
// --- getRefreshInterval / setRefreshInterval ---
|
||||
|
||||
describe('getRefreshInterval', () => {
|
||||
beforeEach(() => {
|
||||
window.localStorage.removeItem('polaris-plugin-refresh-interval');
|
||||
});
|
||||
|
||||
it('returns default (300) when nothing stored', () => {
|
||||
expect(getRefreshInterval()).toBe(300);
|
||||
});
|
||||
|
||||
it('returns stored value when valid', () => {
|
||||
localStorage.setItem('polaris-plugin-refresh-interval', '60');
|
||||
expect(getRefreshInterval()).toBe(60);
|
||||
});
|
||||
|
||||
it('returns default for non-numeric stored value', () => {
|
||||
localStorage.setItem('polaris-plugin-refresh-interval', 'abc');
|
||||
expect(getRefreshInterval()).toBe(300);
|
||||
});
|
||||
|
||||
it('returns default for zero stored value', () => {
|
||||
localStorage.setItem('polaris-plugin-refresh-interval', '0');
|
||||
expect(getRefreshInterval()).toBe(300);
|
||||
});
|
||||
|
||||
it('returns default for negative stored value', () => {
|
||||
localStorage.setItem('polaris-plugin-refresh-interval', '-10');
|
||||
expect(getRefreshInterval()).toBe(300);
|
||||
});
|
||||
});
|
||||
|
||||
describe('setRefreshInterval', () => {
|
||||
beforeEach(() => {
|
||||
window.localStorage.removeItem('polaris-plugin-refresh-interval');
|
||||
});
|
||||
|
||||
it('stores value that getRefreshInterval reads back', () => {
|
||||
setRefreshInterval(1800);
|
||||
expect(getRefreshInterval()).toBe(1800);
|
||||
});
|
||||
});
|
||||
|
||||
// --- usePolarisData ---
|
||||
|
||||
describe('usePolarisData', () => {
|
||||
const mockRequest = ApiProxy.request as ReturnType<typeof vi.fn>;
|
||||
|
||||
beforeEach(() => {
|
||||
mockRequest.mockReset();
|
||||
});
|
||||
|
||||
it('returns data on successful fetch', async () => {
|
||||
const auditData = makeAuditData([makeResult()]);
|
||||
mockRequest.mockResolvedValue(auditData);
|
||||
|
||||
const { result } = renderHook(() => usePolarisData(300));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.loading).toBe(false);
|
||||
});
|
||||
|
||||
expect(result.current.data).toEqual(auditData);
|
||||
expect(result.current.error).toBeNull();
|
||||
});
|
||||
|
||||
it('returns RBAC error on 403', async () => {
|
||||
mockRequest.mockRejectedValue({ status: 403 });
|
||||
|
||||
const { result } = renderHook(() => usePolarisData(300));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.loading).toBe(false);
|
||||
});
|
||||
|
||||
expect(result.current.data).toBeNull();
|
||||
expect(result.current.error).toContain('403');
|
||||
expect(result.current.error).toContain('RBAC');
|
||||
});
|
||||
|
||||
it('returns not-installed error on 404', async () => {
|
||||
mockRequest.mockRejectedValue({ status: 404 });
|
||||
|
||||
const { result } = renderHook(() => usePolarisData(300));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.loading).toBe(false);
|
||||
});
|
||||
|
||||
expect(result.current.error).toContain('not reachable');
|
||||
});
|
||||
|
||||
it('returns not-installed error on 503', async () => {
|
||||
mockRequest.mockRejectedValue({ status: 503 });
|
||||
|
||||
const { result } = renderHook(() => usePolarisData(300));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.loading).toBe(false);
|
||||
});
|
||||
|
||||
expect(result.current.error).toContain('not reachable');
|
||||
});
|
||||
|
||||
it('returns generic error for other failures', async () => {
|
||||
mockRequest.mockRejectedValue(new Error('network down'));
|
||||
|
||||
const { result } = renderHook(() => usePolarisData(300));
|
||||
|
||||
await waitFor(() => {
|
||||
expect(result.current.loading).toBe(false);
|
||||
});
|
||||
|
||||
expect(result.current.error).toContain('Failed to fetch');
|
||||
expect(result.current.error).toContain('network down');
|
||||
});
|
||||
|
||||
it('does not update state after unmount', async () => {
|
||||
let resolveFetch: (value: unknown) => void = () => {};
|
||||
mockRequest.mockReturnValue(
|
||||
new Promise(resolve => {
|
||||
resolveFetch = resolve;
|
||||
})
|
||||
);
|
||||
|
||||
const { result, unmount } = renderHook(() => usePolarisData(300));
|
||||
expect(result.current.loading).toBe(true);
|
||||
|
||||
unmount();
|
||||
|
||||
// Resolve after unmount — should not throw or update state
|
||||
await act(async () => {
|
||||
resolveFetch(makeAuditData([]));
|
||||
});
|
||||
});
|
||||
});
|
||||
+33
-3
@@ -61,6 +61,7 @@ export interface ResultCounts {
|
||||
pass: number;
|
||||
warning: number;
|
||||
danger: number;
|
||||
skipped: number;
|
||||
}
|
||||
|
||||
function countResultSet(rs: ResultSet, counts: ResultCounts): void {
|
||||
@@ -69,6 +70,8 @@ function countResultSet(rs: ResultSet, counts: ResultCounts): void {
|
||||
counts.total++;
|
||||
if (msg.Success) {
|
||||
counts.pass++;
|
||||
} else if (msg.Severity === 'ignore') {
|
||||
counts.skipped++;
|
||||
} else if (msg.Severity === 'warning') {
|
||||
counts.warning++;
|
||||
} else if (msg.Severity === 'danger') {
|
||||
@@ -77,9 +80,9 @@ function countResultSet(rs: ResultSet, counts: ResultCounts): void {
|
||||
}
|
||||
}
|
||||
|
||||
export function countResults(data: AuditData): ResultCounts {
|
||||
const counts: ResultCounts = { total: 0, pass: 0, warning: 0, danger: 0 };
|
||||
for (const result of data.Results) {
|
||||
function countResultItems(results: Result[]): ResultCounts {
|
||||
const counts: ResultCounts = { total: 0, pass: 0, warning: 0, danger: 0, skipped: 0 };
|
||||
for (const result of results) {
|
||||
countResultSet(result.Results, counts);
|
||||
if (result.PodResult) {
|
||||
countResultSet(result.PodResult.Results, counts);
|
||||
@@ -91,6 +94,28 @@ export function countResults(data: AuditData): ResultCounts {
|
||||
return counts;
|
||||
}
|
||||
|
||||
export function countResults(data: AuditData): ResultCounts {
|
||||
return countResultItems(data.Results);
|
||||
}
|
||||
|
||||
export function countResultsForItems(results: Result[]): ResultCounts {
|
||||
return countResultItems(results);
|
||||
}
|
||||
|
||||
export function getNamespaces(data: AuditData): string[] {
|
||||
const namespaces = new Set<string>();
|
||||
for (const result of data.Results) {
|
||||
if (result.Namespace) {
|
||||
namespaces.add(result.Namespace);
|
||||
}
|
||||
}
|
||||
return Array.from(namespaces).sort();
|
||||
}
|
||||
|
||||
export function filterResultsByNamespace(data: AuditData, namespace: string): Result[] {
|
||||
return data.Results.filter(r => r.Namespace === namespace);
|
||||
}
|
||||
|
||||
// --- Settings ---
|
||||
|
||||
export const INTERVAL_OPTIONS = [
|
||||
@@ -118,6 +143,11 @@ export function setRefreshInterval(seconds: number): void {
|
||||
localStorage.setItem(STORAGE_KEY, String(seconds));
|
||||
}
|
||||
|
||||
// --- Polaris dashboard proxy URL ---
|
||||
|
||||
export const POLARIS_DASHBOARD_PROXY =
|
||||
'/api/v1/namespaces/polaris/services/polaris-dashboard/proxy/';
|
||||
|
||||
// --- Score computation ---
|
||||
|
||||
export function computeScore(counts: ResultCounts): number {
|
||||
|
||||
@@ -0,0 +1,134 @@
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
import { makeAuditData, makeResult } from '../test-utils';
|
||||
|
||||
// Mock Headlamp lib
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib', () => ({
|
||||
ApiProxy: { request: vi.fn() },
|
||||
}));
|
||||
|
||||
// Mock Headlamp CommonComponents as thin pass-throughs
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => ({
|
||||
Loader: ({ title }: { title: string }) => <div data-testid="loader">{title}</div>,
|
||||
SectionBox: ({ title, children }: { title?: string; children?: React.ReactNode }) => (
|
||||
<div data-testid="section-box" data-title={title}>
|
||||
{children}
|
||||
</div>
|
||||
),
|
||||
SectionHeader: ({ title }: { title: string }) => <div data-testid="section-header">{title}</div>,
|
||||
StatusLabel: ({ status, children }: { status: string; children?: React.ReactNode }) => (
|
||||
<span data-testid="status-label" data-status={status}>
|
||||
{children}
|
||||
</span>
|
||||
),
|
||||
NameValueTable: ({ rows }: { rows: Array<{ name: string; value: React.ReactNode }> }) => (
|
||||
<table data-testid="name-value-table">
|
||||
<tbody>
|
||||
{rows.map(row => (
|
||||
<tr key={row.name}>
|
||||
<td>{row.name}</td>
|
||||
<td>{row.value}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
),
|
||||
PercentageCircle: ({ label }: { label: string }) => (
|
||||
<div data-testid="percentage-circle">{label}</div>
|
||||
),
|
||||
PercentageBar: () => <div data-testid="percentage-bar" />,
|
||||
}));
|
||||
|
||||
// Mock the context hook — we'll override per test via mockReturnValue
|
||||
const mockUsePolarisDataContext = vi.fn();
|
||||
vi.mock('../api/PolarisDataContext', () => ({
|
||||
usePolarisDataContext: () => mockUsePolarisDataContext(),
|
||||
}));
|
||||
|
||||
import DashboardView from './DashboardView';
|
||||
|
||||
describe('DashboardView', () => {
|
||||
it('renders loader when loading', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: true,
|
||||
error: null,
|
||||
});
|
||||
|
||||
render(<DashboardView />);
|
||||
expect(screen.getByTestId('loader')).toHaveTextContent('Loading Polaris audit data');
|
||||
});
|
||||
|
||||
it('renders error message when error is set', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: false,
|
||||
error: 'Access denied (403)',
|
||||
});
|
||||
|
||||
render(<DashboardView />);
|
||||
expect(screen.getByText('Access denied (403)')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders score, check distribution, and cluster info with data', () => {
|
||||
const data = makeAuditData([
|
||||
makeResult({
|
||||
Results: {
|
||||
c1: {
|
||||
ID: 'c1',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
c2: {
|
||||
ID: 'c2',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'danger',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
]);
|
||||
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
render(<DashboardView />);
|
||||
|
||||
// Score circle shows 50%
|
||||
expect(screen.getByTestId('percentage-circle')).toHaveTextContent('50%');
|
||||
|
||||
// Check distribution values
|
||||
expect(screen.getByText('Total Checks')).toBeInTheDocument();
|
||||
|
||||
// Cluster info section (title is in data-title attr of SectionBox)
|
||||
const sectionBoxes = screen.getAllByTestId('section-box');
|
||||
const clusterInfoBox = sectionBoxes.find(
|
||||
el => el.getAttribute('data-title') === 'Cluster Info'
|
||||
);
|
||||
expect(clusterInfoBox).toBeDefined();
|
||||
|
||||
// Cluster info values
|
||||
expect(screen.getByText('Nodes')).toBeInTheDocument();
|
||||
expect(screen.getByText('Pods')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders "No Data" when no data and no error', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
render(<DashboardView />);
|
||||
expect(screen.getByText('No Polaris audit results found.')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
@@ -1,58 +1,57 @@
|
||||
import {
|
||||
Loader,
|
||||
NameValueTable,
|
||||
PercentageBar,
|
||||
PercentageCircle,
|
||||
SectionBox,
|
||||
SectionHeader,
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React from 'react';
|
||||
import {
|
||||
AuditData,
|
||||
computeScore,
|
||||
countResults,
|
||||
getRefreshInterval,
|
||||
ResultCounts,
|
||||
usePolarisData,
|
||||
} from '../api/polaris';
|
||||
import { AuditData, computeScore, countResults, ResultCounts } from '../api/polaris';
|
||||
import { usePolarisDataContext } from '../api/PolarisDataContext';
|
||||
|
||||
function scoreStatus(score: number): 'success' | 'warning' | 'error' {
|
||||
if (score >= 80) return 'success';
|
||||
if (score >= 50) return 'warning';
|
||||
return 'error';
|
||||
}
|
||||
const COLORS = {
|
||||
pass: '#4caf50',
|
||||
warning: '#ff9800',
|
||||
danger: '#f44336',
|
||||
skipped: '#9e9e9e',
|
||||
};
|
||||
|
||||
function OverviewSection(props: { data: AuditData; counts: ResultCounts }) {
|
||||
const score = computeScore(props.counts);
|
||||
const status = scoreStatus(score);
|
||||
const { counts } = props;
|
||||
const score = computeScore(counts);
|
||||
|
||||
const chartData = [
|
||||
{ name: 'Pass', value: counts.pass, fill: COLORS.pass },
|
||||
{ name: 'Warning', value: counts.warning, fill: COLORS.warning },
|
||||
{ name: 'Danger', value: counts.danger, fill: COLORS.danger },
|
||||
{ name: 'Skipped', value: counts.skipped, fill: COLORS.skipped },
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<SectionBox title="Score">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{
|
||||
name: 'Cluster Score',
|
||||
value: <StatusLabel status={status}>{score}%</StatusLabel>,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<SectionBox title="Cluster Score">
|
||||
<PercentageCircle data={chartData} total={counts.total} label={`${score}%`} />
|
||||
</SectionBox>
|
||||
<SectionBox title="Check Summary">
|
||||
<SectionBox title="Check Distribution">
|
||||
<PercentageBar data={chartData} total={counts.total} />
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{ name: 'Total Checks', value: String(props.counts.total) },
|
||||
{ name: 'Total Checks', value: String(counts.total) },
|
||||
{
|
||||
name: 'Pass',
|
||||
value: <StatusLabel status="success">{props.counts.pass}</StatusLabel>,
|
||||
value: <StatusLabel status="success">{counts.pass}</StatusLabel>,
|
||||
},
|
||||
{
|
||||
name: 'Warning',
|
||||
value: <StatusLabel status="warning">{props.counts.warning}</StatusLabel>,
|
||||
value: <StatusLabel status="warning">{counts.warning}</StatusLabel>,
|
||||
},
|
||||
{
|
||||
name: 'Danger',
|
||||
value: <StatusLabel status="error">{props.counts.danger}</StatusLabel>,
|
||||
value: <StatusLabel status="error">{counts.danger}</StatusLabel>,
|
||||
},
|
||||
{ name: 'Skipped', value: String(counts.skipped) },
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
@@ -70,9 +69,8 @@ function OverviewSection(props: { data: AuditData; counts: ResultCounts }) {
|
||||
);
|
||||
}
|
||||
|
||||
export default function PolarisView() {
|
||||
const interval = getRefreshInterval();
|
||||
const { data, loading, error } = usePolarisData(interval);
|
||||
export default function DashboardView() {
|
||||
const { data, loading, error } = usePolarisDataContext();
|
||||
|
||||
if (loading) {
|
||||
return <Loader title="Loading Polaris audit data..." />;
|
||||
@@ -82,7 +80,7 @@ export default function PolarisView() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title="Polaris" />
|
||||
<SectionHeader title="Polaris — Overview" />
|
||||
|
||||
{error && (
|
||||
<SectionBox title="Error">
|
||||
@@ -0,0 +1,200 @@
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
import { makeAuditData, makeResult } from '../test-utils';
|
||||
|
||||
// Mock Headlamp lib
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib', () => ({
|
||||
ApiProxy: { request: vi.fn() },
|
||||
}));
|
||||
|
||||
// Mock react-router-dom useParams
|
||||
const mockNamespace = vi.fn(() => 'test-ns');
|
||||
vi.mock('react-router-dom', () => ({
|
||||
useParams: () => ({ namespace: mockNamespace() }),
|
||||
}));
|
||||
|
||||
// Mock Headlamp CommonComponents
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => ({
|
||||
Loader: ({ title }: { title: string }) => <div data-testid="loader">{title}</div>,
|
||||
SectionBox: ({ title, children }: { title?: string; children?: React.ReactNode }) => (
|
||||
<div data-testid="section-box" data-title={title}>
|
||||
{children}
|
||||
</div>
|
||||
),
|
||||
SectionHeader: ({ title }: { title: string }) => <div data-testid="section-header">{title}</div>,
|
||||
StatusLabel: ({ status, children }: { status: string; children?: React.ReactNode }) => (
|
||||
<span data-testid="status-label" data-status={status}>
|
||||
{children}
|
||||
</span>
|
||||
),
|
||||
NameValueTable: ({ rows }: { rows: Array<{ name: string; value: React.ReactNode }> }) => (
|
||||
<table data-testid="name-value-table">
|
||||
<tbody>
|
||||
{rows.map(row => (
|
||||
<tr key={row.name}>
|
||||
<td>{row.name}</td>
|
||||
<td>{row.value}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
),
|
||||
SimpleTable: ({
|
||||
columns,
|
||||
data,
|
||||
emptyMessage,
|
||||
}: {
|
||||
columns: Array<{ label: string; getter: (row: unknown) => React.ReactNode }>;
|
||||
data: unknown[];
|
||||
emptyMessage?: string;
|
||||
}) =>
|
||||
data.length === 0 ? (
|
||||
<div data-testid="simple-table-empty">{emptyMessage}</div>
|
||||
) : (
|
||||
<table data-testid="simple-table">
|
||||
<thead>
|
||||
<tr>
|
||||
{columns.map(col => (
|
||||
<th key={col.label}>{col.label}</th>
|
||||
))}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{data.map((row, i) => (
|
||||
<tr key={i}>
|
||||
{columns.map(col => (
|
||||
<td key={col.label}>{col.getter(row)}</td>
|
||||
))}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
),
|
||||
}));
|
||||
|
||||
const mockUsePolarisDataContext = vi.fn();
|
||||
vi.mock('../api/PolarisDataContext', () => ({
|
||||
usePolarisDataContext: () => mockUsePolarisDataContext(),
|
||||
}));
|
||||
|
||||
import NamespaceDetailView from './NamespaceDetailView';
|
||||
|
||||
describe('NamespaceDetailView', () => {
|
||||
it('renders loader when loading', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: true,
|
||||
error: null,
|
||||
});
|
||||
|
||||
render(<NamespaceDetailView />);
|
||||
expect(screen.getByTestId('loader')).toHaveTextContent('Loading Polaris data for test-ns');
|
||||
});
|
||||
|
||||
it('renders error message when error is set', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: false,
|
||||
error: 'Access denied (403)',
|
||||
});
|
||||
|
||||
render(<NamespaceDetailView />);
|
||||
expect(screen.getByText('Access denied (403)')).toBeInTheDocument();
|
||||
expect(screen.getByTestId('section-header')).toHaveTextContent('Polaris — test-ns');
|
||||
});
|
||||
|
||||
it('renders "No Data" when no data and no error', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
render(<NamespaceDetailView />);
|
||||
expect(screen.getByText('No Polaris audit results found.')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders namespace score and resource table with data', () => {
|
||||
const data = makeAuditData([
|
||||
makeResult({
|
||||
Name: 'deploy-a',
|
||||
Namespace: 'test-ns',
|
||||
Kind: 'Deployment',
|
||||
Results: {
|
||||
c1: {
|
||||
ID: 'c1',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
c2: {
|
||||
ID: 'c2',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
makeResult({
|
||||
Name: 'other',
|
||||
Namespace: 'other-ns',
|
||||
Kind: 'Deployment',
|
||||
Results: {
|
||||
c3: {
|
||||
ID: 'c3',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
]);
|
||||
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
render(<NamespaceDetailView />);
|
||||
|
||||
// Header
|
||||
expect(screen.getByTestId('section-header')).toHaveTextContent('Polaris — test-ns');
|
||||
|
||||
// Score section: 50% (1 pass / 2 total)
|
||||
expect(screen.getByText('50%')).toBeInTheDocument();
|
||||
expect(screen.getByText('Total Checks')).toBeInTheDocument();
|
||||
|
||||
// Resource table shows only test-ns resources
|
||||
expect(screen.getByText('deploy-a')).toBeInTheDocument();
|
||||
expect(screen.queryByText('other')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders empty table message for namespace with no results', () => {
|
||||
const data = makeAuditData([
|
||||
makeResult({
|
||||
Name: 'deploy-a',
|
||||
Namespace: 'other-ns',
|
||||
Results: {},
|
||||
}),
|
||||
]);
|
||||
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
render(<NamespaceDetailView />);
|
||||
expect(screen.getByTestId('simple-table-empty')).toHaveTextContent(
|
||||
'No resources found in namespace "test-ns"'
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,159 @@
|
||||
import {
|
||||
Loader,
|
||||
NameValueTable,
|
||||
SectionBox,
|
||||
SectionHeader,
|
||||
SimpleTable,
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React from 'react';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import {
|
||||
computeScore,
|
||||
countResultsForItems,
|
||||
filterResultsByNamespace,
|
||||
POLARIS_DASHBOARD_PROXY,
|
||||
Result,
|
||||
ResultCounts,
|
||||
} from '../api/polaris';
|
||||
import { usePolarisDataContext } from '../api/PolarisDataContext';
|
||||
|
||||
function scoreStatus(score: number): 'success' | 'warning' | 'error' {
|
||||
if (score >= 80) return 'success';
|
||||
if (score >= 50) return 'warning';
|
||||
return 'error';
|
||||
}
|
||||
|
||||
function resourceCounts(result: Result): ResultCounts {
|
||||
return countResultsForItems([result]);
|
||||
}
|
||||
|
||||
export default function NamespaceDetailView() {
|
||||
const { namespace } = useParams<{ namespace: string }>();
|
||||
const { data, loading, error } = usePolarisDataContext();
|
||||
|
||||
if (loading) {
|
||||
return <Loader title={`Loading Polaris data for ${namespace}...`} />;
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title={`Polaris — ${namespace}`} />
|
||||
<SectionBox title="Error">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{
|
||||
name: 'Status',
|
||||
value: <StatusLabel status="error">{error}</StatusLabel>,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
if (!data) {
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title={`Polaris — ${namespace}`} />
|
||||
<SectionBox title="No Data">
|
||||
<NameValueTable rows={[{ name: 'Status', value: 'No Polaris audit results found.' }]} />
|
||||
</SectionBox>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
const results = filterResultsByNamespace(data, namespace);
|
||||
const counts = countResultsForItems(results);
|
||||
const score = computeScore(counts);
|
||||
const status = scoreStatus(score);
|
||||
|
||||
const countsPerResource = new Map<string, ResultCounts>();
|
||||
for (const r of results) {
|
||||
countsPerResource.set(`${r.Namespace}/${r.Kind}/${r.Name}`, resourceCounts(r));
|
||||
}
|
||||
|
||||
function getResourceCounts(row: Result): ResultCounts {
|
||||
return countsPerResource.get(`${row.Namespace}/${row.Kind}/${row.Name}`) ?? resourceCounts(row);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title={`Polaris — ${namespace}`} />
|
||||
|
||||
<SectionBox title="External">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{
|
||||
name: 'Polaris Dashboard',
|
||||
value: (
|
||||
<a href={POLARIS_DASHBOARD_PROXY} target="_blank" rel="noopener noreferrer">
|
||||
View in Polaris Dashboard
|
||||
</a>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
|
||||
<SectionBox title="Namespace Score">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{
|
||||
name: 'Score',
|
||||
value: <StatusLabel status={status}>{score}%</StatusLabel>,
|
||||
},
|
||||
{ name: 'Total Checks', value: String(counts.total) },
|
||||
{
|
||||
name: 'Pass',
|
||||
value: <StatusLabel status="success">{counts.pass}</StatusLabel>,
|
||||
},
|
||||
{
|
||||
name: 'Warning',
|
||||
value: <StatusLabel status="warning">{counts.warning}</StatusLabel>,
|
||||
},
|
||||
{
|
||||
name: 'Danger',
|
||||
value: <StatusLabel status="error">{counts.danger}</StatusLabel>,
|
||||
},
|
||||
{
|
||||
name: 'Skipped',
|
||||
value: String(counts.skipped),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
|
||||
<SectionBox title="Resources">
|
||||
<SimpleTable
|
||||
columns={[
|
||||
{ label: 'Name', getter: (row: Result) => row.Name },
|
||||
{ label: 'Kind', getter: (row: Result) => row.Kind },
|
||||
{
|
||||
label: 'Pass',
|
||||
getter: (row: Result) => (
|
||||
<StatusLabel status="success">{getResourceCounts(row).pass}</StatusLabel>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: 'Warning',
|
||||
getter: (row: Result) => (
|
||||
<StatusLabel status="warning">{getResourceCounts(row).warning}</StatusLabel>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: 'Danger',
|
||||
getter: (row: Result) => (
|
||||
<StatusLabel status="error">{getResourceCounts(row).danger}</StatusLabel>
|
||||
),
|
||||
},
|
||||
]}
|
||||
data={results}
|
||||
emptyMessage={`No resources found in namespace "${namespace}".`}
|
||||
/>
|
||||
</SectionBox>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,219 @@
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import React from 'react';
|
||||
import { MemoryRouter } from 'react-router-dom';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
import { makeAuditData, makeResult } from '../test-utils';
|
||||
|
||||
// Mock Headlamp lib
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib', () => ({
|
||||
ApiProxy: { request: vi.fn() },
|
||||
Router: {
|
||||
createRouteURL: (name: string, params: Record<string, string>) =>
|
||||
`/polaris/ns/${params.namespace}`,
|
||||
},
|
||||
}));
|
||||
|
||||
// Mock Headlamp CommonComponents
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => ({
|
||||
Loader: ({ title }: { title: string }) => <div data-testid="loader">{title}</div>,
|
||||
SectionBox: ({ title, children }: { title?: string; children?: React.ReactNode }) => (
|
||||
<div data-testid="section-box" data-title={title}>
|
||||
{children}
|
||||
</div>
|
||||
),
|
||||
SectionHeader: ({ title }: { title: string }) => <div data-testid="section-header">{title}</div>,
|
||||
StatusLabel: ({ status, children }: { status: string; children?: React.ReactNode }) => (
|
||||
<span data-testid="status-label" data-status={status}>
|
||||
{children}
|
||||
</span>
|
||||
),
|
||||
NameValueTable: ({ rows }: { rows: Array<{ name: string; value: React.ReactNode }> }) => (
|
||||
<table data-testid="name-value-table">
|
||||
<tbody>
|
||||
{rows.map(row => (
|
||||
<tr key={row.name}>
|
||||
<td>{row.name}</td>
|
||||
<td>{row.value}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
),
|
||||
SimpleTable: ({
|
||||
columns,
|
||||
data,
|
||||
emptyMessage,
|
||||
}: {
|
||||
columns: Array<{ label: string; getter: (row: unknown) => React.ReactNode }>;
|
||||
data: unknown[];
|
||||
emptyMessage?: string;
|
||||
}) =>
|
||||
data.length === 0 ? (
|
||||
<div data-testid="simple-table-empty">{emptyMessage}</div>
|
||||
) : (
|
||||
<table data-testid="simple-table">
|
||||
<thead>
|
||||
<tr>
|
||||
{columns.map(col => (
|
||||
<th key={col.label}>{col.label}</th>
|
||||
))}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{data.map((row, i) => (
|
||||
<tr key={i}>
|
||||
{columns.map(col => (
|
||||
<td key={col.label}>{col.getter(row)}</td>
|
||||
))}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
),
|
||||
}));
|
||||
|
||||
const mockUsePolarisDataContext = vi.fn();
|
||||
vi.mock('../api/PolarisDataContext', () => ({
|
||||
usePolarisDataContext: () => mockUsePolarisDataContext(),
|
||||
}));
|
||||
|
||||
import NamespacesListView from './NamespacesListView';
|
||||
|
||||
function renderWithRouter(ui: React.ReactElement) {
|
||||
return render(<MemoryRouter>{ui}</MemoryRouter>);
|
||||
}
|
||||
|
||||
describe('NamespacesListView', () => {
|
||||
it('renders loader when loading', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: true,
|
||||
error: null,
|
||||
});
|
||||
|
||||
renderWithRouter(<NamespacesListView />);
|
||||
expect(screen.getByTestId('loader')).toHaveTextContent('Loading Polaris audit data');
|
||||
});
|
||||
|
||||
it('renders error message when error is set', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: false,
|
||||
error: 'Polaris dashboard not reachable',
|
||||
});
|
||||
|
||||
renderWithRouter(<NamespacesListView />);
|
||||
expect(screen.getByText('Polaris dashboard not reachable')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders "No Data" when no data and no error', () => {
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data: null,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
renderWithRouter(<NamespacesListView />);
|
||||
expect(screen.getByText('No Polaris audit results found.')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders namespace rows with correct scores and links', () => {
|
||||
const data = makeAuditData([
|
||||
makeResult({
|
||||
Name: 'deploy-a',
|
||||
Namespace: 'alpha',
|
||||
Results: {
|
||||
c1: {
|
||||
ID: 'c1',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
makeResult({
|
||||
Name: 'deploy-b',
|
||||
Namespace: 'beta',
|
||||
Results: {
|
||||
c2: {
|
||||
ID: 'c2',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'danger',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
]);
|
||||
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
renderWithRouter(<NamespacesListView />);
|
||||
|
||||
// Namespace links
|
||||
const alphaLink = screen.getByText('alpha');
|
||||
expect(alphaLink.closest('a')).toHaveAttribute('href', '/polaris/ns/alpha');
|
||||
|
||||
const betaLink = screen.getByText('beta');
|
||||
expect(betaLink.closest('a')).toHaveAttribute('href', '/polaris/ns/beta');
|
||||
});
|
||||
|
||||
it('uses correct scoreStatus: >=80 success, >=50 warning, <50 error', () => {
|
||||
// Create a namespace with 100% score (1 pass) and one with 0% (1 danger)
|
||||
const data = makeAuditData([
|
||||
makeResult({
|
||||
Name: 'perfect',
|
||||
Namespace: 'good-ns',
|
||||
Results: {
|
||||
c1: {
|
||||
ID: 'c1',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: true,
|
||||
Severity: 'warning',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
makeResult({
|
||||
Name: 'bad',
|
||||
Namespace: 'bad-ns',
|
||||
Results: {
|
||||
c2: {
|
||||
ID: 'c2',
|
||||
Message: '',
|
||||
Details: [],
|
||||
Success: false,
|
||||
Severity: 'danger',
|
||||
Category: 'X',
|
||||
},
|
||||
},
|
||||
}),
|
||||
]);
|
||||
|
||||
mockUsePolarisDataContext.mockReturnValue({
|
||||
data,
|
||||
loading: false,
|
||||
error: null,
|
||||
});
|
||||
|
||||
renderWithRouter(<NamespacesListView />);
|
||||
|
||||
// Find score StatusLabels - good-ns has 100% (success), bad-ns has 0% (error)
|
||||
const statusLabels = screen.getAllByTestId('status-label');
|
||||
const scoreLabels = statusLabels.filter(el => el.textContent?.includes('%'));
|
||||
|
||||
const successScore = scoreLabels.find(el => el.textContent === '100%');
|
||||
expect(successScore).toHaveAttribute('data-status', 'success');
|
||||
|
||||
const errorScore = scoreLabels.find(el => el.textContent === '0%');
|
||||
expect(errorScore).toHaveAttribute('data-status', 'error');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,135 @@
|
||||
import { Router } from '@kinvolk/headlamp-plugin/lib';
|
||||
import {
|
||||
Loader,
|
||||
NameValueTable,
|
||||
SectionBox,
|
||||
SectionHeader,
|
||||
SimpleTable,
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
import {
|
||||
computeScore,
|
||||
countResultsForItems,
|
||||
filterResultsByNamespace,
|
||||
getNamespaces,
|
||||
} from '../api/polaris';
|
||||
import { usePolarisDataContext } from '../api/PolarisDataContext';
|
||||
|
||||
function scoreStatus(score: number): 'success' | 'warning' | 'error' {
|
||||
if (score >= 80) return 'success';
|
||||
if (score >= 50) return 'warning';
|
||||
return 'error';
|
||||
}
|
||||
|
||||
interface NamespaceRow {
|
||||
namespace: string;
|
||||
score: number;
|
||||
pass: number;
|
||||
warning: number;
|
||||
danger: number;
|
||||
skipped: number;
|
||||
}
|
||||
|
||||
export default function NamespacesListView() {
|
||||
const { data, loading, error } = usePolarisDataContext();
|
||||
|
||||
if (loading) {
|
||||
return <Loader title="Loading Polaris audit data..." />;
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title="Polaris — Namespaces" />
|
||||
<SectionBox title="Error">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{
|
||||
name: 'Status',
|
||||
value: <StatusLabel status="error">{error}</StatusLabel>,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
if (!data) {
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title="Polaris — Namespaces" />
|
||||
<SectionBox title="No Data">
|
||||
<NameValueTable rows={[{ name: 'Status', value: 'No Polaris audit results found.' }]} />
|
||||
</SectionBox>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
const namespaces = getNamespaces(data);
|
||||
const rows: NamespaceRow[] = namespaces.map(ns => {
|
||||
const results = filterResultsByNamespace(data, ns);
|
||||
const counts = countResultsForItems(results);
|
||||
const score = computeScore(counts);
|
||||
return {
|
||||
namespace: ns,
|
||||
score,
|
||||
pass: counts.pass,
|
||||
warning: counts.warning,
|
||||
danger: counts.danger,
|
||||
skipped: counts.skipped,
|
||||
};
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title="Polaris — Namespaces" />
|
||||
<SectionBox>
|
||||
<SimpleTable
|
||||
columns={[
|
||||
{
|
||||
label: 'Namespace',
|
||||
getter: (row: NamespaceRow) => (
|
||||
<Link
|
||||
to={Router.createRouteURL('polaris-namespace', {
|
||||
namespace: row.namespace,
|
||||
})}
|
||||
>
|
||||
{row.namespace}
|
||||
</Link>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: 'Score',
|
||||
getter: (row: NamespaceRow) => (
|
||||
<StatusLabel status={scoreStatus(row.score)}>{row.score}%</StatusLabel>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: 'Pass',
|
||||
getter: (row: NamespaceRow) => <StatusLabel status="success">{row.pass}</StatusLabel>,
|
||||
},
|
||||
{
|
||||
label: 'Warning',
|
||||
getter: (row: NamespaceRow) => (
|
||||
<StatusLabel status="warning">{row.warning}</StatusLabel>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: 'Danger',
|
||||
getter: (row: NamespaceRow) => <StatusLabel status="error">{row.danger}</StatusLabel>,
|
||||
},
|
||||
{
|
||||
label: 'Skipped',
|
||||
getter: (row: NamespaceRow) => String(row.skipped),
|
||||
},
|
||||
]}
|
||||
data={rows}
|
||||
emptyMessage="No namespaces found in Polaris audit data."
|
||||
/>
|
||||
</SectionBox>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import React from 'react';
|
||||
import { describe, expect, it, vi } from 'vitest';
|
||||
|
||||
// Mock Headlamp lib
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib', () => ({
|
||||
ApiProxy: { request: vi.fn() },
|
||||
}));
|
||||
|
||||
// Mock Headlamp CommonComponents
|
||||
vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => ({
|
||||
SectionBox: ({ title, children }: { title?: string; children?: React.ReactNode }) => (
|
||||
<div data-testid="section-box" data-title={title}>
|
||||
{children}
|
||||
</div>
|
||||
),
|
||||
NameValueTable: ({ rows }: { rows: Array<{ name: string; value: React.ReactNode }> }) => (
|
||||
<div data-testid="name-value-table">
|
||||
{rows.map(row => (
|
||||
<div key={row.name}>
|
||||
<span>{row.name}</span>
|
||||
<span>{row.value}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
),
|
||||
}));
|
||||
|
||||
import PolarisSettings from './PolarisSettings';
|
||||
|
||||
describe('PolarisSettings', () => {
|
||||
it('renders with interval from props.data', () => {
|
||||
render(<PolarisSettings data={{ refreshInterval: 60 }} />);
|
||||
|
||||
const select = screen.getByRole('combobox');
|
||||
expect(select).toHaveValue('60');
|
||||
});
|
||||
|
||||
it('falls back to getRefreshInterval when no prop data', () => {
|
||||
// Default is 300 (5 minutes)
|
||||
render(<PolarisSettings />);
|
||||
|
||||
const select = screen.getByRole('combobox');
|
||||
expect(select).toHaveValue('300');
|
||||
});
|
||||
|
||||
it('renders all interval options', () => {
|
||||
render(<PolarisSettings />);
|
||||
|
||||
const options = screen.getAllByRole('option');
|
||||
expect(options).toHaveLength(4);
|
||||
expect(options[0]).toHaveTextContent('1 minute');
|
||||
expect(options[1]).toHaveTextContent('5 minutes');
|
||||
expect(options[2]).toHaveTextContent('10 minutes');
|
||||
expect(options[3]).toHaveTextContent('30 minutes');
|
||||
});
|
||||
|
||||
it('calls setRefreshInterval and onDataChange when selection changes', async () => {
|
||||
const onDataChange = vi.fn();
|
||||
render(<PolarisSettings data={{ refreshInterval: 300 }} onDataChange={onDataChange} />);
|
||||
|
||||
const select = screen.getByRole('combobox');
|
||||
await userEvent.selectOptions(select, '1800');
|
||||
|
||||
// Check localStorage was updated
|
||||
expect(localStorage.getItem('polaris-plugin-refresh-interval')).toBe('1800');
|
||||
|
||||
// Check callback was called with merged data
|
||||
expect(onDataChange).toHaveBeenCalledWith({ refreshInterval: 1800 });
|
||||
});
|
||||
|
||||
it('works without onDataChange callback', async () => {
|
||||
render(<PolarisSettings data={{ refreshInterval: 300 }} />);
|
||||
|
||||
const select = screen.getByRole('combobox');
|
||||
// Should not throw even without onDataChange
|
||||
await userEvent.selectOptions(select, '60');
|
||||
|
||||
expect(localStorage.getItem('polaris-plugin-refresh-interval')).toBe('60');
|
||||
});
|
||||
});
|
||||
+59
-8
@@ -4,8 +4,13 @@ import {
|
||||
registerSidebarEntry,
|
||||
} from '@kinvolk/headlamp-plugin/lib';
|
||||
import React from 'react';
|
||||
import { PolarisDataProvider } from './api/PolarisDataContext';
|
||||
import DashboardView from './components/DashboardView';
|
||||
import NamespaceDetailView from './components/NamespaceDetailView';
|
||||
import NamespacesListView from './components/NamespacesListView';
|
||||
import PolarisSettings from './components/PolarisSettings';
|
||||
import PolarisView from './components/PolarisView';
|
||||
|
||||
// --- Sidebar entries ---
|
||||
|
||||
registerSidebarEntry({
|
||||
parent: null,
|
||||
@@ -15,12 +20,58 @@ registerSidebarEntry({
|
||||
icon: 'mdi:shield-check',
|
||||
});
|
||||
|
||||
registerRoute({
|
||||
path: '/polaris',
|
||||
sidebar: 'polaris',
|
||||
name: 'polaris',
|
||||
exact: true,
|
||||
component: () => <PolarisView />,
|
||||
registerSidebarEntry({
|
||||
parent: 'polaris',
|
||||
name: 'polaris-overview',
|
||||
label: 'Overview',
|
||||
url: '/polaris',
|
||||
icon: 'mdi:view-dashboard',
|
||||
});
|
||||
|
||||
registerPluginSettings('polaris-headlamp-plugin', PolarisSettings, true);
|
||||
registerSidebarEntry({
|
||||
parent: 'polaris',
|
||||
name: 'polaris-namespaces',
|
||||
label: 'Namespaces',
|
||||
url: '/polaris/namespaces',
|
||||
icon: 'mdi:dns',
|
||||
});
|
||||
|
||||
// --- Routes ---
|
||||
|
||||
registerRoute({
|
||||
path: '/polaris',
|
||||
sidebar: 'polaris-overview',
|
||||
name: 'polaris',
|
||||
exact: true,
|
||||
component: () => (
|
||||
<PolarisDataProvider>
|
||||
<DashboardView />
|
||||
</PolarisDataProvider>
|
||||
),
|
||||
});
|
||||
|
||||
registerRoute({
|
||||
path: '/polaris/namespaces',
|
||||
sidebar: 'polaris-namespaces',
|
||||
name: 'polaris-namespaces',
|
||||
exact: true,
|
||||
component: () => (
|
||||
<PolarisDataProvider>
|
||||
<NamespacesListView />
|
||||
</PolarisDataProvider>
|
||||
),
|
||||
});
|
||||
|
||||
registerRoute({
|
||||
path: '/polaris/ns/:namespace',
|
||||
sidebar: 'polaris-namespaces',
|
||||
name: 'polaris-namespace',
|
||||
exact: true,
|
||||
component: () => (
|
||||
<PolarisDataProvider>
|
||||
<NamespaceDetailView />
|
||||
</PolarisDataProvider>
|
||||
),
|
||||
});
|
||||
|
||||
registerPluginSettings('headlamp-polaris-plugin', PolarisSettings, true);
|
||||
|
||||
@@ -0,0 +1,61 @@
|
||||
import React from 'react';
|
||||
import { AuditData, Result } from './api/polaris';
|
||||
|
||||
// --- Fixtures ---
|
||||
|
||||
export function makeResult(overrides: Partial<Result> = {}): Result {
|
||||
return {
|
||||
Name: 'my-deploy',
|
||||
Namespace: 'default',
|
||||
Kind: 'Deployment',
|
||||
Results: {},
|
||||
CreatedTime: '2025-01-01T00:00:00Z',
|
||||
...overrides,
|
||||
};
|
||||
}
|
||||
|
||||
export function makeAuditData(results: Result[]): AuditData {
|
||||
return {
|
||||
PolarisOutputVersion: '1.0',
|
||||
AuditTime: '2025-01-01T00:00:00Z',
|
||||
SourceType: 'Cluster',
|
||||
SourceName: 'test',
|
||||
DisplayName: 'test',
|
||||
ClusterInfo: { Version: '1.28', Nodes: 3, Pods: 10, Namespaces: 2, Controllers: 5 },
|
||||
Results: results,
|
||||
};
|
||||
}
|
||||
|
||||
// --- Mock Polaris Context Provider ---
|
||||
|
||||
interface MockPolarisProviderProps {
|
||||
data?: AuditData | null;
|
||||
loading?: boolean;
|
||||
error?: string | null;
|
||||
children: React.ReactNode;
|
||||
}
|
||||
|
||||
// We dynamically import PolarisDataContext to inject mock values.
|
||||
// This avoids mocking the hook module — we supply real context with controlled values.
|
||||
const PolarisDataContext = React.createContext<{
|
||||
data: AuditData | null;
|
||||
loading: boolean;
|
||||
error: string | null;
|
||||
} | null>(null);
|
||||
|
||||
export function MockPolarisProvider({
|
||||
data = null,
|
||||
loading = false,
|
||||
error = null,
|
||||
children,
|
||||
}: MockPolarisProviderProps) {
|
||||
return (
|
||||
<PolarisDataContext.Provider value={{ data, loading, error }}>
|
||||
{children}
|
||||
</PolarisDataContext.Provider>
|
||||
);
|
||||
}
|
||||
|
||||
// The context reference used in test-utils must be the SAME object the components import.
|
||||
// We achieve this by having component tests mock `usePolarisDataContext` to read from our context.
|
||||
export { PolarisDataContext };
|
||||
@@ -1,4 +1,7 @@
|
||||
{
|
||||
"extends": "@kinvolk/headlamp-plugin/config/plugins-tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"types": ["vite/client", "vite-plugin-svgr/client", "vitest/globals", "lodash", "@testing-library/jest-dom"]
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
import { defineConfig } from 'vitest/config';
|
||||
|
||||
export default defineConfig({
|
||||
test: {
|
||||
globals: true,
|
||||
environment: 'jsdom',
|
||||
setupFiles: ['./vitest.setup.ts'],
|
||||
exclude: ['e2e/**', 'node_modules/**'],
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,43 @@
|
||||
import '@testing-library/jest-dom';
|
||||
|
||||
// Node 22+ ships a minimal built-in `localStorage` global (property-bag only,
|
||||
// no getItem/setItem/removeItem/clear) that shadows jsdom's Web Storage
|
||||
// implementation. Provide a spec-compliant shim so code under test works.
|
||||
if (typeof localStorage !== 'undefined' && typeof localStorage.getItem !== 'function') {
|
||||
const store = new Map<string, string>();
|
||||
|
||||
const storage = {
|
||||
getItem(key: string): string | null {
|
||||
return store.get(key) ?? null;
|
||||
},
|
||||
setItem(key: string, value: string): void {
|
||||
store.set(key, String(value));
|
||||
},
|
||||
removeItem(key: string): void {
|
||||
store.delete(key);
|
||||
},
|
||||
clear(): void {
|
||||
store.clear();
|
||||
},
|
||||
get length(): number {
|
||||
return store.size;
|
||||
},
|
||||
key(index: number): string | null {
|
||||
return [...store.keys()][index] ?? null;
|
||||
},
|
||||
};
|
||||
|
||||
Object.defineProperty(globalThis, 'localStorage', {
|
||||
value: storage,
|
||||
writable: true,
|
||||
configurable: true,
|
||||
});
|
||||
|
||||
if (typeof window !== 'undefined') {
|
||||
Object.defineProperty(window, 'localStorage', {
|
||||
value: storage,
|
||||
writable: true,
|
||||
configurable: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user