@aiquants/authz-react-router 0.1.0 → 0.1.1

package/README.md

@@ -115,4 +115,47 @@ Multiple roles **union** (wider wins): rows OR'd (any `NULL` ⇒ all rows); colu
 - `usePermission(view)` → ○△× display states (`readState`/`writeState`/`deleteState`); pure, safe in render.
 - `<MyPermissionIndicator permission={view} />` → read / write(create∪update) / delete as ○△×. `read` is △ when row/column-restricted; `write` is ○ only when both create & update are held, △ when one.
 
+## Demo App
+
+This package contains an interactive React Router 7 SPA demo in the `demo/` subdirectory. The demo app runs completely in the browser, using `localStorage` to mock database storage.
+
+### Features
+
+- **Role-Based Access Control**: Demonstrates role switching (Admin, Manager, Operator, Reader) and how it affects UI elements.
+- **Route Guards**: Uses `authz.requirePermission` to protect routes and handle unauthorized access.
+- **Scope Verification**: Demonstrates `rowScope` (row filters) and `columnScope` (masked values) dynamically applied based on the active role's permissions.
+- **In-Browser Database Reset**: Includes a **「デモデータ初期化」 (Reset Demo Data)** button in the header of key views (Dashboard, Protected Documents, and Sales pages) to wipe customized roles, assignments, permissions, and CRUD data from `localStorage`, instantly restoring default test states.
+
+### Running the Demo
+
+From the project root:
+
+```bash
+pnpm --filter authz-react-router-demo dev
+```
+
+Open `http://localhost:5178/` in your browser.
+
+## Testing
+
+Playwright tests are included in the `demo/` package to verify the RBAC features, CRUD interactions, and the data reset functionality.
+
+### Running Integration Tests
+
+Ensure the dev server is running, then run Playwright tests from the workspace root:
+
+```bash
+# Run all tests in the demo package
+pnpm exec playwright test packages/authz-react-router/demo/
+
+# Run specific tests
+pnpm exec playwright test packages/authz-react-router/demo/integration-tests.spec.ts
+pnpm exec playwright test packages/authz-react-router/demo/check.spec.ts
+```
+
+- **`integration-tests.spec.ts`**: Runs a comprehensive workflow verifying permission guards, dynamic role granting/revocation in the Admin Panel, row/column scoping on sales data, CRUD validation, and the final state reset.
+- **`check.spec.ts`**: Verifies basic CRUD operations (list, create, update, delete) on protected document files.
+
+## License
+
 MIT

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiquants/authz-react-router",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "React Router (v7) adapter for @aiquants/authz-core: requirePermission/getMyPermissions guards, usePermission hook, and MyPermissionIndicator component.",
   "sideEffects": false,
   "main": "dist/index.js",
@@ -67,6 +67,9 @@
     "publish:patch": "npm version patch && pnpm publish --no-git-checks",
     "publish:minor": "npm version minor && pnpm publish --no-git-checks",
     "publish:major": "npm version major && pnpm publish --no-git-checks",
+    "demo:dev": "cd demo && pnpm run dev",
+    "demo:build": "cd demo && pnpm run build",
+    "demo:start": "cd demo && pnpm run start",
     "lint": "biome lint src/",
     "check": "biome check src/",
     "check:fix": "biome check --write src/",