@kenyaemr/esm-service-queues-app 8.1.1-pre.121 → 8.1.1-pre.124

package/dist/routes.json

@@ -1 +1 @@
-{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":"^2.2.0","queue":"^2.4.0-0"},"extensions":[{"name":"outpatient-side-nav-ext","component":"outpatientSideNav","slot":"outpatient-sidebar-slot","online":true,"offline":true},{"name":"service-queues-dashboard-link","component":"serviceQueuesDashboardLink","slot":"homepage-dashboard-slot","meta":{"name":"service-queues","slot":"service-queues-dashboard-slot","title":"Service queues"},"online":true,"offline":true},{"name":"queue-table-by-status-menu-dashboard-link","component":"queueTableByStatusMenu","meta":{"name":"service-queues","slot":"service-queues-dashboard-slot","title":"Service queues"},"online":true,"offline":true},{"component":"root","name":"service-queues-dashboard","slot":"service-queues-dashboard-slot"},{"name":"patient-info-banner-slot","component":"patientInfoBannerSlot"},{"name":"remove-queue-entry","component":"removeQueueEntry"},{"name":"clear-all-queue-entries","component":"clearAllQueueEntries"},{"name":"previous-visit-summary-widget","component":"pastVisitSummary","slot":"previous-visit-summary-slot"},{"name":"active-visits-row-actions","component":"activeVisitsRowActions","slot":"queue-table-serve-patient-slot"},{"name":"visit-form-queue-fields","component":"visitFormQueueFields","slot":"visit-form-queue-slot"}],"modals":[{"name":"add-visit-to-queue-modal","component":"addVisitToQueueModal"},{"name":"add-provider-to-room-modal","component":"addProviderToRoomModal"},{"name":"edit-queue-entry-modal","component":"editQueueEntryModal"},{"name":"edit-queue-entry-status-modal","component":"editQueueEntryStatusModal"},{"name":"end-queue-entry-modal","component":"endQueueEntryModal"},{"name":"transition-patient-to-latest-queue-modal","component":"transitionPatientToLatestQueue"},{"name":"transition-queue-entry-modal","component":"transitionQueueEntryModal"},{"name":"transition-queue-entry-status-modal","component":"transitionQueueEntryStatusModal"},{"name":"undo-transition-queue-entry-modal","component":"undoTransitionQueueEntryModal"},{"name":"void-queue-entry-modal","component":"voidQueueEntryModal"}],"workspaces":[{"name":"service-queues-service-form","title":"addNewQueueService","component":"addNewQueueServiceWorkspace","type":"service-queues"},{"name":"service-queues-room-form","title":"addNewQueueServiceRoom","component":"addNewQueueServiceRoomWorkspace","type":"service-queues"},{"name":"service-queues-linelist-filter","title":"filter","component":"queueLinelistFilterWorkspace","type":"service-queues"},{"name":"service-queues-patient-search","title":"searchPatient","component":"patientSearchWorkspace","type":"service-queues"}],"version":"8.1.1-pre.121"}
+{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":"^2.2.0","queue":"^2.4.0-0"},"extensions":[{"name":"outpatient-side-nav-ext","component":"outpatientSideNav","slot":"outpatient-sidebar-slot","online":true,"offline":true},{"name":"service-queues-dashboard-link","component":"serviceQueuesDashboardLink","slot":"homepage-dashboard-slot","meta":{"name":"service-queues","slot":"service-queues-dashboard-slot","title":"Service queues"},"online":true,"offline":true},{"name":"queue-table-by-status-menu-dashboard-link","component":"queueTableByStatusMenu","meta":{"name":"service-queues","slot":"service-queues-dashboard-slot","title":"Service queues"},"online":true,"offline":true},{"component":"root","name":"service-queues-dashboard","slot":"service-queues-dashboard-slot"},{"name":"patient-info-banner-slot","component":"patientInfoBannerSlot"},{"name":"remove-queue-entry","component":"removeQueueEntry"},{"name":"clear-all-queue-entries","component":"clearAllQueueEntries"},{"name":"previous-visit-summary-widget","component":"pastVisitSummary","slot":"previous-visit-summary-slot"},{"name":"active-visits-row-actions","component":"activeVisitsRowActions","slot":"queue-table-serve-patient-slot"},{"name":"visit-form-queue-fields","component":"visitFormQueueFields","slot":"visit-form-queue-slot"}],"modals":[{"name":"add-visit-to-queue-modal","component":"addVisitToQueueModal"},{"name":"add-provider-to-room-modal","component":"addProviderToRoomModal"},{"name":"edit-queue-entry-modal","component":"editQueueEntryModal"},{"name":"edit-queue-entry-status-modal","component":"editQueueEntryStatusModal"},{"name":"end-queue-entry-modal","component":"endQueueEntryModal"},{"name":"transition-patient-to-latest-queue-modal","component":"transitionPatientToLatestQueue"},{"name":"transition-queue-entry-modal","component":"transitionQueueEntryModal"},{"name":"transition-queue-entry-status-modal","component":"transitionQueueEntryStatusModal"},{"name":"undo-transition-queue-entry-modal","component":"undoTransitionQueueEntryModal"},{"name":"void-queue-entry-modal","component":"voidQueueEntryModal"}],"workspaces":[{"name":"service-queues-service-form","title":"addNewQueueService","component":"addNewQueueServiceWorkspace","type":"service-queues"},{"name":"service-queues-room-form","title":"addNewQueueServiceRoom","component":"addNewQueueServiceRoomWorkspace","type":"service-queues"},{"name":"service-queues-linelist-filter","title":"filter","component":"queueLinelistFilterWorkspace","type":"service-queues"},{"name":"service-queues-patient-search","title":"searchPatient","component":"patientSearchWorkspace","type":"service-queues"}],"version":"8.1.1-pre.124"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kenyaemr/esm-service-queues-app",
-  "version": "8.1.1-pre.121",
+  "version": "8.1.1-pre.124",
   "description": "Outpatient front-end module for the OpenMRS SPA",
   "browser": "dist/kenyaemr-esm-service-queues-app.js",
   "main": "src/index.ts",

package/src/patient-search/patient-scheduled-visits.component.tsx

@@ -1,7 +1,6 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import dayjs from 'dayjs';
 import head from 'lodash-es/head';
-import { first } from 'rxjs/operators';
 import { useTranslation } from 'react-i18next';
 import {
   Button,
@@ -113,58 +112,50 @@ const ScheduledVisitsForVisitType: React.FC<{
         const abortController = new AbortController();
 
         saveVisit(payload, abortController)
-          .pipe(first())
-          .subscribe(
-            (response) => {
-              if (response.status === 201) {
-                postQueueEntry(
-                  response.data.uuid,
-                  patientId,
-                  priority,
-                  defaultStatus,
-                  service,
-                  appointment,
-                  selectedQueueLocation,
-                  visitQueueNumberAttributeUuid,
-                ).then(
-                  ({ status }) => {
-                    if (status === 201) {
-                      showSnackbar({
-                        kind: 'success',
-                        title: t('startAVisit', 'Start a visit'),
-                        subtitle: t(
-                          'startVisitQueueSuccessfully',
-                          'Patient has been added to active visits list and queue.',
-                          `${hours} : ${minutes}`,
-                        ),
-                      });
-                      closeWorkspace();
-                      setIsSubmitting(false);
-                      mutateQueueEntries();
-                    }
-                  },
-                  (error) => {
-                    showSnackbar({
-                      title: t('queueEntryError', 'Error adding patient to the queue'),
-                      kind: 'error',
-                      isLowContrast: false,
-                      subtitle: error?.message,
-                    });
-                    setIsSubmitting(false);
-                  },
-                );
-              }
-            },
-            (error) => {
-              showSnackbar({
-                title: t('startVisitError', 'Error starting visit'),
-                kind: 'error',
-                isLowContrast: false,
-                subtitle: error?.message,
+          .then((response) => {
+            postQueueEntry(
+              response.data.uuid,
+              patientId,
+              priority,
+              defaultStatus,
+              service,
+              appointment,
+              selectedQueueLocation,
+              visitQueueNumberAttributeUuid,
+            )
+              .then(() => {
+                showSnackbar({
+                  kind: 'success',
+                  title: t('startAVisit', 'Start a visit'),
+                  subtitle: t(
+                    'startVisitQueueSuccessfully',
+                    'Patient has been added to active visits list and queue.',
+                    `${hours} : ${minutes}`,
+                  ),
+                });
+                closeWorkspace();
+                setIsSubmitting(false);
+                mutateQueueEntries();
+              })
+              .catch((error) => {
+                showSnackbar({
+                  title: t('queueEntryError', 'Error adding patient to the queue'),
+                  kind: 'error',
+                  isLowContrast: false,
+                  subtitle: error?.message,
+                });
+                setIsSubmitting(false);
               });
-              setIsSubmitting(false);
-            },
-          );
+          })
+          .catch((error) => {
+            showSnackbar({
+              title: t('startVisitError', 'Error starting visit'),
+              kind: 'error',
+              isLowContrast: false,
+              subtitle: error?.message,
+            });
+            setIsSubmitting(false);
+          });
       }
     },
     [

package/src/patient-search/visit-form/visit-form.component.tsx

@@ -1,6 +1,5 @@
-import React, { useEffect, useState, useMemo, useCallback, useRef } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import dayjs from 'dayjs';
-import { first } from 'rxjs/operators';
 import {
   Button,
   ButtonSet,
@@ -67,7 +66,7 @@ const VisitForm: React.FC<VisitFormProps> = ({ patientUuid, closeWorkspace }) =>
   const [visitTime, setVisitTime] = useState(dayjs(new Date()).format('hh:mm'));
   const state = useMemo(() => ({ patientUuid }), [patientUuid]);
   const [ignoreChanges, setIgnoreChanges] = useState(true);
-  const { activePatientEnrollment, isLoading } = useActivePatientEnrollment(patientUuid);
+  const { activePatientEnrollment } = useActivePatientEnrollment(patientUuid);
   const [enrollment, setEnrollment] = useState<PatientProgram>(activePatientEnrollment[0]);
   const { mutateQueueEntries } = useMutateQueueEntries();
   const visitQueueNumberAttributeUuid = config.visitQueueNumberAttributeUuid;
@@ -116,56 +115,50 @@ const VisitForm: React.FC<VisitFormProps> = ({ patientUuid, closeWorkspace }) =>
 
       const abortController = new AbortController();
 
-      saveVisit(payload, abortController)
-        .pipe(first())
-        .subscribe(
-          (response) => {
-            if (response.status === 201) {
-              // add new queue entry if visit created successfully
-              postQueueEntry(
-                response.data.uuid,
-                service,
-                patientUuid,
-                priority,
-                status,
-                sortWeight,
-                queueLocation,
-                visitQueueNumberAttributeUuid,
-              ).then(
-                ({ status }) => {
-                  if (status === 201) {
-                    showSnackbar({
-                      kind: 'success',
-                      isLowContrast: true,
-                      title: t('startAVisit', 'Start a visit'),
-                      subtitle: t(
-                        'startVisitQueueSuccessfully',
-                        'Patient has been added to active visits list and queue.',
-                        `${hours} : ${minutes}`,
-                      ),
-                    });
-                    closeWorkspace();
-                    mutateQueueEntries();
-                  }
-                },
-                (error) => {
-                  showSnackbar({
-                    title: t('queueEntryError', 'Error adding patient to the queue'),
-                    kind: 'error',
-                    subtitle: error?.message,
-                  });
-                },
-              );
-            }
-          },
-          (error) => {
+      saveVisit(payload, abortController).then((response) => {
+        // add new queue entry if visit created successfully
+        postQueueEntry(
+          response.data.uuid,
+          service,
+          patientUuid,
+          priority,
+          status,
+          sortWeight,
+          queueLocation,
+          visitQueueNumberAttributeUuid,
+        )
+          .then(() => {
+            showSnackbar({
+              kind: 'success',
+              isLowContrast: true,
+              title: t('startAVisit', 'Start a visit'),
+              subtitle: t(
+                'startVisitQueueSuccessfully',
+                'Patient has been added to active visits list and queue.',
+                `${hours} : ${minutes}`,
+              ),
+            });
+            closeWorkspace();
+            setIsSubmitting(false);
+            mutateQueueEntries();
+          })
+          .catch((error) => {
+            showSnackbar({
+              title: t('queueEntryError', 'Error adding patient to the queue'),
+              kind: 'error',
+              subtitle: error?.message,
+            });
+            setIsSubmitting(false);
+          })
+          .catch((error) => {
             showSnackbar({
               title: t('startVisitError', 'Error starting visit'),
               kind: 'error',
               subtitle: error?.message,
             });
-          },
-        );
+            setIsSubmitting(false);
+          });
+      });
     },
     [
       closeWorkspace,
@@ -181,9 +174,9 @@ const VisitForm: React.FC<VisitFormProps> = ({ patientUuid, closeWorkspace }) =>
     ],
   );
 
-  const handleOnChange = () => {
+  const handleOnChange = useCallback(() => {
     setIgnoreChanges((prevState) => !prevState);
-  };
+  }, []);
 
   return (
     <Form className={styles.form} onChange={handleOnChange} onSubmit={handleSubmit}>

package/src/queue-table/default-queue-table.component.tsx

@@ -133,17 +133,18 @@ function DefaultQueueTable() {
               queueUuid={null}
               statusUuid={null}
               ExpandedRow={QueueTableExpandedRow}
-              tableFilter={[
-                <QueueDropdownFilter />,
-                <StatusDropdownFilter />,
-                <TableToolbarSearch
-                  className={styles.search}
-                  onChange={(e) => setSearchTerm(e.target.value)}
-                  placeholder={t('searchThisList', 'Search this list')}
-                  size={isDesktop(layout) ? 'sm' : 'lg'}
-                />,
-                <ClearQueueEntries queueEntries={filteredQueueEntries} />,
-              ]}
+              tableFilters={
+                <>
+                  <QueueDropdownFilter /> <StatusDropdownFilter />
+                  <TableToolbarSearch
+                    className={styles.search}
+                    onChange={(e) => setSearchTerm(e.target.value)}
+                    placeholder={t('searchThisList', 'Search this list')}
+                    size={isDesktop(layout) ? 'sm' : 'lg'}
+                  />
+                  <ClearQueueEntries queueEntries={filteredQueueEntries} />
+                </>
+              }
             />
           </div>
         ) : (
@@ -160,17 +161,17 @@ function QueueDropdownFilter() {
   const layout = useLayoutType();
   const { services } = useQueueServices();
   const selectedService = useSelectedService();
-  const handleServiceChange = ({ selectedItem }) => {
+
+  const handleServiceChange = useCallback(({ selectedItem }) => {
     updateSelectedService(selectedItem.uuid, selectedItem?.display);
-    mutateQueueEntries.mutateQueueEntries();
-  };
+  }, []);
 
   return (
     <>
       <div className={styles.filterContainer}>
         <Dropdown
           id="serviceFilter"
-          titleText={t('filterByService', 'Filter by service :')}
+          titleText={t('filterByService', 'Filter by service:')}
           label={selectedService?.serviceDisplay ?? t('all', 'All')}
           type="inline"
           items={[{ display: `${t('all', 'All')}` }, ...(services ?? [])]}
@@ -197,7 +198,7 @@ function StatusDropdownFilter() {
       <div className={styles.filterContainer}>
         <Dropdown
           id="statusFilter"
-          titleText={t('filterByStatus', 'Filter by status :')}
+          titleText={t('filterByStatus', 'Filter by status:')}
           label={queueStatus?.statusDisplay ?? t('all', 'All')}
           type="inline"
           items={[{ display: `${t('all', 'All')}` }, ...(statuses ?? [])]}

package/src/queue-table/queue-table-by-status-menu.component.tsx

@@ -18,7 +18,7 @@ export default function QueueTableByStatusMenu() {
     <SideNavMenu title={t('serviceQueues', 'Service queues')} className={styles.queueTableByStatusNavMenu}>
       <BrowserRouter>
         {queues.map((queue) => (
-          <QueueTableByStatusLink queue={queue} />
+          <QueueTableByStatusLink key={queue.uuid} queue={queue} />
         ))}
       </BrowserRouter>
     </SideNavMenu>

package/src/queue-table/queue-table-metrics.component.tsx

@@ -20,7 +20,12 @@ function QueueTableMetrics({ selectedQueue }: QueueTableMetricsProps) {
       <QueueTableMetricsCard value={count} headerLabel={t('totalPatients', 'Total Patients')} />
       {allowedStatuses?.map((status) => {
         return (
-          <QueueTableMetricsCard queueUuid={selectedQueue.uuid} status={status.uuid} headerLabel={status.display} />
+          <QueueTableMetricsCard
+            headerLabel={status.display}
+            key={status.uuid}
+            queueUuid={selectedQueue.uuid}
+            status={status.uuid}
+          />
         );
       })}
     </div>

package/src/queue-table/queue-table.component.tsx

@@ -46,7 +46,7 @@ interface QueueTableProps {
   ExpandedRow?: FC<{ queueEntry: QueueEntry }>;
 
   // if provided, adds addition table toolbar elements
-  tableFilter?: React.ReactNode[];
+  tableFilters?: React.ReactNode;
 
   isLoading?: boolean;
 }
@@ -58,7 +58,7 @@ function QueueTable({
   statusUuid,
   queueTableColumnsOverride,
   ExpandedRow,
-  tableFilter,
+  tableFilters,
   isLoading,
 }: QueueTableProps) {
   const { t } = useTranslation();
@@ -80,7 +80,7 @@ function QueueTable({
     paginatedQueueEntries?.map((queueEntry) => {
       const row: Record<string, JSX.Element | string> = { id: queueEntry.uuid };
       columns.forEach(({ key, CellComponent }) => {
-        row[key] = <CellComponent queueEntry={queueEntry} />;
+        row[key] = <CellComponent key={key} queueEntry={queueEntry} />;
       });
       return row;
     }) ?? [];
@@ -111,9 +111,9 @@ function QueueTable({
                 </span>
               ) : null}
 
-              {tableFilter && (
+              {tableFilters && (
                 <TableToolbar {...getToolbarProps()}>
-                  <TableToolbarContent className={styles.toolbarContent}>{tableFilter}</TableToolbarContent>
+                  <TableToolbarContent className={styles.toolbarContent}>{tableFilters}</TableToolbarContent>
                 </TableToolbar>
               )}
             </div>
@@ -121,8 +121,8 @@ function QueueTable({
               <TableHead>
                 <TableRow>
                   {ExpandedRow && <TableExpandHeader enableToggle {...getExpandHeaderProps()} />}
-                  {headers.map((header, i) => (
-                    <TableHeader key={i} {...getHeaderProps({ header })}>
+                  {headers.map((header) => (
+                    <TableHeader key={header.key} {...getHeaderProps({ header })}>
                       {header.header}
                     </TableHeader>
                   ))}
@@ -146,7 +146,10 @@ function QueueTable({
                         ))}
                       </Row>
                       {ExpandedRow && row.isExpanded && (
-                        <TableExpandedRow className={styles.expandedActiveVisitRow} colSpan={headers.length + 1}>
+                        <TableExpandedRow
+                          key={i}
+                          className={styles.expandedActiveVisitRow}
+                          colSpan={headers.length + 1}>
                           <ExpandedRow queueEntry={paginatedQueueEntries[i]} />
                         </TableExpandedRow>
                       )}

package/src/queue-table/queue-table.scss

@@ -28,6 +28,10 @@
 }
 
 .filterContainer {
+  label {
+    margin-right: layout.$spacing-03 !important;
+  }
+
   :global(.cds--dropdown__wrapper--inline) {
     gap: 0;
   }
@@ -97,6 +101,7 @@
   .toolbarContent {
     display: flex;
     z-index: 1; // prevent dropdown from getting covered by table elements
+    column-gap: layout.$spacing-03;
   }
 
   :global(.cds--table-toolbar) {

package/src/remove-queue-entry-dialog/remove-queue-entry.component.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button, ModalBody, ModalFooter, ModalHeader } from '@carbon/react';
 import { parseDate, showSnackbar, useVisit } from '@openmrs/esm-framework';
@@ -20,7 +20,7 @@ const RemoveQueueEntryDialog: React.FC<RemoveQueueEntryDialogProps> = ({ queueEn
 
   const { data: appointments } = useCheckedInAppointments(queueEntry.patientUuid, startOfDay);
 
-  const removeQueueEntry = () => {
+  const removeQueueEntry = useCallback(() => {
     const endCurrentVisitPayload = {
       location: currentVisit?.location?.uuid,
       startDatetime: parseDate(currentVisit?.startDatetime),
@@ -37,25 +37,26 @@ const RemoveQueueEntryDialog: React.FC<RemoveQueueEntryDialogProps> = ({ queueEn
       endCurrentVisitPayload,
       queueEntry.visitUuid,
       appointments,
-    ).then((response) => {
-      closeModal();
-      mutateQueueEntries();
-      showSnackbar({
-        isLowContrast: true,
-        kind: 'success',
-        subtitle: t('queueEntryRemovedSuccessfully', `Queue entry removed successfully`),
-        title: t('queueEntryRemoved', 'Queue entry removed'),
-      });
-      (error) => {
+    )
+      .then(() => {
+        closeModal();
+        mutateQueueEntries();
+        showSnackbar({
+          isLowContrast: true,
+          kind: 'success',
+          subtitle: t('queueEntryRemovedSuccessfully', `Queue entry removed successfully`),
+          title: t('queueEntryRemoved', 'Queue entry removed'),
+        });
+      })
+      .catch((error) => {
         showSnackbar({
           title: t('removeQueueEntryError', 'Error removing queue entry'),
           kind: 'error',
           isLowContrast: false,
           subtitle: error?.message,
         });
-      };
-    });
-  };
+      });
+  }, [appointments, currentVisit, queueEntry]);
 
   return (
     <div>

package/src/remove-queue-entry-dialog/remove-queue-entry.resource.ts

@@ -1,16 +1,14 @@
-import { openmrsFetch, restBaseUrl, updateVisit } from '@openmrs/esm-framework';
 import dayjs from 'dayjs';
-import { endPatientStatus } from '../active-visits/active-visits-table.resource';
-import { type AppointmentsFetchResponse, type EndVisitPayload } from '../types';
 import useSWR from 'swr';
+import { openmrsFetch, restBaseUrl, updateVisit } from '@openmrs/esm-framework';
+import { type AppointmentsFetchResponse, type EndVisitPayload } from '../types';
+import { endPatientStatus } from '../active-visits/active-visits-table.resource';
 import { omrsDateFormat, timeZone } from '../constants';
-import { first } from 'rxjs/operators';
 
 const statusChangeTime = dayjs(new Date()).format(omrsDateFormat);
 
 export async function endQueueEntry(
   queueUuid: string,
-
   queueEntryUuid: string,
   endedAt: Date,
   endCurrentVisitPayload: EndVisitPayload,
@@ -21,31 +19,27 @@ export async function endQueueEntry(
 
   if (endCurrentVisitPayload) {
     if (appointments?.length) {
-      appointments.forEach(async (appointment) => {
-        await Promise.all([changeAppointmentStatus('Completed', appointment.uuid)]);
-      });
+      await Promise.all(
+        appointments.map(async (appointment) => {
+          await changeAppointmentStatus('Completed', appointment.uuid);
+        }),
+      );
     }
 
-    await Promise.all([endPatientStatus(queueUuid, queueEntryUuid, endedAt)]);
+    await endPatientStatus(queueUuid, queueEntryUuid, endedAt);
 
-    return updateVisit(visitUuid, endCurrentVisitPayload, abortController)
-      .pipe(first())
-      .subscribe(
-        (response) => {
-          return response.status;
-        },
-        (error) => {
-          return error;
-        },
-      );
+    try {
+      const response = await updateVisit(visitUuid, endCurrentVisitPayload, abortController);
+      return response.status;
+    } catch (error) {
+      return error;
+    }
   } else {
-    return await Promise.all([endPatientStatus(queueUuid, queueEntryUuid, endedAt)])
-      .then((res) => {
-        return res;
-      })
-      .catch((error) => {
-        return error;
-      });
+    try {
+      return await endPatientStatus(queueUuid, queueEntryUuid, endedAt);
+    } catch (error) {
+      return error;
+    }
   }
 }
 

package/translations/en.json

@@ -83,8 +83,8 @@
   "femaleLabelText": "Female",
   "fields": "of the following fields",
   "filter": "Filter",
-  "filterByService": "Filter by service :",
-  "filterByStatus": "Filter by status :",
+  "filterByService": "Filter by service:",
+  "filterByStatus": "Filter by status:",
   "filterTable": "Filter table",
   "firstName": "First name",
   "firstNameSort": "First name (a-z)",