address PR comments

packages/esm-service-queues-app/src/active-visits/active-visits-table.scss

@@ -273,7 +273,3 @@ html[dir='rtl'] {
     }
   }
 }
-
-.tabList {
-  padding-left: spacing.$spacing-05;
-}

packages/esm-service-queues-app/src/config-schema.ts

@@ -160,7 +160,6 @@ export interface ConfigObject {
     historicalObsConceptUuid: Array<string>;
   };
   contactAttributeType: Array<string>;
-  visitQueueNumberAttributeUuid: string;
   vitals: VitalsConfigObject;
   biometrics: BiometricsConfigObject;
   showQueueTableTab: boolean;

packages/esm-service-queues-app/src/queue-table/cells/queue-table-coming-from-cell.component.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type QueueTableColumn, type QueueTableCellComponentProps } from '../../types';
 
-const QueueTableComingFromCell = ({ queueEntry }: QueueTableCellComponentProps) => {
+export const QueueTableComingFromCell = ({ queueEntry }: QueueTableCellComponentProps) => {
   return <>{queueEntry.queueComingFrom?.display}</>;
 };
 

packages/esm-service-queues-app/src/queue-table/cells/queue-table-name-cell.component.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { type ConfigObject } from '../../config-schema';
 import { type QueueTableColumn, type QueueTableCellComponentProps } from '../../types';
 
-const QueueTableNameCell = ({ queueEntry }: QueueTableCellComponentProps) => {
+export const QueueTableNameCell = ({ queueEntry }: QueueTableCellComponentProps) => {
   const { customPatientChartUrl } = useConfig<ConfigObject>();
   return (
     <ConfigurableLink to={customPatientChartUrl} templateParams={{ patientUuid: queueEntry.patient.uuid }}>

packages/esm-service-queues-app/src/queue-table/cells/queue-table-priority-cell.component.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { type QueueTableColumn, type QueueTableCellComponentProps } from '../../types';
 
 // TODO: color code the Tag based on priority
-const QueueTablePriorityCell = ({ queueEntry }: QueueTableCellComponentProps) => {
+export const QueueTablePriorityCell = ({ queueEntry }: QueueTableCellComponentProps) => {
   return <Tag>{queueEntry.priority.display}</Tag>;
 };
 

packages/esm-service-queues-app/src/queue-table/cells/queue-table-status-cell.component.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type QueueTableColumn, type QueueTableCellComponentProps } from '../../types';
 
-const QueueTableStatusCell = ({ queueEntry }: QueueTableCellComponentProps) => {
+export const QueueTableStatusCell = ({ queueEntry }: QueueTableCellComponentProps) => {
   return <>{queueEntry.status.display}</>;
 };
 

packages/esm-service-queues-app/src/queue-table/cells/queue-table-wait-time-cell.component.tsx

@@ -3,7 +3,7 @@ import { type QueueTableColumn, type QueueTableCellComponentProps } from '../../
 import dayjs from 'dayjs';
 import { useTranslation } from 'react-i18next';
 
-const QueueTableWaitTimeCell = ({ queueEntry }: QueueTableCellComponentProps) => {
+export const QueueTableWaitTimeCell = ({ queueEntry }: QueueTableCellComponentProps) => {
   const { t } = useTranslation();
   const [currentTime, setCurrentTime] = useState(dayjs());
 

packages/esm-service-queues-app/src/queue-table/queue-table-by-status.component.tsx

@@ -12,7 +12,7 @@ import { queueTablePriorityColumn } from './cells/queue-table-priority-cell.comp
 import { queueTableStatusColumn } from './cells/queue-table-status-cell.component';
 import { queueTableWaitTimeColumn } from './cells/queue-table-wait-time-cell.component';
 import { QueueTableByStatusSkeleton } from './queue-table-by-status-skeleton.component';
-import { QueueTable } from './queue-table.component';
+import QueueTable from './queue-table.component';
 
 interface QueueTableByStatusProps {
   selectedQueue: Queue; // the selected queue
@@ -35,7 +35,7 @@ const defaultQueueTableConfig: QueueTableTabConfig = {
   ],
 };
 
-export const QueueTableByStatus: React.FC<QueueTableByStatusProps> = ({
+const QueueTableByStatus: React.FC<QueueTableByStatusProps> = ({
   selectedQueue,
   selectedStatus,
   configByStatus,
@@ -75,7 +75,7 @@ export const QueueTableByStatus: React.FC<QueueTableByStatusProps> = ({
   return (
     <div className={styles.container}>
       <div className={styles.headerContainer}>
-        <div className={!isDesktop(layout) ? styles.tabletHeading : styles.desktopHeading}>
+        <div className={isDesktop(layout) ? styles.desktopHeading : styles.tabletHeading}>
           <h3>{selectedQueue.display}</h3>
         </div>
       </div>
@@ -106,3 +106,5 @@ export const QueueTableByStatus: React.FC<QueueTableByStatusProps> = ({
     </div>
   );
 };
+
+export default QueueTableByStatus;

packages/esm-service-queues-app/src/queue-table/queue-table.component.tsx

@@ -23,7 +23,7 @@ interface QueueTableProps {
   queueTableColumns: QueueTableColumn[];
 }
 
-export function QueueTable({ queueEntries, queueTableColumns }: QueueTableProps) {
+function QueueTable({ queueEntries, queueTableColumns }: QueueTableProps) {
   const { t } = useTranslation();
   const [currentPageSize, setPageSize] = useState(10);
   const pageSizes = [10, 20, 30, 40, 50];
@@ -43,9 +43,7 @@ export function QueueTable({ queueEntries, queueTableColumns }: QueueTableProps)
     <DataTable rows={rowsData} headers={headers}>
       {({ rows, headers, getTableProps, getHeaderProps, getRowProps, getToolbarProps, onInputChange }) => (
         <TableContainer className={styles.tableContainer}>
-          <TableToolbar
-            {...getToolbarProps()}
-            style={{ position: 'static', height: '3rem', overflow: 'visible', backgroundColor: 'color' }}>
+          <TableToolbar {...getToolbarProps()}>
             <TableToolbarContent className={styles.toolbarContent}>
               <TableToolbarSearch
                 className={styles.search}
@@ -94,3 +92,5 @@ export function QueueTable({ queueEntries, queueTableColumns }: QueueTableProps)
     </DataTable>
   );
 }
+
+export default QueueTable;

packages/esm-service-queues-app/src/queue-table/queue-table.scss

@@ -46,6 +46,15 @@
     height: spacing.$spacing-07;
     margin-bottom: spacing.$spacing-02;
   }
+
+  :global(.cds--table-toolbar) {
+    position: static;
+    height: 3rem;
+    overflow: visible;
+  }
+}
+
+.tableToolbaer {
 }
 
 .queueTable tr:last-of-type {

packages/esm-service-queues-app/src/root.component.tsx

@@ -5,8 +5,7 @@ import AppointmentsTable from './queue-patient-linelists/scheduled-appointments-
 import Home from './home.component';
 import ServicesTable from './queue-patient-linelists/queue-services-table.component';
 import QueueScreen from './queue-screen/queue-screen.component';
-import { QueueTableByStatus } from './queue-table/queue-table-by-status.component';
-import { QueueTableByStatusView } from './views/queue-table-by-status-view.component';
+import QueueTableByStatusView from './views/queue-table-by-status-view.component';
 
 const swrConfiguration = {
   // Maximum number of retries when the backend returns an error

packages/esm-service-queues-app/src/views/queue-table-by-status-view.component.tsx

@@ -3,10 +3,10 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { useParams } from 'react-router-dom';
 import { useQueue } from '../hooks/useQueue';
-import { QueueTableByStatus } from '../queue-table/queue-table-by-status.component';
+import QueueTableByStatus from '../queue-table/queue-table-by-status.component';
 import { QueueTableByStatusSkeleton } from '../queue-table/queue-table-by-status-skeleton.component';
 
-export const QueueTableByStatusView: React.FC = () => {
+const QueueTableByStatusView: React.FC = () => {
   const { queueUuid, statusUuid } = useParams();
   const { queue, isLoading } = useQueue(queueUuid);
   const status = queue?.allowedStatuses.find((s) => s.uuid == statusUuid);
@@ -20,3 +20,5 @@ export const QueueTableByStatusView: React.FC = () => {
     return <QueueTableByStatus selectedQueue={queue} selectedStatus={status} />;
   }
 };
+
+export default QueueTableByStatusView;