import { Head, usePage } from '@inertiajs/react';
import { IconButton } from '@/components/common/IconButton';
import { useCallback, useEffect, useMemo, useState } from 'react';
import { TableActiveFilters, type TableActiveFilterItem } from '@/components/common/TableActiveFilters';
import { PageHeaderActions } from '@/components/page-header-actions';
import { TableListToolbar } from '@/components/common/TableListToolbar';
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardHeader } from '@/components/ui/card';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
import { AccountingDocumentTypeFormSheet } from '@/features/accounting-document-types/components/accounting-document-type-form-sheet';
import { useAccountingDocumentTypesFilters } from '@/features/accounting-document-types/lib/use-accounting-document-types-filters';
import { useAccountingDocumentTypesColumns } from '@/features/accounting-document-types/table/accounting-document-types-columns';
import { AccountingDocumentTypesTable } from '@/features/accounting-document-types/table/accounting-document-types-table';
import type {
AccountingDocumentTypesIndexPageProps,
AccountingDocumentTypesSortColumn,
} from '@/features/accounting-document-types/types';
import { useAuthorization } from '@/hooks/use-authorization';
import { useI18n } from '@/hooks/use-i18n';
export default function AccountingDocumentTypesSettingsPage() {
const { t } = useI18n();
const { accounting_document_types, filters: initialFilters, editing_accounting_document_type } =
usePage().props;
const { hasRole } = useAuthorization();
const canManage = hasRole('admin');
const { filters, search, setSearch, isApplying, applyFilters, openEdit, closeEdit } =
useAccountingDocumentTypesFilters(initialFilters);
const [createSheetOpen, setCreateSheetOpen] = useState(false);
const sheetOpen = createSheetOpen || Boolean(editing_accounting_document_type);
const sheetMode = editing_accounting_document_type ? 'edit' : 'create';
useEffect(() => {
if (editing_accounting_document_type) {
setCreateSheetOpen(false);
}
}, [editing_accounting_document_type]);
const onSort = useCallback(
(column: AccountingDocumentTypesSortColumn) => {
const nextDirection =
filters.sort_by === column && filters.sort_direction === 'asc' ? 'desc' : 'asc';
applyFilters({
page: 1,
sort_by: column,
sort_direction: nextDirection,
});
},
[applyFilters, filters.sort_by, filters.sort_direction],
);
const columns = useAccountingDocumentTypesColumns(onSort, canManage, openEdit);
const handleSheetOpenChange = (open: boolean) => {
if (!open) {
setCreateSheetOpen(false);
if (editing_accounting_document_type) {
closeEdit();
}
}
};
const clearAllFilters = () => {
setSearch('');
applyFilters({ page: 1, search: '' });
};
const activeFilterItems = useMemo((): TableActiveFilterItem[] => {
if (filters.search === '') {
return [];
}
return [
{
key: 'search',
label: t('common.active_filters.search', { value: filters.search }),
onRemove: clearAllFilters,
},
];
}, [filters.search, t]);
return (
<>
setCreateSheetOpen(true)}
icon="material-symbols:add"
/>
{t('settings.accounting_document_types.tooltips.add_type')}
) : null
}
/>
applyFilters({ page: 1, search }),
placeholder: t('settings.accounting_document_types.search.placeholder'),
submitLabel: t('settings.accounting_document_types.search.submit'),
disabled: isApplying,
}}
/>
applyFilters({ page })}
isLoading={isApplying}
/>
{canManage && sheetOpen ? (
{
setCreateSheetOpen(false);
if (editing_accounting_document_type) {
closeEdit();
}
}}
/>
) : null}
);
}