@kenyaemr/esm-shr-app 5.4.2-pre.2680 → 5.4.2-pre.2682

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/.turbo/turbo-build.log +4 -4
  2. package/dist/127.js +1 -1
  3. package/dist/235.js +1 -0
  4. package/dist/235.js.map +1 -0
  5. package/dist/358.js +1 -1
  6. package/dist/358.js.map +1 -1
  7. package/dist/40.js +1 -1
  8. package/dist/{807.js → 563.js} +1 -1
  9. package/dist/563.js.map +1 -0
  10. package/dist/706.js +1 -1
  11. package/dist/706.js.map +1 -1
  12. package/dist/916.js +1 -1
  13. package/dist/985.js +1 -0
  14. package/dist/985.js.map +1 -0
  15. package/dist/kenyaemr-esm-shr-app.js +2 -2
  16. package/dist/kenyaemr-esm-shr-app.js.buildmanifest.json +58 -85
  17. package/dist/kenyaemr-esm-shr-app.js.map +1 -1
  18. package/dist/main.js +10 -10
  19. package/dist/main.js.map +1 -1
  20. package/dist/routes.json +1 -1
  21. package/package.json +1 -1
  22. package/src/dashboard.meta.ts +0 -7
  23. package/src/header/referrals-header.component.tsx +6 -17
  24. package/src/index.ts +3 -1
  25. package/src/referrals/referral-tabs/referrals-tab.test.tsx +170 -0
  26. package/src/referrals/referral-tabs/referrals-tabs.component.tsx +52 -33
  27. package/src/referrals/referral-tabs/referrals-tabs.scss +6 -5
  28. package/src/referrals/referrals.component.tsx +14 -10
  29. package/src/referrals-wrap.tsx +1 -17
  30. package/src/routes.json +2 -2
  31. package/src/shr-home.component.tsx +24 -0
  32. package/src/shr-home.scss +6 -0
  33. package/src/types/index.ts +6 -0
  34. package/translations/am.json +6 -1
  35. package/translations/en.json +6 -1
  36. package/translations/sw.json +6 -1
  37. package/dist/548.js +0 -1
  38. package/dist/548.js.map +0 -1
  39. package/dist/807.js.map +0 -1
  40. package/dist/868.js +0 -1
  41. package/dist/868.js.map +0 -1
  42. package/dist/957.js +0 -1
  43. package/dist/957.js.map +0 -1
  44. package/src/header/referrals-illustration.component.tsx +0 -13
  45. package/src/shr-root.component.tsx +0 -15
package/dist/routes.json CHANGED
@@ -1 +1 @@
1
- {"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"kenyaemr":"^19.0.0"},"pages":[{"component":"shrRoot","route":"referrals"}],"extensions":[{"component":"shrAuthorizationForm","name":"shr-authorization-form"},{"name":"patient-chart-shr-summary-dashboard-link","component":"shrSummaryDashboardLink","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-shr-summary-dashboard-slot","path":"SHR Portal"},"featureFlag":"healthInformationExchange"},{"name":"SHR Portal","slot":"patient-chart-shr-summary-dashboard-slot","component":"patientSHRSummary","meta":{"columnSpan":4}},{"name":"referrals","slot":"referrals-slot","component":"shrRoot"},{"name":"referrals-link","slot":"homepage-dashboard-slot","component":"ReferralsDashboardLink","meta":{"name":"referrals","title":"referrals","slot":"referrals-slot"}},{"name":"referral-reasons-dialog","component":"referralReasonsDialogPopup"},{"name":"facility-referral-form","component":"facilityRefferalForm"},{"name":"referral-view-link","component":"referralLink","order":13,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-referral-slot","path":"referral","layoutMode":"anchored"}},{"name":"referral-view","slot":"patient-chart-referral-slot","component":"referralWidget","order":0,"online":true,"offline":false}],"version":"5.4.2-pre.2680"}
1
+ {"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"kenyaemr":"^19.0.0"},"pages":[{"component":"shrHome","route":"referrals"}],"extensions":[{"component":"shrAuthorizationForm","name":"shr-authorization-form"},{"name":"patient-chart-shr-summary-dashboard-link","component":"shrSummaryDashboardLink","meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-shr-summary-dashboard-slot","path":"SHR Portal"},"featureFlag":"healthInformationExchange"},{"name":"SHR Portal","slot":"patient-chart-shr-summary-dashboard-slot","component":"patientSHRSummary","meta":{"columnSpan":4}},{"name":"referrals","slot":"referrals-slot","component":"referralWrap"},{"name":"referrals-link","slot":"homepage-dashboard-slot","component":"ReferralsDashboardLink","meta":{"name":"referrals","title":"referrals","slot":"referrals-slot"}},{"name":"referral-reasons-dialog","component":"referralReasonsDialogPopup"},{"name":"facility-referral-form","component":"facilityRefferalForm"},{"name":"referral-view-link","component":"referralLink","order":13,"meta":{"columns":1,"columnSpan":1,"slot":"patient-chart-referral-slot","path":"referral","layoutMode":"anchored"}},{"name":"referral-view","slot":"patient-chart-referral-slot","component":"referralWidget","order":0,"online":true,"offline":false}],"version":"5.4.2-pre.2682"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kenyaemr/esm-shr-app",
3
- "version": "5.4.2-pre.2680",
3
+ "version": "5.4.2-pre.2682",
4
4
  "description": "Patient care panels microfrontend for the OpenMRS SPA",
5
5
  "keywords": [
6
6
  "openmrs"
@@ -1,10 +1,3 @@
1
- // export const dashboardMeta = {
2
- // slot: 'patient-chart-shr-dashboard-slot',
3
- // columns: 1,
4
- // title: 'SHR panel',
5
- // path: 'SHR panel',
6
- // };
7
-
8
1
  export const referralDashboardMeta = {
9
2
  slot: 'patient-chart-referral-slot',
10
3
  columns: 1,
@@ -1,27 +1,16 @@
1
1
  import React from 'react';
2
2
  import { useTranslation } from 'react-i18next';
3
- import { Calendar, Location } from '@carbon/react/icons';
4
- import { useSession, formatDate, ExtensionSlot } from '@openmrs/esm-framework';
3
+ import { FacilityPictogram, PageHeaderContent, ExtensionSlot, PageHeader } from '@openmrs/esm-framework';
4
+
5
5
  import styles from './referrals-header.scss';
6
- import ReferralsIllustration from './referrals-illustration.component';
7
6
 
8
7
  export const ReferralsHeader: React.FC = () => {
9
8
  const { t } = useTranslation();
10
- const userSession = useSession();
11
- const userLocation = userSession?.sessionLocation?.display;
12
9
 
13
10
  return (
14
- <div className={styles.header}>
15
- <div className={styles['left-justified-items']}>
16
- <ReferralsIllustration />
17
- <div className={styles['page-labels']}>
18
- <p>{t('facilityWide', 'Facility Wide')}</p>
19
- <p className={styles['page-name']}>{t('referrals', 'Referrals')}</p>
20
- </div>
21
- </div>
22
- <div className={styles['right-justified-items']}>
23
- <ExtensionSlot name="provider-banner-info-slot" />
24
- </div>
25
- </div>
11
+ <PageHeader className={styles.header}>
12
+ <PageHeaderContent title={t('referrals', 'Referrals')} illustration={<FacilityPictogram />} />
13
+ <ExtensionSlot name="provider-banner-info-slot" />
14
+ </PageHeader>
26
15
  );
27
16
  };
package/src/index.ts CHANGED
@@ -15,6 +15,7 @@ import SHRAuthorizationForm from './shr-summary/shr-authorization-form.workspace
15
15
  import SHRSummaryPanel from './shr-summary/shr-summary.component';
16
16
  import shrPatientSummaryComponent from './shrpatient-summary/shrpatient-summary.component';
17
17
  import FacilityRefferalForm from './workspace/referrals.workspace.component';
18
+ import ReferralWrap from './referrals-wrap';
18
19
 
19
20
  const moduleName = '@kenyaemr/esm-shr-app';
20
21
 
@@ -46,7 +47,7 @@ export const shrSummaryDashboardLink = getSyncLifecycle(
46
47
  options,
47
48
  );
48
49
 
49
- export const shrRoot = getAsyncLifecycle(() => import('./shr-root.component'), options);
50
+ export const shrHome = getAsyncLifecycle(() => import('./shr-home.component'), options);
50
51
 
51
52
  export const referralReasonsDialogPopup = getSyncLifecycle(ReferralReasonsDialogPopup, {
52
53
  featureName: 'View Referral Reasons',
@@ -64,3 +65,4 @@ export const facilityRefferalForm = getSyncLifecycle(FacilityRefferalForm, optio
64
65
  // SHR Summary
65
66
  export const patientSHRSummary = getSyncLifecycle(SHRSummaryPanel, options);
66
67
  export const shrAuthorizationForm = getSyncLifecycle(SHRAuthorizationForm, options);
68
+ export const referralWrap = getSyncLifecycle(ReferralWrap, options);
@@ -0,0 +1,170 @@
1
+ import React from 'react';
2
+ import { render, screen, waitFor } from '@testing-library/react';
3
+ import userEvent from '@testing-library/user-event';
4
+ import { launchWorkspace, showSnackbar } from '@openmrs/esm-framework';
5
+ import ReferralTabs from './referrals-tabs.component';
6
+ import * as resource from '../refferals.resource';
7
+
8
+ // Mock dependencies
9
+ jest.mock('@openmrs/esm-framework', () => ({
10
+ ...jest.requireActual('@openmrs/esm-framework'),
11
+ launchWorkspace: jest.fn(),
12
+ showSnackbar: jest.fn(),
13
+ useLayoutType: jest.fn(() => 'tablet'),
14
+ isDesktop: jest.fn(() => true),
15
+ }));
16
+
17
+ jest.mock('../refferals.resource', () => ({
18
+ pullFacilityReferrals: jest.fn(),
19
+ }));
20
+
21
+ jest.mock('../referrals.component', () => {
22
+ return jest.fn(({ status }) => <div data-testid={`referral-table-${status}`}>Referral Table - {status}</div>);
23
+ });
24
+
25
+ const mockPullFacilityReferrals = resource.pullFacilityReferrals as jest.MockedFunction<
26
+ typeof resource.pullFacilityReferrals
27
+ >;
28
+
29
+ describe('ReferralTabs', () => {
30
+ beforeEach(() => {
31
+ jest.clearAllMocks();
32
+ });
33
+
34
+ test('should render the referral tabs component with three tabs', () => {
35
+ render(<ReferralTabs />);
36
+
37
+ expect(screen.getByText('From Community')).toBeInTheDocument();
38
+ expect(screen.getByText('From Facility')).toBeInTheDocument();
39
+ expect(screen.getByText('Completed')).toBeInTheDocument();
40
+ });
41
+
42
+ test('should render action buttons for pulling referrals and referring patients', () => {
43
+ render(<ReferralTabs />);
44
+
45
+ const pullReferralsButton = screen.getByRole('button', { name: /Pull Referrals/i });
46
+ const referPatientButton = screen.getByRole('button', { name: /Refer Patient/i });
47
+
48
+ expect(pullReferralsButton).toBeInTheDocument();
49
+ expect(referPatientButton).toBeInTheDocument();
50
+ });
51
+
52
+ test('should display the first tab content (From Community) by default', () => {
53
+ render(<ReferralTabs />);
54
+
55
+ // Check that the active tab's table is visible (not hidden)
56
+ const tabPanels = screen.getAllByRole('tabpanel');
57
+ expect(tabPanels[0]).not.toHaveAttribute('hidden');
58
+ expect(screen.getAllByText('Referral Table - active')).toHaveLength(2); // Two "active" tabs
59
+ });
60
+
61
+ test('should switch to the second tab (From Facility) when clicked', async () => {
62
+ const user = userEvent.setup();
63
+ render(<ReferralTabs />);
64
+
65
+ const facilityTab = screen.getByText('From Facility');
66
+ await user.click(facilityTab);
67
+
68
+ // Verify the tab is selected by checking its aria-selected attribute
69
+ expect(facilityTab.closest('button')).toHaveAttribute('aria-selected', 'true');
70
+ });
71
+
72
+ test('should switch to the third tab (Completed) when clicked', async () => {
73
+ const user = userEvent.setup();
74
+ render(<ReferralTabs />);
75
+
76
+ const completedTab = screen.getByText('Completed');
77
+ await user.click(completedTab);
78
+
79
+ // Verify the tab is selected by checking its aria-selected attribute
80
+ expect(completedTab.closest('button')).toHaveAttribute('aria-selected', 'true');
81
+ });
82
+
83
+ test('should call launchWorkspace when the "Refer Patient" button is clicked', async () => {
84
+ const user = userEvent.setup();
85
+ render(<ReferralTabs />);
86
+
87
+ const referPatientButton = screen.getByRole('button', { name: /Refer Patient/i });
88
+ await user.click(referPatientButton);
89
+
90
+ expect(launchWorkspace).toHaveBeenCalledWith('facility-referral-form', {
91
+ workspaceTitle: 'Referral Form',
92
+ });
93
+ });
94
+
95
+ test('should call pullFacilityReferrals and show success snackbar when "Pull Referrals" button is clicked successfully', async () => {
96
+ const user = userEvent.setup();
97
+ mockPullFacilityReferrals.mockResolvedValueOnce({} as any);
98
+
99
+ render(<ReferralTabs />);
100
+
101
+ const pullReferralsButton = screen.getByRole('button', { name: /Pull Referrals/i });
102
+ await user.click(pullReferralsButton);
103
+
104
+ // Wait for the async operation to complete
105
+ await screen.findByRole('button', { name: /Pull Referrals/i });
106
+
107
+ expect(mockPullFacilityReferrals).toHaveBeenCalledTimes(1);
108
+ expect(showSnackbar).toHaveBeenCalledWith({
109
+ title: 'Success',
110
+ subtitle: 'Referrals pulled successfully',
111
+ kind: 'success',
112
+ isLowContrast: true,
113
+ });
114
+ });
115
+
116
+ // Note: Error handling test for pullFacilityReferrals is complex to test with useSWRMutation
117
+ // The component correctly implements error handling with onError callback and showSnackbar
118
+ // This is validated through manual testing and the implementation code review
119
+
120
+ test('should show loading state when pulling referrals', async () => {
121
+ const user = userEvent.setup();
122
+ let resolvePromise: (value: any) => void;
123
+ const promise = new Promise((resolve) => {
124
+ resolvePromise = resolve;
125
+ });
126
+ mockPullFacilityReferrals.mockReturnValueOnce(promise as any);
127
+
128
+ render(<ReferralTabs />);
129
+
130
+ const pullReferralsButton = screen.getByRole('button', { name: /Pull Referrals/i });
131
+ await user.click(pullReferralsButton);
132
+
133
+ // Check that the loading state is shown
134
+ expect(screen.getByText('Pulling referrals...')).toBeInTheDocument();
135
+ expect(pullReferralsButton).toBeDisabled();
136
+
137
+ // Resolve the promise to clean up
138
+ resolvePromise!({});
139
+ });
140
+
141
+ test('should disable "Pull Referrals" button during loading', async () => {
142
+ const user = userEvent.setup();
143
+ let resolvePromise: (value: any) => void;
144
+ const promise = new Promise((resolve) => {
145
+ resolvePromise = resolve;
146
+ });
147
+ mockPullFacilityReferrals.mockReturnValueOnce(promise as any);
148
+
149
+ render(<ReferralTabs />);
150
+
151
+ const pullReferralsButton = screen.getByRole('button', { name: /Pull Referrals/i });
152
+
153
+ expect(pullReferralsButton).not.toBeDisabled();
154
+
155
+ await user.click(pullReferralsButton);
156
+
157
+ expect(pullReferralsButton).toBeDisabled();
158
+
159
+ // Resolve the promise to clean up
160
+ resolvePromise!({});
161
+ });
162
+
163
+ test('should render correct tab panels for each tab', () => {
164
+ render(<ReferralTabs />);
165
+
166
+ // All tab panels are rendered in the DOM (Carbon tabs behavior)
167
+ const tabPanels = screen.getAllByRole('tabpanel', { hidden: true });
168
+ expect(tabPanels).toHaveLength(3);
169
+ });
170
+ });
@@ -1,42 +1,56 @@
1
- import React, { useState } from 'react';
1
+ import React from 'react';
2
+ import { mutate } from 'swr';
3
+ import useSWRMutation from 'swr/mutation';
2
4
  import { useTranslation } from 'react-i18next';
3
5
  import { Tab, TabList, Tabs, Button, TabPanel, TabPanels, InlineLoading } from '@carbon/react';
4
- import styles from './referrals-tabs.scss';
5
- import ReferralTable from '../referrals.component';
6
+ import { isDesktop, launchWorkspace, useLayoutType, showSnackbar, restBaseUrl } from '@openmrs/esm-framework';
6
7
  import { AirlineManageGates, UpdateNow } from '@carbon/react/icons';
7
- import { launchWorkspace } from '@openmrs/esm-framework';
8
- import { pullFacilityReferrals } from '../refferals.resource';
9
- import { mutate } from 'swr';
10
8
 
11
- interface ReferralTabsProps {
12
- isLoadingFacilityReferrals: boolean;
13
- }
9
+ import ReferralTable from '../referrals.component';
10
+ import { pullFacilityReferrals } from '../refferals.resource';
11
+ import styles from './referrals-tabs.scss';
14
12
 
15
- const ReferralTabs: React.FC<ReferralTabsProps> = () => {
13
+ const ReferralTabs: React.FC = () => {
16
14
  const { t } = useTranslation();
15
+ const layout = useLayoutType();
16
+ const responsiveSize = isDesktop(layout) ? 'md' : 'sm';
17
17
  const [activeTabIndex, setActiveTabIndex] = React.useState<number>(0);
18
- const [isLoadingFacilityReferrals, setIsLoadingFacilityReferrals] = useState(false);
18
+
19
+ const { trigger: pullReferrals, isMutating: isLoadingFacilityReferrals } = useSWRMutation(
20
+ `${restBaseUrl}/kenyaemril/pullFacilityReferrals`,
21
+ async () => {
22
+ return await pullFacilityReferrals();
23
+ },
24
+ {
25
+ onSuccess: () => {
26
+ mutate(
27
+ (key) =>
28
+ typeof key === 'string' && key.startsWith(`${restBaseUrl}/kenyaemril/communityReferrals?status=active`),
29
+ );
30
+ showSnackbar({
31
+ title: t('success', 'Success'),
32
+ subtitle: t('referralsPulledSuccessfully', 'Referrals pulled successfully'),
33
+ kind: 'success',
34
+ isLowContrast: true,
35
+ });
36
+ },
37
+ onError: (error) => {
38
+ showSnackbar({
39
+ title: t('errorPullingReferrals', 'Error pulling referrals'),
40
+ subtitle: error?.message || t('unknownError', 'An unknown error occurred'),
41
+ kind: 'error',
42
+ isLowContrast: true,
43
+ });
44
+ },
45
+ },
46
+ );
19
47
 
20
48
  const handleReferral = () => {
21
49
  launchWorkspace('facility-referral-form', {
22
- workspaceTitle: 'Referral Form',
50
+ workspaceTitle: t('referralForm', 'Referral Form'),
23
51
  });
24
52
  };
25
53
 
26
- const pullReferrals = () => {
27
- setIsLoadingFacilityReferrals(true);
28
- pullFacilityReferrals()
29
- .then((r) => {
30
- mutate(
31
- (key) => typeof key === 'string' && key.startsWith('/ws/rest/v1/kenyaemril/communityReferrals?status=active'),
32
- );
33
- setIsLoadingFacilityReferrals(false);
34
- })
35
- .catch((err) => {
36
- setIsLoadingFacilityReferrals(false);
37
- });
38
- };
39
-
40
54
  const handleTabChange = ({ selectedIndex }: { selectedIndex: number }) => {
41
55
  setActiveTabIndex(selectedIndex);
42
56
  };
@@ -54,31 +68,36 @@ const ReferralTabs: React.FC<ReferralTabsProps> = () => {
54
68
  <div className={styles.actionBtn}>
55
69
  <Button
56
70
  kind="primary"
57
- renderIcon={(props) => <UpdateNow size={20} {...props} />}
71
+ renderIcon={UpdateNow}
58
72
  iconDescription={t('pullReferrals', 'Pull Referrals')}
59
73
  onClick={pullReferrals}
60
74
  className={styles.actionBtn}
75
+ size={responsiveSize}
61
76
  disabled={isLoadingFacilityReferrals}>
62
- {t('pullReferrals', 'Pull Referrals')}
77
+ {isLoadingFacilityReferrals ? (
78
+ <InlineLoading description={t('pullingReferrals', 'Pulling referrals...')} status="active" />
79
+ ) : (
80
+ t('pullReferrals', 'Pull Referrals')
81
+ )}
63
82
  </Button>
64
83
  <Button
65
84
  kind="tertiary"
66
85
  renderIcon={(props) => <AirlineManageGates size={20} {...props} />}
67
86
  onClick={handleReferral}
68
- iconDescription={t('referralPatient', 'Refer Patient')}>
87
+ iconDescription={t('referralPatient', 'Refer Patient')}
88
+ size={responsiveSize}>
69
89
  {t('referralPatient', 'Refer Patient')}
70
90
  </Button>
71
91
  </div>
72
92
  </div>
73
- <div>{isLoadingFacilityReferrals && <InlineLoading description="Pulling referrals..." />}</div>
74
93
  <TabPanels>
75
- <TabPanel className={styles.tabPanel}>
94
+ <TabPanel>
76
95
  <ReferralTable status="active" />
77
96
  </TabPanel>
78
- <TabPanel className={styles.tabPanel}>
97
+ <TabPanel>
79
98
  <ReferralTable status="active" />
80
99
  </TabPanel>
81
- <TabPanel className={styles.tabPanel}>
100
+ <TabPanel>
82
101
  <ReferralTable status="completed" />
83
102
  </TabPanel>
84
103
  </TabPanels>
@@ -16,9 +16,6 @@
16
16
  background-color: $ui-02;
17
17
  border: 1px solid $ui-03;
18
18
  width: 100%;
19
- margin: 0 auto;
20
- max-width: 95vw;
21
- padding-bottom: 0;
22
19
 
23
20
  :has(.filterEmptyState) {
24
21
  border-bottom: none;
@@ -72,7 +69,7 @@
72
69
  justify-content: space-between;
73
70
 
74
71
  &:global(.cds--inline-loading) {
75
- max-height: 1rem;
72
+ max-height: layout.$spacing-05;
76
73
  }
77
74
  }
78
75
 
@@ -193,6 +190,10 @@
193
190
  display: flex;
194
191
  gap: 0.5rem;
195
192
  margin-right: layout.$spacing-05;
193
+
194
+ :global(.cds--inline-loading) {
195
+ min-height: spacing.$spacing-05;
196
+ }
196
197
  }
197
198
 
198
199
  .mainSection {
@@ -204,5 +205,5 @@
204
205
  display: flex;
205
206
  justify-content: space-between;
206
207
  align-items: center;
207
- padding-left: 1rem;
208
+ margin: 0 layout.$spacing-05;
208
209
  }
@@ -18,25 +18,27 @@ import {
18
18
  Link,
19
19
  } from '@carbon/react';
20
20
  import { useLayoutType, isDesktop, usePagination, navigate } from '@openmrs/esm-framework';
21
- import { EmptyState } from '@openmrs/esm-patient-common-lib';
22
21
  import styles from '../referrals/referral-tabs/referrals-tabs.scss';
23
22
  import { useTranslation } from 'react-i18next';
24
23
  import { useCommunityReferrals } from './refferals.resource';
25
24
  import CommunityReferralActions from './referrals-actions.component';
26
25
  import { ReferralReasonsProps } from '../types';
26
+ import { usePaginationInfo } from '@openmrs/esm-patient-common-lib/src';
27
27
 
28
28
  type ReferralProps = {
29
29
  status: string;
30
30
  };
31
31
 
32
- const ReferralTable: React.FC<ReferralProps> = (data) => {
32
+ const DEFAULT_PAGE_SIZE = 10;
33
+
34
+ const ReferralTable: React.FC<ReferralProps> = ({ status }) => {
33
35
  const { t } = useTranslation();
34
- const { referrals, isLoading, isValidating } = useCommunityReferrals(data.status);
36
+ const { referrals, isLoading, isValidating } = useCommunityReferrals(status);
35
37
  const layout = useLayoutType();
36
38
  const [searchString, setSearchString] = useState('');
37
39
  const responsiveSize = isDesktop(layout) ? 'lg' : 'sm';
38
- const pageSizes = [10, 20, 30, 40, 50];
39
- const [pageSize, setPageSize] = useState(10);
40
+ const [pageSize, setPageSize] = useState(DEFAULT_PAGE_SIZE);
41
+ const { pageSizes } = usePaginationInfo(pageSize, referrals?.length, 1, referrals?.length);
40
42
 
41
43
  const setName = (record: any) => {
42
44
  return record.givenName + ' ' + record.middleName + ' ' + record.familyName;
@@ -107,7 +109,7 @@ const ReferralTable: React.FC<ReferralProps> = (data) => {
107
109
  uuid: record.uuid,
108
110
  nupi: record.nupi,
109
111
  name:
110
- data.status === 'active' ? (
112
+ status === 'active' ? (
111
113
  setName(record)
112
114
  ) : (
113
115
  <Link
@@ -122,7 +124,7 @@ const ReferralTable: React.FC<ReferralProps> = (data) => {
122
124
  dateReferred: record.dateReferred,
123
125
  referredFrom: record.referredFrom,
124
126
  referralService: record.referralReasons?.category,
125
- actions: <CommunityReferralActions status={data.status} referralData={referralReasonsx} />,
127
+ actions: <CommunityReferralActions status={status} referralData={referralReasonsx} />,
126
128
  };
127
129
  rowData.push(s);
128
130
  });
@@ -136,9 +138,11 @@ const ReferralTable: React.FC<ReferralProps> = (data) => {
136
138
  [goTo, setSearchString],
137
139
  );
138
140
 
139
- return isLoading ? (
140
- <DataTableSkeleton />
141
- ) : (
141
+ if (isLoading) {
142
+ return <DataTableSkeleton headers={headerData} columnCount={headerData.length} />;
143
+ }
144
+
145
+ return (
142
146
  <div className={styles.serviceContainer}>
143
147
  <FilterableTableHeader
144
148
  handleSearch={handleSearch}
@@ -5,26 +5,10 @@ import { mutate } from 'swr';
5
5
  import { pullFacilityReferrals } from './referrals/refferals.resource';
6
6
 
7
7
  const ReferralWrap: React.FC = () => {
8
- const [isLoadingFacilityReferrals, setIsLoadingFacilityReferrals] = useState(false);
9
-
10
- const pullReferrals = () => {
11
- setIsLoadingFacilityReferrals(true);
12
- pullFacilityReferrals()
13
- .then((r) => {
14
- mutate(
15
- (key) => typeof key === 'string' && key.startsWith('/ws/rest/v1/kenyaemril/communityReferrals?status=active'),
16
- );
17
- setIsLoadingFacilityReferrals(false);
18
- })
19
- .catch((err) => {
20
- setIsLoadingFacilityReferrals(false);
21
- });
22
- };
23
-
24
8
  return (
25
9
  <div className={`omrs-main-content`}>
26
10
  <ReferralsHeader />
27
- <ReferralTabs isLoadingFacilityReferrals />
11
+ <ReferralTabs />
28
12
  </div>
29
13
  );
30
14
  };
package/src/routes.json CHANGED
@@ -5,7 +5,7 @@
5
5
  },
6
6
  "pages": [
7
7
  {
8
- "component": "shrRoot",
8
+ "component": "shrHome",
9
9
  "route": "referrals"
10
10
  }
11
11
  ],
@@ -36,7 +36,7 @@
36
36
  {
37
37
  "name": "referrals",
38
38
  "slot": "referrals-slot",
39
- "component": "shrRoot"
39
+ "component": "referralWrap"
40
40
  },
41
41
  {
42
42
  "name": "referrals-link",
@@ -0,0 +1,24 @@
1
+ import React from 'react';
2
+ import { useLeftNav, WorkspaceContainer } from '@openmrs/esm-framework';
3
+ import { BrowserRouter, Routes, Route } from 'react-router-dom';
4
+
5
+ import styles from './shr-home.scss';
6
+ import ReferralWrap from './referrals-wrap';
7
+
8
+ const SHRHome: React.FC = () => {
9
+ const shrBasePath = window.getOpenmrsSpaBase() + 'referrals';
10
+ useLeftNav({ name: 'shr-dashboard-slot', basePath: shrBasePath });
11
+
12
+ return (
13
+ <BrowserRouter basename={shrBasePath}>
14
+ <main className={styles.container}>
15
+ <Routes>
16
+ <Route path="/" element={<ReferralWrap />} />
17
+ </Routes>
18
+ </main>
19
+ <WorkspaceContainer key="referrals" contextKey="referrals" />
20
+ </BrowserRouter>
21
+ );
22
+ };
23
+
24
+ export default SHRHome;
@@ -0,0 +1,6 @@
1
+ @use '@carbon/colors';
2
+ @use '@carbon/layout';
3
+
4
+ .container {
5
+ background-color: colors.$white-0;
6
+ }
@@ -321,3 +321,9 @@ export interface ReferralError extends Error {
321
321
  statusText?: string;
322
322
  responseBody?: string;
323
323
  }
324
+
325
+ export interface DashboardConfig {
326
+ name: string;
327
+ slot: string;
328
+ title: string;
329
+ }
@@ -17,10 +17,10 @@
17
17
  "destinationFacility": "Destination Facility",
18
18
  "diagnosis": "ምርመራ",
19
19
  "emptyReferralsMessage": "የሪፈራል ዳታ",
20
+ "errorPullingReferrals": "Error pulling referrals",
20
21
  "facilityMissing": "Facility Missing",
21
22
  "facilityReferral": "Facility Referral",
22
23
  "facilityReferSuccess": "",
23
- "facilityWide": "ተቋም አቀፍ",
24
24
  "filterTable": "ሠንጠረዥ አጣራ",
25
25
  "fixValidationErrors": "Please fix the validation errors and try again",
26
26
  "fromCommunity": "ከማህበረሰብ",
@@ -45,6 +45,7 @@
45
45
  "processReferral": "ሪፈራል አስተናግድ",
46
46
  "processReferralError": "ሪፈራል በማስተናገድ ላይ ስህተት",
47
47
  "processReferralSuccess": "ታካሚ በተሳካ ሁኔታ ተመዝግቧል",
48
+ "pullingReferrals": "ሪፈራሎችን ስብ...",
48
49
  "pullReferrals": "ሪፈራሎችን ስብ",
49
50
  "pullSHRRecords": "የSHR መዝገቦችን ስብ",
50
51
  "reaction": "ምላሽ",
@@ -54,10 +55,12 @@
54
55
  "referral": "ሪፈራሎች",
55
56
  "referralDate": "የሪፈራል ቀን",
56
57
  "referralError": "ሪፈራል በማስተናገድ ላይ ስህተት",
58
+ "referralForm": "ሪፈራል ገንቢ",
57
59
  "referralPatient": "ታካሚ ላክ",
58
60
  "referralReasons": "የሪፈራል ምክንያቶች",
59
61
  "referrals": "ሪፈራሎች",
60
62
  "referralService": "መምሪያ",
63
+ "referralsPulledSuccessfully": "Referrals pulled successfully",
61
64
  "referralType": "Referral Type",
62
65
  "referredFrom": "የተላከበት",
63
66
  "referredPatients": "የተላኩ ታካሚዎች",
@@ -80,6 +83,8 @@
80
83
  "status": "ሁኔታ",
81
84
  "submitReferral": "Submit Referral",
82
85
  "submitting": "Submitting...",
86
+ "success": "Success",
87
+ "unknownError": "An unknown error occurred",
83
88
  "validationError": "Validation Error",
84
89
  "value": "ዋጋ",
85
90
  "viewReasons": "ምክንያቶችን እይ",
@@ -17,10 +17,10 @@
17
17
  "destinationFacility": "Destination Facility",
18
18
  "diagnosis": "Diagnosis",
19
19
  "emptyReferralsMessage": " referral data",
20
+ "errorPullingReferrals": "Error pulling referrals",
20
21
  "facilityMissing": "Facility Missing",
21
22
  "facilityReferral": "Facility Referral",
22
23
  "facilityReferSuccess": "",
23
- "facilityWide": "Facility Wide",
24
24
  "filterTable": "Filter table",
25
25
  "fixValidationErrors": "Please fix the validation errors and try again",
26
26
  "fromCommunity": "From Community",
@@ -45,6 +45,7 @@
45
45
  "processReferral": "Process referral",
46
46
  "processReferralError": "Process referral error",
47
47
  "processReferralSuccess": "Patient registered successfully",
48
+ "pullingReferrals": "Pulling referrals...",
48
49
  "pullReferrals": "Pull Referrals",
49
50
  "pullSHRRecords": "Pull SHR Records",
50
51
  "reaction": "Reaction",
@@ -54,10 +55,12 @@
54
55
  "referral": "Referrals",
55
56
  "referralDate": "Referral Date",
56
57
  "referralError": "Error processing referral",
58
+ "referralForm": "Referral Form",
57
59
  "referralPatient": "Refer Patient",
58
60
  "referralReasons": "Referral Reasons",
59
61
  "referrals": "Referrals",
60
62
  "referralService": "Department",
63
+ "referralsPulledSuccessfully": "Referrals pulled successfully",
61
64
  "referralType": "Referral Type",
62
65
  "referredFrom": "Refereed From",
63
66
  "referredPatients": "Referred Patients",
@@ -80,6 +83,8 @@
80
83
  "status": "Status",
81
84
  "submitReferral": "Submit Referral",
82
85
  "submitting": "Submitting...",
86
+ "success": "Success",
87
+ "unknownError": "An unknown error occurred",
83
88
  "validationError": "Validation Error",
84
89
  "value": "Value",
85
90
  "viewReasons": "View reasons",