feat(home): add imgBackground option to about component - #3857
Merged
Merged
Conversation
Add a full developers module with two tabs: API Keys and Webhooks. API Keys tab: create, edit, revoke, and delete keys with one-time secret reveal dialog. Webhooks tab: create, edit, and delete webhooks with event selection and deliveries viewer. Includes Pinia store with complete CRUD actions and 36 unit tests covering all store operations and edge cases. Wired into app router and registered in dev/test config defaults.
…ync ping, naming - Fix timezone handling in keyCreate date picker (use local components instead of toISOString) - Fix webhookCreate form blank on reopening same webhook (populate on dialog open) - Fix formatJson hiding valid falsy values (use == null check) - Fix testPing treating success as synchronous (await actual request) - Fix CRUD mutations on paginated slices (re-fetch active page from server) - Rename developers.view.vue to developers.index.view.vue (naming convention) - Update store tests for re-fetch pattern and add pagination regression cases
When imgBackground is set on a content item, the image is wrapped in a
rounded container with the specified background color and padding.
Supports theme-aware values via { light, dark } object that picks the
right color based on current Vuetify theme.
Closes #3855
|
Warning Rate limit exceeded
Your organization is not enrolled in usage-based pricing. Contact your admin to enable usage-based pricing to continue reviews beyond the rate limit, or try again in 24 minutes and 4 seconds. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: ASSERTIVE Plan: Pro Run ID: 📒 Files selected for processing (14)
✨ 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 |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #3857 +/- ##
==========================================
+ Coverage 99.23% 99.30% +0.07%
==========================================
Files 28 29 +1
Lines 910 1011 +101
Branches 243 251 +8
==========================================
+ Hits 903 1004 +101
Misses 7 7 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
Pull request overview
This PR adds a new imgBackground option to the Home “about” content items to optionally render images inside a padded, rounded background container, and it also introduces a new authenticated “Developers” module (API keys + webhooks) wired into the main app router.
Changes:
- Add
imgBackground(string or{ light, dark }) support tohome.about.component.vueto optionally wrap images with a background and usecontain. - Add a new Developers module (router, store, views, components) for managing API keys, webhooks, and webhook deliveries.
- Extend API endpoint defaults and app routing to include the Developers module.
Reviewed changes
Copilot reviewed 14 out of 14 changed files in this pull request and generated 13 comments.
Show a summary per file
| File | Description |
|---|---|
| src/modules/home/components/home.about.component.vue | Adds optional image background wrapper + theme-aware resolution logic. |
| src/modules/developers/views/developers.index.view.vue | New Developers page hosting tabs + dialogs for keys/webhooks. |
| src/modules/developers/stores/developers.store.js | New Pinia store for keys/webhooks/deliveries CRUD + test ping. |
| src/modules/developers/tests/developers.store.unit.tests.js | Unit tests for the new developers store actions. |
| src/modules/developers/router/developers.router.js | Adds /developers route guarded by CASL action/subject. |
| src/modules/developers/config/developers.config.js | Defines supported webhook events + event→color mapping. |
| src/modules/developers/components/developers.keysTab.component.vue | API keys table + revoke flow UI. |
| src/modules/developers/components/developers.keyCreate.component.vue | Create-key dialog UI + expiry handling. |
| src/modules/developers/components/developers.webhooksTab.component.vue | Webhooks table + edit/delete/test UI + deliveries row click. |
| src/modules/developers/components/developers.webhookCreate.component.vue | Create/edit webhook dialog UI + validation. |
| src/modules/developers/components/developers.webhookDeliveries.component.vue | Deliveries dialog + expandable payload/response display. |
| src/modules/app/app.router.js | Wires Developers router into the app’s route set. |
| src/config/defaults/development.config.js | Adds api.endPoints.developers default. |
| src/config/defaults/test.config.js | Adds api.endPoints.developers default for tests. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
PierreBrisorgueil
pushed a commit
that referenced
this pull request
May 1, 2026
# [2.0.0](v1.5.0...v2.0.0) (2026-05-01) * feat(admin)!: render extra tabs as inline nested routes ([e5ebea9](e5ebea9)), closes [#3955](#3955) ### Bug Fixes * **admin:** frame Readiness & Activity tabs to match Users/Organizations ([#3987](#3987)) ([73c7527](73c7527)) * **admin:** nav label, activeTab sync, tighter tab-route validation ([39f2eac](39f2eac)) * **admin:** prevent toggleUserRole from erasing user fields ([#3995](#3995)) ([d469759](d469759)), closes [#3993](#3993) [#3993](#3993) * **audit:** security fixes — SVG XSS, router guard, admin errors, docs config ([#3880](#3880)) ([b57d8fc](b57d8fc)), closes [#3876](#3876) [#3877](#3877) [#3878](#3878) [#3879](#3879) [#3877](#3877) * **auth,admin:** structured logging + remove stale TODOs ([#3919](#3919)) ([2b52c28](2b52c28)) * **auth:** call backend signout to clear httpOnly TOKEN cookie ([#4018](#4018)) ([6b04471](6b04471)), closes [#3502](#3502) * **auth:** show loader on oAuth callback, surface token() errors ([#4017](#4017)) ([#4019](#4019)) ([a60d1b9](a60d1b9)) * **auth:** tolerate canonical + legacy + plain-string OAuth error payloads ([#4022](#4022)) ([89fa807](89fa807)), closes [#3495](#3495) [pre-#3513](https://github.com/pre-/issues/3513) [#4021](#4021) [#4021](#4021) * **avatar:** snap size to backend sharp whitelist ([#3973](#3973)) ([c6f59d9](c6f59d9)), closes [#3972](#3972) * **billing:** cumulative review — loading race + unconditional useMeter + cleanup ([#4043](#4043)) ([3ff56ba](3ff56ba)) * **billing:** replace networkidle with domcontentloaded in pricing E2E tests ([#3858](#3858)) ([b468027](b468027)), closes [#3848](#3848) * **billing:** use named import for plans, add migration note for billing.config.js rename ([162689d](162689d)) * **config:** fix layer numbering and clarify downstream README instructions ([3c7c918](3c7c918)) * **config:** guard loadModuleConfigs against array default exports ([#3908](#3908)) ([0c215a0](0c215a0)), closes [#3900](#3900) * **config:** rename billing.config.js to billing.development.config.js ([394efaa](394efaa)) * **developers:** remove orphan developers module (no backend) ([#3909](#3909)) ([8e1b440](8e1b440)) * **e2e:** eliminate flaky Vite cold-start race on ARC runners ([#3918](#3918)) ([534c7a7](534c7a7)), closes [#3917](#3917) * **features:** remount carousel cards on step change to replay SVG animations ([#3887](#3887)) ([e202d65](e202d65)), closes [#3886](#3886) * **footer:** transparent background on link list ([#3875](#3875)) ([83b83b0](83b83b0)), closes [#3862](#3862) * **footer:** use transparent card color to match section background ([#3871](#3871)) ([eaca4b5](eaca4b5)) * **home:** add title/subtitle spacing in HomeContentComponent ([#3840](#3840)) ([e52a10a](e52a10a)), closes [#3835](#3835) * **home:** equalize capabilities card heights across tabs ([#3946](#3946)) ([3fa094b](3fa094b)), closes [#3945](#3945) * **home:** isSvg handles URLs with query strings and fragments ([#3950](#3950)) ([548facf](548facf)), closes [#3949](#3949) * **home:** prevent last section and footer sharing same background ([#3842](#3842)) ([2cda9c7](2cda9c7)), closes [#3838](#3838) * **home:** remove hardcoded Ghost API key, use env var ([#3915](#3915)) ([aaba326](aaba326)), closes [#3910](#3910) * **home:** render SVGs inline to access CSS custom properties ([#3860](#3860)) ([f95ef06](f95ef06)), closes [#3849](#3849) * **home:** replace console.error/warn with structured logger ([#3916](#3916)) ([631ddac](631ddac)), closes [#3911](#3911) * **home:** support custom gradient in features section background ([#3866](#3866)) ([d66c36e](d66c36e)) * **home:** use homeImgComponent for about section SVGs ([#3930](#3930)) ([b9246dd](b9246dd)), closes [#3929](#3929) * **images:** omit port when api.port is empty or undefined ([#3964](#3964)) ([70c2e4c](70c2e4c)), closes [#3927](#3927) [#3963](#3963) * **img:** await nextTick before setting SVG content from cache ([#3889](#3889)) ([5e98d2c](5e98d2c)) * **navigation:** clean mobile glass navigation ([#3942](#3942)) ([ec6a283](ec6a283)) * **stores:** normalize console.log → console.error in catch blocks ([#3912](#3912)) ([09423de](09423de)), closes [#3906](#3906) * **tests:** eliminate component mount leaks + harden vitest config ([#4045](#4045)) ([79a8108](79a8108)) ### Features * **admin:** add Activity tab with audit log viewer ([#3928](#3928)) ([79cacff](79cacff)), closes [#3891](#3891) * **admin:** configurable tabs via admin config array ([#3847](#3847)) ([3a99e67](3a99e67)), closes [#3846](#3846) * **admin:** SaaS readiness card in admin dashboard ([#3814](#3814)) ([f2f86e0](f2f86e0)) * **admin:** surface API errors in admin store actions ([#3861](#3861)) ([38aa910](38aa910)), closes [#3850](#3850) * **billing:** meter UI primitives — progress + breakdown + ledger (PR-V2) ([#4038](#4038)) ([089d200](089d200)) * **billing:** meter UX surfaces (PR-V3) ([#4039](#4039)) ([0d0d4f6](0d0d4f6)) * **billing:** mini-bar always-on (free/admin) + extras section in /billing + account links ([#4048](#4048)) ([b459fad](b459fad)) * **billing:** useMeter composable + extras store actions (PR-V1) ([#4037](#4037)) ([1d05894](1d05894)) * **config:** document and standardize {module}.{project}.config.js per-module project overrides ([93393e3](93393e3)) * **core/pageHeader:** breadcrumb slot + canonical height + overflow fix ([#4026](#4026)) ([52e00cd](52e00cd)), closes [#4013](#4013) * **core:** expose reusable OrgAvatar component ([#3926](#3926)) ([1d71817](1d71817)), closes [#3924](#3924) * **core:** support SVG/image sidenav logo + click-to-home ([#3988](#3988)) ([958b1a5](958b1a5)), closes [#3986](#3986) * **docs:** add docs module with embedded Scalar API reference ([#3873](#3873)) ([b5df8d1](b5df8d1)), closes [#3867](#3867) * **docs:** add markdown guide pages with navigation tabs ([#3874](#3874)) ([a39256c](a39256c)), closes [#3867](#3867) [#3868](#3868) * **home:** add animated counter to statistics component ([#3845](#3845)) ([df63150](df63150)), closes [#3831](#3831) * **home:** add configurable cols to services component ([#3856](#3856)) ([ceeb9e0](ceeb9e0)), closes [#3853](#3853) * **home:** add grid layout option to features component ([#3859](#3859)) ([e1b6540](e1b6540)), closes [#3854](#3854) * **home:** add HomeCtaComponent for final CTA section ([#3843](#3843)) ([38c5444](38c5444)), closes [#3837](#3837) [#3839](#3839) * **home:** add imgBackground option to about component ([#3857](#3857)) ([4d939ee](4d939ee)), closes [#3855](#3855) * **home:** add imgMode prop to features cards for SVG illustrations ([#3844](#3844)) ([bfe6ab7](bfe6ab7)), closes [#3839](#3839) * **home:** make timeline opposite-side labels optional ([#3841](#3841)) ([564808c](564808c)), closes [#3836](#3836) * **home:** render icon on the right of title when alignment='right' ([#3952](#3952)) ([94ff2ee](94ff2ee)), closes [#3951](#3951) * **home:** support custom section background in all home components ([#3872](#3872)) ([5756f9c](5756f9c)) * **home:** support right alignment in homeContentComponent ([#3947](#3947)) ([26af7df](26af7df)), closes [#3944](#3944) * **modules:** per-module activation config flag ([#3864](#3864)) ([d49dae0](d49dae0)), closes [#3863](#3863) * **navigation:** support explicit sidenav ordering via meta.order ([#3965](#3965)) ([37eaa67](37eaa67)), closes [#3962](#3962) * **navigation:** support external links in sidenav ([#3954](#3954)) ([#3956](#3956)) ([8708fa0](8708fa0)) * **observability:** fan-out errors Sentry + PostHog + opt-in flags ([#4012](#4012)) ([0efe3ab](0efe3ab)), closes [#4011](#4011) [#4011](#4011) ### BREAKING CHANGES * downstream projects using config.admin.tabs with /admin/* sibling routes must migrate per MIGRATIONS.md — relative paths in the router file, registration via injectAdminChildren in app.router.js, and removal of PageHeader from tab views.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
imgBackgroundconfig option to about component content itemscontaininstead ofcoverfor better display){ light: '#f5f5f7', dark: '#1e293b' }to pick color based on current Vuetify themecover)Closes #3855
Test plan
imgBackgroundrenders as before (cover image, no wrapper)imgBackground: '#f5f5f7'renders the image inside a rounded, padded container with that background colorimgBackground: { light: '#f5f5f7', dark: '#1e293b' }picks the correct color when toggling light/dark theme