feat: add Edit button to history items to modify changes

This commit is contained in:
Christian Vidal Wolf
2026-04-10 12:46:26 +02:00
parent be584600fc
commit 95eb6ab91b
2 changed files with 17 additions and 2 deletions
+1
View File
@@ -558,6 +558,7 @@ export default function App() {
headers={appState.headers}
data={appState.data}
sessionToken={session?.access_token}
onEdit={(index) => setEditingRowIndex(index)}
onRevert={async (articleNo, revertedData, historyId) => {
// Find the row in appState.data and update it
const rowIndex = appState.data.findIndex(r => String(r[COLUMNS.ARTICLE_NO]) === articleNo);
+16 -2
View File
@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react';
import { History, RotateCcw, ChevronDown, ChevronRight, User, Calendar, Tag, Search, X } from 'lucide-react';
import { History, RotateCcw, ChevronDown, ChevronRight, User, Calendar, Tag, Search, X, Edit2 } from 'lucide-react';
import { getHistory, deleteHistoryEntry, HistoryEntry } from '../lib/supabase';
import { ExcelRow, COLUMNS } from '../types';
import { cn } from '../lib/utils';
@@ -8,10 +8,11 @@ interface HistoryViewProps {
headers: string[];
data: ExcelRow[];
onRevert: (articleNo: string, oldData: ExcelRow, historyId?: number) => void;
onEdit?: (rowIndex: number) => void;
sessionToken?: string;
}
export function HistoryView({ headers, data, onRevert, sessionToken }: HistoryViewProps) {
export function HistoryView({ headers, data, onRevert, onEdit, sessionToken }: HistoryViewProps) {
const [history, setHistory] = useState<HistoryEntry[]>([]);
const [loading, setLoading] = useState(true);
const [expandedId, setExpandedId] = useState<string | null>(null);
@@ -175,6 +176,19 @@ export function HistoryView({ headers, data, onRevert, sessionToken }: HistoryVi
<span className="px-2.5 py-1 rounded-full bg-blue-500/10 text-blue-400 font-medium">
{changes.length} {changes.length === 1 ? 'change' : 'changes'}
</span>
<button
onClick={(e) => {
e.stopPropagation();
if (onEdit) {
const idx = data.findIndex(r => String(r[COLUMNS.ARTICLE_NO]) === entry.product_id);
if (idx !== -1) onEdit(idx);
}
}}
className="flex items-center gap-1.5 px-3 py-1.5 rounded-md bg-blue-500/10 text-blue-400 hover:bg-blue-500/20 transition-colors border border-blue-500/20"
>
<Edit2 className="w-4 h-4" />
Edit
</button>
<button
onClick={(e) => {
e.stopPropagation();