-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #170 from openmsupply/154-scheduled-notifications-…
…allow-users-be-able-to-add-or-delete-the-queries-to-use-in-their-notification 154 scheduled notifications allow users be able to add or delete the queries to use in their notification
- Loading branch information
Showing
13 changed files
with
333 additions
and
136 deletions.
There are no files selected for viewing
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
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
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
202 changes: 99 additions & 103 deletions
202
frontend/packages/system/src/Notifications/Pages/Scheduled/ScheduledNotificationEditForm.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,129 +1,125 @@ | ||
| import React from 'react'; | ||
| import { | ||
| BasicTextInput, | ||
| Box, | ||
| BufferedTextArea, | ||
| DateTimeInput, | ||
| Select, | ||
| Typography, | ||
| useQueryParamsState, | ||
| useTranslation, | ||
| } from '@notify-frontend/common'; | ||
| import { ScheduledNotification } from '../../types'; | ||
| import { SqlQuerySelector } from '../../components'; | ||
|
|
||
| const dummySqlQueries = [ | ||
| { | ||
| id: '1', | ||
| name: 'Last Sync By Province', | ||
| query: `SELECT | ||
| category3 AS project, category1_level2 AS province, | ||
| COUNT(last_sync_date) AS num_of_stores_synced_once | ||
| FROM store_categories sc | ||
| JOIN store s ON sc.code = s.code | ||
| JOIN ( | ||
| SELECT site_id, MAX(date) AS last_sync_date FROM site_log GROUP BY site_id | ||
| ) sl ON s.sync_id_remote_site = sl.site_id | ||
| WHERE mode IN ('store', 'dispensary') | ||
| AND sc.disabled = false | ||
| AND category3 IN ({{project}}) | ||
| AND category1_level2 IN ({{province}}) | ||
| GROUP BY category3, category1_level2`, | ||
| parameters: ['project', 'province'], | ||
| }, | ||
| { | ||
| id: '2', | ||
| name: 'First Stock Take', | ||
| query: `SELECT | ||
| category3 AS project, category1_level2 AS province, | ||
| COUNT(first_stock_take_date) AS first_stock_take_date | ||
| FROM store_categories sc | ||
| JOIN store s ON sc.code = s.code | ||
| JOIN ( | ||
| SELECT store_id, MAX(stock_take_created_date) AS fist_stock_take_date FROM stock_take GROUP BY store_id | ||
| ) st ON s.id = st.store_id | ||
| WHERE mode IN ('store', 'dispensary') | ||
| AND sc.disabled = false | ||
| AND category3 IN ({{project}}) | ||
| AND category1_level2 IN ({{province}}) | ||
| GROUP BY category3, category1_level2 `, | ||
| parameters: ['project', 'province'], | ||
| }, | ||
| ]; | ||
| import { useNotificationQueries } from 'packages/system/src/Queries/api'; | ||
|
|
||
| type ScheduledNotificationEditFormProps = { | ||
| onUpdate: (patch: Partial<ScheduledNotification>) => void; | ||
| draft: ScheduledNotification; | ||
| }; | ||
|
|
||
| const FormRow = ({ | ||
| title, | ||
| children, | ||
| }: { | ||
| title: string; | ||
| children: React.ReactNode; | ||
| }) => ( | ||
| <Box padding={1}> | ||
| <Typography sx={{ fontWeight: 700, fontSize: '13px', marginBottom: '2px' }}> | ||
| {title} | ||
| </Typography> | ||
| <Box paddingLeft={1}>{children}</Box> | ||
| </Box> | ||
| ); | ||
|
|
||
| export const ScheduledNotificationEditForm = ({ | ||
| onUpdate, | ||
| draft, | ||
| }: ScheduledNotificationEditFormProps) => { | ||
| const t = useTranslation('system'); | ||
| return ( | ||
| <> | ||
| <BasicTextInput | ||
| autoFocus | ||
| value={draft.subjectTemplate} | ||
| required | ||
| onChange={e => | ||
| onUpdate({ | ||
| subjectTemplate: e.target | ||
| .value as ScheduledNotification['subjectTemplate'], | ||
| }) | ||
| } | ||
| label={t('label.subject-template')} | ||
| InputLabelProps={{ shrink: true }} | ||
| /> | ||
| <BufferedTextArea | ||
| value={draft.bodyTemplate} | ||
| onChange={e => onUpdate({ bodyTemplate: e.target.value })} | ||
| label={t('label.body-template')} | ||
| InputProps={{ sx: { backgroundColor: 'background.menu' } }} | ||
| InputLabelProps={{ shrink: true }} | ||
| /> | ||
|
|
||
| <BufferedTextArea | ||
| value={draft.parameters} | ||
| onChange={e => onUpdate({ parameters: e.target.value })} | ||
| label={t('label.parameters')} | ||
| InputProps={{ sx: { backgroundColor: 'background.menu' } }} | ||
| InputLabelProps={{ shrink: true }} | ||
| /> | ||
| <Typography sx={{ fontWeight: 700, fontSize: '13px' }}> | ||
| Queries | ||
| </Typography> | ||
| <SqlQuerySelector records={dummySqlQueries} /> | ||
| const { queryParams } = useQueryParamsState(); | ||
|
|
||
| <Typography | ||
| sx={{ fontWeight: 700, fontSize: '13px', marginBottom: '2px' }} | ||
| > | ||
| Schedule | ||
| </Typography> | ||
| <Typography sx={{ fontSize: '10px' }}>Starting From</Typography> | ||
| <DateTimeInput | ||
| onChange={d => | ||
| onUpdate({ | ||
| scheduleStartTime: d as ScheduledNotification['scheduleStartTime'], | ||
| }) | ||
| } | ||
| date={draft.scheduleStartTime} | ||
| /> | ||
| <Typography sx={{ fontSize: '10px' }}>Repeat</Typography> | ||
| <Select | ||
| value={draft.scheduleFrequency} | ||
| disabled={false} | ||
| onChange={e => | ||
| onUpdate({ | ||
| scheduleFrequency: e.target | ||
| .value as ScheduledNotification['scheduleFrequency'], | ||
| }) | ||
| } | ||
| options={[ | ||
| { label: t('label.daily'), value: 'daily' }, | ||
| { label: t('label.weekly'), value: 'weekly' }, | ||
| { label: t('label.monthly'), value: 'monthly' }, | ||
| ]} | ||
| /> | ||
| </> | ||
| const { data, isLoading } = useNotificationQueries(queryParams); | ||
| const queries = data?.nodes ?? []; | ||
|
|
||
| return ( | ||
| <Box paddingTop={1}> | ||
| <FormRow title={t('label.details')}> | ||
| <BasicTextInput | ||
| autoFocus | ||
| value={draft.subjectTemplate} | ||
| required | ||
| onChange={e => | ||
| onUpdate({ | ||
| subjectTemplate: e.target | ||
| .value as ScheduledNotification['subjectTemplate'], | ||
| }) | ||
| } | ||
| label={t('label.subject-template')} | ||
| InputLabelProps={{ shrink: true }} | ||
| /> | ||
| </FormRow> | ||
| <FormRow title=""> | ||
| <BufferedTextArea | ||
| value={draft.bodyTemplate} | ||
| onChange={e => onUpdate({ bodyTemplate: e.target.value })} | ||
| label={t('label.body-template')} | ||
| InputProps={{ sx: { backgroundColor: 'background.menu' } }} | ||
| InputLabelProps={{ shrink: true }} | ||
| /> | ||
| </FormRow> | ||
| <FormRow title=""> | ||
| <BufferedTextArea | ||
| value={draft.parameters} | ||
| onChange={e => onUpdate({ parameters: e.target.value })} | ||
| label={t('label.parameters')} | ||
| InputProps={{ sx: { backgroundColor: 'background.menu' } }} | ||
| InputLabelProps={{ shrink: true }} | ||
| /> | ||
| </FormRow> | ||
| <Box padding={1}> | ||
| <Typography sx={{ fontWeight: 700, fontSize: '13px' }}> | ||
| {t('label.queries')} | ||
| </Typography> | ||
| <SqlQuerySelector | ||
| allQueries={queries} | ||
| selectedQueryIds={draft.notificationQueryIds} | ||
| isLoading={isLoading} | ||
| setSelection={props => { | ||
| onUpdate(props as Partial<ScheduledNotification>); | ||
| }} | ||
| /> | ||
| </Box> | ||
| <FormRow title={t('label.schedule')}> | ||
| <Typography sx={{ fontSize: '10px' }}>Starting From</Typography> | ||
| <DateTimeInput | ||
| onChange={d => | ||
| onUpdate({ | ||
| scheduleStartTime: | ||
| d as ScheduledNotification['scheduleStartTime'], | ||
| }) | ||
| } | ||
| date={draft.scheduleStartTime} | ||
| /> | ||
| <Typography sx={{ fontSize: '10px', paddingTop: 1 }}>Repeat</Typography> | ||
| <Select | ||
| value={draft.scheduleFrequency} | ||
| disabled={false} | ||
| onChange={e => | ||
| onUpdate({ | ||
| scheduleFrequency: e.target | ||
| .value as ScheduledNotification['scheduleFrequency'], | ||
| }) | ||
| } | ||
| options={[ | ||
| { label: t('label.daily'), value: 'daily' }, | ||
| { label: t('label.weekly'), value: 'weekly' }, | ||
| { label: t('label.monthly'), value: 'monthly' }, | ||
| ]} | ||
| /> | ||
| </FormRow> | ||
| </Box> | ||
| ); | ||
| }; |
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.