Skip to content
This repository was archived by the owner on May 29, 2026. It is now read-only.

feat(widgets): unified Add/Edit widget modal#65

Merged
rubenvdlinde merged 1 commit into
developmentfrom
feature/impl-widget-add-edit-modal
Apr 30, 2026
Merged

feat(widgets): unified Add/Edit widget modal#65
rubenvdlinde merged 1 commit into
developmentfrom
feature/impl-widget-add-edit-modal

Conversation

@rubenvdlinde

@rubenvdlinde rubenvdlinde commented Apr 30, 2026

Copy link
Copy Markdown
Contributor

Summary

  • Implements REQ-WDG-010 (modified), REQ-WDG-012, REQ-WDG-013, REQ-WDG-014 per spec at `openspec/changes/widget-add-edit-modal/`
  • New `AddWidgetModal.vue` handles both create and edit flows via dynamic `` sub-form loading from `widgetRegistry`
  • New `src/utils/widgetForm.js` provides `resetForm`, `loadEditingWidget`, `assembleContent` (strips cross-type field leakage on submit)
  • Per-type `validate(): string[]` contract gates the submit button reactively; three close triggers (cancel, backdrop click, Esc key) — none submit
  • Wired into `Views.vue`: `widget-edit` from DashboardGrid (inline button + context-menu) routes content-type placements to the new modal; style-only placements fall through to `WidgetStyleEditor`
  • `WidgetPicker.vue` preserved as-is (Nextcloud widget discovery surface)
  • 12 Vitest scenarios: create/edit mode, type-switch leakage, submit field filtering, validation gating, all three close triggers, reopen reset

Test plan

  • Run `npm test` — all 133 tests pass; only pre-existing `WidgetContextMenu.test.js` CSS import failure (unrelated)
  • Run `npm run lint` — exits 0 (warnings are pre-existing)
  • Run `npm run stylelint` — exits 0
  • Open modal in create mode: type selector visible with all registry entries, correct sub-form renders
  • Open with `preselectedType`: type selector hidden
  • Open in edit mode: title "Edit Widget", type hidden, form pre-filled, button reads "Save"
  • Switch type: previous type's fields do not appear in new type's form
  • Click backdrop: modal closes, no submit emitted
  • Press Escape: modal closes, no submit emitted
  • Click Cancel: modal closes, no submit emitted
  • Submit with invalid sub-form: button disabled, submit blocked
  • Submit with valid sub-form: `submit({type, content})` emitted with only the type's fields

@rubenvdlinde rubenvdlinde added the ready-for-code-review Build complete — awaiting code reviewer label Apr 30, 2026
@github-actions

github-actions Bot commented Apr 30, 2026

Copy link
Copy Markdown
Contributor

Quality Report — ConductionNL/mydash @ 889aab8

Check PHP Vue Security License Tests
lint ✅
phpcs ❌
phpmd ✅
psalm ✅
phpstan ✅
phpmetrics ✅
eslint ✅
stylelint ✅
composer ✅ ✅ 103/103
npm ✅ ✅ 342/342
PHPUnit ⏭️
Newman ⏭️
Playwright ⏭️

Quality workflow — 2026-04-30 20:19 UTC

Download the full PDF report from the workflow artifacts.

@rubenvdlinde rubenvdlinde force-pushed the feature/impl-widget-add-edit-modal branch from 0382df8 to 79d74ad Compare April 30, 2026 20:28
@rubenvdlinde
feat(widgets): unified Add/Edit modal + form contract per REQ-WDG-010…
6461467 
…..014

- src/utils/widgetForm.js: resetForm, loadEditingWidget, assembleContent helpers
- src/components/Widgets/AddWidgetModal.vue: unified modal host for create+edit flows;
  dynamic <component :is> sub-form from widgetRegistry; per-type validate() gate;
  three close triggers (cancel, backdrop click, Esc); type-switch resets state
- src/views/Views.vue: mount AddWidgetModal; openWidgetEditModal routes content-type
  placements to the modal, style-only placements fall through to WidgetStyleEditor;
  widget-edit from DashboardGrid/context-menu wired to openWidgetEditModal
- src/__tests__/AddWidgetModal.test.js: 12 Vitest scenarios covering create/edit mode,
  type-switch leakage, submit field filtering, validation gating, close triggers
@rubenvdlinde rubenvdlinde force-pushed the feature/impl-widget-add-edit-modal branch from 79d74ad to 6461467 Compare April 30, 2026 20:28
@rubenvdlinde rubenvdlinde merged commit 053491c into development Apr 30, 2026
@rubenvdlinde rubenvdlinde deleted the feature/impl-widget-add-edit-modal branch April 30, 2026 20:28
@github-actions

github-actions Bot commented Apr 30, 2026

Copy link
Copy Markdown
Contributor

Quality Report — ConductionNL/mydash @ 53bfd22

Check PHP Vue Security License Tests
lint ❌
phpcs ❌
phpmd ❌
psalm ❌
phpstan ❌
phpmetrics ❌
eslint ❌
stylelint ✅
composer ❌ ❌
npm ❌ ❌
PHPUnit ❌
Newman ❌
Playwright ❌

Quality workflow — 2026-04-30 20:29 UTC

Download the full PDF report from the workflow artifacts.

@github-actions

github-actions Bot commented Apr 30, 2026

Copy link
Copy Markdown
Contributor

Quality Report — ConductionNL/mydash @ da3c98b

Check PHP Vue Security License Tests
lint ✅
phpcs ❌
phpmd ✅
psalm ✅
phpstan ✅
phpmetrics ✅
eslint ✅
stylelint ✅
composer ✅ ✅ 103/103
npm ✅ ✅ 342/342
PHPUnit ⏭️
Newman ⏭️
Playwright ⏭️

Quality workflow — 2026-04-30 20:31 UTC

Download the full PDF report from the workflow artifacts.

@rubenvdlinde rubenvdlinde mentioned this pull request Apr 30, 2026
Merged
7 tasks
rubenvdlinde added a commit that referenced this pull request Apr 30, 2026
@rubenvdlinde
chore(frontend): swap remaining @nextcloud/vue imports to @conduction…
d9737be 
…/nextcloud-vue (ADR-004) (#71)

Two stragglers added by widget-add-edit-modal (#65/#68 runtime-shell) and
widget-context-menu (#60) before ADR-004 landed via #34. Swap is mechanical:
NcButton + NcEmptyContent are already exported by @conduction/nextcloud-vue
and used elsewhere in the codebase (TileCard, WidgetRenderer, AdminSettings).
This was referenced May 1, 2026
Closed
Merged
rubenvdlinde added a commit that referenced this pull request May 3, 2026
@rubenvdlinde
feat(widgets): unified Add/Edit modal + form contract per REQ-WDG-010…
c4bc332 
…..014 (#65)

- src/utils/widgetForm.js: resetForm, loadEditingWidget, assembleContent helpers
- src/components/Widgets/AddWidgetModal.vue: unified modal host for create+edit flows;
  dynamic <component :is> sub-form from widgetRegistry; per-type validate() gate;
  three close triggers (cancel, backdrop click, Esc); type-switch resets state
- src/views/Views.vue: mount AddWidgetModal; openWidgetEditModal routes content-type
  placements to the modal, style-only placements fall through to WidgetStyleEditor;
  widget-edit from DashboardGrid/context-menu wired to openWidgetEditModal
- src/__tests__/AddWidgetModal.test.js: 12 Vitest scenarios covering create/edit mode,
  type-switch leakage, submit field filtering, validation gating, close triggers
rubenvdlinde added a commit that referenced this pull request May 3, 2026
@rubenvdlinde
chore(frontend): swap remaining @nextcloud/vue imports to @conduction…
240ea07 
…/nextcloud-vue (ADR-004) (#71)

Two stragglers added by widget-add-edit-modal (#65/#68 runtime-shell) and
widget-context-menu (#60) before ADR-004 landed via #34. Swap is mechanical:
NcButton + NcEmptyContent are already exported by @conduction/nextcloud-vue
and used elsewhere in the codebase (TileCard, WidgetRenderer, AdminSettings).
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

No reviews

Assignees

No one assigned

Labels

ready-for-code-review Build complete — awaiting code reviewer

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@rubenvdlinde