feat(ui): harden Registry accessibility and acceptance

- Add reduced-motion and focus behavior to shared primitives
- Add deterministic Registry browser acceptance and CI routing
- Document default-off rollout and live-backend prerequisites
- Fix Next.js server-action build compatibility

Author: Alan-TheGentleman

.github/test-impact.yml

@@ -451,6 +451,17 @@ modules:
     e2e:
       - ui/tests/home/**
 
+  - name: ui-registry
+    match:
+      - ui/actions/registry/**
+      - ui/app/**/registry/**
+      - ui/components/registry/**
+      - ui/lib/registry/**
+      - ui/tests/registry/**
+    tests: []
+    e2e:
+      - ui/tests/registry/**
+
   - name: ui-shadcn
     match:
       - ui/components/shadcn/**

.github/workflows/ui-e2e-tests-v2.yml

@@ -10,12 +10,12 @@ on:
       - master
       - "v5.*"
     paths:
-      - '.github/workflows/ui-e2e-tests-v2.yml'
-      - '.github/test-impact.yml'
-      - 'ui/**'
-      - 'api/**'  # API changes can affect UI E2E
-      - '!ui/CHANGELOG.md'
-      - '!api/CHANGELOG.md'
+      - ".github/workflows/ui-e2e-tests-v2.yml"
+      - ".github/test-impact.yml"
+      - "ui/**"
+      - "api/**" # API changes can affect UI E2E
+      - "!ui/CHANGELOG.md"
+      - "!api/CHANGELOG.md"
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
@@ -40,11 +40,11 @@ jobs:
       (needs.impact-analysis.outputs.has-ui-e2e == 'true' || needs.impact-analysis.outputs.run-all == 'true')
     runs-on: ubuntu-latest
     env:
-      AUTH_SECRET: 'fallback-ci-secret-for-testing'
+      AUTH_SECRET: "fallback-ci-secret-for-testing"
       AUTH_TRUST_HOST: true
-      NEXTAUTH_URL: 'http://localhost:3000'
-      AUTH_URL: 'http://localhost:3000'
-      UI_API_BASE_URL: 'http://localhost:8080/api/v1'
+      NEXTAUTH_URL: "http://localhost:3000"
+      AUTH_URL: "http://localhost:3000"
+      UI_API_BASE_URL: "http://localhost:8080/api/v1"
       E2E_ADMIN_USER: ${{ secrets.E2E_ADMIN_USER }}
       E2E_ADMIN_PASSWORD: ${{ secrets.E2E_ADMIN_PASSWORD }}
       E2E_AWS_PROVIDER_ACCOUNT_ID: ${{ secrets.E2E_AWS_PROVIDER_ACCOUNT_ID }}
@@ -60,7 +60,7 @@ jobs:
       E2E_M365_SECRET_ID: ${{ secrets.E2E_M365_SECRET_ID }}
       E2E_M365_TENANT_ID: ${{ secrets.E2E_M365_TENANT_ID }}
       E2E_M365_CERTIFICATE_CONTENT: ${{ secrets.E2E_M365_CERTIFICATE_CONTENT }}
-      E2E_KUBERNETES_CONTEXT: 'kind-kind'
+      E2E_KUBERNETES_CONTEXT: "kind-kind"
       E2E_KUBERNETES_KUBECONFIG_PATH: /home/runner/.kube/config
       E2E_GCP_BASE64_SERVICE_ACCOUNT_KEY: ${{ secrets.E2E_GCP_BASE64_SERVICE_ACCOUNT_KEY }}
       E2E_GCP_PROJECT_ID: ${{ secrets.E2E_GCP_PROJECT_ID }}
@@ -292,7 +292,7 @@ jobs:
       - name: Setup Node.js
         uses: actions/setup-node@53b83947a5a98c8d113130e565377fae1a50d02f # v6.3.0
         with:
-          node-version-file: 'ui/.nvmrc'
+          node-version-file: "ui/.nvmrc"
 
       - name: Setup pnpm
         uses: pnpm/action-setup@fc06bc1257f339d1d5d8b3a19a8cae5388b55320 # v5.0.0
@@ -340,55 +340,56 @@ jobs:
       - name: Run E2E tests
         working-directory: ./ui
         run: |
+          REGISTRY_FIXTURE_SELECTED=false
+          if [[ "${RUN_ALL_TESTS}" == "true" ]] ||
+            [[ " ${E2E_TEST_PATHS} " == *" ui/tests/registry/"* ]]; then
+            REGISTRY_FIXTURE_SELECTED=true
+          fi
+
           if [[ "${RUN_ALL_TESTS}" == "true" ]]; then
-            echo "Running ALL E2E tests..."
+            echo "Running all standard E2E tests..."
             pnpm run test:e2e
           else
-            echo "Running targeted E2E tests: ${E2E_TEST_PATHS}"
-            # Convert glob patterns to playwright test paths
-            # e.g., "ui/tests/providers/**" -> "tests/providers"
+            echo "Running targeted standard E2E tests: ${E2E_TEST_PATHS}"
             TEST_PATHS="${E2E_TEST_PATHS}"
-            # Remove ui/ prefix and convert ** to empty (playwright handles recursion)
             TEST_PATHS=$(echo "$TEST_PATHS" | sed 's|ui/||g' | sed 's|\*\*||g' | tr ' ' '\n' | sort -u)
-            # Drop auth setup helpers (not runnable test suites)
-            TEST_PATHS=$(echo "$TEST_PATHS" | grep -v '^tests/setups/')
-            # Safety net: if bare "tests/" appears (from broad patterns like ui/tests/**),
-            # expand to specific subdirs to avoid Playwright discovering setup files
+            TEST_PATHS=$(echo "$TEST_PATHS" | grep -vE '^tests/(setups|registry)/' || true)
+
             if echo "$TEST_PATHS" | grep -qx 'tests/'; then
-              echo "Expanding bare 'tests/' to specific subdirs (excluding setups)..."
               SPECIFIC_DIRS=""
               for dir in tests/*/; do
-                [[ "$dir" == "tests/setups/" ]] && continue
+                [[ "$dir" == "tests/setups/" || "$dir" == "tests/registry/" ]] && continue
                 SPECIFIC_DIRS="${SPECIFIC_DIRS}${dir}"$'\n'
               done
-              # Replace "tests/" with specific dirs, keep other paths
-              TEST_PATHS=$(echo "$TEST_PATHS" | grep -vx 'tests/')
+              TEST_PATHS=$(echo "$TEST_PATHS" | grep -vx 'tests/' || true)
               TEST_PATHS="${TEST_PATHS}"$'\n'"${SPECIFIC_DIRS}"
               TEST_PATHS=$(echo "$TEST_PATHS" | grep -v '^$' | sort -u)
             fi
-            if [[ -z "$TEST_PATHS" ]]; then
-              echo "No runnable E2E test paths after filtering setups"
-              exit 0
-            fi
-            # Filter out directories that don't contain any test files
+
             VALID_PATHS=""
-            while IFS= read -r p; do
-              [[ -z "$p" ]] && continue
-              if find "$p" -name '*.spec.ts' -o -name '*.test.ts' 2>/dev/null | head -1 | grep -q .; then
-                VALID_PATHS="${VALID_PATHS}${p}"$'\n'
+            while IFS= read -r path; do
+              [[ -z "$path" ]] && continue
+              if find "$path" -name '*.spec.ts' -o -name '*.test.ts' 2>/dev/null | head -1 | grep -q .; then
+                VALID_PATHS="${VALID_PATHS}${path}"$'\n'
               else
-                echo "Skipping empty test directory: $p"
+                echo "Skipping empty test directory: $path"
               fi
             done <<< "$TEST_PATHS"
             VALID_PATHS=$(echo "$VALID_PATHS" | grep -v '^$' || true)
-            if [[ -z "$VALID_PATHS" ]]; then
-              echo "No test files found in any resolved paths — skipping E2E"
-              exit 0
+
+            if [[ -n "$VALID_PATHS" ]]; then
+              TEST_PATHS=$(echo "$VALID_PATHS" | tr '\n' ' ')
+              echo "Resolved standard test paths: $TEST_PATHS"
+              read -ra test_paths <<< "$TEST_PATHS"
+              pnpm exec playwright test "${test_paths[@]}"
+            else
+              echo "No standard E2E test paths selected."
             fi
-            TEST_PATHS=$(echo "$VALID_PATHS" | tr '\n' ' ')
-            echo "Resolved test paths: $TEST_PATHS"
-            read -ra test_paths <<< "$TEST_PATHS"
-            pnpm exec playwright test "${test_paths[@]}"
+          fi
+
+          if [[ "$REGISTRY_FIXTURE_SELECTED" == "true" ]]; then
+            echo "Running self-contained Registry fixture acceptance."
+            pnpm run test:e2e:registry
           fi
 
       - name: Upload test reports

docs/developer-guide/environment-variables.mdx

@@ -40,6 +40,14 @@ The former build-time variables map to the new runtime variables as follows:
 
 `UI_CLOUD_ENABLED` is a plain runtime boolean flag that enables Prowler Cloud behavior when set to the exact string `"true"` and defaults to off; unlike the other renamed variables it has no legacy fallback, so `NEXT_PUBLIC_IS_CLOUD_ENV` is no longer read.
 
+## Registry UI Rollout and Rollback
+
+`UI_REGISTRY_ENABLED` is an optional Prowler Cloud runtime flag. Registry is eligible only when both `UI_CLOUD_ENABLED` and `UI_REGISTRY_ENABLED` are the exact string `"true"` and the current user has the backend-authorized `MANAGE_REGISTRY` permission. Unset, `"false"`, malformed, or stale values fail closed. The flag defaults to off and is not a replacement for backend authorization.
+
+Roll out Registry only after the Registry backend dependency is deployed, intended Cloud roles have `MANAGE_REGISTRY`, and controlled acceptance has exercised credential onboarding, complete catalog loading, and Add/Remove behavior. Deploy the UI with `UI_REGISTRY_ENABLED` unset or `"false"`; set it to `"true"` only in the prepared Cloud process environment, then restart or otherwise apply the environment update required by the platform.
+
+To roll back, set `UI_REGISTRY_ENABLED=false` or remove it and apply the environment update. Proxy, page, and action checks deny on their next request. A visible client rechecks within 15 seconds, while a hidden client lease expires within 30 seconds and rechecks before showing Registry on return. Rollback does not delete Registry credentials or tenant artifact records.
+
 The build-time-only Sentry variables used for source-map upload — `SENTRY_ORG`, `SENTRY_PROJECT`, `SENTRY_AUTH_TOKEN`, and `SENTRY_RELEASE` — keep their names, as they are not part of Prowler Local Server's runtime configuration.
 
 ## Enabling Third-Party Integrations

ui/Dockerfile

@@ -83,6 +83,8 @@ ENV HOSTNAME="0.0.0.0"
 #   - required: UI_API_BASE_URL, AUTH_URL, AUTH_SECRET (missing ⇒ fail fast at boot)
 #   - optional: UI_API_DOCS_URL
 #   - optional: UI_CLOUD_ENABLED ("true" only in Prowler Cloud deployments)
+#   - optional: UI_REGISTRY_ENABLED ("true" only after the Registry dependency,
+#     Cloud role grant, and controlled acceptance are ready; unset/false hides Registry)
 #   - gated integrations (load only when *_ENABLED="true"; the value is then
 #     required or boot fails). Their legacy names (NEXT_PUBLIC_SENTRY_*,
 #     NEXT_PUBLIC_GOOGLE_TAG_MANAGER_ID, POSTHOG_KEY/HOST) still work:

ui/actions/registry/registry.test.ts

@@ -1,18 +1,12 @@
 import { beforeEach, describe, expect, it, vi } from "vitest";
 
-const {
-  authMock,
-  evaluateAccessMock,
-  fetchMock,
-  pollTaskUntilSettledMock,
-  refreshEligibilityMock,
-} = vi.hoisted(() => ({
-  authMock: vi.fn(),
-  evaluateAccessMock: vi.fn(),
-  fetchMock: vi.fn(),
-  pollTaskUntilSettledMock: vi.fn(),
-  refreshEligibilityMock: vi.fn(),
-}));
+const { authMock, evaluateAccessMock, fetchMock, pollTaskUntilSettledMock } =
+  vi.hoisted(() => ({
+    authMock: vi.fn(),
+    evaluateAccessMock: vi.fn(),
+    fetchMock: vi.fn(),
+    pollTaskUntilSettledMock: vi.fn(),
+  }));
 
 vi.mock("@/auth.config", () => ({ auth: authMock }));
 vi.mock("@/lib", () => ({ apiBaseUrl: "https://api.test/api/v1" }));
@@ -21,7 +15,6 @@ vi.mock("@/actions/task/poll", () => ({
 }));
 vi.mock("@/lib/registry/access.server", () => ({
   evaluateRegistryAccess: evaluateAccessMock,
-  refreshRegistryEligibility: refreshEligibilityMock,
 }));
 
 import {
@@ -103,10 +96,6 @@ beforeEach(() => {
     status: "eligible",
     leaseDurationMs: 30_000,
   });
-  refreshEligibilityMock.mockResolvedValue({
-    status: "eligible",
-    leaseDurationMs: 30_000,
-  });
   fetchMock.mockReset();
   pollTaskUntilSettledMock.mockReset();
 });
@@ -164,13 +153,14 @@ describe("Registry guarded reads", () => {
   it("returns only the current eligibility result without Registry I/O", async () => {
     // Given
     const access = { status: "unknown" } as const;
-    refreshEligibilityMock.mockResolvedValue(access);
+    evaluateAccessMock.mockResolvedValue(access);
 
     // When
     const result = await refreshRegistryEligibility();
 
     // Then
     expect(result).toEqual(access);
+    expect(evaluateAccessMock).toHaveBeenCalledWith("access-token");
     expect(fetchMock).not.toHaveBeenCalled();
   });
 

ui/actions/registry/registry.ts

@@ -253,7 +253,9 @@ function bootstrapFailure(
   });
 }
 
-export { refreshRegistryEligibility } from "@/lib/registry/access.server";
+export async function refreshRegistryEligibility() {
+  return evaluateRegistryAccess((await auth())?.accessToken);
+}
 
 export async function getRegistryBootstrap(): Promise<RegistryBootstrapResult> {
   const access = await getRegistryAccess();

ui/components/registry/registry-access-boundary.integration.test.tsx

@@ -2,7 +2,7 @@ import { describe, expect, it, vi } from "vitest";
 
 import { render } from "@/__tests__/render-browser";
 
-vi.mock("@/lib/registry/access.server", () => ({
+vi.mock("@/actions/registry/registry", () => ({
   refreshRegistryEligibility: () => Promise.resolve({ status: "ineligible" }),
 }));
 

ui/components/registry/registry-access-dialog.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useRef } from "react";
+import { type FormEvent, type RefObject, useRef } from "react";
 
 import { Button } from "@/components/shadcn/button/button";
 import { Input } from "@/components/shadcn/input/input";
@@ -11,6 +11,7 @@ interface RegistryAccessDialogCommonProps {
   onSubmit: (key: string) => Promise<void>;
   open: boolean;
   pending: boolean;
+  returnFocusRef: RefObject<HTMLButtonElement | null>;
 }
 
 type ConnectRegistryAccessDialogProps = RegistryAccessDialogCommonProps & {
@@ -34,13 +35,15 @@ export function RegistryAccessDialog({
   onSubmit,
   open,
   pending,
+  returnFocusRef,
 }: RegistryAccessDialogProps) {
   const formRef = useRef<HTMLFormElement>(null);
   const keyInputRef = useRef<HTMLInputElement>(null);
   const actionLabel = mode === "connect" ? "Connect" : "Replace Registry key";
 
-  async function handleSubmit(formData: FormData) {
-    const key = formData.get("registry-key");
+  async function handleSubmit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    const key = new FormData(event.currentTarget).get("registry-key");
     if (typeof key !== "string" || key.trim().length === 0) return;
 
     formRef.current?.reset();
@@ -54,12 +57,16 @@ export function RegistryAccessDialog({
         event.preventDefault();
         keyInputRef.current?.focus();
       }}
+      onCloseAutoFocus={(event) => {
+        event.preventDefault();
+        returnFocusRef.current?.focus();
+      }}
       onOpenChange={onOpenChange}
       open={open}
       size="sm"
       title={mode === "connect" ? "Connect Registry" : "Manage Registry access"}
     >
-      <form action={handleSubmit} ref={formRef} className="space-y-4">
+      <form className="space-y-4" onSubmit={handleSubmit} ref={formRef}>
         <label className="space-y-2 text-sm" htmlFor="registry-key">
           <span>Registry key</span>
           <Input
@@ -72,6 +79,11 @@ export function RegistryAccessDialog({
             type="password"
           />
         </label>
+        {pending && (
+          <p aria-live="polite" role="status">
+            Validating Registry key
+          </p>
+        )}
         <div className="flex flex-wrap justify-end gap-2">
           {mode === "manage" && (
             <Button

ui/components/registry/registry-artifact-detail.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { type Ref, useState } from "react";
 
 import { Badge } from "@/components/shadcn/badge/badge";
 import { Button } from "@/components/shadcn/button/button";
@@ -14,6 +14,8 @@ import type {
 
 interface RegistryArtifactDetailProps {
   catalogArtifact?: RegistryCatalogArtifact;
+  headingRef?: Ref<HTMLHeadingElement>;
+  removeButtonRef?: Ref<HTMLButtonElement>;
   tenantArtifact?: RegistryTenantArtifact;
   isMutationPending?: boolean;
   onAdd?: (versionSpec?: string) => void;
@@ -22,6 +24,8 @@ interface RegistryArtifactDetailProps {
 
 export function RegistryArtifactDetail({
   catalogArtifact: artifact,
+  headingRef,
+  removeButtonRef,
   tenantArtifact,
   isMutationPending = false,
   onAdd,
@@ -55,7 +59,12 @@ export function RegistryArtifactDetail({
 
   return (
     <section aria-labelledby="registry-artifact-title">
-      <h1 id="registry-artifact-title" className="text-xl font-semibold">
+      <h1
+        className="text-xl font-semibold"
+        id="registry-artifact-title"
+        ref={headingRef}
+        tabIndex={-1}
+      >
         {name}
       </h1>
       {artifact?.description && (
@@ -84,6 +93,7 @@ export function RegistryArtifactDetail({
         <Button
           className="mt-6"
           onClick={onRemove}
+          ref={removeButtonRef}
           type="button"
           variant="destructive"
         >

ui/components/registry/registry-eligibility-provider.integration.test.tsx

@@ -5,7 +5,7 @@ import { render } from "@/__tests__/render-browser";
 const { refreshAccessMock } = vi.hoisted(() => ({
   refreshAccessMock: vi.fn(),
 }));
-vi.mock("@/lib/registry/access.server", () => ({
+vi.mock("@/actions/registry/registry", () => ({
   refreshRegistryEligibility: refreshAccessMock,
 }));