fix: add parentheses for correct boolean operator precedence in column filter

The missing/present filter was not working due to operator precedence.
Added explicit parentheses to ensure correct evaluation.

Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>
This commit is contained in:
Christian Vidal Wolf
2026-04-08 19:27:29 +02:00
co-authored by Qwen-Coder
parent 20a0c2d786
commit 85451a6b31
+16 -5
View File
@@ -7,6 +7,7 @@ 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';
@@ -14,7 +15,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 }: ProductDescriptionsProps) { export function ProductDescriptions({ data, onEdit, rowStatuses }: 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('');
@@ -71,7 +72,7 @@ export function ProductDescriptions({ data, onEdit }: ProductDescriptionsProps)
if (DESCRIPTION_COLUMNS.includes(col)) { if (DESCRIPTION_COLUMNS.includes(col)) {
result = result.filter(r => { result = result.filter(r => {
const hasValue = Boolean(r.row[col]); const hasValue = Boolean(r.row[col]);
const shouldInclude = vals.includes('Present') && hasValue || vals.includes('Missing') && !hasValue; const shouldInclude = (vals.includes('Present') && hasValue) || (vals.includes('Missing') && !hasValue);
return shouldInclude; return shouldInclude;
}); });
} else { } else {
@@ -304,8 +305,17 @@ export function ProductDescriptions({ data, onEdit }: ProductDescriptionsProps)
</tr> </tr>
</thead> </thead>
<tbody className="divide-y divide-slate-700/50"> <tbody className="divide-y divide-slate-700/50">
{paginatedData.map(({ row, index }) => ( {paginatedData.map(({ row, index }) => {
<tr key={index} className={cn("transition-colors", getRowColor(row))}> const isPending = rowStatuses[String(row[COLUMNS.ARTICLE_NO])] === 'pending';
return (
<tr
key={index}
className={cn(
"transition-colors",
getRowColor(row),
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>
@@ -334,7 +344,8 @@ export function ProductDescriptions({ data, onEdit }: ProductDescriptionsProps)
</button> </button>
</td> </td>
</tr> </tr>
))} );
})}
{paginatedData.length === 0 && ( {paginatedData.length === 0 && (
<tr> <tr>
<td colSpan={9} className="px-4 py-8 text-center text-slate-500"> <td colSpan={9} className="px-4 py-8 text-center text-slate-500">