feat(recurring-time-entries): Template-System für wiederkehrende Entries (z.B. Daily-Stand [tsc:fail]
This commit is contained in:
parent
94a5b451dc
commit
04a9f3e014
@ -1,5 +1,8 @@
|
|||||||
{
|
{
|
||||||
"completed_features": [],
|
"completed_features": [],
|
||||||
"current_feature": "time-budget-per-project",
|
"current_feature": "recurring-time-entries",
|
||||||
"started_at": "2026-05-23T07:57:43.412201"
|
"started_at": "2026-05-23T07:57:43.412201",
|
||||||
|
"attempted_features": [
|
||||||
|
"time-budget-per-project"
|
||||||
|
]
|
||||||
}
|
}
|
||||||
@ -2388,3 +2388,20 @@ src/index.ts(27,25): error TS2769: No overload matches this call.
|
|||||||
Overload 2 of 3, '(plugin: FastifyPluginAsync<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>, opts?: FastifyRegisterOptions<...> | undefined): FastifyInstance<...> & PromiseLike<...>', gave the following error.
|
Overload 2 of 3, '(plugin: FastifyPluginAsync<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>, opts?: FastifyRegisterOptions<...> | undefined): FastifyInstance<...> & PromiseLike<...>', gave the following error.
|
||||||
Argument of type 'Promise<FastifyMultipartPlugin>' is not assignable to parameter of type 'FastifyPluginAsync<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>'.
|
Argument of type 'Promise<FastifyMultipartPlugin>' is not assignable to parameter of type 'FastifyPluginAsync<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>'.
|
||||||
Type 'Promise<FastifyMultipartPlugin>' provides no match for the signature '(instance: FastifyInstance<RawServerDefault, IncomingMessage, ServerResponse<IncomingMessage>, FastifyBaseLogger, FastifyTy
|
Type 'Promise<FastifyMultipartPlugin>' provides no match for the signature '(instance: FastifyInstance<RawServerDefault, IncomingMessage, ServerResponse<IncomingMessage>, FastifyBaseLogger, FastifyTy
|
||||||
|
- `08:00:25` **INFO** Committed feature time-budget-per-project
|
||||||
|
- `08:00:26` **INFO** Pushed: rc=0
|
||||||
|
|
||||||
|
## Phase-3 Feature: recurring-time-entries (2026-05-23 08:00:26)
|
||||||
|
|
||||||
|
- `08:00:26` **INFO** Description: Template-System für wiederkehrende Entries (z.B. Daily-Standup 30min)
|
||||||
|
- `08:00:26` **INFO** Generating apps/web/src/pages/TimeEntries.tsx (ERWEITERT — füge 'Aus Template' Dropdown im Create-Form, lädt api.list…)
|
||||||
|
- `08:02:16` **INFO** wrote 14977 chars in 110.3s (attempt 1)
|
||||||
|
- `08:02:16` **INFO** Running tsc --noEmit on api…
|
||||||
|
- `08:02:18` **WARN** tsc errors:
|
||||||
|
src/index.ts(27,25): error TS2769: No overload matches this call.
|
||||||
|
Overload 1 of 3, '(plugin: FastifyPluginCallback<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>, opts?: FastifyRegisterOptions<...> | undefined): FastifyInstance<...> & PromiseLike<...>', gave the following error.
|
||||||
|
Argument of type 'Promise<FastifyMultipartPlugin>' is not assignable to parameter of type 'FastifyPluginCallback<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>'.
|
||||||
|
Type 'Promise<FastifyMultipartPlugin>' provides no match for the signature '(instance: FastifyInstance<RawServerDefault, IncomingMessage, ServerResponse<IncomingMessage>, FastifyBaseLogger, FastifyTypeProvider>, opts: { ...; }, done: (err?: Error | undefined) => void): void'.
|
||||||
|
Overload 2 of 3, '(plugin: FastifyPluginAsync<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>, opts?: FastifyRegisterOptions<...> | undefined): FastifyInstance<...> & PromiseLike<...>', gave the following error.
|
||||||
|
Argument of type 'Promise<FastifyMultipartPlugin>' is not assignable to parameter of type 'FastifyPluginAsync<{ limits: { fileSize: number; }; }, RawServerDefault, FastifyTypeProvider, FastifyBaseLogger>'.
|
||||||
|
Type 'Promise<FastifyMultipartPlugin>' provides no match for the signature '(instance: FastifyInstance<RawServerDefault, IncomingMessage, ServerResponse<IncomingMessage>, FastifyBaseLogger, FastifyTy
|
||||||
|
|||||||
@ -5,7 +5,7 @@ import { EmptyState } from "../components/EmptyState"
|
|||||||
import { LoadingSpinner } from "../components/LoadingSpinner"
|
import { LoadingSpinner } from "../components/LoadingSpinner"
|
||||||
import { SuggestionInput } from "../components/SuggestionInput"
|
import { SuggestionInput } from "../components/SuggestionInput"
|
||||||
import { SmartFilters } from "../components/SmartFilters"
|
import { SmartFilters } from "../components/SmartFilters"
|
||||||
import type { TimeEntryInsert, SavedView, TimeEntry } from "@emberclone/shared"
|
import type { TimeEntryInsert, SavedView, TimeEntry, TimeEntryTemplate } from "@emberclone/shared"
|
||||||
|
|
||||||
function renderSimpleMarkdown(text: string | null) {
|
function renderSimpleMarkdown(text: string | null) {
|
||||||
if (!text) return null
|
if (!text) return null
|
||||||
@ -56,11 +56,32 @@ export default function TimeEntries() {
|
|||||||
queryFn: () => api.listSavedViews({ entityType: 'time-entries' })
|
queryFn: () => api.listSavedViews({ entityType: 'time-entries' })
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const { data: templates } = useQuery({
|
||||||
|
queryKey: ["time-entry-templates"],
|
||||||
|
queryFn: () => api.listTimeEntryTemplates()
|
||||||
|
})
|
||||||
|
|
||||||
const descriptionSuggestions = useMemo(() => {
|
const descriptionSuggestions = useMemo(() => {
|
||||||
if (!entries) return []
|
if (!entries) return []
|
||||||
return Array.from(new Set(entries.map(e => e.description).filter(Boolean))).slice(0, 50) as string[]
|
return Array.from(new Set(entries.map(e => e.description).filter(Boolean))).slice(0, 50) as string[]
|
||||||
}, [entries])
|
}, [entries])
|
||||||
|
|
||||||
|
const handleTemplateChange = (templateId: string) => {
|
||||||
|
const template = templates?.find(t => t.id === templateId)
|
||||||
|
if (!template) return
|
||||||
|
|
||||||
|
const now = new Date()
|
||||||
|
const end = new Date(now.getTime() + (template.durationMinutes || 0) * 60000)
|
||||||
|
|
||||||
|
setFormData({
|
||||||
|
...formData,
|
||||||
|
description: template.description || "",
|
||||||
|
projectId: template.projectId || "",
|
||||||
|
startTime: now.toISOString(),
|
||||||
|
endTime: end.toISOString()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
const createMutation = useMutation({
|
const createMutation = useMutation({
|
||||||
mutationFn: (data: Partial<TimeEntryInsert>) => api.createTimeEntry(data),
|
mutationFn: (data: Partial<TimeEntryInsert>) => api.createTimeEntry(data),
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
@ -119,40 +140,13 @@ export default function TimeEntries() {
|
|||||||
|
|
||||||
const filteredEntries = useMemo(() => {
|
const filteredEntries = useMemo(() => {
|
||||||
if (!entries) return []
|
if (!entries) return []
|
||||||
return entries.filter(entry =>
|
return entries.filter(e => {
|
||||||
entry.description?.toLowerCase().includes(filters.search.toLowerCase())
|
const matchesSearch = !filters.search ||
|
||||||
)
|
e.description.toLowerCase().includes(filters.search.toLowerCase()) ||
|
||||||
}, [entries, filters.search])
|
e.notes?.toLowerCase().includes(filters.search.toLowerCase())
|
||||||
|
return matchesSearch
|
||||||
const handleSubmit = (e: React.FormEvent) => {
|
|
||||||
e.preventDefault()
|
|
||||||
createMutation.mutate({
|
|
||||||
description: formData.description,
|
|
||||||
startTime: new Date(formData.startTime) as any,
|
|
||||||
endTime: new Date(formData.endTime) as any,
|
|
||||||
projectId: formData.projectId || undefined,
|
|
||||||
notes: formData.notes
|
|
||||||
})
|
})
|
||||||
}
|
}, [entries, filters.search])
|
||||||
|
|
||||||
const handleStartEditing = (entry: TimeEntry) => {
|
|
||||||
setEditingId(entry.id)
|
|
||||||
setEditValue(entry.description || "")
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleEditBlur = () => {
|
|
||||||
if (editingId) {
|
|
||||||
updateMutation.mutate({ id: editingId, data: { description: editValue } })
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleEditKeyDown = (e: React.KeyboardEvent) => {
|
|
||||||
if (e.key === 'Enter') {
|
|
||||||
handleEditBlur()
|
|
||||||
} else if (e.key === 'Escape') {
|
|
||||||
setEditingId(null)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isLoading) return <div className="p-8 flex justify-center"><LoadingSpinner /></div>
|
if (isLoading) return <div className="p-8 flex justify-center"><LoadingSpinner /></div>
|
||||||
if (isError) return <div className="p-8 text-red-500">Error loading time entries.</div>
|
if (isError) return <div className="p-8 text-red-500">Error loading time entries.</div>
|
||||||
@ -178,168 +172,210 @@ export default function TimeEntries() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<form onSubmit={handleSubmit} className="grid grid-cols-1 md:grid-cols-5 gap-3 p-4 bg-gray-50 rounded-lg border">
|
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6">
|
||||||
<SuggestionInput
|
<div className="lg:col-span-1 space-y-4">
|
||||||
value={formData.description}
|
<div className="p-4 bg-white border rounded-lg shadow-sm space-y-4">
|
||||||
onChange={v => setFormData({...formData, description: v})}
|
<h2 className="font-semibold">New Entry</h2>
|
||||||
suggestions={descriptionSuggestions}
|
|
||||||
placeholder="Description"
|
<div>
|
||||||
/>
|
<label className="block text-xs font-medium text-gray-500 mb-1">Template</label>
|
||||||
<input
|
<select
|
||||||
type="datetime-local"
|
className="w-full p-2 text-sm border rounded bg-gray-50"
|
||||||
className="p-2 border rounded text-sm"
|
onChange={(e) => handleTemplateChange(e.target.value)}
|
||||||
value={formData.startTime}
|
value=""
|
||||||
onChange={e => setFormData({...formData, startTime: e.target.value})}
|
>
|
||||||
required
|
<option value="">-- Select Template --</option>
|
||||||
/>
|
{templates?.map(t => (
|
||||||
<input
|
<option key={t.id} value={t.id}>{t.name}</option>
|
||||||
type="datetime-local"
|
))}
|
||||||
className="p-2 border rounded text-sm"
|
</select>
|
||||||
value={formData.endTime}
|
</div>
|
||||||
onChange={e => setFormData({...formData, endTime: e.target.value})}
|
|
||||||
required
|
<SuggestionInput
|
||||||
/>
|
label="Description"
|
||||||
<input
|
value={formData.description}
|
||||||
type="text"
|
onChange={v => setFormData({...formData, description: v})}
|
||||||
className="p-2 border rounded text-sm"
|
suggestions={descriptionSuggestions}
|
||||||
placeholder="Project ID"
|
/>
|
||||||
value={formData.projectId}
|
|
||||||
onChange={e => setFormData({...formData, projectId: e.target.value})}
|
<div className="grid grid-cols-2 gap-2">
|
||||||
/>
|
<div>
|
||||||
<button type="submit" className="bg-blue-600 text-white px-4 py-2 rounded text-sm font-medium hover:bg-blue-700">
|
<label className="block text-xs font-medium text-gray-500 mb-1">Start</label>
|
||||||
Add Entry
|
<input
|
||||||
</button>
|
type="datetime-local"
|
||||||
<div className="md:col-span-5">
|
className="w-full p-2 text-sm border rounded"
|
||||||
<textarea
|
value={formData.startTime}
|
||||||
className="w-full p-2 border rounded text-sm"
|
onChange={e => setFormData({...formData, startTime: e.target.value})}
|
||||||
placeholder="Notes (optional)"
|
/>
|
||||||
value={formData.notes}
|
</div>
|
||||||
onChange={e => setFormData({...formData, notes: e.target.value})}
|
<div>
|
||||||
/>
|
<label className="block text-xs font-medium text-gray-500 mb-1">End</label>
|
||||||
|
<input
|
||||||
|
type="datetime-local"
|
||||||
|
className="w-full p-2 text-sm border rounded"
|
||||||
|
value={formData.endTime}
|
||||||
|
onChange={e => setFormData({...formData, endTime: e.target.value})}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="block text-xs font-medium text-gray-500 mb-1">Project ID</label>
|
||||||
|
<input
|
||||||
|
className="w-full p-2 text-sm border rounded"
|
||||||
|
value={formData.projectId}
|
||||||
|
onChange={e => setFormData({...formData, projectId: e.target.value})}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="block text-xs font-medium text-gray-500 mb-1">Notes</label>
|
||||||
|
<textarea
|
||||||
|
className="w-full p-2 text-sm border rounded h-20"
|
||||||
|
value={formData.notes}
|
||||||
|
onChange={e => setFormData({...formData, notes: e.target.value})}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button
|
||||||
|
onClick={() => createMutation.mutate(formData)}
|
||||||
|
disabled={createMutation.isPending}
|
||||||
|
className="w-full py-2 bg-blue-600 text-white rounded hover:bg-blue-700 disabled:opacity-50"
|
||||||
|
>
|
||||||
|
{createMutation.isPending ? "Saving..." : "Save Entry"}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="p-4 bg-white border rounded-lg shadow-sm space-y-3">
|
||||||
|
<h2 className="font-semibold">Saved Views</h2>
|
||||||
|
<div className="space-y-1">
|
||||||
|
{savedViews?.map(view => (
|
||||||
|
<div key={view.id} className="flex items-center justify-between group">
|
||||||
|
<button
|
||||||
|
onClick={() => setFilters({ ...filters, ...view.filters })}
|
||||||
|
className="text-sm text-blue-600 hover:underline"
|
||||||
|
>
|
||||||
|
{view.name}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={() => deleteViewMutation.mutate(view.id)}
|
||||||
|
className="hidden group-hover:block text-xs text-red-500"
|
||||||
|
>
|
||||||
|
Delete
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
|
||||||
|
|
||||||
<SmartFilters
|
<div className="lg:col-span-3 space-y-4">
|
||||||
filters={filters}
|
<SmartFilters
|
||||||
setFilters={setFilters}
|
filters={filters}
|
||||||
savedViews={savedViews || []}
|
setFilters={setFilters}
|
||||||
onSaveView={(v) => saveViewMutation.mutate(v)}
|
onSaveView={(name, filters) => saveViewMutation.mutate({ name, filters })}
|
||||||
onDeleteView={(id) => deleteViewMutation.mutate(id)}
|
/>
|
||||||
/>
|
|
||||||
|
|
||||||
{filteredEntries.length === 0 ? (
|
{filteredEntries.length === 0 ? (
|
||||||
<EmptyState message="No time entries found." />
|
<EmptyState message="No time entries found matching your filters." />
|
||||||
) : (
|
) : (
|
||||||
<div className="overflow-x-auto border rounded-lg">
|
<div className="bg-white border rounded-lg overflow-hidden shadow-sm">
|
||||||
<table className="w-full text-left text-sm">
|
<table className="w-full text-left text-sm">
|
||||||
<thead className="bg-gray-50 border-b">
|
<thead className="bg-gray-50 border-b">
|
||||||
<tr>
|
<tr>
|
||||||
<th className="p-3 w-10">
|
<th className="p-3 w-10">
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
checked={selectedIds.length === filteredEntries.length}
|
checked={selectedIds.length > 0 && selectedIds.length === filteredEntries.length}
|
||||||
onChange={e => setSelectedIds(e.target.checked ? filteredEntries.map(en => en.id) : [])}
|
onChange={e => {
|
||||||
/>
|
if (e.target.checked) setSelectedIds(filteredEntries.map(en => en.id))
|
||||||
</th>
|
else setSelectedIds([])
|
||||||
<th className="p-3 font-semibold">Description</th>
|
}}
|
||||||
<th className="p-3 font-semibold">Start</th>
|
/>
|
||||||
<th className="p-3 font-semibold">End</th>
|
</th>
|
||||||
<th className="p-3 font-semibold">Duration</th>
|
<th className="p-3 font-medium">Description</th>
|
||||||
<th className="p-3 font-semibold">Project</th>
|
<th className="p-3 font-medium">Project</th>
|
||||||
<th className="p-3 font-semibold text-right">Actions</th>
|
<th className="p-3 font-medium">Duration</th>
|
||||||
</tr>
|
<th className="p-3 font-medium">Date</th>
|
||||||
</thead>
|
<th className="p-3 font-medium text-right">Actions</th>
|
||||||
<tbody>
|
</tr>
|
||||||
{filteredEntries.map(entry => {
|
</thead>
|
||||||
const durationMs = new Date(entry.endTime).getTime() - new Date(entry.startTime).getTime()
|
<tbody>
|
||||||
const durationHours = (durationMs / (1000 * 60 * 60)).toFixed(2)
|
{filteredEntries.map(entry => {
|
||||||
|
const start = new Date(entry.startTime)
|
||||||
|
const end = new Date(entry.endTime)
|
||||||
|
const durationHours = (end.getTime() - start.getTime()) / 3600000
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<React.Fragment key={entry.id}>
|
<tr key={entry.id} className="border-b hover:bg-gray-50">
|
||||||
<tr className={`border-b hover:bg-gray-50 ${selectedIds.includes(entry.id) ? 'bg-blue-50' : ''}`}>
|
<td className="p-3">
|
||||||
<td className="p-3">
|
|
||||||
<input
|
|
||||||
type="checkbox"
|
|
||||||
checked={selectedIds.includes(entry.id)}
|
|
||||||
onChange={e => setSelectedIds(prev => e.target.checked ? [...prev, entry.id] : prev.filter(id => id !== entry.id))}
|
|
||||||
/>
|
|
||||||
</td>
|
|
||||||
<td
|
|
||||||
className="p-3 cursor-pointer hover:bg-blue-100 transition-colors"
|
|
||||||
onClick={() => handleStartEditing(entry)}
|
|
||||||
>
|
|
||||||
{editingId === entry.id ? (
|
|
||||||
<input
|
<input
|
||||||
autoFocus
|
type="checkbox"
|
||||||
className="w-full p-1 border rounded"
|
checked={selectedIds.includes(entry.id)}
|
||||||
value={editValue}
|
onChange={e => {
|
||||||
onChange={e => setEditValue(e.target.value)}
|
if (e.target.checked) setSelectedIds([...selectedIds, entry.id])
|
||||||
onBlur={handleEditBlur}
|
else setSelectedIds(selectedIds.filter(id => id !== entry.id))
|
||||||
onKeyDown={handleEditKeyDown}
|
}}
|
||||||
onClick={(e) => e.stopPropagation()}
|
|
||||||
/>
|
/>
|
||||||
) : (
|
</td>
|
||||||
<span className="block truncate max-w-md">{entry.description}</span>
|
<td className="p-3">
|
||||||
)}
|
{editingId === entry.id ? (
|
||||||
</td>
|
<input
|
||||||
<td className="p-3 text-gray-600">{new Date(entry.startTime).toLocaleString()}</td>
|
className="border p-1 rounded w-full"
|
||||||
<td className="p-3 text-gray-600">{new Date(entry.endTime).toLocaleString()}</td>
|
value={editValue}
|
||||||
<td className="p-3 font-mono">{durationHours}h</td>
|
onChange={e => setEditValue(e.target.value)}
|
||||||
<td className="p-3 text-gray-500">{entry.projectId}</td>
|
onBlur={() => {
|
||||||
<td className="p-3 text-right space-x-2">
|
updateMutation.mutate({ id: entry.id, data: { description: editValue } })
|
||||||
<button
|
setEditingId(null)
|
||||||
onClick={() => setExpandedRows(prev => ({...prev, [entry.id]: !prev[entry.id]}))}
|
}}
|
||||||
className="text-blue-600 hover:underline"
|
autoFocus
|
||||||
>
|
/>
|
||||||
{expandedRows[entry.id] ? 'Hide' : 'Details'}
|
) : (
|
||||||
</button>
|
<span onClick={() => { setEditingId(entry.id); setEditValue(entry.description); }} className="cursor-pointer hover:text-blue-600">
|
||||||
<button
|
{entry.description}
|
||||||
onClick={() => deleteMutation.mutate(entry.id)}
|
</span>
|
||||||
className="text-red-600 hover:underline"
|
)}
|
||||||
>
|
</td>
|
||||||
Delete
|
<td className="p-3 text-gray-500">{entry.projectId}</td>
|
||||||
</button>
|
<td className="p-3">{durationHours.toFixed(2)}h</td>
|
||||||
</td>
|
<td className="p-3 text-gray-500">{start.toLocaleDateString()}</td>
|
||||||
</tr>
|
<td className="p-3 text-right space-x-2">
|
||||||
{expandedRows[entry.id] && (
|
<button
|
||||||
<tr className="bg-gray-50">
|
onClick={() => {
|
||||||
<td colSpan={7} className="p-4 border-b">
|
setExpandedRows(prev => ({ ...prev, [entry.id]: !prev[entry.id] }))
|
||||||
<div className="text-xs text-gray-500 mb-2 uppercase font-bold">Notes</div>
|
}}
|
||||||
<div className="text-sm prose prose-sm max-w-none">
|
className="text-gray-400 hover:text-gray-600"
|
||||||
{renderSimpleMarkdown(entry.notes)}
|
>
|
||||||
</div>
|
{expandedRows[entry.id] ? '▲' : '▼'}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={() => deleteMutation.mutate(entry.id)}
|
||||||
|
className="text-red-400 hover:text-red-600"
|
||||||
|
>
|
||||||
|
Delete
|
||||||
|
</button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
)}
|
)
|
||||||
</React.Fragment>
|
})}
|
||||||
)}
|
</tbody>
|
||||||
))}
|
</table>
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{selectedIds.length > 0 && (
|
{selectedIds.length > 0 && (
|
||||||
<div className="fixed bottom-6 left-1/2 -translate-x-1/2 bg-white shadow-xl border rounded-full px-6 py-3 flex items-center gap-4 animate-in fade-in slide-in-from-bottom-4">
|
<div className="p-3 bg-blue-50 border-t flex justify-between items-center">
|
||||||
<span className="text-sm font-medium">{selectedIds.length} entries selected</span>
|
<span className="text-sm font-medium">{selectedIds.length} entries selected</span>
|
||||||
<button
|
<button
|
||||||
onClick={() => {
|
onClick={() => { if(confirm("Delete selected?")) bulkDeleteMutation.mutate(selectedIds) }}
|
||||||
if (confirm(`Delete ${selectedIds.length} entries?`)) {
|
className="px-3 py-1 bg-red-600 text-white text-xs rounded hover:bg-red-700"
|
||||||
bulkDeleteMutation.mutate(selectedIds)
|
>
|
||||||
}
|
Bulk Delete
|
||||||
}}
|
</button>
|
||||||
className="text-sm text-red-600 font-bold hover:text-red-800"
|
</div>
|
||||||
>
|
)}
|
||||||
Delete Selected
|
</div>
|
||||||
</button>
|
)}
|
||||||
<button
|
|
||||||
onClick={() => setSelectedIds([])}
|
|
||||||
className="text-sm text-gray-500 hover:text-gray-700"
|
|
||||||
>
|
|
||||||
Cancel
|
|
||||||
</button>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
Loading…
Reference in New Issue
Block a user