feat(07-02): add QuickAdd API client, hook, management page, routing, and i18n
- Added QuickAddItem interface and quickAdd namespace to api.ts - Created useQuickAdd hook with CRUD operations following useTemplate pattern - Created QuickAddPage with amber/orange gradient header, add form, inline edit, and EmptyState - Added /quick-add route to App.tsx with QuickAddPage import - Added Zap nav item to AppLayout sidebar after template - Added quickAdd i18n keys to en.json and de.json including picker keys
This commit is contained in:
40
frontend/src/hooks/useQuickAdd.ts
Normal file
40
frontend/src/hooks/useQuickAdd.ts
Normal file
@@ -0,0 +1,40 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
import { quickAdd as quickAddApi, type QuickAddItem } from '@/lib/api'
|
||||
|
||||
export function useQuickAdd() {
|
||||
const [items, setItems] = useState<QuickAddItem[]>([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
|
||||
const fetchItems = async () => {
|
||||
const data = await quickAddApi.list()
|
||||
setItems(data ?? [])
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const init = async () => {
|
||||
try {
|
||||
await fetchItems()
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
init()
|
||||
}, [])
|
||||
|
||||
const addItem = async (name: string, icon: string) => {
|
||||
await quickAddApi.create({ name, icon })
|
||||
await fetchItems()
|
||||
}
|
||||
|
||||
const updateItem = async (id: string, name: string, icon: string, sortOrder: number) => {
|
||||
await quickAddApi.update(id, { name, icon, sort_order: sortOrder })
|
||||
await fetchItems()
|
||||
}
|
||||
|
||||
const removeItem = async (id: string) => {
|
||||
await quickAddApi.delete(id)
|
||||
await fetchItems()
|
||||
}
|
||||
|
||||
return { items, loading, addItem, updateItem, removeItem }
|
||||
}
|
||||
Reference in New Issue
Block a user