407 Add test workflow for leapfrogai_ui

.github/workflows/e2e-shim.yaml

@@ -18,7 +18,7 @@ on:
       - "CODEOWNERS"
       - ".gitignore"
       - "LICENSE"
-      - "pre-commit-config.yaml"
+      - ".pre-commit-config.yaml"
 
       # Catch pytests
       - "tests/pytest/**"

.github/workflows/e2e.yaml

@@ -26,7 +26,7 @@ on:
       - "!LICENSE"
 
       # Ignore local development files
-      - "!pre-commit-config.yaml"
+      - "!.pre-commit-config.yaml"
 
       # Ignore non e2e tests
       - "!tests/pytest/**"

.github/workflows/lint.yaml

@@ -21,3 +21,14 @@ jobs:
         with:
           version: 0.3.4
           args: format --check
+
+      # Javascript & Typescript Linting
+      - uses: actions/setup-node@60edb5dd545a775178f52524783378180af0d1f8 # v4.0.2
+        with:
+          node-version-file: 'src/leapfrogai_ui/package.json'
+
+      - name: Install UI Dependencies
+        run: npm --prefix src/leapfrogai_ui ci
+
+      - name: Run UI Linter
+        run: npm --prefix src/leapfrogai_ui run lint

.github/workflows/secret-scan.yaml

@@ -0,0 +1,16 @@
+name: secret-scan
+on: pull_request
+
+
+jobs:
+  secret-scan: # scan for any live secrets in the repository using trufflehog
+    runs-on: ubuntu-latest
+    steps:
+    - name: Checkout code
+      uses: actions/checkout@b4ffde65f46336ab88eb53be808477a3936bae11 # v4.1.1
+      with:
+        fetch-depth: 0
+    - name: Secret Scanning
+      uses: trufflesecurity/trufflehog@main
+      with:
+        extra_args: --only-verified

.github/workflows/ui-test-shim.yaml

@@ -0,0 +1,40 @@
+# Catch all the things we ignore in the ui-test workflow
+name: ui-test-shim
+on:
+  pull_request:
+    paths:
+      # catch all workflows except the ui-test
+      - ".github/workflows/**"
+      - "!.github/workflows/ui-test.yaml"
+
+      # ignore LFAI-UI things
+      - "!src/leapfrogai_ui/**"
+      - "!packages/ui/**"
+
+
+permissions:
+  contents: read
+
+# This is here to act as a shim for branch protection rules to work correctly.
+# This is ugly but this seems to be the best way to do this since:
+#  - Job names in a workflow must be unique
+#  - When paths are ignored not all jobs are reported to the branch protection rules
+#  - Multiple jobs of the same name are still required by branch protection rules
+
+# For more info see below:
+# https://github.com/orgs/community/discussions/54877
+# https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/collaborating-on-repositories-with-code-quality-features/troubleshooting-required-status-checks#handling-skipped-but-required-checks
+
+# Abort prior jobs in the same workflow / PR
+concurrency:
+  group: ui-test-skip-${{ github.ref }}
+  cancel-in-progress: true
+
+
+jobs:
+  ui-test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Skipped
+        run: |
+          echo skipped

.github/workflows/ui-test.yaml

@@ -0,0 +1,35 @@
+name: ui-test
+on:
+  pull_request:
+    paths:
+      # Ignore all workflows except this one
+      - ".github/workflows/ui-test.yaml"
+
+      # LFAI-UI things (no Python)
+      - "src/leapfrogai_ui/**"
+      - "packages/ui/**"
+
+# Declare default permissions as read only.
+permissions: read-all
+
+concurrency:
+  group: ui-test-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  ui-test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@b4ffde65f46336ab88eb53be808477a3936bae11 # v4.1.1
+
+      - uses: actions/setup-node@60edb5dd545a775178f52524783378180af0d1f8 # v4.0.2
+        with:
+          node-version-file: 'src/leapfrogai_ui/package.json'
+
+      - name: Install Dependencies
+        run: npm --prefix src/leapfrogai_ui ci
+
+      - name: Run Unit Tests
+        run: npm --prefix src/leapfrogai_ui run test:unit

.pre-commit-config.yaml

@@ -21,3 +21,12 @@ repos:
     hooks:
       - id: ruff # Run the linter.
       - id: ruff-format # Run the formatter.
+
+  # Local Eslint w/ Prettier
+  - repo: local
+    hooks:
+    - id: eslint
+      name: eslint
+      language: system
+      entry: sh -c 'npm --prefix src/leapfrogai_ui/ run lint'
+      files: \.(js|jsx|ts|tsx|svelte|cjs|mjs)$ # *.js, *.jsx, *.ts, *.tsx, *.svelte, *.cjs, *.mjs

src/leapfrogai_ui/.eslintrc.cjs

@@ -27,5 +27,8 @@ module.exports = {
 				parser: '@typescript-eslint/parser'
 			}
 		}
-	]
+	],
+	rules: {
+		'no-undef': 'off'
+	}
 };

src/leapfrogai_ui/.prettierignore

@@ -3,4 +3,6 @@ pnpm-lock.yaml
 package-lock.json
 yarn.lock
 
-../../packages/ui/chart/
+../../packages/ui/chart/
+
+supabase

src/leapfrogai_ui/Dockerfile

@@ -20,4 +20,4 @@ ENV NODE_ENV=production
 ENV BODY_SIZE_LIMIT=Infinity
 ENV PROTOCOL_HEADER=x-forwarded-proto
 ENV HOST_HEADER=x-forwarded-host
-CMD ["build"]
+CMD ["build"]

src/leapfrogai_ui/Makefile

@@ -4,4 +4,4 @@ docker-build:
 	docker build -t ghcr.io/defenseunicorns/leapfrogai/leapfrogai-ui:${VERSION} .
 
 zarf-build:
-	zarf package create . --confirm --set IMAGE_VERSION=${VERSION}
+	zarf package create . --confirm --set IMAGE_VERSION=${VERSION}

src/leapfrogai_ui/README.md

@@ -100,9 +100,9 @@ Under a realm in Keycloak that is not the master realm (if using UDS, its "uds")
 1. Create a new client (the client ID you use will be used in the env variables below)
 2. Turn on "Client Authentication"
 3. For "Valid redirect URLs", you need to put:
-   1. `http://localhost:5173/auth/callback` (or the URL for the frontend app callback)
-   2. `http://127.0.0.1:54321/auth/v1/callback` (or the URL for the Supabase callback, for locally running Supabase, DO NOT USE LOCALHOST, use 127.0.0.1)
-   3. Put the same two URLs in for "Web Origins"
+    1. `http://localhost:5173/auth/callback` (or the URL for the frontend app callback)
+    2. `http://127.0.0.1:54321/auth/v1/callback` (or the URL for the Supabase callback, for locally running Supabase, DO NOT USE LOCALHOST, use 127.0.0.1)
+    3. Put the same two URLs in for "Web Origins"
 4. Copy the Client Secret under the Clients -> Credentials tab and use in the env variables below
 5. You can create users under the "Users" tab and either have them verify their email (if you setup SMTP), or manually mark them as verified.