Skip to content

Commit efd4889

Browse files
authored
[NGO Admin] Fix monitoring observers bugs (#872)
* fix: make dropdown menus scrollable * fix: truncate overflowing table columns * Squashed commit of the following: commit 742f250 Author: imdeaconu <imdeaconu@gmail.com> Date: Wed Sep 11 19:54:55 2024 +0300 add read notification checkmark commit ea11fa0 Author: imdeaconu <imdeaconu@gmail.com> Date: Wed Sep 11 19:54:30 2024 +0300 add read notification column * Squashed commit of the following: commit d8833dc Author: imdeaconu <imdeaconu@gmail.com> Date: Fri Sep 13 13:29:31 2024 +0300 WIP: add selector functionality commit 3608c0e Author: imdeaconu <imdeaconu@gmail.com> Date: Fri Sep 13 10:00:05 2024 +0300 WIP: create new tags input * chore: remove unused import * chore: delete duplicated / unused classes * feature: add searching to MonitoringObserversTagFilter * chore: update config files * Revert "[NGO Admin] Rewrite the tag selector component (#675)" This reverts commit 2ad0e90. * Merge branch 'main' of https://github.com/commitglobal/votemonitor into commitglobal-main * WIP: rename prop for alternative filter key in Observer Tags and add it to the Push Message form * WIP: fix push messages receipients query not invalidating after edits * invalidate targeted observers query after a morning observer is added
1 parent 35da3dd commit efd4889

File tree

9 files changed

+38
-34
lines changed

9 files changed

+38
-34
lines changed

web/src/features/filtering/components/ActiveFilters.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
1+
import { useDataSource } from '@/common/data-source-store';
12
import { DateTimeFormat } from '@/common/formats';
3+
import { DataSources } from '@/common/types';
24
import { FilterBadge } from '@/components/ui/badge';
35
import { useCurrentElectionRoundStore } from '@/context/election-round.store';
6+
import { useCoalitionDetails } from '@/features/election-event/hooks/coalition-hooks';
47
import { useFormSubmissionsFilters } from '@/features/responses/hooks/form-submissions-queries';
58
import {
69
mapFormSubmissionFollowUpStatus,
@@ -12,9 +15,6 @@ import { useNavigate } from '@tanstack/react-router';
1215
import { format } from 'date-fns/format';
1316
import { FC, useCallback } from 'react';
1417
import { FILTER_KEY, FILTER_LABEL } from '../filtering-enums';
15-
import { useDataSource } from '@/common/data-source-store';
16-
import { useCoalitionDetails } from '@/features/election-event/hooks/coalition-hooks';
17-
import { DataSources } from '@/common/types';
1818

1919
interface ActiveFilterProps {
2020
filterId: string;
@@ -50,7 +50,7 @@ const FILTER_LABELS = new Map<string, string>([
5050
[FILTER_KEY.LocationL3, FILTER_LABEL.LocationL3],
5151
[FILTER_KEY.LocationL4, FILTER_LABEL.LocationL4],
5252
[FILTER_KEY.LocationL5, FILTER_LABEL.LocationL5],
53-
[FILTER_KEY.FormSubmissionsMonitoringObserverTags, FILTER_LABEL.FormSubmissionsMonitoringObserverTags],
53+
[FILTER_KEY.TagsFilter, FILTER_LABEL.TagsFilter],
5454
[FILTER_KEY.PollingStationNumber, FILTER_LABEL.PollingStationNumber],
5555
[FILTER_KEY.FormId, FILTER_LABEL.FormId],
5656
[FILTER_KEY.FormStatusFilter, FILTER_LABEL.FormStatus],
@@ -120,7 +120,8 @@ export const ActiveFilters: FC<ActiveFiltersProps> = ({ queryParams }) => {
120120
.filter(([filterId, value]) => isNotNilOrWhitespace(value?.toString()))
121121
.filter(
122122
([filterId, value]) =>
123-
filterId !== FILTER_KEY.CoalitionMemberId || (dataSource === DataSources.Coalition && filterId === FILTER_KEY.CoalitionMemberId)
123+
filterId !== FILTER_KEY.CoalitionMemberId ||
124+
(dataSource === DataSources.Coalition && filterId === FILTER_KEY.CoalitionMemberId)
124125
)
125126
.map(([filterId, value]) => {
126127
let key = '';

web/src/features/filtering/filtering-enums.ts

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export const enum FILTER_KEY {
1616
LocationL4 = 'level4Filter',
1717
LocationL5 = 'level5Filter',
1818
PollingStationNumber = 'pollingStationNumberFilter',
19-
FormSubmissionsMonitoringObserverTags = 'tagsFilter',
19+
TagsFilter = 'tagsFilter',
2020
ViewBy = 'viewBy',
2121
Tab = 'tab',
2222
FormId = 'formId',
@@ -25,10 +25,10 @@ export const enum FILTER_KEY {
2525
FromDate = 'submissionsFromDate',
2626
ToDate = 'submissionsToDate',
2727
SearchText = 'searchText',
28-
QuickReportIncidentCategory ='incidentCategory',
29-
QuickReportFollowUpStatus ='quickReportFollowUpStatus',
30-
HasQuickReports ='hasQuickReports',
31-
DataSource ='dataSource',
28+
QuickReportIncidentCategory = 'incidentCategory',
29+
QuickReportFollowUpStatus = 'quickReportFollowUpStatus',
30+
HasQuickReports = 'hasQuickReports',
31+
DataSource = 'dataSource',
3232
CoalitionMemberId = 'coalitionMemberId',
3333
}
3434

@@ -46,15 +46,15 @@ export const enum FILTER_LABEL {
4646
LocationL4 = 'Location - L4',
4747
LocationL5 = 'Location - L5',
4848
PollingStationNumber = 'Polling station number',
49-
FormSubmissionsMonitoringObserverTags = 'Observer tags',
49+
TagsFilter = 'Observer tags',
5050
MediaFiles = 'Has attachments',
5151
FormId = 'Form',
5252
FormStatus = 'Form status',
5353
FromDate = 'From date',
5454
ToDate = 'To Date',
5555
SearchText = 'Search text',
56-
QuickReportIncidentCategory ='Incident category',
57-
QuickReportFollowUpStatus ='Quick report follow up status',
58-
HasQuickReports ='Has quick reports',
59-
CoalitionMemberId = 'NGO'
56+
QuickReportIncidentCategory = 'Incident category',
57+
QuickReportFollowUpStatus = 'Quick report follow up status',
58+
HasQuickReports = 'Has quick reports',
59+
CoalitionMemberId = 'NGO',
6060
}

web/src/features/monitoring-observers/components/EditMonitoringObserver/EditMonitoringObserver.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import { useNavigate, useRouter } from '@tanstack/react-router';
1717
import { useForm } from 'react-hook-form';
1818
import { z } from 'zod';
1919
import { monitoringObserversKeys } from '../../hooks/monitoring-observers-queries';
20+
import { targetedObserversKeys } from '../../hooks/push-messages-queries';
2021
import { MonitoringObserverStatus, UpdateMonitoringObserverRequest } from '../../models/monitoring-observer';
2122
import { MonitorObserverBackButton } from '../MonitoringObserverBackButton';
2223

@@ -87,6 +88,7 @@ export default function EditObserver() {
8788
});
8889
router.invalidate();
8990
queryClient.invalidateQueries({ queryKey: monitoringObserversKeys.all(electionRoundId) });
91+
queryClient.invalidateQueries({ queryKey: targetedObserversKeys.all(electionRoundId) });
9092

9193
navigate({
9294
to: '/monitoring-observers/view/$monitoringObserverId/$tab',

web/src/features/monitoring-observers/components/MonitoringObserversList/CreateMonitoringObserverDialog.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { useForm } from 'react-hook-form';
1313
import { useTranslation } from 'react-i18next';
1414
import { z } from 'zod';
1515
import { monitoringObserversKeys } from '../../hooks/monitoring-observers-queries';
16+
import { targetedObserversKeys } from '../../hooks/push-messages-queries';
1617

1718
export interface CreateMonitoringObserverDialogProps {
1819
open: boolean;
@@ -54,6 +55,8 @@ function CreateMonitoringObserverDialog({ open, onOpenChange }: CreateMonitoring
5455
});
5556

5657
queryClient.invalidateQueries({ queryKey: monitoringObserversKeys.all(electionRoundId) });
58+
queryClient.invalidateQueries({ queryKey: targetedObserversKeys.all(electionRoundId) });
59+
5760
form.reset({});
5861
onOpenChange(false);
5962
},

web/src/features/monitoring-observers/components/PushMessageForm/PushMessageForm.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -40,9 +40,7 @@ import { targetedMonitoringObserverColDefs } from '../../utils/column-defs';
4040

4141
const createPushMessageSchema = z.object({
4242
title: z.string().min(1, { message: 'Your message must have a title before sending.' }),
43-
messageBody: z
44-
.string()
45-
.min(1, { message: 'Your message must have a detailed description before sending.' })
43+
messageBody: z.string().min(1, { message: 'Your message must have a detailed description before sending.' }),
4644
});
4745

4846
function PushMessageForm(): FunctionComponent {
@@ -201,7 +199,7 @@ function PushMessageForm(): FunctionComponent {
201199
value={searchText}
202200
placeholder='Search'
203201
/>
204-
<MonitoringObserverTagsSelect />
202+
<MonitoringObserverTagsSelect isUsingAlternativeFilteringKey />
205203
<MonitoringObserverStatusSelect />
206204
<FormTypeFilter />
207205
<FormSubmissionsFormFilter />

web/src/features/monitoring-observers/filtering/MonitoringObserverTagsSelect.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,13 @@ import { useMonitoringObserversTags } from '@/hooks/tags-queries';
77
import { FC } from 'react';
88

99
interface MonitoringObserverTagsSelectProps {
10-
isFilteringFormSubmissions?: boolean;
10+
isUsingAlternativeFilteringKey?: boolean;
1111
}
1212

13-
export const MonitoringObserverTagsSelect: FC<MonitoringObserverTagsSelectProps> = ({ isFilteringFormSubmissions }) => {
14-
const COMPONENT_FILTER_KEY = isFilteringFormSubmissions
15-
? FILTER_KEY.FormSubmissionsMonitoringObserverTags
16-
: FILTER_KEY.MonitoringObserverTags;
13+
export const MonitoringObserverTagsSelect: FC<MonitoringObserverTagsSelectProps> = ({
14+
isUsingAlternativeFilteringKey,
15+
}) => {
16+
const COMPONENT_FILTER_KEY = isUsingAlternativeFilteringKey ? FILTER_KEY.TagsFilter : FILTER_KEY.MonitoringObserverTags;
1717

1818
const currentElectionRoundId = useCurrentElectionRoundStore((s) => s.currentElectionRoundId);
1919
const { data: tags } = useMonitoringObserversTags(currentElectionRoundId);

web/src/features/responses/components/FormSubmissionsFiltersByEntry/FormSubmissionsFiltersByEntry.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1+
import { useDataSource } from '@/common/data-source-store';
2+
import { DataSources } from '@/common/types';
13
import { PollingStationsFilters } from '@/components/PollingStationsFilters/PollingStationsFilters';
4+
import { CoalitionMemberFilter } from '@/features/filtering/components/CoalitionMemberFilter';
25
import { FilteringContainer } from '@/features/filtering/components/FilteringContainer';
36
import { FormTypeFilter } from '@/features/filtering/components/FormTypeFilter';
47
import { MonitoringObserverTagsSelect } from '@/features/monitoring-observers/filtering/MonitoringObserverTagsSelect';
@@ -11,9 +14,6 @@ import { FormSubmissionsMediaFilesFilter } from '../../../filtering/components/F
1114
import { FormSubmissionsQuestionNotesFilter } from '../../../filtering/components/FormSubmissionsQuestionNotesFilter';
1215
import { FormSubmissionsQuestionsAnsweredFilter } from '../../../filtering/components/FormSubmissionsQuestionsAnsweredFilter';
1316
import { FormSubmissionsToDateFilter } from '../../../filtering/components/FormSubmissionsToDateFilter';
14-
import { useDataSource } from '@/common/data-source-store';
15-
import { DataSources } from '@/common/types';
16-
import { CoalitionMemberFilter } from '@/features/filtering/components/CoalitionMemberFilter';
1717

1818
export const FormSubmissionsFiltersByEntry: FC = () => {
1919
const dataSource = useDataSource();
@@ -28,7 +28,7 @@ export const FormSubmissionsFiltersByEntry: FC = () => {
2828
<FormSubmissionsQuestionsAnsweredFilter />
2929
<FormSubmissionsQuestionNotesFilter />
3030
<FormSubmissionsMediaFilesFilter />
31-
<MonitoringObserverTagsSelect isFilteringFormSubmissions />
31+
<MonitoringObserverTagsSelect isUsingAlternativeFilteringKey />
3232
<PollingStationsFilters />
3333
<FormSubmissionsFromDateFilter />
3434
<FormSubmissionsToDateFilter />

web/src/features/responses/components/FormSubmissionsFiltersByForm/FormSubmissionsFiltersByForm.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1+
import { useDataSource } from '@/common/data-source-store';
2+
import { DataSources } from '@/common/types';
13
import { PollingStationsFilters } from '@/components/PollingStationsFilters/PollingStationsFilters';
4+
import { CoalitionMemberFilter } from '@/features/filtering/components/CoalitionMemberFilter';
25
import { FilteringContainer } from '@/features/filtering/components/FilteringContainer';
36
import { FormSubmissionsFollowUpFilter } from '@/features/filtering/components/FormSubmissionsFollowUpFilter';
47
import { FormSubmissionsFormFilter } from '@/features/filtering/components/FormSubmissionsFormFilter';
@@ -11,9 +14,6 @@ import { FC } from 'react';
1114
import { FormSubmissionsFlaggedAnswersFilter } from '../../../filtering/components/FormSubmissionsFlaggedAnswersFilter';
1215
import { FormSubmissionsMediaFilesFilter } from '../../../filtering/components/FormSubmissionsMediaFilesFilter';
1316
import { FormSubmissionsQuestionNotesFilter } from '../../../filtering/components/FormSubmissionsQuestionNotesFilter';
14-
import { useDataSource } from '@/common/data-source-store';
15-
import { DataSources } from '@/common/types';
16-
import { CoalitionMemberFilter } from '@/features/filtering/components/CoalitionMemberFilter';
1717

1818
export const FormSubmissionsFiltersByForm: FC = () => {
1919
const dataSource = useDataSource();
@@ -28,7 +28,7 @@ export const FormSubmissionsFiltersByForm: FC = () => {
2828
<FormSubmissionsQuestionsAnsweredFilter />
2929
<FormSubmissionsQuestionNotesFilter />
3030
<FormSubmissionsMediaFilesFilter />
31-
<MonitoringObserverTagsSelect isFilteringFormSubmissions />
31+
<MonitoringObserverTagsSelect isUsingAlternativeFilteringKey />
3232
<PollingStationsFilters />
3333
<FormSubmissionsFromDateFilter />
3434
<FormSubmissionsToDateFilter />

web/src/features/responses/components/FormSubmissionsFiltersByObserver/FormSubmissionsFiltersByObserver.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,12 @@ import { FormSubmissionsFollowUpFilter } from '../../../filtering/components/For
88

99
export function FormSubmissionsFiltersByObserver(): FunctionComponent {
1010
const dataSource = useDataSource();
11-
11+
1212
return (
1313
<FilteringContainer>
1414
<FormSubmissionsFollowUpFilter />
1515
{dataSource === DataSources.Coalition ? <CoalitionMemberFilter /> : null}
16-
<MonitoringObserverTagsSelect isFilteringFormSubmissions />
16+
<MonitoringObserverTagsSelect isUsingAlternativeFilteringKey />
1717
<FormSubmissionsFlaggedAnswersFilter />
1818
</FilteringContainer>
1919
);

0 commit comments

Comments
 (0)