salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more fixes

Browse Source
This commit is contained in:
IGNY8 VPS (Salman)
2025-12-27 06:53:36 +00:00
parent 302af6337e
commit d5bda678fd
11 changed files with 34 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
frontend/src/templates/TablePageTemplate.tsx
View File

@@ -22,6 +22,18 @@ import {
TableRow,
TableCell,
} from '../components/ui/table';
// Helper function to format column key to display name
// Converts snake_case/camelCase to Title Case (e.g., "content_type" -> "Content Type")
const formatColumnKey = (key: string): string => {
return key
.replace(/_/g, ' ') // Replace underscores with spaces
.replace(/([a-z])([A-Z])/g, '$1 $2') // Add space before capital letters in camelCase
.split(' ')
.map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
.join(' ');
};
import Checkbox from '../components/form/input/Checkbox';
import Button from '../components/ui/button/Button';
import Input from '../components/form/input/InputField';
@@ -29,7 +41,8 @@ import SelectDropdown from '../components/form/SelectDropdown';
import { Dropdown } from '../components/ui/dropdown/Dropdown';
import { DropdownItem } from '../components/ui/dropdown/DropdownItem';
import AlertModal from '../components/ui/alert/AlertModal';
import { ChevronDownIcon, MoreDotIcon, PlusIcon, ListIcon } from '../icons';
import { ChevronDownIcon, MoreDotIcon, PlusIcon } from '../icons';
import { FunnelIcon } from '@heroicons/react/24/outline';
import { useHeaderMetrics } from '../context/HeaderMetricsContext';
import { useToast } from '../components/ui/toast/ToastContainer';
import { getDeleteModalConfig } from '../config/pages/delete-modal.config';
@@ -571,7 +584,8 @@ export default function TablePageTemplate({
size="md"
onClick={primaryAction.onClick}
disabled={selectedIds.length === 0}
variant={primaryAction.variant === 'success' ? 'success' : primaryAction.variant === 'warning' ? 'primary' : 'primary'}
variant="primary"
tone={primaryAction.variant === 'success' ? 'success' : primaryAction.variant === 'warning' ? 'warning' : 'brand'}
startIcon={primaryAction.icon}
className={selectedIds.length === 0 ? "opacity-50 cursor-not-allowed" : ""}
>
@@ -597,7 +611,8 @@ export default function TablePageTemplate({
}
}}
disabled={selectedIds.length === 0}
variant={bulkActions[0].variant === 'success' ? 'success' : bulkActions[0].variant === 'danger' ? 'primary' : 'primary'}
variant="primary"
tone={bulkActions[0].variant === 'success' ? 'success' : bulkActions[0].variant === 'danger' ? 'danger' : 'brand'}
startIcon={bulkActions[0].icon}
className={selectedIds.length === 0 ? "opacity-50 cursor-not-allowed" : ""}
>
@@ -667,7 +682,7 @@ export default function TablePageTemplate({
variant="secondary"
size="md"
onClick={() => setShowFilters(!showFilters)}
startIcon={<ListIcon className="w-4 h-4" />}
startIcon={<FunnelIcon className="w-4 h-4" />}
>
{showFilters ? 'Hide Filters' : 'Show Filters'}
</Button>
@@ -800,22 +815,23 @@ export default function TablePageTemplate({
)}
{visibleColumnsList.map((column, colIndex) => {
const isLastColumn = colIndex === visibleColumnsList.length - 1;
const displayName = formatColumnKey(column.key);
return (
<TableCell
key={column.key}
isHeader
className={`px-5 py-3 font-medium text-gray-500 text-${column.align || 'start'} text-theme-xs dark:text-gray-400 ${column.sortable ? 'cursor-pointer hover:text-gray-700 dark:hover:text-gray-300' : ''} ${isLastColumn && rowActions.length > 0 ? 'pr-16' : ''}`}
className={`px-5 py-3 font-medium text-gray-500 text-${column.align || 'start'} text-[11px] dark:text-gray-400 ${column.sortable ? 'cursor-pointer hover:text-gray-700 dark:hover:text-gray-300' : ''} ${isLastColumn && rowActions.length > 0 ? 'pr-16' : ''}`}
>
<div className="flex items-center justify-between gap-2">
<div className="flex items-center flex-1">
{column.sortable ? (
<div onClick={() => handleSort(column)} className="flex items-center">
{column.label}
{displayName}
{getSortIcon(column)}
</div>
) : (
<>
{column.label}
{displayName}
{getSortIcon(column)}
</>
)}
@@ -825,7 +841,7 @@ export default function TablePageTemplate({
<ColumnSelector
columns={columns.map(col => ({
key: col.key,
label: col.label,
label: formatColumnKey(col.key),
defaultVisible: col.defaultVisible !== false,
}))}
visibleColumns={visibleColumns}