Caisin ccabbf0e97 feat: enable project-scoped preferences extension tabs (#7803)
* feat: enable project-scoped preferences extension tabs

Add a typed extension schema so subprojects can define extra settings,
render them in the shared preferences drawer only when configured, and
consume them in playground as a real feature demo. Extension labels now
follow locale keys instead of hardcoded app-specific strings.

Constraint: Reuse the shared preferences drawer and field blocks
Rejected: Add app-specific fields to core preferences | too tightly coupled
Rejected: Inline localized label objects | breaks existing locale-key flow
Confidence: high
Scope-risk: moderate
Reversibility: clean
Directive: Keep extension labels as locale keys rendered via $t in UI
Tested: Vitest preferences tests
Tested: Turbo typecheck for preferences, layouts, web-antd, and playground
Tested: ESLint for touched preferences and playground files
Not-tested: Manual browser interaction in playground preferences drawer

* fix: satisfy lint formatting for preferences extension demo

Adjust the playground preferences extension demo template so formatter and
Vue template lint rules agree on the rendered markup. This keeps CI green
without changing runtime behavior.

Constraint: Must preserve the existing demo behavior while fixing CI only
Rejected: Disable the Vue newline rule | would weaken shared lint guarantees
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Prefer computed/template structures that avoid formatter-vs-lint conflicts
Tested: pnpm run lint
Not-tested: Manual browser interaction in playground preferences extension demo

* fix: harden custom preferences validation and i18n labels

Tighten custom preferences handling so numeric extension fields respect
min, max, and step constraints. Number inputs now ignore NaN values,
and web-antd extension metadata uses locale keys instead of raw strings.
Also align tip-based hover guards in shared preference inputs/selects.

Constraint: Keep fixes scoped to verified findings only
Rejected: Broader refactor of preferences field components | not needed for these fixes
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Reuse the same validation path for updates and cache hydration
Tested: Vitest preferences tests
Tested: ESLint for touched preferences and widget files
Tested: Typecheck for web-antd, layouts, and core preferences
Not-tested: Manual browser interaction for all preference field variants

* fix: remove localized default from playground extension config

Drop the hardcoded Chinese default value from the playground extension
report title field and fall back to an empty string instead. This keeps
extension config locale-neutral while preserving localized labels and
placeholders through translation keys.

Constraint: Keep the fix limited to the verified localized default issue
Rejected: Compute the default from runtime locale in config | unnecessary for this finding
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Avoid embedding localized literals in extension default values
Tested: ESLint for playground/src/preferences.ts
Tested: Oxfmt check for playground/src/preferences.ts
Not-tested: Manual playground preferences interaction

* docs: document project-scoped preferences extension workflow

Add Chinese and English guide sections explaining how to define,
initialize, read, and update project-scoped preferences extensions.
Also document numeric field validation and point readers to the
playground demo for a complete example.

Constraint: Keep this docs-only and aligned with the shipped API
Rejected: Update only Chinese docs | would leave English docs inconsistent
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep zh/en examples and playground demo paths synchronized
Tested: git diff --check; pnpm build:docs
Not-tested: Manual browser review of the rendered docs site

* fix: harden custom preferences defaults and baselines

Use a locale-neutral default for the web-antd report title.
Also stop preference getters from exposing mutable baseline
or extension schema objects, and add a regression test for
external mutation attempts.

Constraint: Keep behavior compatible with the shipped preferences API
Rejected: Return raw refs with readonly typing only | callers could still mutate internals
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep defensive copies for baseline and schema getters unless storage semantics change
Tested: eslint, oxlint, targeted vitest, filtered typecheck, git diff --check
Not-tested: Full monorepo typecheck and test suite

* test: relax custom preference cache key matching

Avoid coupling the custom-number cache test to one exact
localStorage key string. Match the intended cache lookup
more loosely so the test still verifies filtering behavior
without depending on the full namespaced cache key.

Constraint: Focus the test on cache filtering behavior
Rejected: Assert one exact key | brittle with namespace changes
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Prefer behavior tests over literal storage keys
Tested: targeted vitest, eslint, git diff --check
Not-tested: Full monorepo test suite

---------

Co-authored-by: caisin <caisin@caisins-Mac-mini.local>
2026-04-13 15:11:57 +08:00
2024-07-28 14:29:05 +08:00
2024-05-19 21:20:42 +08:00
2024-05-19 21:20:42 +08:00
2024-05-19 21:20:42 +08:00
2026-01-28 18:05:20 +08:00
2026-03-13 22:12:15 +08:00
2026-03-15 17:41:47 +08:00
2024-07-28 14:29:05 +08:00
2026-04-10 21:23:24 +08:00
2026-04-11 14:13:13 +08:00
2026-04-10 22:16:33 +08:00
2025-11-04 04:34:55 +08:00
2024-05-19 21:20:42 +08:00
2026-03-13 22:12:15 +08:00

VbenAdmin Logo

license

Vue Vben Admin

Quality Gate Status codeql build ci deploy

English | 中文 | 日本語

Introduction

Vue Vben Admin is a free and open source middle and back-end template. Using the latest vue3, vite, TypeScript and other mainstream technology development, the out-of-the-box middle and back-end front-end solutions can also be used for learning reference.

Upgrade Notice

This is the latest version, 5.0, and it is not compatible with previous versions. If you are starting a new project, it is recommended to use the latest version. If you wish to view the old version, please use the v2 branch.

Features

  • Latest Technology Stack: Developed with cutting-edge front-end technologies like Vue 3 and Vite
  • TypeScript: A language for application-scale JavaScript
  • Themes: Multiple theme colors available with customizable options
  • Internationalization: Comprehensive built-in internationalization support
  • Permissions: Built-in solution for dynamic route-based permission generation

Preview

Test Account: vben/123456

VbenAdmin Logo VbenAdmin Logo VbenAdmin Logo

Use Gitpod

Open the project in Gitpod (free online dev environment for GitHub) and start coding immediately.

Open in Gitpod

Documentation

Document

Install and Use

  1. Get the project code
git clone https://github.com/vbenjs/vue-vben-admin.git
  1. Install dependencies
cd vue-vben-admin
npm i -g corepack
pnpm install
  1. Run
pnpm dev
  1. Build
pnpm build

Change Log

CHANGELOG

How to Contribute

You are very welcome to join! Raise an issue or submit a Pull Request.

Pull Request Process:

  1. Fork the code
  2. Create your branch: git checkout -b feat/xxxx
  3. Submit your changes: git commit -am 'feat(function): add xxxxx'
  4. Push your branch: git push origin feat/xxxx
  5. Submit pull request

Git Contribution Submission Specification

Reference vue specification (Angular)

  • feat Add new features
  • fix Fix the problem/BUG
  • style The code style is related and does not affect the running result
  • perf Optimization/performance improvement
  • refactor Refactor
  • revert Undo edit
  • test Test related
  • docs Documentation/notes
  • chore Dependency update/scaffolding configuration modification etc.
  • ci Continuous integration
  • types Type definition file changes

Browser Support

The Chrome 80+ browser is recommended for local development

Support modern browsers, not IE

Edge
Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
last 2 versions last 2 versions last 2 versions last 2 versions

Maintainer

@Vben

Star History

Star History Chart

Donate

If you think this project is helpful to you, you can help the author buy a cup of coffee to show your support!

donate

Paypal Me

Contributors

Contribution Leaderboard Contributors

Discord

License

MIT © Vben-2020

Description
No description provided
Readme MIT 336 MiB
Languages
Vue 53%
TypeScript 35.6%
JavaScript 8.1%
CSS 2.1%
Java 0.6%
Other 0.4%