Dev dashboard - #218
Conversation
Bump dashboard package version to 3.1.1 (package.json and lockfile). Enable Play Store link in DashboardSidebar and mark it as available.
Add CI steps to build linux/amd64 Agent and Dashboard images (without pushing), measure their sizes, and expose human-readable size outputs from the build jobs. Introduce a commit-readme-image-sizes job that consumes those outputs, replaces marker placeholders in README.md (<!-- AGENT_IMAGE_SIZE_START --> / <!-- DASHBOARD_IMAGE_SIZE_START -->) and commits the updated README on branch pushes. Also update README.md to add a Components table with image size placeholders and mobile app badges, and adjust workflow/dev environment defaults: fix TRAEFIK_LOG_DASHBOARD_ERROR_PATH, mount a local GeoIP DB, rename NEXT_PUBLIC_API_URL to AGENT_API_URL for the local compose step, and add dashboard-related envs (refresh interval, max logs, demo flag, GeoIP paths/TTL, NODE_ENV, MOBILE_API_KEY). The README commit is constrained to README-only updates and only runs on non-PR branch pushes.
Automated branch update after calculating linux/amd64 sizes for the published agent and dashboard images. Constraint: CI updates only README.md on branch pushes Confidence: high Scope-risk: narrow Directive: Keep the README size markers stable or the workflow replacement step will fail Tested: Marker replacement and README-only diff check in workflow Not-tested: Branch protection rules that reject bot pushes
Signed-off-by: HHF Technology <discourse@hhf.technology>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughAdds CI steps to build linux/amd64 Docker images, inspect and export human-readable image sizes, and a job that updates README.md with those sizes; updates generated docker-compose release notes; bumps dashboard version and activates the Play Store link in the sidebar; adds mobile app badges to README. Changes
Sequence Diagram(s)sequenceDiagram
participant GHA as GitHub Actions
participant Docker as Docker Engine
participant FS as Filesystem
participant Git as Git Remote
GHA->>Docker: Build linux/amd64 image (load only)
Docker-->>GHA: Image created
GHA->>Docker: Inspect image size (bytes)
Docker-->>GHA: Return size bytes
GHA->>GHA: numfmt -> IEC string
GHA-->>GHA: Set job output `image_size_human`
GHA->>FS: Checkout branch (commit-readme-image-sizes)
FS-->>GHA: Files available
GHA->>FS: Replace README markers with `image_size_human` values
FS-->>GHA: README modified
GHA->>Git: Fetch origin & verify SHA, commit & push if unchanged
Git-->>GHA: Push result
Estimated Code Review Effort🎯 3 (Moderate) | ⏱️ ~22 minutes Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Signed-off-by: HHF Technology <discourse@hhf.technology>
There was a problem hiding this comment.
Code Review
This pull request updates the dashboard version to 3.1.1, adds a components overview with image sizes to the README, and activates the Play Store link in the sidebar. Review feedback highlights a naming inconsistency in the README referring to "Crowdsec-Manager", a placeholder link for the App Store, and a typo in the authentication documentation.
| | **CLI** | Terminal-based dashboard using Bubble Tea (optional) | N/A | | ||
|
|
||
| --- | ||
| ### Crowdsec-Manager mobile app. |
| ### Crowdsec-Manager mobile app. | ||
|
|
||
| <div align="center"> | ||
| <a href="https://apps.apple.com/us/app/#"><img width="135" height="39" alt="appstore" src="https://github.com/user-attachments/assets/45e31a11-cf6b-40a2-a083-6dc8d1f01291" /></a> <a href="https://play.google.com/store/apps/details?id=com.traefik.logdashboard"><img width="135" height="39" alt="googleplay" src="https://github.com/user-attachments/assets/acbba639-858f-4c74-85c7-92a4096efbf5" /></a> |
| <a href="https://apps.apple.com/us/app/#"><img width="135" height="39" alt="appstore" src="https://github.com/user-attachments/assets/45e31a11-cf6b-40a2-a083-6dc8d1f01291" /></a> <a href="https://play.google.com/store/apps/details?id=com.traefik.logdashboard"><img width="135" height="39" alt="googleplay" src="https://github.com/user-attachments/assets/acbba639-858f-4c74-85c7-92a4096efbf5" /></a> | ||
| </div> | ||
|
|
||
| ### All apps are Pangolin and Basis auth supported. |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 32a1430307
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| - MOBILE_API_KEY= | ||
|
|
||
| - NODE_ENV=production | ||
| - MOBILE_API_KEY=d41d8cd98f00b204e9800998ecf8427e #if you have a mobile app, set this to a secure random value and use it in the app to authenticate with the API |
There was a problem hiding this comment.
Remove hard-coded mobile API key from release template
The generated Docker Compose block now sets MOBILE_API_KEY to a public, fixed value, which means users who copy/paste the release notes without editing this line will enable the mobile API with a known credential. In dashboard/server/routes/mobile.ts, MOBILE_API_KEY is the primary auth gate and CORS is opened broadly, so this creates a real unauthorized-access risk on internet-exposed dashboards; leaving the variable unset (disabled by default) or requiring a per-deployment random value would avoid that regression.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
Actionable comments posted: 4
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.github/workflows/build-and-publish.yml:
- Around line 98-123: The size-collection steps ("Build agent image for size
calculation (linux/amd64)" and "Calculate agent image size" with id image_size
and IMAGE_REF usage) are currently part of the main build job and can fail the
pipeline; move them into a separate best-effort job or make them non-blocking.
Either: extract those steps into a standalone job that runs after the publish
job (uses docker/build-push-action@v5 and docker image inspect) with no
dependency on success for release, or set the size-collection steps to
continue-on-error: true and only write to GITHUB_OUTPUT when both size artifacts
exist (guard the echo to GITHUB_OUTPUT with a conditional that verifies
SIZE_BYTES/SIZE_HUMAN are non-empty). Ensure references to IMAGE_REF,
image_size, and GITHUB_OUTPUT remain consistent so README updates are optional
and won’t block create-release.
- Around line 220-256: The push can race with concurrent commits because the
workflow checks out the branch head but then blindly git pushes; modify the
"Commit README image size update" step to verify the remote branch still points
at the original checked-out commit (github.sha) or use a ref-scoped safe push.
Specifically, inside the "Commit README image size update" step (the run block
that currently does git add/commit and git push), fetch the remote for ${{
github.ref_name }} and compare its tip to ${{ github.sha }} and abort if they
differ, or alternatively use a ref-scoped safe push such as git push
--force-with-lease against the checked-out ref to avoid non-fast-forward
overwrites; ensure the check references github.sha and the step name ("Commit
README image size update") so the guard is placed in the correct run block.
In `@README.md`:
- Around line 19-26: The README's mobile app heading "### Crowdsec-Manager
mobile app." needs surrounding blank lines to satisfy MD022 and the following
line "### All apps are Pangolin and Basis auth supported." should be converted
from a level-3 heading into regular prose (remove the "###") and separated by a
blank line so it reads as a sentence under the mobile app section; update the
lines referencing "Crowdsec-Manager mobile app." and "All apps are Pangolin and
Basis auth supported." accordingly to add the required blank lines and change
the auth line to plain text.
- Around line 22-23: Update the App Store badge anchor that currently uses the
placeholder href ".../app/#" (the <a> tag wrapping the image with
alt="appstore") by replacing the stub URL with the App Store listing URL for the
iOS app; if the iOS listing is not yet available, remove the entire App Store
anchor/image element (the anchor with href ".../app/#" and img alt="appstore")
to avoid a dead link until the app is live.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: bc6a4585-6e04-4585-b616-f375e5d64fdc
⛔ Files ignored due to path filters (1)
dashboard/package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (4)
.github/workflows/build-and-publish.ymlREADME.mddashboard/package.jsondashboard/src/components/layout/DashboardSidebar.tsx
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: build-agent
- GitHub Check: build-dashboard
🧰 Additional context used
🪛 markdownlint-cli2 (0.22.0)
README.md
[warning] 20-20: Headings should be surrounded by blank lines
Expected: 1; Actual: 0; Above
(MD022, blanks-around-headings)
[warning] 26-26: Headings should be surrounded by blank lines
Expected: 1; Actual: 0; Below
(MD022, blanks-around-headings)
🔇 Additional comments (4)
dashboard/package.json (1)
3-3: Version bump looks correct for this release increment.
3.1.1is a clean patch-version update and aligns with the scoped dashboard/documentation/link changes in this PR.dashboard/src/components/layout/DashboardSidebar.tsx (1)
82-84: Play Store activation is wired correctly.Setting a real
hrefand togglingisComingSoontofalsecleanly enables the icon link through the existingisDisabledlogic..github/workflows/build-and-publish.yml (1)
461-473: Docs/example config now matches the dashboard runtime.These env names line up with the server config and route checks, so the release-note compose sample is materially more accurate now.
README.md (1)
13-17: The size-marker placement is solid.Embedding the start/end markers inside the table cells gives the workflow a deterministic edit target without rewriting unrelated README content.
| --- | ||
| ### Crowdsec-Manager mobile app. | ||
|
|
||
| <div align="center"> | ||
| <a href="https://apps.apple.com/us/app/#"><img width="135" height="39" alt="appstore" src="https://github.com/user-attachments/assets/45e31a11-cf6b-40a2-a083-6dc8d1f01291" /></a> <a href="https://play.google.com/store/apps/details?id=com.traefik.logdashboard"><img width="135" height="39" alt="googleplay" src="https://github.com/user-attachments/assets/acbba639-858f-4c74-85c7-92a4096efbf5" /></a> | ||
| </div> | ||
|
|
||
| ### All apps are Pangolin and Basis auth supported. |
There was a problem hiding this comment.
Normalize the mobile-app section heading structure.
This block currently trips MD022, and Line 26 reads like body text rather than a section heading. Add the required blank lines around the heading and make the auth sentence regular prose to keep the README lint-clean and easier to scan.
🧰 Tools
🪛 markdownlint-cli2 (0.22.0)
[warning] 20-20: Headings should be surrounded by blank lines
Expected: 1; Actual: 0; Above
(MD022, blanks-around-headings)
[warning] 26-26: Headings should be surrounded by blank lines
Expected: 1; Actual: 0; Below
(MD022, blanks-around-headings)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@README.md` around lines 19 - 26, The README's mobile app heading "###
Crowdsec-Manager mobile app." needs surrounding blank lines to satisfy MD022 and
the following line "### All apps are Pangolin and Basis auth supported." should
be converted from a level-3 heading into regular prose (remove the "###") and
separated by a blank line so it reads as a sentence under the mobile app
section; update the lines referencing "Crowdsec-Manager mobile app." and "All
apps are Pangolin and Basis auth supported." accordingly to add the required
blank lines and change the auth line to plain text.
| <div align="center"> | ||
| <a href="https://apps.apple.com/us/app/#"><img width="135" height="39" alt="appstore" src="https://github.com/user-attachments/assets/45e31a11-cf6b-40a2-a083-6dc8d1f01291" /></a> <a href="https://play.google.com/store/apps/details?id=com.traefik.logdashboard"><img width="135" height="39" alt="googleplay" src="https://github.com/user-attachments/assets/acbba639-858f-4c74-85c7-92a4096efbf5" /></a> |
There was a problem hiding this comment.
Replace the placeholder App Store URL before publishing this.
The Apple badge currently links to .../app/#, so users get a dead/stub destination. Either point it at the actual listing or remove the badge until the iOS app is live.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@README.md` around lines 22 - 23, Update the App Store badge anchor that
currently uses the placeholder href ".../app/#" (the <a> tag wrapping the image
with alt="appstore") by replacing the stub URL with the App Store listing URL
for the iOS app; if the iOS listing is not yet available, remove the entire App
Store anchor/image element (the anchor with href ".../app/#" and img
alt="appstore") to avoid a dead link until the app is live.
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (2)
.github/workflows/build-and-publish.yml (2)
248-259:⚠️ Potential issue | 🟡 MinorSkip the README update when either size is missing.
This block can write one fresh size while leaving the other marker on its previous value, so a partial failure produces a mixed old/new table in
README.md. Bail out unless both outputs are present.Suggested fix
- name: Update README image sizes shell: bash run: | AGENT_SIZE="${{ needs.build-agent.outputs.image_size_human }}" DASHBOARD_SIZE="${{ needs.build-dashboard.outputs.image_size_human }}" - if [ -n "${AGENT_SIZE}" ]; then - sed -i -E "s|(<!-- AGENT_IMAGE_SIZE_START -->)[^<]*(<!-- AGENT_IMAGE_SIZE_END -->)|\1${AGENT_SIZE}\2|" README.md - else - echo "Agent image size output is empty; leaving README marker unchanged" - fi - if [ -n "${DASHBOARD_SIZE}" ]; then - sed -i -E "s|(<!-- DASHBOARD_IMAGE_SIZE_START -->)[^<]*(<!-- DASHBOARD_IMAGE_SIZE_END -->)|\1${DASHBOARD_SIZE}\2|" README.md - else - echo "Dashboard image size output is empty; leaving README marker unchanged" - fi + if [ -z "${AGENT_SIZE}" ] || [ -z "${DASHBOARD_SIZE}" ]; then + echo "One or more image sizes are missing; skipping README update" + exit 0 + fi + sed -i -E "s|(<!-- AGENT_IMAGE_SIZE_START -->)[^<]*(<!-- AGENT_IMAGE_SIZE_END -->)|\1${AGENT_SIZE}\2|" README.md + sed -i -E "s|(<!-- DASHBOARD_IMAGE_SIZE_START -->)[^<]*(<!-- DASHBOARD_IMAGE_SIZE_END -->)|\1${DASHBOARD_SIZE}\2|" README.md🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.github/workflows/build-and-publish.yml around lines 248 - 259, Change the logic to require both AGENT_SIZE and DASHBOARD_SIZE be present before touching README: check the two variables (AGENT_SIZE and DASHBOARD_SIZE) together and if either is empty, print a message and exit non‑zero (or skip the job) so neither sed command runs; only when both are non‑empty run the existing sed replacements that target the <!-- AGENT_IMAGE_SIZE_START -->…<!-- AGENT_IMAGE_SIZE_END --> and <!-- DASHBOARD_IMAGE_SIZE_START -->…<!-- DASHBOARD_IMAGE_SIZE_END --> markers to update README.
264-290:⚠️ Potential issue | 🟡 MinorUse a leased push for the README self-update.
The
fetch/compare guard helps, but there's still a race between Lines 264-266 and Line 290: another commit can land afterREMOTE_SHAis read and beforegit push, which turns this best-effort job red. Push with a ref-scoped lease, or treat a non-fast-forward as a skip.Suggested fix
git commit -F /tmp/readme-image-size-commit-msg - git push origin HEAD:${{ github.ref_name }} + git push \ + --force-with-lease=refs/heads/${{ github.ref_name }}:${REMOTE_SHA} \ + origin HEAD:${{ github.ref_name }} || { + echo "Branch advanced during README update; skipping push" + exit 0 + }🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.github/workflows/build-and-publish.yml around lines 264 - 290, The current flow reads REMOTE_SHA then later runs git push origin HEAD:${{ github.ref_name }}, which can race if a new commit lands between those steps; replace the final plain push with a ref-scoped lease push (use git push with a ref-scoped --force-with-lease against the branch you fetched) or, if you prefer not to force, perform the push and treat a non-fast-forward failure as a no-op by detecting the push exit status and exiting 0 (i.e., skip the update) instead of failing the job; update the git push invocation and/or add logic after the push to handle non-fast-forward errors referencing REMOTE_SHA and the git push command to ensure the README self-update is safely leased.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.github/workflows/build-and-publish.yml:
- Line 507: The current workflow emits a hard-coded predictable secret for
MOBILE_API_KEY; replace the literal key with a non-sensitive placeholder or env
interpolation (e.g., set MOBILE_API_KEY: "${{ secrets.MOBILE_API_KEY }}" or
MOBILE_API_KEY: "<your-mobile-api-key>") so the generated Compose example does
not contain a copy-pasteable secret; update the MOBILE_API_KEY entry wherever it
appears and ensure documentation/comments explain to set it via secrets or an
environment variable.
---
Duplicate comments:
In @.github/workflows/build-and-publish.yml:
- Around line 248-259: Change the logic to require both AGENT_SIZE and
DASHBOARD_SIZE be present before touching README: check the two variables
(AGENT_SIZE and DASHBOARD_SIZE) together and if either is empty, print a message
and exit non‑zero (or skip the job) so neither sed command runs; only when both
are non‑empty run the existing sed replacements that target the <!--
AGENT_IMAGE_SIZE_START -->…<!-- AGENT_IMAGE_SIZE_END --> and <!--
DASHBOARD_IMAGE_SIZE_START -->…<!-- DASHBOARD_IMAGE_SIZE_END --> markers to
update README.
- Around line 264-290: The current flow reads REMOTE_SHA then later runs git
push origin HEAD:${{ github.ref_name }}, which can race if a new commit lands
between those steps; replace the final plain push with a ref-scoped lease push
(use git push with a ref-scoped --force-with-lease against the branch you
fetched) or, if you prefer not to force, perform the push and treat a
non-fast-forward failure as a no-op by detecting the push exit status and
exiting 0 (i.e., skip the update) instead of failing the job; update the git
push invocation and/or add logic after the push to handle non-fast-forward
errors referencing REMOTE_SHA and the git push command to ensure the README
self-update is safely leased.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: 3867c810-9df5-4015-be00-6275a4babbda
📒 Files selected for processing (1)
.github/workflows/build-and-publish.yml
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
- GitHub Check: build-cli-binaries (linux, 386)
- GitHub Check: build-dashboard
- GitHub Check: build-agent
- GitHub Check: build-dashboard
| - MOBILE_API_KEY= | ||
|
|
||
| - NODE_ENV=production | ||
| - MOBILE_API_KEY=d41d8cd98f00b204e9800998ecf8427e #if you have a mobile app, set this to a secure random value and use it in the app to authenticate with the API |
This comment was marked as resolved.
This comment was marked as resolved.
Sorry, something went wrong.
Summary by CodeRabbit
New Features
Documentation
Chores