mirror of
https://github.com/christianvidalwolf-prog/Craze-Data-check.git
synced 2026-08-03 13:45:24 +02:00
feat: implement persistence system with visual highlighting and auto-reset on export
This commit is contained in:
@@ -0,0 +1,14 @@
|
|||||||
|
{
|
||||||
|
"permissions": {
|
||||||
|
"allow": [
|
||||||
|
"Bash(npm run *)",
|
||||||
|
"Bash(git checkout *)",
|
||||||
|
"Bash(git merge *)",
|
||||||
|
"Bash(npx *)",
|
||||||
|
"Bash(git commit *)",
|
||||||
|
"Bash(git show *)",
|
||||||
|
"Bash(diff *)"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"$version": 3
|
||||||
|
}
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
{
|
||||||
|
"permissions": {
|
||||||
|
"allow": [
|
||||||
|
"Bash(npm run *)"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
+27
-3
@@ -6,7 +6,7 @@ import { TopBar } from './components/TopBar';
|
|||||||
import { ProductDescriptions } from './components/ProductDescriptions';
|
import { ProductDescriptions } from './components/ProductDescriptions';
|
||||||
import { MatrixView } from './components/MatrixView';
|
import { MatrixView } from './components/MatrixView';
|
||||||
import { EditPanel } from './components/EditPanel';
|
import { EditPanel } from './components/EditPanel';
|
||||||
import { getAllSyncedRows, saveRowToSupabase } from './lib/supabase';
|
import { getAllSyncedRows, saveRowToSupabase, resetAllPendingRows } from './lib/supabase';
|
||||||
import { getStoredSession, signOut, type AuthSession } from './lib/auth';
|
import { getStoredSession, signOut, type AuthSession } from './lib/auth';
|
||||||
import { LoginPage } from './components/LoginPage';
|
import { LoginPage } from './components/LoginPage';
|
||||||
import { DimensionsView } from './components/DimensionsView';
|
import { DimensionsView } from './components/DimensionsView';
|
||||||
@@ -38,6 +38,7 @@ export default function App() {
|
|||||||
const [editingRowIndex, setEditingRowIndex] = useState<number | null>(null);
|
const [editingRowIndex, setEditingRowIndex] = useState<number | null>(null);
|
||||||
const [isLoadingDefault, setIsLoadingDefault] = useState(true);
|
const [isLoadingDefault, setIsLoadingDefault] = useState(true);
|
||||||
const [defaultLoadError, setDefaultLoadError] = useState<string | null>(null);
|
const [defaultLoadError, setDefaultLoadError] = useState<string | null>(null);
|
||||||
|
const [rowStatuses, setRowStatuses] = useState<Record<string, string>>({});
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const loadDefaultData = async () => {
|
const loadDefaultData = async () => {
|
||||||
@@ -78,7 +79,13 @@ export default function App() {
|
|||||||
|
|
||||||
const processedRows = rawRows.map(row => {
|
const processedRows = rawRows.map(row => {
|
||||||
const articleNo = String(row[articleNoIdx]);
|
const articleNo = String(row[articleNoIdx]);
|
||||||
const finalRow = syncedData[articleNo] || row;
|
const synced = syncedData[articleNo];
|
||||||
|
const finalRow = synced ? synced.data : row;
|
||||||
|
|
||||||
|
// Sync status_check
|
||||||
|
if (synced && synced.status === 'pending') {
|
||||||
|
setRowStatuses(prev => ({ ...prev, [articleNo]: 'pending' }));
|
||||||
|
}
|
||||||
|
|
||||||
// Format numeric/price fields to 2 decimal places
|
// Format numeric/price fields to 2 decimal places
|
||||||
return finalRow.map((val, idx) => {
|
return finalRow.map((val, idx) => {
|
||||||
@@ -219,6 +226,15 @@ export default function App() {
|
|||||||
const dateStr = new Date().toISOString().split('T')[0];
|
const dateStr = new Date().toISOString().split('T')[0];
|
||||||
XLSX.writeFile(wb, `CRAZE_Products_Updated_${dateStr}.xlsx`);
|
XLSX.writeFile(wb, `CRAZE_Products_Updated_${dateStr}.xlsx`);
|
||||||
|
|
||||||
|
// 3. Post-export: Reset pending statuses in Supabase
|
||||||
|
console.log('Resetting pending statuses in Supabase...');
|
||||||
|
resetAllPendingRows().then(success => {
|
||||||
|
if (success) {
|
||||||
|
console.log('Successfully reset all pending statuses');
|
||||||
|
setRowStatuses({}); // Clear local statuses
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
setAppState(prev => ({ ...prev, hasUnsavedChanges: false }));
|
setAppState(prev => ({ ...prev, hasUnsavedChanges: false }));
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -238,6 +254,10 @@ export default function App() {
|
|||||||
// 2. Persist to Supabase
|
// 2. Persist to Supabase
|
||||||
const articleNo = String(updatedRow[COLUMNS.ARTICLE_NO]);
|
const articleNo = String(updatedRow[COLUMNS.ARTICLE_NO]);
|
||||||
console.log(`Saving article ${articleNo} to Supabase...`);
|
console.log(`Saving article ${articleNo} to Supabase...`);
|
||||||
|
|
||||||
|
// Update local status to pending
|
||||||
|
setRowStatuses(prev => ({ ...prev, [articleNo]: 'pending' }));
|
||||||
|
|
||||||
const success = await saveRowToSupabase(articleNo, updatedRow);
|
const success = await saveRowToSupabase(articleNo, updatedRow);
|
||||||
|
|
||||||
if (success) {
|
if (success) {
|
||||||
@@ -349,10 +369,11 @@ export default function App() {
|
|||||||
<ProductDescriptions
|
<ProductDescriptions
|
||||||
data={appState.data}
|
data={appState.data}
|
||||||
onEdit={(index) => setEditingRowIndex(index)}
|
onEdit={(index) => setEditingRowIndex(index)}
|
||||||
|
rowStatuses={rowStatuses}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{activeModule === 'matrix' && (
|
{activeModule === 'matrix' && (
|
||||||
<MatrixView data={appState.data} headers={appState.headers} />
|
<MatrixView data={appState.data} headers={appState.headers} rowStatuses={rowStatuses} />
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{activeModule === 'dimensions' && (
|
{activeModule === 'dimensions' && (
|
||||||
@@ -362,6 +383,7 @@ export default function App() {
|
|||||||
onEdit={(index) => setEditingRowIndex(index)}
|
onEdit={(index) => setEditingRowIndex(index)}
|
||||||
onSaveRow={handleSaveRow}
|
onSaveRow={handleSaveRow}
|
||||||
onCaptureState={captureState}
|
onCaptureState={captureState}
|
||||||
|
rowStatuses={rowStatuses}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
@@ -372,12 +394,14 @@ export default function App() {
|
|||||||
onSaveRow={handleSaveRow}
|
onSaveRow={handleSaveRow}
|
||||||
onCaptureState={captureState}
|
onCaptureState={captureState}
|
||||||
onEdit={(index) => setEditingRowIndex(index)}
|
onEdit={(index) => setEditingRowIndex(index)}
|
||||||
|
rowStatuses={rowStatuses}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{activeModule === 'article_details' && (
|
{activeModule === 'article_details' && (
|
||||||
<ArticleDetails
|
<ArticleDetails
|
||||||
data={appState.data}
|
data={appState.data}
|
||||||
onEdit={(index) => setEditingRowIndex(index)}
|
onEdit={(index) => setEditingRowIndex(index)}
|
||||||
|
rowStatuses={rowStatuses}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -7,11 +7,12 @@ import { ColumnFilterPopover } from './ColumnFilterPopover';
|
|||||||
interface ArticleDetailsProps {
|
interface ArticleDetailsProps {
|
||||||
data: ExcelRow[];
|
data: ExcelRow[];
|
||||||
onEdit: (index: number) => void;
|
onEdit: (index: number) => void;
|
||||||
|
rowStatuses: Record<string, string>;
|
||||||
}
|
}
|
||||||
|
|
||||||
type TabType = 'all' | 'missingDetailsDE' | 'missingDetailsEN' | 'missingAnyDetails' | 'lowStock';
|
type TabType = 'all' | 'missingDetailsDE' | 'missingDetailsEN' | 'missingAnyDetails' | 'lowStock';
|
||||||
|
|
||||||
export function ArticleDetails({ data, onEdit }: ArticleDetailsProps) {
|
export function ArticleDetails({ data, onEdit, rowStatuses }: ArticleDetailsProps) {
|
||||||
const [activeTab, setActiveTab] = useState<TabType>('all');
|
const [activeTab, setActiveTab] = useState<TabType>('all');
|
||||||
const [search, setSearch] = useState('');
|
const [search, setSearch] = useState('');
|
||||||
const [lineFilter, setLineFilter] = useState('');
|
const [lineFilter, setLineFilter] = useState('');
|
||||||
@@ -243,8 +244,16 @@ export function ArticleDetails({ data, onEdit }: ArticleDetailsProps) {
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody className="divide-y divide-slate-700/30">
|
<tbody className="divide-y divide-slate-700/30">
|
||||||
{paginatedData.map(({ row, index }) => (
|
{paginatedData.map(({ row, index }) => {
|
||||||
<tr key={index} className="hover:bg-slate-700/20 transition-colors">
|
const isPending = rowStatuses[String(row[COLUMNS.ARTICLE_NO])] === 'pending';
|
||||||
|
return (
|
||||||
|
<tr
|
||||||
|
key={index}
|
||||||
|
className={cn(
|
||||||
|
"hover:bg-slate-700/20 transition-colors",
|
||||||
|
isPending ? "bg-yellow-400/20 border-l-4 border-l-yellow-400" : ""
|
||||||
|
)}
|
||||||
|
>
|
||||||
<td className="px-3 py-2 font-mono text-indigo-400">{row[COLUMNS.ARTICLE_NO]}</td>
|
<td className="px-3 py-2 font-mono text-indigo-400">{row[COLUMNS.ARTICLE_NO]}</td>
|
||||||
<td className="px-3 py-2 font-medium text-slate-200 max-w-[150px] truncate" title={row[COLUMNS.ARTICLE_NAME]}>
|
<td className="px-3 py-2 font-medium text-slate-200 max-w-[150px] truncate" title={row[COLUMNS.ARTICLE_NAME]}>
|
||||||
{row[COLUMNS.ARTICLE_NAME]}
|
{row[COLUMNS.ARTICLE_NAME]}
|
||||||
@@ -284,7 +293,8 @@ export function ArticleDetails({ data, onEdit }: ArticleDetailsProps) {
|
|||||||
</button>
|
</button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
))}
|
);
|
||||||
|
})}
|
||||||
{paginatedData.length === 0 && (
|
{paginatedData.length === 0 && (
|
||||||
<tr>
|
<tr>
|
||||||
<td colSpan={7} className="px-4 py-8 text-center text-slate-500">
|
<td colSpan={7} className="px-4 py-8 text-center text-slate-500">
|
||||||
|
|||||||
@@ -11,6 +11,7 @@ interface DimensionsViewProps {
|
|||||||
onEdit: (index: number) => void;
|
onEdit: (index: number) => void;
|
||||||
onSaveRow: (index: number, updatedRow: ExcelRow) => void;
|
onSaveRow: (index: number, updatedRow: ExcelRow) => void;
|
||||||
onCaptureState: (message: string) => void;
|
onCaptureState: (message: string) => void;
|
||||||
|
rowStatuses: Record<string, string>;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface DimensionGroup {
|
interface DimensionGroup {
|
||||||
@@ -32,7 +33,7 @@ interface NearDuplicateCluster {
|
|||||||
maxDiffPct: number;
|
maxDiffPct: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function DimensionsView({ data, headers, onEdit, onSaveRow, onCaptureState }: DimensionsViewProps) {
|
export function DimensionsView({ data, headers, onEdit, onSaveRow, onCaptureState, rowStatuses }: DimensionsViewProps) {
|
||||||
const [expandedGroups, setExpandedGroups] = useState<Set<string>>(new Set());
|
const [expandedGroups, setExpandedGroups] = useState<Set<string>>(new Set());
|
||||||
const [expandedNearDuplicates, setExpandedNearDuplicates] = useState<Set<number>>(new Set());
|
const [expandedNearDuplicates, setExpandedNearDuplicates] = useState<Set<number>>(new Set());
|
||||||
const [showOnlyInconsistent, setShowOnlyInconsistent] = useState(true);
|
const [showOnlyInconsistent, setShowOnlyInconsistent] = useState(true);
|
||||||
@@ -584,8 +585,16 @@ export function DimensionsView({ data, headers, onEdit, onSaveRow, onCaptureStat
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody className="divide-y divide-slate-700/50">
|
<tbody className="divide-y divide-slate-700/50">
|
||||||
{group.rows.map(({ row, index }) => (
|
{group.rows.map(({ row, index }) => {
|
||||||
<tr key={index} className="hover:bg-slate-700/20 group transition-colors">
|
const isPending = rowStatuses[String(row[COLUMNS.ARTICLE_NO])] === 'pending';
|
||||||
|
return (
|
||||||
|
<tr
|
||||||
|
key={index}
|
||||||
|
className={cn(
|
||||||
|
"hover:bg-slate-700/20 group transition-colors",
|
||||||
|
isPending ? "bg-yellow-400/20 border-l-4 border-l-yellow-400" : ""
|
||||||
|
)}
|
||||||
|
>
|
||||||
<td className="px-4 py-3">
|
<td className="px-4 py-3">
|
||||||
<div className="font-medium text-slate-200">{row[COLUMNS.ARTICLE_NO]}</div>
|
<div className="font-medium text-slate-200">{row[COLUMNS.ARTICLE_NO]}</div>
|
||||||
<div className="text-[10px] text-slate-500 truncate max-w-[200px]">{row[COLUMNS.ARTICLE_NAME]}</div>
|
<div className="text-[10px] text-slate-500 truncate max-w-[200px]">{row[COLUMNS.ARTICLE_NAME]}</div>
|
||||||
@@ -661,7 +670,8 @@ export function DimensionsView({ data, headers, onEdit, onSaveRow, onCaptureStat
|
|||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
))}
|
);
|
||||||
|
})}
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -7,9 +7,10 @@ import { ColumnFilterPopover } from './ColumnFilterPopover';
|
|||||||
interface MatrixViewProps {
|
interface MatrixViewProps {
|
||||||
data: ExcelRow[];
|
data: ExcelRow[];
|
||||||
headers: string[];
|
headers: string[];
|
||||||
|
rowStatuses: Record<string, string>;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function MatrixView({ data, headers }: MatrixViewProps) {
|
export function MatrixView({ data, headers, rowStatuses }: MatrixViewProps) {
|
||||||
const [page, setPage] = useState(1);
|
const [page, setPage] = useState(1);
|
||||||
const [pageSize, setPageSize] = useState(25);
|
const [pageSize, setPageSize] = useState(25);
|
||||||
const [search, setSearch] = useState('');
|
const [search, setSearch] = useState('');
|
||||||
|
|||||||
@@ -23,6 +23,7 @@ interface PricingViewProps {
|
|||||||
onSaveRow: (index: number, updatedRow: ExcelRow) => void;
|
onSaveRow: (index: number, updatedRow: ExcelRow) => void;
|
||||||
onCaptureState: (message: string) => void;
|
onCaptureState: (message: string) => void;
|
||||||
onEdit: (index: number) => void;
|
onEdit: (index: number) => void;
|
||||||
|
rowStatuses: Record<string, string>;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface DetectedCol {
|
interface DetectedCol {
|
||||||
@@ -45,7 +46,7 @@ function findCol(headers: string[], ...keywords: string[]): number {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit }: PricingViewProps) {
|
export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit, rowStatuses }: PricingViewProps) {
|
||||||
const [filterMode, setFilterMode] = useState<FilterMode>('all_errors');
|
const [filterMode, setFilterMode] = useState<FilterMode>('all_errors');
|
||||||
const [search, setSearch] = useState('');
|
const [search, setSearch] = useState('');
|
||||||
const [editingCell, setEditingCell] = useState<EditingCell | null>(null);
|
const [editingCell, setEditingCell] = useState<EditingCell | null>(null);
|
||||||
@@ -454,16 +455,19 @@ export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit }
|
|||||||
<tbody>
|
<tbody>
|
||||||
{filteredRows.map(({ row, dataIndex, pricingErrors, unitErrors, isCritical }) => {
|
{filteredRows.map(({ row, dataIndex, pricingErrors, unitErrors, isCritical }) => {
|
||||||
const hasAnyError = pricingErrors.length > 0 || unitErrors.length > 0;
|
const hasAnyError = pricingErrors.length > 0 || unitErrors.length > 0;
|
||||||
|
const isPending = rowStatuses[String(row[COLUMNS.ARTICLE_NO])] === 'pending';
|
||||||
return (
|
return (
|
||||||
<tr
|
<tr
|
||||||
key={dataIndex}
|
key={dataIndex}
|
||||||
className={cn(
|
className={cn(
|
||||||
'border-b border-slate-700/50 transition-colors hover:bg-slate-700/20',
|
'border-b border-slate-700/50 transition-colors hover:bg-slate-700/20',
|
||||||
isCritical
|
isPending
|
||||||
? 'bg-red-950/20'
|
? 'bg-yellow-400/20 border-l-4 border-l-yellow-400'
|
||||||
: pricingErrors.length > 0
|
: isCritical
|
||||||
? 'bg-amber-950/10'
|
? 'bg-red-950/20'
|
||||||
: ''
|
: pricingErrors.length > 0
|
||||||
|
? 'bg-amber-950/10'
|
||||||
|
: ''
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{/* Article No */}
|
{/* Article No */}
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import React, { useState, useMemo, useCallback } from 'react';
|
import React, { useState, useMemo } from 'react';
|
||||||
import { ExcelRow, COLUMNS } from '../types';
|
import { ExcelRow, COLUMNS } from '../types';
|
||||||
import { Search, Filter, Edit2, ChevronDown, ChevronUp, X } from 'lucide-react';
|
import { Search, Filter, Edit2, ChevronDown, ChevronUp, X } from 'lucide-react';
|
||||||
import { cn } from '../lib/utils';
|
import { cn } from '../lib/utils';
|
||||||
@@ -7,7 +7,6 @@ import { ColumnFilterPopover } from './ColumnFilterPopover';
|
|||||||
interface ProductDescriptionsProps {
|
interface ProductDescriptionsProps {
|
||||||
data: ExcelRow[];
|
data: ExcelRow[];
|
||||||
onEdit: (index: number) => void;
|
onEdit: (index: number) => void;
|
||||||
rowStatuses: Record<string, string>;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
type TabType = 'all' | 'missingLongDE' | 'missingLongEN' | 'missingLongAny' | 'missingShortDE' | 'missingShortEN' | 'missingShortAny' | 'complete' | 'incomplete';
|
type TabType = 'all' | 'missingLongDE' | 'missingLongEN' | 'missingLongAny' | 'missingShortDE' | 'missingShortEN' | 'missingShortAny' | 'complete' | 'incomplete';
|
||||||
@@ -15,7 +14,7 @@ type TabType = 'all' | 'missingLongDE' | 'missingLongEN' | 'missingLongAny' | 'm
|
|||||||
// Description columns that should only have Present/Missing filters
|
// Description columns that should only have Present/Missing filters
|
||||||
const DESCRIPTION_COLUMNS = [COLUMNS.LONG_DE, COLUMNS.LONG_EN, COLUMNS.SHORT_DE, COLUMNS.SHORT_EN];
|
const DESCRIPTION_COLUMNS = [COLUMNS.LONG_DE, COLUMNS.LONG_EN, COLUMNS.SHORT_DE, COLUMNS.SHORT_EN];
|
||||||
|
|
||||||
export function ProductDescriptions({ data, onEdit, rowStatuses }: ProductDescriptionsProps) {
|
export function ProductDescriptions({ data, onEdit }: ProductDescriptionsProps) {
|
||||||
const [activeTab, setActiveTab] = useState<TabType>('all');
|
const [activeTab, setActiveTab] = useState<TabType>('all');
|
||||||
const [search, setSearch] = useState('');
|
const [search, setSearch] = useState('');
|
||||||
const [lineFilter, setLineFilter] = useState('');
|
const [lineFilter, setLineFilter] = useState('');
|
||||||
@@ -316,34 +315,34 @@ export function ProductDescriptions({ data, onEdit, rowStatuses }: ProductDescri
|
|||||||
isPending ? "bg-yellow-400/20 border-l-4 border-l-yellow-400" : ""
|
isPending ? "bg-yellow-400/20 border-l-4 border-l-yellow-400" : ""
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<td className="px-4 py-3 font-mono text-slate-300 text-xs">{row[COLUMNS.ARTICLE_NO]}</td>
|
<td className="px-4 py-3 font-mono text-slate-300 text-xs">{row[COLUMNS.ARTICLE_NO]}</td>
|
||||||
<td className="px-4 py-3 font-medium text-white max-w-[200px] truncate" title={row[COLUMNS.ARTICLE_NAME]}>{row[COLUMNS.ARTICLE_NAME]}</td>
|
<td className="px-4 py-3 font-medium text-white max-w-[200px] truncate" title={row[COLUMNS.ARTICLE_NAME]}>{row[COLUMNS.ARTICLE_NAME]}</td>
|
||||||
<td className="px-4 py-3 text-slate-300 text-xs">{row[COLUMNS.LINE]}</td>
|
<td className="px-4 py-3 text-slate-300 text-xs">{row[COLUMNS.LINE]}</td>
|
||||||
<td className="px-4 py-3 text-slate-300 text-xs truncate max-w-[120px]" title={row[COLUMNS.LICENSE]}>{row[COLUMNS.LICENSE] || '—'}</td>
|
<td className="px-4 py-3 text-slate-300 text-xs truncate max-w-[120px]" title={row[COLUMNS.LICENSE]}>{row[COLUMNS.LICENSE] || '—'}</td>
|
||||||
<td className="px-4 py-3">
|
<td className="px-4 py-3">
|
||||||
<span className={cn(
|
<span className={cn(
|
||||||
"px-2 py-0.5 rounded text-[10px] font-bold border",
|
"px-2 py-0.5 rounded text-[10px] font-bold border",
|
||||||
String(row[COLUMNS.CLASSIFICATION]).includes('OOC')
|
String(row[COLUMNS.CLASSIFICATION]).includes('OOC')
|
||||||
? "bg-amber-500/10 text-amber-500 border-amber-500/20"
|
? "bg-amber-500/10 text-amber-500 border-amber-500/20"
|
||||||
: "bg-slate-700/50 text-slate-400 border-slate-600/50"
|
: "bg-slate-700/50 text-slate-400 border-slate-600/50"
|
||||||
)}>
|
)}>
|
||||||
{row[COLUMNS.CLASSIFICATION] || '—'}
|
{row[COLUMNS.CLASSIFICATION] || '—'}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td className="px-4 py-3"><Badge content={row[COLUMNS.LONG_DE]} row={row} /></td>
|
<td className="px-4 py-3"><Badge content={row[COLUMNS.LONG_DE]} row={row} /></td>
|
||||||
<td className="px-4 py-3"><Badge content={row[COLUMNS.LONG_EN]} row={row} /></td>
|
<td className="px-4 py-3"><Badge content={row[COLUMNS.LONG_EN]} row={row} /></td>
|
||||||
<td className="px-4 py-3"><Badge content={row[COLUMNS.SHORT_DE]} row={row} /></td>
|
<td className="px-4 py-3"><Badge content={row[COLUMNS.SHORT_DE]} row={row} /></td>
|
||||||
<td className="px-4 py-3"><Badge content={row[COLUMNS.SHORT_EN]} row={row} /></td>
|
<td className="px-4 py-3"><Badge content={row[COLUMNS.SHORT_EN]} row={row} /></td>
|
||||||
<td className="px-4 py-3 text-right">
|
<td className="px-4 py-3 text-right">
|
||||||
<button
|
<button
|
||||||
onClick={() => onEdit(index)}
|
onClick={() => onEdit(index)}
|
||||||
className="inline-flex items-center gap-2 px-3 py-1.5 bg-blue-600/10 text-blue-400 hover:bg-blue-600 hover:text-white rounded-md transition-colors font-medium"
|
className="inline-flex items-center gap-2 px-3 py-1.5 bg-blue-600/10 text-blue-400 hover:bg-blue-600 hover:text-white rounded-md transition-colors font-medium"
|
||||||
>
|
>
|
||||||
<Edit2 className="w-4 h-4" />
|
<Edit2 className="w-4 h-4" />
|
||||||
Edit
|
Edit
|
||||||
</button>
|
</button>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
{paginatedData.length === 0 && (
|
{paginatedData.length === 0 && (
|
||||||
|
|||||||
+31
-6
@@ -10,17 +10,17 @@ export async function saveRowToSupabase(articleNo: string, rowData: ExcelRow) {
|
|||||||
headers: {
|
headers: {
|
||||||
'apikey': SUPABASE_KEY,
|
'apikey': SUPABASE_KEY,
|
||||||
'Authorization': `Bearer ${SUPABASE_KEY}`,
|
'Authorization': `Bearer ${SUPABASE_KEY}`,
|
||||||
'Content-Type': 'application/json',
|
'Content-Type': 'application/json'
|
||||||
'Prefer': 'resolution=merge-duplicates'
|
|
||||||
},
|
},
|
||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
id: articleNo,
|
id: articleNo,
|
||||||
data: rowData,
|
data: rowData,
|
||||||
|
status_check: 'pending',
|
||||||
updated_at: new Date().toISOString()
|
updated_at: new Date().toISOString()
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|
||||||
if (response.status === 204 || response.ok) {
|
if (!response.ok) {
|
||||||
// If PATCH didn't find the record, try UPSERT
|
// If PATCH didn't find the record, try UPSERT
|
||||||
const upsertResponse = await fetch(`${SUPABASE_URL}/rest/v1/products_sync`, {
|
const upsertResponse = await fetch(`${SUPABASE_URL}/rest/v1/products_sync`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
@@ -33,6 +33,7 @@ export async function saveRowToSupabase(articleNo: string, rowData: ExcelRow) {
|
|||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
id: articleNo,
|
id: articleNo,
|
||||||
data: rowData,
|
data: rowData,
|
||||||
|
status_check: 'pending',
|
||||||
updated_at: new Date().toISOString()
|
updated_at: new Date().toISOString()
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
@@ -45,7 +46,7 @@ export async function saveRowToSupabase(articleNo: string, rowData: ExcelRow) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getAllSyncedRows(): Promise<Record<string, ExcelRow>> {
|
export async function getAllSyncedRows(): Promise<Record<string, { data: ExcelRow, status: string }>> {
|
||||||
try {
|
try {
|
||||||
const response = await fetch(`${SUPABASE_URL}/rest/v1/products_sync`, {
|
const response = await fetch(`${SUPABASE_URL}/rest/v1/products_sync`, {
|
||||||
headers: {
|
headers: {
|
||||||
@@ -57,9 +58,12 @@ export async function getAllSyncedRows(): Promise<Record<string, ExcelRow>> {
|
|||||||
if (!response.ok) return {};
|
if (!response.ok) return {};
|
||||||
|
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
const result: Record<string, ExcelRow> = {};
|
const result: Record<string, { data: ExcelRow, status: string }> = {};
|
||||||
data.forEach((item: any) => {
|
data.forEach((item: any) => {
|
||||||
result[item.id] = item.data;
|
result[item.id] = {
|
||||||
|
data: item.data,
|
||||||
|
status: item.status_check || 'original'
|
||||||
|
};
|
||||||
});
|
});
|
||||||
return result;
|
return result;
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
@@ -67,3 +71,24 @@ export async function getAllSyncedRows(): Promise<Record<string, ExcelRow>> {
|
|||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function resetAllPendingRows() {
|
||||||
|
try {
|
||||||
|
const response = await fetch(`${SUPABASE_URL}/rest/v1/products_sync?status_check=eq.pending`, {
|
||||||
|
method: 'PATCH',
|
||||||
|
headers: {
|
||||||
|
'apikey': SUPABASE_KEY,
|
||||||
|
'Authorization': `Bearer ${SUPABASE_KEY}`,
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
status_check: 'original',
|
||||||
|
updated_at: new Date().toISOString()
|
||||||
|
})
|
||||||
|
});
|
||||||
|
return response.ok;
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error resetting statuses in Supabase:', error);
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user