-
Notifications
You must be signed in to change notification settings - Fork 47
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: KHP3 follow up changes on the providers: Filters, UI (#552)
* (refactor) follow up changes on the provider UI redesign * (refactor) commented out providerHIEFHIRReference functionality * (refactor) addressed the PR suggestions * (refactor) updated the translation
- Loading branch information
1 parent
5e6d3a4
commit 57d4e5e
Showing
17 changed files
with
458 additions
and
487 deletions.
There are no files selected for viewing
47 changes: 3 additions & 44 deletions
47
packages/esm-providers-app/src/component/providers.component.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
98 changes: 0 additions & 98 deletions
98
packages/esm-providers-app/src/content-switcher/content-switcher.component.tsx
This file was deleted.
Oops, something went wrong.
47 changes: 6 additions & 41 deletions
47
packages/esm-providers-app/src/header/providers-header.component.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,53 +1,18 @@ | ||
| import React from 'react'; | ||
| import { useTranslation } from 'react-i18next'; | ||
| import { Calendar, Location } from '@carbon/react/icons'; | ||
| import { useSession, formatDate } from '@openmrs/esm-framework'; | ||
| import { useSession, formatDate, PageHeader } from '@openmrs/esm-framework'; | ||
| import styles from './providers-header.scss'; | ||
| import ProvidersIllustration from './providers-illustration.component'; | ||
| import { MetricCard } from './providers-metrics.component'; | ||
|
|
||
| interface ProviderHeaderProps { | ||
| title: string; | ||
| summarize: { | ||
| all: number; | ||
| active: number; | ||
| expired: number; | ||
| missingNationalId: number; | ||
| missingLicenseOrExpiry: number; | ||
| }; | ||
| } | ||
| export const ProvidersHeader: React.FC<ProviderHeaderProps> = ({ title, summarize }) => { | ||
| export const ProvidersHeader: React.FC = () => { | ||
| const { t } = useTranslation(); | ||
| const userSession = useSession(); | ||
| const userLocation = userSession?.sessionLocation?.display; | ||
|
|
||
| return ( | ||
| <div className={styles.header__section__container}> | ||
| <div className={styles.left__justified__items}> | ||
| <ProvidersIllustration /> | ||
| <div className={styles.page__label}> | ||
| <p className={styles.page__name}>{title}</p> | ||
| <p>{t('providerManagement', 'Providers Management')}</p> | ||
| </div> | ||
| <> | ||
| <div className={styles.header}> | ||
| <PageHeader title={t('providerManagement', 'Providers Management')} illustration={<ProvidersIllustration />} /> | ||
| </div> | ||
| <div className={styles.metrics__header}> | ||
| <MetricCard label={t('all', 'All')} value={summarize.all} /> | ||
| <MetricCard label={t('actives', 'Active')} value={summarize.active} /> | ||
| <MetricCard label={t('expiredlscs', 'Expiring license(s)')} value={summarize.expired} /> | ||
| <MetricCard label={t('missingLicenses', 'Missing license(s)')} value={summarize.missingLicenseOrExpiry} /> | ||
| <MetricCard label={t('missingNational', 'Missing national id')} value={summarize.missingNationalId} /> | ||
|
|
||
| <div className={styles.warp__metrics}> | ||
| <div className={styles.metricLocationDate}> | ||
| <span className={styles.location}> | ||
| <Location size={16} /> {userLocation} | ||
| </span> | ||
| <span className={styles.date}> | ||
| <Calendar size={16} /> {formatDate(new Date(), { mode: 'standard' })} | ||
| </span> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.