gitea-admin/lti-web-client
1
0
Fork 0
mirror of https://gitlab.com/mbugroup/lti-web-client.git synced 2026-05-24 23:35:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(FE): Add skeleton loaders for inventory tables

Browse Source
This commit is contained in:
rstubryan
2026-03-02 13:31:23 +07:00
parent 9c4c750664
commit 1341b1ff53
6 changed files with 250 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/inventory/movement/MovementTable.tsx
+39 -21
View File
@@ -16,6 +16,7 @@ import DebouncedTextInput from '@/components/input/DebouncedTextInput';
import RequirePermission from '@/components/helper/RequirePermission';
import PopoverButton from '@/components/popover/PopoverButton';
import PopoverContent from '@/components/popover/PopoverContent';
import MovementTableSkeleton from '@/components/pages/inventory/movement/skeleton/MovementTableSkeleton';
const RowOptionsMenu = ({
popoverPosition = 'bottom',
@@ -198,27 +199,44 @@ const MovementTable = () => {
{/* Table Section */}
<div className='flex flex-col mb-4'>
<Table<Movement>
data={isResponseSuccess(movements) ? movements?.data : []}
columns={movementColumns}
pageSize={tableFilterState.pageSize}
page={isResponseSuccess(movements) ? movements?.meta?.page : 0}
totalItems={
isResponseSuccess(movements) ? movements?.meta?.total_results : 0
}
onPageChange={setPage}
onPageSizeChange={setPageSize}
isLoading={isLoading}
sorting={sorting}
setSorting={setSorting}
className={{
containerClassName: cn('p-3 mb-0', {
'w-full':
isResponseSuccess(movements) && movements?.data?.length === 0,
}),
headerColumnClassName: 'text-nowrap',
}}
/>
{isLoading ? (
<div className='w-full flex flex-row justify-center items-center p-4'>
<span className='loading loading-spinner loading-xl' />
</div>
) : !isResponseSuccess(movements) || movements.data?.length === 0 ? (
<div className='p-3'>
<MovementTableSkeleton
columns={movementColumns}
icon={
<Icon
icon='heroicons:document-text'
className='text-white'
width={20}
height={20}
/>
}
/>
</div>
) : (
<Table<Movement>
data={isResponseSuccess(movements) ? movements?.data : []}
columns={movementColumns}
pageSize={tableFilterState.pageSize}
page={isResponseSuccess(movements) ? movements?.meta?.page : 0}
totalItems={
isResponseSuccess(movements) ? movements?.meta?.total_results : 0
}
onPageChange={setPage}
onPageSizeChange={setPageSize}
isLoading={isLoading}
sorting={sorting}
setSorting={setSorting}
className={{
containerClassName: cn('p-3 mb-0'),
headerColumnClassName: 'text-nowrap',
}}
/>
)}
</div>
</div>
);