Skip to content

Commit abee5a2

Browse files
vdegraafvdegraaf
authored
[feat-5113]: overview page standaard teksten (#2589)
* Add featureFlags to show old and new standard texts * Add overview page with dummy data * Fetching data from backend * Added pagination and context * Add toevoegen button * Add OverviewPage test * Add Summary test * Update docker file * PR feedback
1 parent d485b77 commit abee5a2

28 files changed

+747
-28
lines changed

‎Dockerfile

+5-5
Original file line numberDiff line numberDiff line change
@@ -80,11 +80,11 @@ RUN adduser -D -u 1001 appuser
8080

8181
# Make sure appuser can change files that change in runtime
8282
RUN touch /run/nginx.pid && \
83-
chown -R appuser \
84-
/run/nginx.pid \
85-
/var/cache/nginx \
86-
/usr/share/nginx/html/index.html \
87-
/usr/share/nginx/html/manifest.json
83+
chown -R appuser \
84+
/run/nginx.pid \
85+
/var/cache/nginx \
86+
/usr/share/nginx/html/index.html \
87+
/usr/share/nginx/html/manifest.json
8888

8989
USER appuser
9090

‎app.amsterdam.json

+6-5
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,10 @@
44
"featureFlags": {
55
"assignSignalToDepartment": false,
66
"assignSignalToEmployee": false,
7+
"disableClosingCategoryOverigOverig": true,
78
"enableAmsterdamSpecificOverigCategories": true,
8-
"enableMultipleKtoAnswers": true,
99
"enableCsvExport": false,
10+
"enableMultipleKtoAnswers": true,
1011
"enableMyIncidents": true,
1112
"enableNearIncidents": true,
1213
"enablePublicIncidentsMap": true,
@@ -16,12 +17,12 @@
1617
"fetchQuestionsFromBackend": false,
1718
"mapFilter24Hours": true,
1819
"reporterMailHandledNegativeContactEnabled": true,
20+
"showMainCategories": true,
21+
"showStandardTextAdminV2": true,
1922
"showThorButton": true,
2023
"showVulaanControls": true,
21-
"useProjectenSignalType": false,
22-
"showMainCategories": true,
23-
"disableClosingCategoryOverigOverig": true,
24-
"useGisib": false
24+
"useGisib": false,
25+
"useProjectenSignalType": false
2526
},
2627
"head": {
2728
"androidIcon": "/icon_192x192.png",

‎app.base.json

+2
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@
2222
"useProjectenSignalType": false,
2323
"enableForwardIncidentToExternal": false,
2424
"showMainCategories": false,
25+
"showStandardTextAdminV1": true,
26+
"showStandardTextAdminV2": false,
2527
"disableClosingCategoryOverigOverig": false,
2628
"useGisib": false
2729
},

‎internals/mocks/fixtures/standard-texts-page-two.json

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
{
2+
"count": 16,
3+
"results": [
4+
{
5+
"id": 19,
6+
"title": "Titel #15",
7+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
8+
"active": false,
9+
"state": "m",
10+
"meta": {}
11+
}
12+
],
13+
"facets": {
14+
"state": [
15+
{
16+
"count": 8,
17+
"active": false,
18+
"term": "m"
19+
},
20+
{
21+
"count": 5,
22+
"active": false,
23+
"term": "i"
24+
},
25+
{
26+
"count": 2,
27+
"active": false,
28+
"term": "o"
29+
},
30+
{
31+
"count": 1,
32+
"active": false,
33+
"term": "reaction received"
34+
}
35+
],
36+
"active": [
37+
{
38+
"count": 11,
39+
"active": false,
40+
"term": true
41+
},
42+
{
43+
"count": 5,
44+
"active": false,
45+
"term": false
46+
}
47+
]
48+
}
49+
}

‎internals/mocks/fixtures/standard-texts.json

+161
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,161 @@
1+
{
2+
"count": 16,
3+
"results": [
4+
{
5+
"id": 2,
6+
"title": "Test",
7+
"text": "Test",
8+
"active": true,
9+
"state": "o",
10+
"meta": {}
11+
},
12+
{
13+
"id": 4,
14+
"title": "Titel #1",
15+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
16+
"active": true,
17+
"state": "m",
18+
"meta": {}
19+
},
20+
{
21+
"id": 6,
22+
"title": "Titel #3",
23+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
24+
"active": false,
25+
"state": "o",
26+
"meta": {}
27+
},
28+
{
29+
"id": 7,
30+
"title": "Titel #4",
31+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
32+
"active": true,
33+
"state": "m",
34+
"meta": {}
35+
},
36+
{
37+
"id": 8,
38+
"title": "Titel #5",
39+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
40+
"active": true,
41+
"state": "i",
42+
"meta": {}
43+
},
44+
{
45+
"id": 9,
46+
"title": "Titel #6",
47+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
48+
"active": true,
49+
"state": "m",
50+
"meta": {}
51+
},
52+
{
53+
"id": 10,
54+
"title": "Titel #7",
55+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
56+
"active": true,
57+
"state": "m",
58+
"meta": {}
59+
},
60+
{
61+
"id": 11,
62+
"title": "Titel #8",
63+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
64+
"active": true,
65+
"state": "i",
66+
"meta": {}
67+
},
68+
{
69+
"id": 12,
70+
"title": "Titel #9",
71+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
72+
"active": true,
73+
"state": "i",
74+
"meta": {}
75+
},
76+
{
77+
"id": 13,
78+
"title": "Titel 10",
79+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
80+
"active": true,
81+
"state": "reaction received",
82+
"meta": {}
83+
},
84+
{
85+
"id": 14,
86+
"title": "Titel #11",
87+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
88+
"active": true,
89+
"state": "i",
90+
"meta": {}
91+
},
92+
{
93+
"id": 15,
94+
"title": "Titel #12",
95+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
96+
"active": false,
97+
"state": "m",
98+
"meta": {}
99+
},
100+
{
101+
"id": 16,
102+
"title": "Titel #13",
103+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
104+
"active": false,
105+
"state": "m",
106+
"meta": {}
107+
},
108+
{
109+
"id": 17,
110+
"title": "Titel #13",
111+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
112+
"active": false,
113+
"state": "m",
114+
"meta": {}
115+
},
116+
{
117+
"id": 18,
118+
"title": "Titel #14",
119+
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
120+
"active": true,
121+
"state": "i",
122+
"meta": {}
123+
}
124+
],
125+
"facets": {
126+
"state": [
127+
{
128+
"count": 8,
129+
"active": false,
130+
"term": "m"
131+
},
132+
{
133+
"count": 5,
134+
"active": false,
135+
"term": "i"
136+
},
137+
{
138+
"count": 2,
139+
"active": false,
140+
"term": "o"
141+
},
142+
{
143+
"count": 1,
144+
"active": false,
145+
"term": "reaction received"
146+
}
147+
],
148+
"active": [
149+
{
150+
"count": 11,
151+
"active": false,
152+
"term": true
153+
},
154+
{
155+
"count": 5,
156+
"active": false,
157+
"term": false
158+
}
159+
]
160+
}
161+
}

‎internals/schemas/app.schema.json

+9-1
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@
109109
"enableMultipleKtoAnswers": {
110110
"description": "Feature switch to enable multiple kto questions.",
111111
"type": "boolean"
112-
},
112+
},
113113
"fetchDistrictsFromBackend": {
114114
"description": "Feature switch to use the areas endpoint to fetch districts, instead of using the hardcoded stadsdelen",
115115
"type": "boolean"
@@ -153,6 +153,14 @@
153153
"useGisib": {
154154
"description": "When true, will use GISIB for the map",
155155
"type": "boolean"
156+
},
157+
"showStandardTextAdminV1": {
158+
"description": "Shows the old way of managing standard text for email responses.",
159+
"type": "boolean"
160+
},
161+
"showStandardTextAdminV2": {
162+
"description": "Shows the new way of managing standard text for email responses. One text can be assigned to multiple statuses.",
163+
"type": "boolean"
156164
}
157165
},
158166
"required": [

‎internals/testing/api.ts

+2
Original file line numberDiff line numberDiff line change
@@ -28,3 +28,5 @@ export const INCIDENT_CONTEXT_REPORTER = `${INCIDENT}/context/reporter`
2828

2929
export const CATEGORIES_PRIVATE_ENDPOINT = `${API_BASE_URL}/private/categories/:categoryId`
3030
export const CATEGORIES_PRIVATE_ENDPOINT_HISTORY = `${API_BASE_URL}/private/categories/:categoryId/history`
31+
32+
export const STANDARD_TEXTS_SEARCH_ENDPOINT = `${API_BASE_URL}/private/status-messages/search`

‎internals/testing/msw-server.ts

+13
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,8 @@ import openSignalsReportFixture from '../mocks/fixtures/report_signals-open.json
2525
import reopenRequestedSignalsReportFixture from '../mocks/fixtures/report_signals-reopen-requested.json'
2626
import incidentReporterFixture from '../mocks/fixtures/reporter.json'
2727
import reportsFixture from '../mocks/fixtures/reports.json'
28+
import standardTextsPage2 from '../mocks/fixtures/standard-texts-page-two.json'
29+
import standardTexts from '../mocks/fixtures/standard-texts.json'
2830
import statusMessageTemplatesFixture from '../mocks/fixtures/status-message-templates.json'
2931
import usersFixture from '../mocks/fixtures/users.json'
3032

@@ -148,6 +150,17 @@ const handlers = [
148150
res(ctx.status(200), ctx.json(reportsFixture))
149151
),
150152

153+
rest.get(API.STANDARD_TEXTS_SEARCH_ENDPOINT, (req, res, ctx) => {
154+
const pageNumber = req.url.searchParams.get('page')
155+
156+
switch (pageNumber) {
157+
case '2':
158+
return res(ctx.status(200), ctx.json(standardTextsPage2))
159+
default:
160+
return res(ctx.status(200), ctx.json(standardTexts))
161+
}
162+
}),
163+
151164
rest.get(API.QA_SESSIONS, (req, res, ctx) => {
152165
switch (req.params.uuid) {
153166
case 'locked':

‎src/components/SiteHeader/MenuItems.tsx

+27-12
Original file line numberDiff line numberDiff line change
@@ -74,18 +74,33 @@ export const MenuItems = ({ onLogOut, showItems, onLinkClick }: Props) => {
7474
</MenuItem>
7575
)}
7676

77-
{showItems.defaultTexts && (
78-
<MenuItem>
79-
<StyledMenuButton
80-
onClick={onLinkClick}
81-
forwardedAs={NavLink}
82-
to="/manage/standaard/teksten"
83-
$active={activeMenuItem.includes('/manage/standaard/teksten')}
84-
>
85-
Standaard teksten
86-
</StyledMenuButton>
87-
</MenuItem>
88-
)}
77+
{configuration.featureFlags.showStandardTextAdminV1 &&
78+
showItems.defaultTexts && (
79+
<MenuItem>
80+
<StyledMenuButton
81+
onClick={onLinkClick}
82+
forwardedAs={NavLink}
83+
to="/manage/v1/standaardteksten"
84+
$active={activeMenuItem.includes('/manage/v1/standaardteksten')}
85+
>
86+
Standaard teksten (v1)
87+
</StyledMenuButton>
88+
</MenuItem>
89+
)}
90+
91+
{configuration.featureFlags.showStandardTextAdminV2 &&
92+
showItems.defaultTexts && (
93+
<MenuItem>
94+
<StyledMenuButton
95+
onClick={onLinkClick}
96+
forwardedAs={NavLink}
97+
to="/manage/v2/standaardteksten"
98+
$active={activeMenuItem.includes('/manage/v2/standaardteksten')}
99+
>
100+
Standaard teksten (v2)
101+
</StyledMenuButton>
102+
</MenuItem>
103+
)}
89104

90105
{showItems.settings && (
91106
<MenuItem>

0 commit comments

Comments
 (0)