SuavePlan/suaveplan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
suaveplan/openspec/archive/2026-05-12-enterprise-react-drive-sharing/tasks.md
admin fbc70f96e6 Initial Commit
2026-05-27 23:29:53 +01:00

3.5 KiB
Raw Permalink Blame History

Tasks: enterprise-react-drive-sharing

Change ID: enterprise-react-drive-sharing Package: @suaveplan/drive-react-sharing Target path: packages/drive/drive-react-sharing Prerequisite packages on Verdaccio: @suaveplan/error, @suaveplan/drive-sharing, @suaveplan/react-translate

1. Scaffold

  • Create directory tree. Write package.json at 0.1.0, tsconfig.json, vitest.config.ts, scripts.
  • Dependencies: @suaveplan/error workspace:^, @suaveplan/drive-sharing workspace:^, @suaveplan/react-translate workspace:^, @opentelemetry/api catalog:observability, zod catalog:forms, tslib catalog:build.

2. Error codes and types

  • Define DriveSharingError; codes: SHARING_ADD_FAILED, SHARING_REVOKE_FAILED, SHARING_PERMISSION_FAILED.
  • Re-export SharePermission from @suaveplan/drive-sharing (no local divergence). Define: ShareRecipient, AccessEntry, PartitionType, ShareDialogProps, PartitionBadgeProps, FileAccessListProps, UseSharingOptions, UseSharingReturn, ShareLinkDialogProps.

3. Hooks

useSharing

  • Manages recipients array; calls real @suaveplan/drive-sharing engine for addRecipient, removeRecipient, updatePermission. OTel spans: drive.share.add, drive.share.revoke, drive.share.permission.change.
  • Write use-sharing.test.ts (≤500 lines): add recipient calls engine, remove recipient calls engine, permission update calls engine, error states. DI-injected engine. { timeout: 10000 }.
  • Write use-sharing.md.
  • Write use-sharing.stories.tsx (hooks playground with live recipient management).

4. Components

PartitionBadge

  • Displays partition type (personal / communal / vault / public) with encryption lock icon. All labels via useTranslation.
  • Write test, stories (all-four-types, encrypted, playground), md.

FileAccessList

  • Read-only list with revoke buttons. Each revoke button has aria-label naming the recipient via useTranslation. OTel drive.share.revoke counter on revoke.
  • Write test, stories (default, with-owner, empty, playground), md.

ShareDialog

  • Modal dialog with recipients list, permission picker, add-recipient form. Focus trap on open. ESC-to-close. aria-modal, aria-labelledby. All labels via useTranslation.
  • Write share-dialog.test.tsx (≤500 lines): renders recipients, add fires useSharing.addRecipient, remove fires removeRecipient, ESC closes, axe-clean. { timeout: 10000 }.
  • Write stories (default, with-recipients, vault-partition, empty, playground), md.

ShareLinkDialog

  • Generate / revoke shareable link. Accepts scope: SharePermission, expiry?: Date, password?: boolean. Copy-to-clipboard button with aria-live announcement.
  • Write test, stories (default, with-expiry, with-password, playground), md.

5. E2E

  • e2e/drive-sharing.spec.ts — Playwright:
    • Open ShareDialog; add a recipient; verify they appear in the list.
    • Change a recipient's permission; verify dropdown updates.
    • Revoke a recipient; verify they are removed.
    • Navigate the dialog using keyboard only; verify no focus escapes.
    • Test on mobile viewport.

6. Verify and publish

  • bunx turbo lint typecheck test --filter=@suaveplan/drive-react-sharing — green.
  • bunx turbo test:coverage --filter=@suaveplan/drive-react-sharing — 100%.
  • bun scripts/publish.ts --package @suaveplan/drive-react-sharing.
  • Archive change folder.
Reference in New Issue View Git Blame Copy Permalink