bakery-admin/bakery-ia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix frontend 1

Browse Source
This commit is contained in:
Urtzi Alfaro
2025-08-28 18:07:16 +02:00
parent 9ea6794923
commit 68bb5a6449
11 changed files with 427 additions and 400 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
frontend/src/components/ui/Table/Table.tsx
View File

@@ -229,14 +229,14 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
};
const variantClasses = {
default: 'border-collapse border border-table-border',
default: 'border-collapse',
striped: 'border-collapse',
bordered: 'border-collapse border border-table-border',
bordered: 'border-collapse border border-[var(--border-primary)]',
borderless: 'border-collapse',
};
const tableClasses = clsx(
'w-full bg-table-bg',
'w-full bg-[var(--bg-primary)]',
sizeClasses[size],
variantClasses[variant],
{
@@ -285,10 +285,10 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
const hasExpansion = expandable;
return (
<thead className={clsx('bg-table-header-bg', { 'sticky top-0 z-10': sticky })}>
<thead className={clsx('bg-[var(--bg-secondary)]', { 'sticky top-0 z-10': sticky })}>
<tr>
{hasSelection && (
<th className="px-4 py-3 text-left font-medium text-text-primary border-b border-table-border w-12">
<th className="px-4 py-3 text-left font-medium text-[var(--text-primary)] border-b border-[var(--border-primary)] w-12">
{rowSelection.type !== 'radio' && (
<input
type="checkbox"
@@ -302,7 +302,7 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
</th>
)}
{hasExpansion && (
<th className="px-4 py-3 text-left font-medium text-text-primary border-b border-table-border w-12"></th>
<th className="px-4 py-3 text-left font-medium text-[var(--text-primary)] border-b border-[var(--border-primary)] w-12"></th>
)}
{columns.map((column) => {
const isSorted = sortState.field === (column.sortKey || column.key);
@@ -311,12 +311,12 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
<th
key={column.key}
className={clsx(
'px-4 py-3 font-medium text-text-primary border-b border-table-border',
'px-4 py-3 font-medium text-[var(--text-primary)] border-b border-[var(--border-primary)]',
{
'text-left': column.align === 'left' || !column.align,
'text-center': column.align === 'center',
'text-right': column.align === 'right',
'cursor-pointer hover:bg-table-row-hover': column.sortable,
'cursor-pointer hover:bg-[var(--bg-secondary)] transition-colors duration-150': column.sortable,
},
column.headerClassName
)}
@@ -372,12 +372,13 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
<tr
{...rowProps}
className={clsx(
'transition-colors duration-150',
'group transition-colors duration-200 ease-in-out',
{
'bg-table-row-hover': hover && !isSelected,
'bg-table-row-selected': isSelected,
'odd:bg-bg-secondary': variant === 'striped' && !isSelected,
'border-b border-table-border': variant !== 'borderless',
'hover:bg-[var(--bg-secondary)] hover:shadow-sm': hover && !isSelected,
'bg-[var(--color-primary)]/10': isSelected,
'odd:bg-[var(--bg-tertiary)]/30': variant === 'striped' && !isSelected && !hover,
'odd:hover:bg-[var(--bg-secondary)]': variant === 'striped' && hover && !isSelected,
'border-b border-[var(--border-primary)]': variant !== 'borderless',
'cursor-pointer': expandable?.expandRowByClick,
},
rowProps.className
@@ -385,7 +386,7 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
onClick={expandable?.expandRowByClick ? () => handleExpand(record, !isExpanded) : rowProps.onClick}
>
{rowSelection && (
<td className="px-4 py-3 border-b border-table-border">
<td className="px-4 py-3 border-b border-[var(--border-primary)]">
<input
type={rowSelection.type || 'checkbox'}
className="rounded border-input-border focus:ring-color-primary"
@@ -398,7 +399,7 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
</td>
)}
{expandable && (
<td className="px-4 py-3 border-b border-table-border">
<td className="px-4 py-3 border-b border-[var(--border-primary)]">
{canExpand && (
<button
type="button"
@@ -431,11 +432,12 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
<td
key={column.key}
className={clsx(
'px-4 py-3 border-b border-table-border',
'px-4 py-3 border-b border-[var(--border-primary)] transition-colors duration-200 ease-in-out',
{
'text-left': column.align === 'left' || !column.align,
'text-center': column.align === 'center',
'text-right': column.align === 'right',
'group-hover:text-[var(--text-primary)]': true,
},
column.className
)}
@@ -450,7 +452,7 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
<tr>
<td
colSpan={columns.length + (rowSelection ? 1 : 0) + (expandable ? 1 : 0)}
className="px-4 py-0 border-b border-table-border bg-bg-secondary"
className="px-4 py-0 border-b border-[var(--border-primary)] bg-[var(--bg-secondary)]"
>
<div className="py-4" style={{ paddingLeft: expandable.indentSize || 24 }}>
{expandable.expandedRowRender(record, index)}
@@ -462,7 +464,7 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
);
})}
{summary && (
<tr className="bg-table-header-bg border-t-2 border-table-border font-medium">
<tr className="bg-[var(--bg-secondary)] border-t-2 border-[var(--border-primary)] font-medium">
<td colSpan={columns.length + (rowSelection ? 1 : 0) + (expandable ? 1 : 0)}>
{summary(data)}
</td>
@@ -472,8 +474,8 @@ const Table = forwardRef<HTMLTableElement, TableProps>(({
);
return (
<div className="space-y-4">
<div className={containerClasses}>
<div className="space-y-4 bg-[var(--bg-primary)]">
<div className={clsx(containerClasses, 'bg-[var(--bg-primary)]')}>
<table
ref={ref}
className={tableClasses}