feat: manage canvases with custom name and icon

Make designs (canvases) fully user-manageable: create with a chosen name
and icon, rename, change icon, and delete. Replaces the hardcoded
"New Electrical Design" button with a generic "New Canvas" flow.

- Add Design.icon column + migration that backfills legacy rows
  (electrical -> zap, others -> dashboard)
- DesignModal: name input + curated lucide icon picker (create + edit)
- Sidebar switcher gains per-canvas edit/delete; delete guards the last
  canvas and confirms
- designStore: addDesign/updateDesign/removeDesign with active reassignment
- Fix data loss on design switch: abort load when the save fails and keep
  unsaved edits; skip the save-old step when the previous canvas was deleted
- designsApi create/update carry icon; design_type kept for back-compat

Tests: backend design CRUD (icon + cascade + last-canvas guard), designStore
actions, designIcons resolver, DesignModal create/edit/validation.

ha-relevant: yes
This commit is contained in:
Pouzor
2026-06-02 15:47:57 +02:00
parent eb7b0c6d38
commit 12d527aad6
15 changed files with 693 additions and 42 deletions
@@ -0,0 +1,27 @@
import { describe, it, expect } from 'vitest'
import { DESIGN_ICONS, DEFAULT_DESIGN_ICON, resolveDesignIcon } from '@/utils/designIcons'
describe('designIcons', () => {
it('exposes a non-empty, unique-keyed icon set', () => {
expect(DESIGN_ICONS.length).toBeGreaterThan(0)
const keys = DESIGN_ICONS.map((e) => e.key)
expect(new Set(keys).size).toBe(keys.length)
})
it('default icon key is part of the set', () => {
expect(DESIGN_ICONS.some((e) => e.key === DEFAULT_DESIGN_ICON)).toBe(true)
})
it('resolveDesignIcon returns the matching component for a known key', () => {
const entry = DESIGN_ICONS.find((e) => e.key === 'zap')!
expect(resolveDesignIcon('zap')).toBe(entry.icon)
})
it('resolveDesignIcon falls back to a component for unknown/empty keys', () => {
const fallback = resolveDesignIcon(undefined)
expect(typeof fallback).toBe('object')
expect(resolveDesignIcon('does-not-exist')).toBe(fallback)
expect(resolveDesignIcon(null)).toBe(fallback)
expect(resolveDesignIcon('')).toBe(fallback)
})
})