EmployeeWebClient - shared/Table - update naming

employee-web-client/src/modules/customers/presentation/CustomersCollection/CustomersTable/index.tsx

@@ -4,7 +4,7 @@ import { compose } from 'utils';
 
 import { useQueryParams } from 'shared/Params';
 import { withErrorBoundary } from 'shared/ErrorBoundary';
-import { Tfoot, TableContainer, useTable, DefaultTable, withTableSuspense } from 'shared/Table';
+import { Tfoot, TContainer, useTable, DefaultTable, withTableSuspense } from 'shared/Table';
 
 import { ICustomerCollectionQueryParams } from '../../../application/types';
 import { useCustomersQuery } from '../../../infrastructure/query';
@@ -26,10 +26,10 @@ const CustomersTableSuspense = () => {
  });
 
  return (
- <TableContainer count={collection.length}>
+ <TContainer count={collection.length}>
  <DefaultTable table={table} />
  <Tfoot meta={meta} collectionCount={collection.length} />
- </TableContainer>
+ </TContainer>
  );
 };
 

employee-web-client/src/modules/employees/presentation/EmployeesCollection/EmployeesTable/index.tsx

@@ -4,7 +4,7 @@ import { compose } from 'utils';
 
 import { useQueryParams } from 'shared/Params';
 import { withErrorBoundary } from 'shared/ErrorBoundary';
-import { DefaultTable, TableContainer, Tfoot, useTable, withTableSuspense } from 'shared/Table';
+import { DefaultTable, TContainer, Tfoot, useTable, withTableSuspense } from 'shared/Table';
 
 import { useEnterpriseContextSelector } from '../../../../context';
 import { IEmployeeCollectionQueryParams } from '../../../application/types';
@@ -26,10 +26,10 @@ const EmployeesTableSuspense = () => {
  });
 
  return (
- <TableContainer count={collection.length}>
+ <TContainer count={collection.length}>
  <DefaultTable table={table} />
  <Tfoot meta={meta} collectionCount={collection.length} />
- </TableContainer>
+ </TContainer>
  );
 };
 

employee-web-client/src/modules/facility/presentation/FacilitiesCollection/FacitiliesTable/index.tsx

@@ -4,7 +4,7 @@ import { compose } from 'utils';
 
 import { useQueryParams } from 'shared/Params';
 import { withErrorBoundary } from 'shared/ErrorBoundary';
-import { DefaultTable, TableContainer, Tfoot, useTable, withTableSuspense } from 'shared/Table';
+import { DefaultTable, TContainer, Tfoot, useTable, withTableSuspense } from 'shared/Table';
 
 import { IFacilityCollectionQueryParams } from '../../../application/types';
 import { useEnterpriseContextSelector } from '../../../../context';
@@ -26,10 +26,10 @@ const FacilitiesTableSuspense = () => {
  });
 
  return (
- <TableContainer count={collection.length}>
+ <TContainer count={collection.length}>
  <DefaultTable table={table} />
  <Tfoot meta={meta} collectionCount={collection.length} />
- </TableContainer>
+ </TContainer>
  );
 };
 

employee-web-client/src/modules/schedules/presentation/SchedulesCollection/SchedulesTable/index.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { compose } from 'utils';
 
 import { withErrorBoundary } from 'shared/ErrorBoundary';
-import { TableContainer, useTable, withTableSuspense, Table, Th, Tbody, Td, Thead, Tr } from 'shared/Table';
+import { TContainer, useTable, withTableSuspense, Table, Th, Tbody, Td, Thead, Tr } from 'shared/Table';
 
 import { useSchedulesQuery } from '../../../infrastructure/query';
 import { useFacilityContextSelector } from '../../../../context';
@@ -24,7 +24,7 @@ const SchedulesTableSuspense = () => {
  });
 
  return (
- <TableContainer count={collection.length}>
+ <TContainer count={collection.length}>
  <Table>
  <Thead>
  {table.getHeaderGroups().map(headerGroup => (
@@ -45,7 +45,7 @@ const SchedulesTableSuspense = () => {
  ))}
  </Tbody>
  </Table>
- </TableContainer>
+ </TContainer>
  );
 };
 

employee-web-client/src/shared/Table/TableContainer.tsx → employee-web-client/src/shared/Table/TContainer.tsx

@@ -7,7 +7,7 @@ interface IProps {
  count: number
 }
 
-const TableContainer = ({ children, count }: IProps) => {
+const TContainer = ({ children, count }: IProps) => {
  if (count === 0) {
  return <NoResultsState />;
  }
@@ -19,4 +19,4 @@ const TableContainer = ({ children, count }: IProps) => {
  );
 };
 
-export { TableContainer };
+export { TContainer };

employee-web-client/src/shared/Table/TableLoader.tsx → employee-web-client/src/shared/Table/TLoader.tsx

@@ -3,7 +3,7 @@ import { Skeleton, SkeletonProps, VStack } from '@chakra-ui/react';
 
 interface IProps extends SkeletonProps {}
 
-const TableLoader = (props: IProps) => {
+const TLoader = (props: IProps) => {
  return (
  <VStack data-testid='table-loader' w='100%'>
  <Skeleton w='100%' h='36px' {...props} />
@@ -15,4 +15,4 @@ const TableLoader = (props: IProps) => {
  );
 };
 
-export { TableLoader };
+export { TLoader };

employee-web-client/src/shared/Table/Th.tsx

@@ -9,17 +9,17 @@ import { SortingType, useSort } from 'hooks';
 interface IProps<TData> extends Header<TData, unknown> {}
 
 function Th<TData>(header: IProps<TData>) {
- const { currentSortType, change } = useSort(camelCase(header.column.id));
  const { colors } = useTheme();
  const textColor = useColorModeValue('gray.600', 'gray.400');
  const borderColor = useColorModeValue(colors.gray[300], colors.gray[700]);
  const activeBorderColor = useColorModeValue(colors.primary[500], colors.primary[500]);
+
+ const { currentSortType, change } = useSort(camelCase(header.column.id));
  const isSortable = header.column.getCanSort();
+ const isActive = currentSortType !== SortingType.DEFAULT;
 
  const meta = header.column.columnDef.meta;
 
- const isActive = currentSortType !== SortingType.DEFAULT;
-
  return (
  <ChakraTh
  p='12px 18px'

employee-web-client/src/shared/Table/index.ts

@@ -6,8 +6,8 @@ export { Th } from './Th';
 export { Tfoot } from './Tfoot';
 export { Tbody } from './Tbody';
 export { Table } from './Table';
-export { TableLoader } from './TableLoader';
-export { TableContainer } from './TableContainer';
+export { TLoader } from './TLoader';
+export { TContainer } from './TContainer';
 export { CollectionPanel } from '../Collection/CollectionPanel';
 export { createColumn, useTable } from './useTable';
 export { DefaultTable } from './DefaultTable';

employee-web-client/src/shared/Table/withTableSuspense.tsx

@@ -1,13 +1,13 @@
 import React, { Component, ComponentType, Suspense, SuspenseProps } from 'react';
 
-import { TableLoader } from './TableLoader';
+import { TLoader } from './TLoader';
 
 export function withTableSuspense<Props>(Wrapper: ComponentType<Props>, props?: Omit<SuspenseProps, 'children'>) {
  // eslint-disable-next-line react/display-name
  return class extends Component<Props> {
  render() {
  return (
- <Suspense fallback={props?.fallback ?? <TableLoader />}>
+ <Suspense fallback={props?.fallback ?? <TLoader />}>
  <Wrapper {...this.props} />
  </Suspense>
  );