Skip to content

Commit e6bdf4b

Browse files
edwardhorsfordedwardhorsford
authored
Add medical history pages (#136)
1 parent dfef96c commit e6bdf4b

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+3050
-553
lines changed

‎app/assets/javascript/scroll-to-section.js‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ document.addEventListener('DOMContentLoaded', function () {
55
const urlParams = new URLSearchParams(window.location.search)
66
const scrollTo = urlParams.get('scrollTo')
77

8+
console.log("scrollTo running", scrollTo)
9+
810
if (scrollTo) {
911
const targetSection = document.getElementById(scrollTo)
1012
if (targetSection) {
@@ -15,8 +17,8 @@ document.addEventListener('DOMContentLoaded', function () {
1517

1618
// Scroll to the section
1719
setTimeout(() => {
18-
targetSection.scrollIntoView({ behavior: 'smooth', block: 'start' })
19-
}, 100)
20+
targetSection.scrollIntoView({ behavior: 'instant', block: 'start' })
21+
}, 10)
2022

2123
// Clean up the URL (remove scrollTo parameter)
2224
const url = new URL(window.location)

‎app/assets/sass/components/_small-button.scss‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
@use "nhsuk-frontend/dist/nhsuk/core/settings" as *;
2+
@use "nhsuk-frontend/dist/nhsuk/core/tools" as *;
3+
4+
.nhsuk-button.app-button--small {
5+
padding: nhsuk-spacing(2) 12px nhsuk-spacing(1);
6+
@include nhsuk-font-size(16);
7+
line-height: 1.2;
8+
margin-bottom: nhsuk-spacing(3);
9+
}
10+
11+
// Reduce button group margin
12+
// Based on https://github.com/nhsuk/nhsuk-frontend/blob/8f453df75be6c4dced33c57d0a47b409f99c9004/packages/nhsuk-frontend/src/nhsuk/core/objects/_button-group.scss#L67
13+
.app-button-group--small {
14+
$horizontal-gap: nhsuk-spacing(2);
15+
16+
@include nhsuk-media-query($from: tablet) {
17+
// Cancel out the column gap for the last item in each row
18+
margin-right: ($horizontal-gap * -1);
19+
20+
.nhsuk-body,
21+
.nhsuk-body-m,
22+
p,
23+
> .nhsuk-link,
24+
> a:not(.nhsuk-button),
25+
> .nhsuk-button {
26+
margin-right: $horizontal-gap;
27+
}
28+
}
29+
}

‎app/assets/sass/components/_summary-card.scss‎

Lines changed: 166 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,166 @@
1+
@use 'nhsuk-frontend/dist/nhsuk/core/settings' as *;
2+
@use 'nhsuk-frontend/dist/nhsuk/core/tools' as *;
3+
4+
// Styles for summary card adapted from:
5+
// https://github.com/alphagov/govuk-frontend/blob/main/packages/govuk-frontend/src/govuk/components/summary-list/_index.scss
6+
7+
.nhsuk-summary-card__action {
8+
display: inline-block;
9+
}
10+
11+
@include nhsuk-media-query($until: tablet) {
12+
.nhsuk-summary-card__action {
13+
margin-right: nhsuk-spacing(2);
14+
padding-right: nhsuk-spacing(2);
15+
border-right: 1px solid $nhsuk-border-color;
16+
}
17+
18+
.nhsuk-summary-card__action:last-child {
19+
margin-right: 0;
20+
padding-right: 0;
21+
border: 0;
22+
}
23+
}
24+
25+
@include nhsuk-media-query($from: tablet) {
26+
.nhsuk-summary-card__action {
27+
margin-left: nhsuk-spacing(2);
28+
padding-left: nhsuk-spacing(2);
29+
}
30+
31+
.nhsuk-summary-card__action:not(:first-child) {
32+
border-left: 1px solid $nhsuk-border-color;
33+
}
34+
35+
.nhsuk-summary-card__action:first-child {
36+
margin-left: 0;
37+
padding-left: 0;
38+
border: 0;
39+
}
40+
}
41+
42+
// Additional block for the summary card
43+
.nhsuk-summary-card {
44+
border: 1px solid $nhsuk-border-color;
45+
@include nhsuk-responsive-margin(6, "bottom");
46+
}
47+
48+
.nhsuk-summary-card__title-wrapper {
49+
padding: nhsuk-spacing(3);
50+
51+
// Ensures the card header appears separate to the summary list in forced
52+
// colours mode
53+
border-bottom: 1px solid transparent;
54+
background-color: $color_nhsuk-grey-5;
55+
56+
@include nhsuk-media-query($from: "tablet") {
57+
display: flex;
58+
// Justify removed because we always want actions on the right
59+
// /justify-content: space-between;
60+
flex-wrap: nowrap;
61+
padding: nhsuk-spacing(3) nhsuk-spacing(4);
62+
}
63+
}
64+
65+
.nhsuk-summary-card__title {
66+
@include nhsuk-font($size: 19, $weight: bold);
67+
color: $nhsuk-text-color;
68+
margin: nhsuk-spacing(1) nhsuk-spacing(4) nhsuk-spacing(2) 0;
69+
70+
@include nhsuk-media-query($from: "tablet") {
71+
margin-bottom: nhsuk-spacing(1);
72+
}
73+
}
74+
75+
.nhsuk-summary-card__actions {
76+
@include nhsuk-font-size($size: 19);
77+
@include nhsuk-typography-weight-bold;
78+
display: flex;
79+
flex-wrap: wrap;
80+
row-gap: 10px;
81+
margin: nhsuk-spacing(1) 0;
82+
padding: 0;
83+
list-style: none;
84+
85+
@include nhsuk-media-query($from: "tablet") {
86+
justify-content: right;
87+
text-align: right;
88+
margin-left: auto; // Added so actions are always aligned right
89+
}
90+
}
91+
92+
.nhsuk-summary-card__action {
93+
display: inline;
94+
95+
// We use the following media query to target IE11 and 10 only to add margin
96+
// between actions.
97+
//
98+
// We do this because we're using row-gap to create space between actions on
99+
// more evergreen browsers which IE doesn't support. @supports currently isn't
100+
// a viable solution, see https://github.com/w3c/csswg-drafts/issues/3559.
101+
//
102+
// Solution taken from https://stackoverflow.com/questions/11173106/apply-style-only-on-ie#answer-36448860
103+
// which also includes an explanation of why this works
104+
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
105+
margin-bottom: nhsuk-spacing(1);
106+
}
107+
}
108+
109+
.nhsuk-summary-card__action:last-child {
110+
// See above comment for why this is here
111+
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
112+
margin-bottom: 0;
113+
}
114+
}
115+
116+
.nhsuk-summary-card__content {
117+
padding: nhsuk-spacing(3) nhsuk-spacing(3) 0;
118+
119+
@include nhsuk-media-query($from: "tablet") {
120+
padding: nhsuk-spacing(3) nhsuk-spacing(4);
121+
}
122+
123+
.nhsuk-summary-list {
124+
margin-bottom: 0;
125+
}
126+
127+
.nhsuk-summary-list__row:last-of-type {
128+
margin-bottom: 0;
129+
border-bottom: none;
130+
}
131+
}
132+
133+
.nhsuk-summary-card--no-border {
134+
border: none;
135+
136+
.nhsuk-summary-card__actions {
137+
@include nhsuk-typography-weight-normal;
138+
}
139+
140+
.nhsuk-summary-card__action {
141+
margin-bottom: 0;
142+
}
143+
144+
.nhsuk-summary-card__title-wrapper {
145+
background-color: inherit;
146+
}
147+
148+
.nhsuk-summary-card__title-wrapper, .nhsuk-summary-card__content {
149+
padding: 0;
150+
}
151+
}
152+
153+
.nhsuk-summary-card--compact {
154+
155+
.nhsuk-summary-card__actions {
156+
@include nhsuk-typography-weight-normal;
157+
}
158+
159+
.nhsuk-summary-card__action {
160+
margin-bottom: 0;
161+
}
162+
163+
.nhsuk-summary-card__title-wrapper, .nhsuk-summary-card__content {
164+
padding: nhsuk-spacing(1) nhsuk-spacing(2);
165+
}
166+
}

‎app/assets/sass/main.scss‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ $nhsuk-page-width: 1260px;
44
@forward "nhsuk-frontend/dist/nhsuk/nhsuk";
55

66
// Components that are not in the NHS.UK frontend library
7+
78
@forward "components/button-menu";
89
@forward "components/details";
910
@forward "components/dark-mode";
@@ -17,20 +18,22 @@ $nhsuk-page-width: 1260px;
1718
@forward "components/forward-link";
1819
@forward "components/status";
1920
@forward "components/status-bar";
21+
@forward 'components/summary-card';
2022
@forward "components/reading";
2123

2224
@forward "components/overrides";
2325
@forward "components/checkboxes";
2426
@forward "components/breast-features";
2527
@forward "components/sticky-appointment-bar";
26-
28+
@forward 'components/small-button';
2729
@forward "components/annotation";
2830

2931
@forward "misc";
3032

3133
@forward "typography";
3234
@forward "utils";
3335

36+
3437
$nhsuk-page-width: 1260px;
3538

3639
///////////////////////////////////////////

‎app/data/medical-history-types.js‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
// app/data/medical-history-types.js
2+
3+
module.exports = [
4+
{
5+
type: 'breastCancer',
6+
name: 'Breast cancer',
7+
slug: 'breast-cancer',
8+
canHaveMultiple: true,
9+
yearLabel: 'Diagnosis year'
10+
},
11+
{
12+
type: 'implantedMedicalDevice',
13+
name: 'Implanted medical device',
14+
slug: 'implanted-medical-device',
15+
canHaveMultiple: true,
16+
yearLabel: 'Procedure year'
17+
},
18+
{
19+
type: 'breastImplantsAugmentation',
20+
name: 'Breast implants or augmentation',
21+
slug: 'breast-implants-augmentation',
22+
canHaveMultiple: false,
23+
yearLabel: 'Procedure year'
24+
},
25+
{
26+
type: 'mastectomyLumpectomy',
27+
name: 'Mastectomy or lumpectomy',
28+
slug: 'mastectomy-lumpectomy',
29+
canHaveMultiple: true,
30+
yearLabel: 'Surgery year'
31+
},
32+
{
33+
type: 'cysts',
34+
name: 'Cysts',
35+
slug: 'cysts',
36+
canHaveMultiple: false
37+
},
38+
{
39+
type: 'benignLumps',
40+
name: 'Benign lumps',
41+
slug: 'benign-lumps',
42+
canHaveMultiple: true,
43+
yearLabel: 'Procedure year'
44+
},
45+
{
46+
type: 'otherProcedures',
47+
name: 'Other procedures',
48+
slug: 'other-procedures',
49+
canHaveMultiple: true,
50+
yearLabel: 'Procedure year'
51+
}
52+
]

‎app/data/session-data-defaults.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ const users = require('./users')
55
const breastScreeningUnits = require('./breast-screening-units')
66
// All breast screening units
77
const allBreastScreeningUnits = require('./all-breast-screening-units')
8+
const medicalHistoryTypes = require('./medical-history-types')
89
const path = require('path')
910
const fs = require('fs')
1011
const { needsRegeneration } = require('../lib/utils/regenerate-data')
@@ -81,5 +82,6 @@ module.exports = {
8182
generationInfo,
8283
config,
8384
settings: defaultSettings,
84-
defaultSettings
85+
defaultSettings,
86+
medicalHistoryTypes
8587
}

‎app/lib/utils/arrays.js‎

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -153,6 +153,20 @@ const map = function (array, filterName) {
153153
return array.map((item) => filterFunction.call(this, item))
154154
}
155155

156+
/**
157+
* Check if a value is an array
158+
*
159+
* @param {*} value - Value to check
160+
* @returns {boolean} True if value is an array, false otherwise
161+
* @example
162+
* isArray([1, 2, 3]) // Returns true
163+
* isArray('hello') // Returns false
164+
* isArray(null) // Returns false
165+
*/
166+
const isArray = (value) => {
167+
return Array.isArray(value)
168+
}
169+
156170
module.exports = {
157171
push,
158172
includes,
@@ -161,5 +175,6 @@ module.exports = {
161175
findById,
162176
where,
163177
removeWhere,
164-
map
178+
map,
179+
isArray
165180
}

0 commit comments

Comments
 (0)