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

refactor(FE): Add skeleton loaders for ProjectFlock and TransferToLaying

Browse Source 
tables
This commit is contained in:
rstubryan
2026-03-02 11:56:27 +07:00
parent d96388e5f4
commit d3501e5f3d
4 changed files with 194 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/production/project-flock/ProjectFlockTable.tsx
+64 -40
View File
@@ -32,6 +32,7 @@ import StatusBadge from '@/components/helper/StatusBadge';
import PopoverButton from '@/components/popover/PopoverButton';
import PopoverContent from '@/components/popover/PopoverContent';
import ProjectFlockConfirmationModal from './ProjectFlockConfirmationModal';
import ProjectFlockTableSkeleton from '@/components/pages/production/project-flock/skeleton/ProjectFlockTableSkeleton';
import { useProjectFlockStore } from '@/stores/production/project-flock/project-flock.store';
import { ProjectFlockFormValues } from './form/ProjectFlockForm.schema';
import { useChickinStore } from '@/stores/production/chickin/chickin.store';
@@ -997,46 +998,69 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
</div>
</div>
<Table<ProjectFlock>
data={isResponseSuccess(projectFlocks) ? projectFlocks?.data : []}
columns={columns}
pageSize={tableFilterState.pageSize}
page={
isResponseSuccess(projectFlocks) ? projectFlocks?.meta?.page : 0
}
totalItems={
isResponseSuccess(projectFlocks)
? projectFlocks?.meta?.total_results
: 0
}
onPageChange={(page) => {
setPage(page);
}}
onPageSizeChange={(pageSize) => {
setPageSize(pageSize);
}}
isLoading={isLoading}
sorting={sorting}
setSorting={setSorting}
rowSelection={rowSelection}
setRowSelection={setRowSelection}
enableRowSelection={(row) => {
const projectFlock = row.original;
return (
projectFlock.approval?.step_number === 1 &&
projectFlock.approval?.action !== 'REJECTED'
);
}}
withCheckbox
className={{
containerClassName: cn('p-3', {
'w-full mb-20':
isResponseSuccess(projectFlocks) &&
projectFlocks?.data?.length === 0,
}),
headerColumnClassName: 'text-nowrap',
}}
/>
<div className='flex flex-col mb-4'>
{isLoading ? (
<div className='w-full flex flex-row justify-center items-center p-4'>
<span className='loading loading-spinner loading-xl' />
</div>
) : !isResponseSuccess(projectFlocks) ||
projectFlocks.data?.length === 0 ? (
<div className='p-3'>
<ProjectFlockTableSkeleton
columns={columns}
icon={
<Icon
icon='heroicons:document-text'
className='text-white'
width={20}
height={20}
/>
}
/>
</div>
) : (
<Table<ProjectFlock>
data={
isResponseSuccess(projectFlocks) ? projectFlocks?.data : []
}
columns={columns}
pageSize={tableFilterState.pageSize}
page={
isResponseSuccess(projectFlocks)
? projectFlocks?.meta?.page
: 0
}
totalItems={
isResponseSuccess(projectFlocks)
? projectFlocks?.meta?.total_results
: 0
}
onPageChange={(page) => {
setPage(page);
}}
onPageSizeChange={(pageSize) => {
setPageSize(pageSize);
}}
isLoading={isLoading}
sorting={sorting}
setSorting={setSorting}
rowSelection={rowSelection}
setRowSelection={setRowSelection}
enableRowSelection={(row) => {
const projectFlock = row.original;
return (
projectFlock.approval?.step_number === 1 &&
projectFlock.approval?.action !== 'REJECTED'
);
}}
withCheckbox
className={{
containerClassName: cn('p-3 mb-0'),
headerColumnClassName: 'text-nowrap',
}}
/>
)}
</div>
</div>
</div>