From a7184e788f5aad29cb5a496eb1344ad801b5d3ee Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Fri, 17 Jan 2025 14:20:16 +0000 Subject: [PATCH 1/9] refactor: remove parent heading placeholder --- website/src/components/signup-form/i18n/de.json | 3 +-- website/src/components/signup-form/i18n/en.json | 3 +-- website/src/components/signup-form/i18n/es.json | 3 +-- website/src/components/signup-form/i18n/fr.json | 3 +-- website/src/components/signup-form/index.tsx | 3 --- 5 files changed, 4 insertions(+), 11 deletions(-) diff --git a/website/src/components/signup-form/i18n/de.json b/website/src/components/signup-form/i18n/de.json index 17846e1..c7ca73c 100644 --- a/website/src/components/signup-form/i18n/de.json +++ b/website/src/components/signup-form/i18n/de.json @@ -257,8 +257,7 @@ "text": "Wenn Sie ein BBSOAS-Elternteil sind, könnten Sie uns den Vornamen und die Adresse Ihres BBSOAS-Kindes mitteilen? Wir verwenden diese Informationen, um die Anzahl der Diagnosen weltweit zu verfolgen." }, "parentContact": { - "heading": "Kontaktdaten des BBSOAS-Elternteils/Betreuers oder Patienten", - "text": "(Satz zur Erklärung, warum wir diese Informationen benötigen und wofür wir sie verwenden werden.)" + "heading": "Kontaktdaten des BBSOAS-Elternteils/Betreuers oder Patienten" }, "signupButton": "Anmelden", "optional": "optional" diff --git a/website/src/components/signup-form/i18n/en.json b/website/src/components/signup-form/i18n/en.json index 39c71dc..23c69be 100644 --- a/website/src/components/signup-form/i18n/en.json +++ b/website/src/components/signup-form/i18n/en.json @@ -258,8 +258,7 @@ "text": "If you're a BBSOAS parent, could you share your BBSOAS child's first name and address with us? We use this to keep track of the number of diagnoses worldwide." }, "parentContact": { - "heading": "BBSOAS parent/carer or patient's contact details", - "text": "(Sentence to explain why we need these and what we will use them for.)" + "heading": "BBSOAS parent/carer or patient's contact details" }, "signupButton": "Sign up", "optional": "optional" diff --git a/website/src/components/signup-form/i18n/es.json b/website/src/components/signup-form/i18n/es.json index 270dd81..bd1c945 100644 --- a/website/src/components/signup-form/i18n/es.json +++ b/website/src/components/signup-form/i18n/es.json @@ -257,8 +257,7 @@ "text": "Si eres un padre de BBSOAS, ¿podrías compartir el nombre y la dirección de tu hijo con BBSOAS con nosotros? Usamos esto para llevar un registro del número de diagnósticos en todo el mundo." }, "parentContact": { - "heading": "Detalles de contacto del padre/cuidador o paciente con BBSOAS", - "text": "(Frase para explicar por qué necesitamos estos datos y para qué los usaremos.)" + "heading": "Detalles de contacto del padre/cuidador o paciente con BBSOAS" }, "signupButton": "Regístrate", "optional": "opcional" diff --git a/website/src/components/signup-form/i18n/fr.json b/website/src/components/signup-form/i18n/fr.json index 1b63e57..6c9a47b 100644 --- a/website/src/components/signup-form/i18n/fr.json +++ b/website/src/components/signup-form/i18n/fr.json @@ -280,8 +280,7 @@ "text": "Si vous êtes un parent de BBSOAS, pourriez-vous partager avec nous le prénom et l'adresse de votre enfant atteint de BBSOAS ? Nous utilisons ces informations pour suivre le nombre de diagnostics dans le monde entier." }, "parentContact": { - "heading": "Coordonnées du parent/tuteur ou du patient BBSOAS", - "text": "(Phrase pour expliquer pourquoi nous avons besoin de ces informations et à quoi elles serviront.)" + "heading": "Coordonnées du parent/tuteur ou du patient BBSOAS" }, "signupButton": "S'inscrire", "optional": "optionnel" diff --git a/website/src/components/signup-form/index.tsx b/website/src/components/signup-form/index.tsx index 44319cd..9c3d4f4 100644 --- a/website/src/components/signup-form/index.tsx +++ b/website/src/components/signup-form/index.tsx @@ -281,9 +281,6 @@ const SignupForm: React.FC = ({ lang, registerPatient }) => {

{content?.parentContact.heading}

-

- {content?.parentContact.text} -

From dbbd030c10338de33295314faa842c95131420c0 Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Fri, 17 Jan 2025 14:35:51 +0000 Subject: [PATCH 2/9] style: page header and add h2 mobile --- .../app/[lang]/register-a-patient/page-body.module.scss | 8 ++++++++ website/src/components/page-header/index.module.scss | 2 +- website/src/styles/_text-styles.scss | 8 ++++++++ 3 files changed, 17 insertions(+), 1 deletion(-) diff --git a/website/src/app/[lang]/register-a-patient/page-body.module.scss b/website/src/app/[lang]/register-a-patient/page-body.module.scss index 150add0..f5f85b3 100644 --- a/website/src/app/[lang]/register-a-patient/page-body.module.scss +++ b/website/src/app/[lang]/register-a-patient/page-body.module.scss @@ -78,6 +78,14 @@ @include text-styles.header-2; margin: 0; margin-block-end: var(--spacing-4); + + @include breakpoints.small-screen { + @include text-styles.header-2__mobile; + } + + @include breakpoints.medium-screen { + @include text-styles.header-2__mobile; + } } section { diff --git a/website/src/components/page-header/index.module.scss b/website/src/components/page-header/index.module.scss index d989ecc..a9ed1d6 100644 --- a/website/src/components/page-header/index.module.scss +++ b/website/src/components/page-header/index.module.scss @@ -51,8 +51,8 @@ $mobile-curve: "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fil } & > div { - max-width: calc(576px - var(--spacing-8)); align-self: flex-end; + max-width: calc(592px); @include breakpoints.small-screen { max-width: unset; diff --git a/website/src/styles/_text-styles.scss b/website/src/styles/_text-styles.scss index f3db81b..cc6aaa1 100644 --- a/website/src/styles/_text-styles.scss +++ b/website/src/styles/_text-styles.scss @@ -15,6 +15,14 @@ } @mixin header-2 { + color: var(--foreground-primary); + font-size: 1.875rem; + font-style: normal; + font-weight: 800; + line-height: 120%; +} + +@mixin header-2__mobile { color: var(--foreground-primary); font-size: var(--spacing-6); font-style: normal; From cccd09e74f505ca6b8dc9ab7ced8e212382c2b33 Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Fri, 17 Jan 2025 14:48:09 +0000 Subject: [PATCH 3/9] refactor: change foundation address --- website/src/components/footer/markup.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/website/src/components/footer/markup.tsx b/website/src/components/footer/markup.tsx index 2b24a71..9a07e15 100644 --- a/website/src/components/footer/markup.tsx +++ b/website/src/components/footer/markup.tsx @@ -81,8 +81,8 @@ const Footer: React.FC = ({ lang }) => { {documentToReactComponents(contactUs?.content?.json)}
- NR2F1 Foundation
416 E. Kenilworth Ave
- Royal Oak, MI 48067 + NR2F1 Foundation
PO Box 0588
+ Pflugerville, TX 78691-058
info@nr2f1.org From 32d50d90483c64143e2c63ce74d6331589bf448e Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Fri, 17 Jan 2025 16:15:52 +0000 Subject: [PATCH 4/9] chore: add register patient page query --- .../memberships-partners/index.generated.tsx | 2 +- .../register-patient-page/index.generated.tsx | 181 ++++++++++++++++++ .../register-patient-page/index.graphql | 126 ++++++++++++ website/src/graphql/types.ts | 147 ++++++++++++++ 4 files changed, 455 insertions(+), 1 deletion(-) create mode 100644 website/src/graphql/queries/register-patient-page/index.generated.tsx create mode 100644 website/src/graphql/queries/register-patient-page/index.graphql diff --git a/website/src/graphql/queries/memberships-partners/index.generated.tsx b/website/src/graphql/queries/memberships-partners/index.generated.tsx index 791837f..e62ebe5 100644 --- a/website/src/graphql/queries/memberships-partners/index.generated.tsx +++ b/website/src/graphql/queries/memberships-partners/index.generated.tsx @@ -9,7 +9,7 @@ export type GetMembershipPartnersQueryVariables = Types.Exact<{ }>; -export type GetMembershipPartnersQuery = { __typename?: 'Query', navigationList?: { __typename?: 'NavigationList', name?: string | null, linksCollection?: { __typename?: 'NavigationListLinksCollection', items: Array<{ __typename?: 'Link', href?: string | null, content?: string | null, referenceCollection?: { __typename?: 'LinkReferenceCollection', items: Array<{ __typename?: 'Banner' } | { __typename?: 'BlogPage' } | { __typename?: 'BoardMember' } | { __typename?: 'Heading' } | { __typename?: 'HtmlHeadMetadata' } | { __typename?: 'Image', asset?: { __typename?: 'Asset', url?: string | null } | null } | { __typename?: 'Link' } | { __typename?: 'NavigationList' } | { __typename?: 'PageHeader' } | { __typename?: 'Paragraphs' } | { __typename?: 'Volunteer' } | null> } | null } | null> } | null } | null }; +export type GetMembershipPartnersQuery = { __typename?: 'Query', navigationList?: { __typename?: 'NavigationList', name?: string | null, linksCollection?: { __typename?: 'NavigationListLinksCollection', items: Array<{ __typename?: 'Link', href?: string | null, content?: string | null, referenceCollection?: { __typename?: 'LinkReferenceCollection', items: Array<{ __typename?: 'Accordion' } | { __typename?: 'Banner' } | { __typename?: 'BlogPage' } | { __typename?: 'BoardMember' } | { __typename?: 'Heading' } | { __typename?: 'HtmlHeadMetadata' } | { __typename?: 'Image', asset?: { __typename?: 'Asset', url?: string | null } | null } | { __typename?: 'Link' } | { __typename?: 'NavigationList' } | { __typename?: 'PageHeader' } | { __typename?: 'Paragraphs' } | { __typename?: 'Volunteer' } | null> } | null } | null> } | null } | null }; export const GetMembershipPartnersDocument = gql` diff --git a/website/src/graphql/queries/register-patient-page/index.generated.tsx b/website/src/graphql/queries/register-patient-page/index.generated.tsx new file mode 100644 index 0000000..991c027 --- /dev/null +++ b/website/src/graphql/queries/register-patient-page/index.generated.tsx @@ -0,0 +1,181 @@ +import * as Types from '../../types'; + +import { gql } from '@apollo/client'; +import * as Apollo from '@apollo/client'; +const defaultOptions = {} as const; +export type GetRegisterPatientPageQueryVariables = Types.Exact<{ + locale?: Types.InputMaybe; + introId: Types.Scalars['String']['input']; + registerWithUsHeadingId: Types.Scalars['String']['input']; + registerPatientRegistryHeadingId: Types.Scalars['String']['input']; + registerClinicalIdHeadingId: Types.Scalars['String']['input']; + registerWithUsContentId: Types.Scalars['String']['input']; + registerPatientRegistryContentId: Types.Scalars['String']['input']; + registerPatientRegistrySignUpLinkId: Types.Scalars['String']['input']; + registerPatientRegistryLoginLinkId: Types.Scalars['String']['input']; + whoCanTakePartAccordionId: Types.Scalars['String']['input']; + whoWillHaveAccessAccordionId: Types.Scalars['String']['input']; + otherThanFillSurveysAccordionId: Types.Scalars['String']['input']; + matrixLanguagesAccordionId: Types.Scalars['String']['input']; + whoContactAccordionId: Types.Scalars['String']['input']; + registerClinicalIdContentId: Types.Scalars['String']['input']; + registerContentIdLinkId: Types.Scalars['String']['input']; +}>; + + +export type GetRegisterPatientPageQuery = { __typename?: 'Query', intro?: { __typename?: 'Paragraphs', content?: { __typename?: 'ParagraphsContent', json: any } | null } | null, registerWithUsHeading?: { __typename?: 'Heading', content?: string | null } | null, registerPatientRegistryHeading?: { __typename?: 'Heading', content?: string | null } | null, registerClinicalIdHeading?: { __typename?: 'Heading', content?: string | null } | null, registerWithUsContent?: { __typename?: 'Paragraphs', content?: { __typename?: 'ParagraphsContent', json: any } | null } | null, registerPatientRegistryContent?: { __typename?: 'Paragraphs', content?: { __typename?: 'ParagraphsContent', json: any } | null } | null, registerPatientRegistrySignUpLink?: { __typename?: 'Link', content?: string | null, href?: string | null } | null, registerPatientRegistryLoginLink?: { __typename?: 'Link', content?: string | null, href?: string | null } | null, whoCanTakePartAccordion?: { __typename?: 'Accordion', title?: string | null, content?: { __typename?: 'AccordionContent', json: any } | null } | null, whoWillHaveAccessAccordion?: { __typename?: 'Accordion', title?: string | null, content?: { __typename?: 'AccordionContent', json: any } | null } | null, otherThanFillSurveysAccordion?: { __typename?: 'Accordion', title?: string | null, content?: { __typename?: 'AccordionContent', json: any } | null } | null, matrixLanguagesAccordion?: { __typename?: 'Accordion', title?: string | null, content?: { __typename?: 'AccordionContent', json: any } | null } | null, whoContactAccordion?: { __typename?: 'Accordion', title?: string | null, content?: { __typename?: 'AccordionContent', json: any } | null } | null, registerClinicalIdContent?: { __typename?: 'Paragraphs', content?: { __typename?: 'ParagraphsContent', json: any } | null } | null, registerContentIdLink?: { __typename?: 'Link', content?: string | null, href?: string | null } | null }; + + +export const GetRegisterPatientPageDocument = gql` + query GetRegisterPatientPage($locale: String, $introId: String!, $registerWithUsHeadingId: String!, $registerPatientRegistryHeadingId: String!, $registerClinicalIdHeadingId: String!, $registerWithUsContentId: String!, $registerPatientRegistryContentId: String!, $registerPatientRegistrySignUpLinkId: String!, $registerPatientRegistryLoginLinkId: String!, $whoCanTakePartAccordionId: String!, $whoWillHaveAccessAccordionId: String!, $otherThanFillSurveysAccordionId: String!, $matrixLanguagesAccordionId: String!, $whoContactAccordionId: String!, $registerClinicalIdContentId: String!, $registerContentIdLinkId: String!) { + intro: paragraphs(locale: $locale, id: $introId) { + content { + json + } + } + registerWithUsHeading: heading(locale: $locale, id: $registerWithUsHeadingId) { + content + } + registerPatientRegistryHeading: heading( + locale: $locale + id: $registerPatientRegistryHeadingId + ) { + content + } + registerClinicalIdHeading: heading( + locale: $locale + id: $registerClinicalIdHeadingId + ) { + content + } + registerWithUsContent: paragraphs(locale: $locale, id: $registerWithUsContentId) { + content { + json + } + } + registerPatientRegistryContent: paragraphs( + locale: $locale + id: $registerPatientRegistryContentId + ) { + content { + json + } + } + registerPatientRegistrySignUpLink: link( + locale: $locale + id: $registerPatientRegistrySignUpLinkId + ) { + content + href + } + registerPatientRegistryLoginLink: link( + locale: $locale + id: $registerPatientRegistryLoginLinkId + ) { + content + href + } + whoCanTakePartAccordion: accordion( + locale: $locale + id: $whoCanTakePartAccordionId + ) { + title + content { + json + } + } + whoWillHaveAccessAccordion: accordion( + locale: $locale + id: $whoWillHaveAccessAccordionId + ) { + title + content { + json + } + } + otherThanFillSurveysAccordion: accordion( + locale: $locale + id: $otherThanFillSurveysAccordionId + ) { + title + content { + json + } + } + matrixLanguagesAccordion: accordion( + locale: $locale + id: $matrixLanguagesAccordionId + ) { + title + content { + json + } + } + whoContactAccordion: accordion(locale: $locale, id: $whoContactAccordionId) { + title + content { + json + } + } + registerClinicalIdContent: paragraphs( + locale: $locale + id: $registerClinicalIdContentId + ) { + content { + json + } + } + registerContentIdLink: link(locale: $locale, id: $registerContentIdLinkId) { + content + href + } +} + `; + +/** + * __useGetRegisterPatientPageQuery__ + * + * To run a query within a React component, call `useGetRegisterPatientPageQuery` and pass it any options that fit your needs. + * When your component renders, `useGetRegisterPatientPageQuery` returns an object from Apollo Client that contains loading, error, and data properties + * you can use to render your UI. + * + * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options; + * + * @example + * const { data, loading, error } = useGetRegisterPatientPageQuery({ + * variables: { + * locale: // value for 'locale' + * introId: // value for 'introId' + * registerWithUsHeadingId: // value for 'registerWithUsHeadingId' + * registerPatientRegistryHeadingId: // value for 'registerPatientRegistryHeadingId' + * registerClinicalIdHeadingId: // value for 'registerClinicalIdHeadingId' + * registerWithUsContentId: // value for 'registerWithUsContentId' + * registerPatientRegistryContentId: // value for 'registerPatientRegistryContentId' + * registerPatientRegistrySignUpLinkId: // value for 'registerPatientRegistrySignUpLinkId' + * registerPatientRegistryLoginLinkId: // value for 'registerPatientRegistryLoginLinkId' + * whoCanTakePartAccordionId: // value for 'whoCanTakePartAccordionId' + * whoWillHaveAccessAccordionId: // value for 'whoWillHaveAccessAccordionId' + * otherThanFillSurveysAccordionId: // value for 'otherThanFillSurveysAccordionId' + * matrixLanguagesAccordionId: // value for 'matrixLanguagesAccordionId' + * whoContactAccordionId: // value for 'whoContactAccordionId' + * registerClinicalIdContentId: // value for 'registerClinicalIdContentId' + * registerContentIdLinkId: // value for 'registerContentIdLinkId' + * }, + * }); + */ +export function useGetRegisterPatientPageQuery(baseOptions: Apollo.QueryHookOptions & ({ variables: GetRegisterPatientPageQueryVariables; skip?: boolean; } | { skip: boolean; }) ) { + const options = {...defaultOptions, ...baseOptions} + return Apollo.useQuery(GetRegisterPatientPageDocument, options); + } +export function useGetRegisterPatientPageLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions) { + const options = {...defaultOptions, ...baseOptions} + return Apollo.useLazyQuery(GetRegisterPatientPageDocument, options); + } +export function useGetRegisterPatientPageSuspenseQuery(baseOptions?: Apollo.SkipToken | Apollo.SuspenseQueryHookOptions) { + const options = baseOptions === Apollo.skipToken ? baseOptions : {...defaultOptions, ...baseOptions} + return Apollo.useSuspenseQuery(GetRegisterPatientPageDocument, options); + } +export type GetRegisterPatientPageQueryHookResult = ReturnType; +export type GetRegisterPatientPageLazyQueryHookResult = ReturnType; +export type GetRegisterPatientPageSuspenseQueryHookResult = ReturnType; +export type GetRegisterPatientPageQueryResult = Apollo.QueryResult; \ No newline at end of file diff --git a/website/src/graphql/queries/register-patient-page/index.graphql b/website/src/graphql/queries/register-patient-page/index.graphql new file mode 100644 index 0000000..2108366 --- /dev/null +++ b/website/src/graphql/queries/register-patient-page/index.graphql @@ -0,0 +1,126 @@ +query GetRegisterPatientPage( + $locale: String + $introId: String! + $registerWithUsHeadingId: String! + $registerPatientRegistryHeadingId: String! + $registerClinicalIdHeadingId: String! + $registerWithUsContentId: String! + $registerPatientRegistryContentId: String! + $registerPatientRegistrySignUpLinkId: String! + $registerPatientRegistryLoginLinkId: String! + $whoCanTakePartAccordionId: String! + $whoWillHaveAccessAccordionId: String! + $otherThanFillSurveysAccordionId: String! + $matrixLanguagesAccordionId: String! + $whoContactAccordionId: String! + $registerClinicalIdContentId: String! + $registerContentIdLinkId: String! +) { + intro: paragraphs(locale: $locale, id: $introId) { + content { + json + } + } + registerWithUsHeading: heading( + locale: $locale + id: $registerWithUsHeadingId + ) { + content + } + registerPatientRegistryHeading: heading( + locale: $locale + id: $registerPatientRegistryHeadingId + ) { + content + } + registerClinicalIdHeading: heading( + locale: $locale + id: $registerClinicalIdHeadingId + ) { + content + } + registerWithUsContent: paragraphs( + locale: $locale + id: $registerWithUsContentId + ) { + content { + json + } + } + registerPatientRegistryContent: paragraphs( + locale: $locale + id: $registerPatientRegistryContentId + ) { + content { + json + } + } + registerPatientRegistrySignUpLink: link( + locale: $locale + id: $registerPatientRegistrySignUpLinkId + ) { + content + href + } + registerPatientRegistryLoginLink: link( + locale: $locale + id: $registerPatientRegistryLoginLinkId + ) { + content + href + } + whoCanTakePartAccordion: accordion( + locale: $locale + id: $whoCanTakePartAccordionId + ) { + title + content { + json + } + } + whoWillHaveAccessAccordion: accordion( + locale: $locale + id: $whoWillHaveAccessAccordionId + ) { + title + content { + json + } + } + otherThanFillSurveysAccordion: accordion( + locale: $locale + id: $otherThanFillSurveysAccordionId + ) { + title + content { + json + } + } + matrixLanguagesAccordion: accordion( + locale: $locale + id: $matrixLanguagesAccordionId + ) { + title + content { + json + } + } + whoContactAccordion: accordion(locale: $locale, id: $whoContactAccordionId) { + title + content { + json + } + } + registerClinicalIdContent: paragraphs( + locale: $locale + id: $registerClinicalIdContentId + ) { + content { + json + } + } + registerContentIdLink: link(locale: $locale, id: $registerContentIdLinkId) { + content + href + } +} diff --git a/website/src/graphql/types.ts b/website/src/graphql/types.ts index 2be14a2..033a543 100644 --- a/website/src/graphql/types.ts +++ b/website/src/graphql/types.ts @@ -19,6 +19,134 @@ export type Scalars = { Quality: { input: any; output: any; } }; +/** Accordions [See type definition](https://app.contentful.com/spaces/9j9d6tsmuyzl/content_types/accordion) */ +export type Accordion = Entry & _Node & { + __typename?: 'Accordion'; + _id: Scalars['ID']['output']; + content?: Maybe; + contentfulMetadata: ContentfulMetadata; + linkedFrom?: Maybe; + sys: Sys; + title?: Maybe; +}; + + +/** Accordions [See type definition](https://app.contentful.com/spaces/9j9d6tsmuyzl/content_types/accordion) */ +export type AccordionContentArgs = { + locale?: InputMaybe; +}; + + +/** Accordions [See type definition](https://app.contentful.com/spaces/9j9d6tsmuyzl/content_types/accordion) */ +export type AccordionLinkedFromArgs = { + allowedLocales?: InputMaybe>>; +}; + + +/** Accordions [See type definition](https://app.contentful.com/spaces/9j9d6tsmuyzl/content_types/accordion) */ +export type AccordionTitleArgs = { + locale?: InputMaybe; +}; + +export type AccordionCollection = { + __typename?: 'AccordionCollection'; + items: Array>; + limit: Scalars['Int']['output']; + skip: Scalars['Int']['output']; + total: Scalars['Int']['output']; +}; + +export type AccordionContent = { + __typename?: 'AccordionContent'; + json: Scalars['JSON']['output']; + links: AccordionContentLinks; +}; + +export type AccordionContentAssets = { + __typename?: 'AccordionContentAssets'; + block: Array>; + hyperlink: Array>; +}; + +export type AccordionContentEntries = { + __typename?: 'AccordionContentEntries'; + block: Array>; + hyperlink: Array>; + inline: Array>; +}; + +export type AccordionContentLinks = { + __typename?: 'AccordionContentLinks'; + assets: AccordionContentAssets; + entries: AccordionContentEntries; + resources: AccordionContentResources; +}; + +export type AccordionContentResources = { + __typename?: 'AccordionContentResources'; + block: Array; + hyperlink: Array; + inline: Array; +}; + +export type AccordionContentResourcesBlock = ResourceLink & { + __typename?: 'AccordionContentResourcesBlock'; + sys: ResourceSys; +}; + +export type AccordionContentResourcesHyperlink = ResourceLink & { + __typename?: 'AccordionContentResourcesHyperlink'; + sys: ResourceSys; +}; + +export type AccordionContentResourcesInline = ResourceLink & { + __typename?: 'AccordionContentResourcesInline'; + sys: ResourceSys; +}; + +export type AccordionFilter = { + AND?: InputMaybe>>; + OR?: InputMaybe>>; + content_contains?: InputMaybe; + content_exists?: InputMaybe; + content_not_contains?: InputMaybe; + contentfulMetadata?: InputMaybe; + sys?: InputMaybe; + title?: InputMaybe; + title_contains?: InputMaybe; + title_exists?: InputMaybe; + title_in?: InputMaybe>>; + title_not?: InputMaybe; + title_not_contains?: InputMaybe; + title_not_in?: InputMaybe>>; +}; + +export type AccordionLinkingCollections = { + __typename?: 'AccordionLinkingCollections'; + entryCollection?: Maybe; +}; + + +export type AccordionLinkingCollectionsEntryCollectionArgs = { + limit?: InputMaybe; + locale?: InputMaybe; + preview?: InputMaybe; + skip?: InputMaybe; +}; + +export enum AccordionOrder { + SysFirstPublishedAtAsc = 'sys_firstPublishedAt_ASC', + SysFirstPublishedAtDesc = 'sys_firstPublishedAt_DESC', + SysIdAsc = 'sys_id_ASC', + SysIdDesc = 'sys_id_DESC', + SysPublishedAtAsc = 'sys_publishedAt_ASC', + SysPublishedAtDesc = 'sys_publishedAt_DESC', + SysPublishedVersionAsc = 'sys_publishedVersion_ASC', + SysPublishedVersionDesc = 'sys_publishedVersion_DESC', + TitleAsc = 'title_ASC', + TitleDesc = 'title_DESC' +} + /** Represents a binary file in a space. An asset can be any file type. */ export type Asset = { __typename?: 'Asset'; @@ -1816,6 +1944,8 @@ export enum ParagraphsOrder { export type Query = { __typename?: 'Query'; _node?: Maybe<_Node>; + accordion?: Maybe; + accordionCollection?: Maybe; asset?: Maybe; assetCollection?: Maybe; banner?: Maybe; @@ -1851,6 +1981,23 @@ export type Query_NodeArgs = { }; +export type QueryAccordionArgs = { + id: Scalars['String']['input']; + locale?: InputMaybe; + preview?: InputMaybe; +}; + + +export type QueryAccordionCollectionArgs = { + limit?: InputMaybe; + locale?: InputMaybe; + order?: InputMaybe>>; + preview?: InputMaybe; + skip?: InputMaybe; + where?: InputMaybe; +}; + + export type QueryAssetArgs = { id: Scalars['String']['input']; locale?: InputMaybe; From d67c34998369960e6887bd9590887d962a4da1ab Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Fri, 17 Jan 2025 17:23:34 +0000 Subject: [PATCH 5/9] chore: add register patient cms models --- website/src/models/accordions/index.ts | 6 ++++++ website/src/models/headings/index.ts | 4 ++++ website/src/models/links/index.ts | 4 ++++ website/src/models/paragraphs/index.ts | 5 +++++ 4 files changed, 19 insertions(+) create mode 100644 website/src/models/accordions/index.ts diff --git a/website/src/models/accordions/index.ts b/website/src/models/accordions/index.ts new file mode 100644 index 0000000..d5ae41d --- /dev/null +++ b/website/src/models/accordions/index.ts @@ -0,0 +1,6 @@ +// Register patient +export const whoCanTakePartAccordionId = '6yv0oPwGDPn2QzrFB3y7G9'; +export const whoWillHaveAccessAccordionId = '3c2SyehmoXzSw5I1n9BGei'; +export const otherThanFillSurveysAccordionId = '66QKbkH4UEeomBga3oRN1Q'; +export const matrixLanguagesAccordionId = '1LapxQoHas8hqer8P9durd'; +export const whoContactAccordionId = '2eZAH8PSWm7dF8iaO3bAR5'; diff --git a/website/src/models/headings/index.ts b/website/src/models/headings/index.ts index 5093c94..917ab22 100644 --- a/website/src/models/headings/index.ts +++ b/website/src/models/headings/index.ts @@ -8,3 +8,7 @@ export const empowerFamiliesHeadingId = '5suGsoVge3LvQ7cLtAWyo2'; export const driveResearchHeadingId = '5nXf25IVMjhU2FFLID6ydG'; // Latest news export const latestNewsTitleId = '1ylyjtePqtkFwXBfZUaL7n'; +// Regsiter patient page +export const registerWithUsHeadingId = '2C3o4BDN7MSjpEwYi7rLXM'; +export const registerPatientRegistryHeadingId = '6juU9IL2M4aWq4hkohifYN'; +export const registerClinicalIdHeadingId = '3SxkzaMqsMEpLrYJrrYNmj'; diff --git a/website/src/models/links/index.ts b/website/src/models/links/index.ts index f8da354..22f37cd 100644 --- a/website/src/models/links/index.ts +++ b/website/src/models/links/index.ts @@ -7,3 +7,7 @@ export const heroCtaId = '4pwc4e2bvRxUAzXKzftn6N'; export const learnMoreCtaId = '7263K1eR6vR5DYd3nRY5hQ'; // Latest news export const latestNewsCtaId = '5kWxWSZyTvYZn1iXiKgA1E'; +// Register patient page +export const registerPatientRegistryLoginLinkId = '6ZoUDDQsuOvt8dgE5jqMif'; +export const registerPatientRegistrySignUpLinkId = '6rYsvNOGRKn1CElKIOQGIf'; +export const registerContentIdLinkId = '4Kb6OkWbG6YIfu6aW2dFg9'; diff --git a/website/src/models/paragraphs/index.ts b/website/src/models/paragraphs/index.ts index 1543371..f4fc5cb 100644 --- a/website/src/models/paragraphs/index.ts +++ b/website/src/models/paragraphs/index.ts @@ -10,3 +10,8 @@ export const driveResearchParagraphId = '1O9buDkUcPPHm8U2Qk6VLE'; export const empowerFamiliesParagraphId = '3U0YGSxfl4ZU5t07VYkKnc'; export const educatePeopleParagraphId = '1ZCUxvuFRUu61orqlSoHw5'; export const ourVisionParagraphId = '4zrbZeSU8XCsk5T1ZVywo3'; +// Register patient page +export const introId = '2fefGxsEkuAkLi3VF3nhi'; +export const registerWithUsContentId = '2anfbBGcBGJxFYWo6i22H'; +export const registerPatientRegistryContentd = '2u126GIcOaJIqQjgbg169l'; +export const registerClinicalIdContentId = '5Y7VVQ0o5PIs1LUk7Sylxm'; From bdf65543643bdb440f1aed0e9abb0b66c5cab0c5 Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Fri, 17 Jan 2025 17:41:14 +0000 Subject: [PATCH 6/9] chore: call query for register patient page --- website/src/app/[lang]/blog/[slug]/page.tsx | 1 - .../[lang]/register-a-patient/page-body.tsx | 54 ++++++++++++++++++- website/src/models/paragraphs/index.ts | 2 +- 3 files changed, 54 insertions(+), 3 deletions(-) diff --git a/website/src/app/[lang]/blog/[slug]/page.tsx b/website/src/app/[lang]/blog/[slug]/page.tsx index 5040333..2701820 100644 --- a/website/src/app/[lang]/blog/[slug]/page.tsx +++ b/website/src/app/[lang]/blog/[slug]/page.tsx @@ -23,7 +23,6 @@ export async function generateMetadata({ }: BlogPagePropsWithLocale): Promise { const { lang, slug } = await params; - const { query } = getClient(); const { data } = await query({ query: GetPostDocument, variables: { locale: lang, slug }, diff --git a/website/src/app/[lang]/register-a-patient/page-body.tsx b/website/src/app/[lang]/register-a-patient/page-body.tsx index 1843ed3..c174a9c 100644 --- a/website/src/app/[lang]/register-a-patient/page-body.tsx +++ b/website/src/app/[lang]/register-a-patient/page-body.tsx @@ -3,14 +3,66 @@ import styles from './page-body.module.scss'; import PageContents from '@components/page-contents'; import PageLatestNews from '@components/page-latest-news'; import SignupForm from '@components/signup-form'; +import { getClient } from '@graphql/client'; +import { + GetRegisterPatientPageDocument, + type GetRegisterPatientPageQuery, +} from '@graphql/queries/register-patient-page/index.generated'; import type { AvailableLocale } from '@i18n/locales'; +import { + matrixLanguagesAccordionId, + otherThanFillSurveysAccordionId, + whoContactAccordionId, + whoWillHaveAccessAccordionId, +} from '@models/accordions'; +import { + registerClinicalIdHeadingId, + registerPatientRegistryHeadingId, + registerWithUsHeadingId, +} from '@models/headings'; +import { + registerContentIdLinkId, + registerPatientRegistryLoginLinkId, + registerPatientRegistrySignUpLinkId, +} from '@models/links'; +import { + introId, + registerClinicalIdContentId, + registerPatientRegistryContentId, + registerWithUsContentId, +} from '@models/paragraphs'; import { createHashLink } from '@shared/utils/hash-links'; interface RegisterPageBodyProps { lang: AvailableLocale; } -const RegisterPageBody: React.FC = ({ lang }) => { +const { query } = getClient(); + +const RegisterPageBody: React.FC = async ({ lang }) => { + const { data, error } = await query({ + query: GetRegisterPatientPageDocument, + variables: { + locale: lang, + introId, + registerWithUsHeadingId, + registerPatientRegistryHeadingId, + registerClinicalIdHeadingId, + registerPatientRegistryLoginLinkId, + registerWithUsContentId, + registerPatientRegistryContentId, + registerPatientRegistrySignUpLinkId, + whoContactAccordionId, + whoWillHaveAccessAccordionId, + otherThanFillSurveysAccordionId, + matrixLanguagesAccordionId, + registerClinicalIdContentId, + registerContentIdLinkId, + }, + }); + + console.log({ data }); + return (
diff --git a/website/src/models/paragraphs/index.ts b/website/src/models/paragraphs/index.ts index f4fc5cb..ce3adac 100644 --- a/website/src/models/paragraphs/index.ts +++ b/website/src/models/paragraphs/index.ts @@ -13,5 +13,5 @@ export const ourVisionParagraphId = '4zrbZeSU8XCsk5T1ZVywo3'; // Register patient page export const introId = '2fefGxsEkuAkLi3VF3nhi'; export const registerWithUsContentId = '2anfbBGcBGJxFYWo6i22H'; -export const registerPatientRegistryContentd = '2u126GIcOaJIqQjgbg169l'; +export const registerPatientRegistryContentId = '2u126GIcOaJIqQjgbg169l'; export const registerClinicalIdContentId = '5Y7VVQ0o5PIs1LUk7Sylxm'; From 0e06f99ca15dceb8eb0eecba4a839a9ae878a5f3 Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Fri, 17 Jan 2025 18:35:58 +0000 Subject: [PATCH 7/9] feat: add rich text rendering to register patient page --- .../register-a-patient/page-body.module.scss | 3 + .../[lang]/register-a-patient/page-body.tsx | 164 ++++++++++-------- website/src/models/paragraphs/index.ts | 4 +- 3 files changed, 98 insertions(+), 73 deletions(-) diff --git a/website/src/app/[lang]/register-a-patient/page-body.module.scss b/website/src/app/[lang]/register-a-patient/page-body.module.scss index f5f85b3..0da1c5c 100644 --- a/website/src/app/[lang]/register-a-patient/page-body.module.scss +++ b/website/src/app/[lang]/register-a-patient/page-body.module.scss @@ -71,6 +71,9 @@ } li:not(:last-of-type) { + & p { + margin: 0; + } margin-block-end: var(--spacing-2); } diff --git a/website/src/app/[lang]/register-a-patient/page-body.tsx b/website/src/app/[lang]/register-a-patient/page-body.tsx index c174a9c..7adf1a7 100644 --- a/website/src/app/[lang]/register-a-patient/page-body.tsx +++ b/website/src/app/[lang]/register-a-patient/page-body.tsx @@ -3,15 +3,17 @@ import styles from './page-body.module.scss'; import PageContents from '@components/page-contents'; import PageLatestNews from '@components/page-latest-news'; import SignupForm from '@components/signup-form'; +import { documentToReactComponents } from '@contentful/rich-text-react-renderer'; import { getClient } from '@graphql/client'; import { GetRegisterPatientPageDocument, type GetRegisterPatientPageQuery, } from '@graphql/queries/register-patient-page/index.generated'; -import type { AvailableLocale } from '@i18n/locales'; +import type { AvailableLocale, LocalisedString } from '@i18n/locales'; import { matrixLanguagesAccordionId, otherThanFillSurveysAccordionId, + whoCanTakePartAccordionId, whoContactAccordionId, whoWillHaveAccessAccordionId, } from '@models/accordions'; @@ -39,8 +41,34 @@ interface RegisterPageBodyProps { const { query } = getClient(); +const alreadyRegister: LocalisedString = { + en: 'Already registered?', + es: '¿Ya estás registrado?', + fr: 'Déjà enregistré?', + de: 'Bereits registriert?', +}; + const RegisterPageBody: React.FC = async ({ lang }) => { - const { data, error } = await query({ + const { + data: { + intro, + registerWithUsHeading, + registerPatientRegistryHeading, + registerClinicalIdHeading, + registerPatientRegistryLoginLink, + registerWithUsContent, + registerPatientRegistryContent, + registerPatientRegistrySignUpLink, + whoCanTakePartAccordion, + whoWillHaveAccessAccordion, + otherThanFillSurveysAccordion, + matrixLanguagesAccordion, + whoContactAccordion, + registerClinicalIdContent, + registerContentIdLink, + }, + error, + } = await query({ query: GetRegisterPatientPageDocument, variables: { locale: lang, @@ -52,16 +80,19 @@ const RegisterPageBody: React.FC = async ({ lang }) => { registerWithUsContentId, registerPatientRegistryContentId, registerPatientRegistrySignUpLinkId, - whoContactAccordionId, + whoCanTakePartAccordionId, whoWillHaveAccessAccordionId, otherThanFillSurveysAccordionId, matrixLanguagesAccordionId, + whoContactAccordionId, registerClinicalIdContentId, registerContentIdLinkId, }, }); - console.log({ data }); + if (error) { + return null; + } return (
@@ -70,83 +101,77 @@ const RegisterPageBody: React.FC = async ({ lang }) => {
-

- We believe there is power in numbers. This is why every new - diagnosis is important to us. By registering BBSOAS patients, our - community decides what's important to study and learn about BBSOAS.{' '} -

-

There are three actions for newly diagnosed patients:

- - +
-

Register with us

-

- We want to keep track of the number of diagnosed cases around the - world, so that we can share this with you and our community of - scientists and researchers. If you are a newly diagnosed family, - please also share your location. By registering with us, you will - also receive communications from the NR2F1 Foundation. -

+

+ 1. {registerWithUsHeading?.content} +

+ + {documentToReactComponents(registerWithUsContent?.content?.json)} +
-

- Register with the NR2F1 Patient Registry +

+ 2. {registerPatientRegistryHeading?.content}

-

- The Patient Registry collects information through surveys on how a - disease affects a person over a lifetime to better understand - diseases, especially rare ones. The data collected from the - surveys will help researchers and families learn more about - BBSOAS. -

-

- The Patient Registry will show how the disease progresses over - time. This is why it’s extremely important to complete all the - surveys listed in your account. Every year in June, we ask - families to go back into the Patient Registry to complete annual - surveys. -

-

- Having our BBSOAS population registered in Patient Registry also - means as an organization we are ‘research ready’ for clinical - trials or pharmaceutical development. -

-

Get started in 4 simple steps:

-
    -
  1. Create a Patient Registry account in Matrix
    2. -
  2. Upload the genetic report to confirm diagnosis
    3. -
  3. Fill out all the surveys listed in your account
    4. -
  4. Turn on survey notifications
    5. -
+ + {documentToReactComponents( + registerPatientRegistryContent?.content?.json, + )} + - Register now + {registerPatientRegistrySignUpLink?.content} -

Already registered?

+

{alreadyRegister[lang]}

- Login + {registerPatientRegistryLoginLink?.content}
Who can take part? @@ -227,25 +252,22 @@ const RegisterPageBody: React.FC = async ({ lang }) => {
-

- Register for a Clinical Research ID +

+ 3. {registerClinicalIdHeading?.content}

-

- The Clinical Research ID (CRID) is a free patient-generated - service specifically for use in clinical research. The parent or - carer of the patient or the patient themselves decides who to - share it with. With a CRID, you can gain visibility into the - research studies you’re enrolled in. -

-

Anyone around the world can register for a CRID.

+ + {documentToReactComponents( + registerClinicalIdContent?.content?.json, + )} + - Register now + {registerContentIdLink?.content}
diff --git a/website/src/models/paragraphs/index.ts b/website/src/models/paragraphs/index.ts index ce3adac..de7e189 100644 --- a/website/src/models/paragraphs/index.ts +++ b/website/src/models/paragraphs/index.ts @@ -11,7 +11,7 @@ export const empowerFamiliesParagraphId = '3U0YGSxfl4ZU5t07VYkKnc'; export const educatePeopleParagraphId = '1ZCUxvuFRUu61orqlSoHw5'; export const ourVisionParagraphId = '4zrbZeSU8XCsk5T1ZVywo3'; // Register patient page -export const introId = '2fefGxsEkuAkLi3VF3nhi'; -export const registerWithUsContentId = '2anfbBGcBGJxFYWo6i22H'; +export const introId = '2fefGxsEkuAkLai3VF3nhi'; +export const registerWithUsContentId = '2anfbBGc6BGJxFYWo6i22H'; export const registerPatientRegistryContentId = '2u126GIcOaJIqQjgbg169l'; export const registerClinicalIdContentId = '5Y7VVQ0o5PIs1LUk7Sylxm'; From c7e3cdf366bd9cf601310eb1e9d8bef36116af2b Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Sat, 18 Jan 2025 18:24:47 +0000 Subject: [PATCH 8/9] feat: add accordion component --- .../register-a-patient/page-body.module.scss | 60 --------- .../[lang]/register-a-patient/page-body.tsx | 114 ++++++------------ .../components/accordion/index.module.scss | 61 ++++++++++ website/src/components/accordion/index.tsx | 19 +++ 4 files changed, 118 insertions(+), 136 deletions(-) create mode 100644 website/src/components/accordion/index.module.scss create mode 100644 website/src/components/accordion/index.tsx diff --git a/website/src/app/[lang]/register-a-patient/page-body.module.scss b/website/src/app/[lang]/register-a-patient/page-body.module.scss index 0da1c5c..a07fbef 100644 --- a/website/src/app/[lang]/register-a-patient/page-body.module.scss +++ b/website/src/app/[lang]/register-a-patient/page-body.module.scss @@ -1,7 +1,6 @@ @use '@styles/layout'; @use '@styles/breakpoints'; @use '@styles/text-styles'; -@use '@styles/icons'; .page-layout { padding: var(--spacing-6) var(--spacing-16) var(--spacing-24); @@ -114,62 +113,3 @@ display: none; } } - -.accordion { - background-color: var(--background-accent-navy); - padding: 0 var(--spacing-6); - - &:first-of-type { - border-top-right-radius: var(--border-radius-xl); - border-top-left-radius: var(--border-radius-xl); - } - - &:last-of-type { - border-bottom-right-radius: var(--border-radius-xl); - border-bottom-left-radius: var(--border-radius-xl); - } - - &:not(:first-of-type) summary { - border-block-start: 1px solid var(--border-default); - } - - &[open] summary { - &::after { - background-image: url(icons.$chevron-up-navy); - } - } - - summary { - @include text-styles.header-3; - padding: var(--spacing-6) 0; - cursor: pointer; - display: flex; - justify-content: space-between; - align-items: center; - &::marker, - &::-webkit-details-marker { - display: none; - content: ''; - } - - &::after { - aspect-ratio: 1 / 1; - background-image: url(icons.$chevron-down-navy); - background-position: center; - background-size: contain; - content: ''; - display: block; - width: var(--spacing-5); - } - } - - & > div { - padding-block-end: var(--spacing-6); - & p:last-of-type { - margin-block-end: 0; - } - & li:last-of-type { - margin-block-end: 0; - } - } -} diff --git a/website/src/app/[lang]/register-a-patient/page-body.tsx b/website/src/app/[lang]/register-a-patient/page-body.tsx index 7adf1a7..0a7e98e 100644 --- a/website/src/app/[lang]/register-a-patient/page-body.tsx +++ b/website/src/app/[lang]/register-a-patient/page-body.tsx @@ -1,5 +1,6 @@ import styles from './page-body.module.scss'; +import Accordion from '@components/accordion'; import PageContents from '@components/page-contents'; import PageLatestNews from '@components/page-latest-news'; import SignupForm from '@components/signup-form'; @@ -173,82 +174,43 @@ const RegisterPageBody: React.FC = async ({ lang }) => { > {registerPatientRegistryLoginLink?.content} -
- Who can take part? -
-

- Parents or carers of a confirmed BBSOAS patient or BBSOAS - patients themselves. By confirmed we mean with a genetic - report showing the diagnosis. -

-
-
-
- Who will have access to the data? -
-

- Only a few study administrators have access to patient - identifying data. The patient or carer owns their own data. - They can share it with whoever they want, including doctors, - teachers, other carers, etc. if useful. -

-

Anonymous data is accessed by:

-
    -
  • - The NR2F1 Foundation - limited to whose working on Patient - Registry  -
    • -
  • COMBINEDBrain - our scientific partner
    • -
  • - Subject to approval by the NR2F1 Foundation - researchers - and industry who are working on BBSOAS studies -
    • -
  • Matrix - the company behind the Patient Registry tool
    • -
-
-
-
- - Other than filling out surveys, how else can I use Patient - Registry? - -
-

- Patient Registry can also be used as a personal health - monitoring tool. It has features that make managing daily - medical care easier. -

-
-
-
- - What languages is Matrix and the surveys available in? - -
-

- Matrix is available in English, Spanish, Italian, French, - German, Portuguese and Korean. Surveys are available in - English, Spanish, Italian, French and German. Coming soon: - Portuguese, Korean and Hebrew. -

-
-
-
- - Who can I contact about the Patient Registry for more help or - answers? - -
-

- Email{' '} - - patientregistry@nr2f1.org - {' '} - and we can help or offer a Zoom meeting to help you get - registered. -

-
-
+ + + + + + +
diff --git a/website/src/components/accordion/index.module.scss b/website/src/components/accordion/index.module.scss new file mode 100644 index 0000000..133c8dc --- /dev/null +++ b/website/src/components/accordion/index.module.scss @@ -0,0 +1,61 @@ +@use '@styles/icons'; +@use '@styles/text-styles'; + +.accordion { + background-color: var(--background-accent-navy); + padding: 0 var(--spacing-6); + + &:first-of-type { + border-top-right-radius: var(--border-radius-xl); + border-top-left-radius: var(--border-radius-xl); + } + + &:last-of-type { + border-bottom-right-radius: var(--border-radius-xl); + border-bottom-left-radius: var(--border-radius-xl); + } + + &:not(:first-of-type) summary { + border-block-start: 1px solid var(--border-default); + } + + &[open] summary { + &::after { + background-image: url(icons.$chevron-up-navy); + } + } + + summary { + @include text-styles.header-3; + padding: var(--spacing-6) 0; + cursor: pointer; + display: flex; + justify-content: space-between; + align-items: center; + &::marker, + &::-webkit-details-marker { + display: none; + content: ''; + } + + &::after { + aspect-ratio: 1 / 1; + background-image: url(icons.$chevron-down-navy); + background-position: center; + background-size: contain; + content: ''; + display: block; + width: var(--spacing-5); + } + } + + & > div { + padding-block-end: var(--spacing-6); + & p:last-of-type { + margin-block-end: 0; + } + & li:last-of-type { + margin-block-end: 0; + } + } +} diff --git a/website/src/components/accordion/index.tsx b/website/src/components/accordion/index.tsx new file mode 100644 index 0000000..497d3bb --- /dev/null +++ b/website/src/components/accordion/index.tsx @@ -0,0 +1,19 @@ +import styles from './index.module.scss'; + +interface AccordionProps { + title: string; + content: React.ReactNode; +} + +const Accordion: React.FC = ({ title, content }) => { + return ( +
+ {title} +
+

{content}

+
+
+ ); +}; + +export default Accordion; From 7c9ea47e0afcc4ba7855239700db2e8c92013e8b Mon Sep 17 00:00:00 2001 From: Pedro Martin Date: Sat, 18 Jan 2025 18:39:47 +0000 Subject: [PATCH 9/9] feat: add headings to page contents --- .../[lang]/register-a-patient/page-body.tsx | 8 ++- .../src/components/page-contents/index.tsx | 70 ++++++------------- 2 files changed, 29 insertions(+), 49 deletions(-) diff --git a/website/src/app/[lang]/register-a-patient/page-body.tsx b/website/src/app/[lang]/register-a-patient/page-body.tsx index 0a7e98e..ff0cd68 100644 --- a/website/src/app/[lang]/register-a-patient/page-body.tsx +++ b/website/src/app/[lang]/register-a-patient/page-body.tsx @@ -95,11 +95,17 @@ const RegisterPageBody: React.FC = async ({ lang }) => { return null; } + const headings = [ + registerWithUsHeading?.content ?? '', + registerPatientRegistryHeading?.content ?? '', + registerClinicalIdHeading?.content ?? '', + ]; + return (
{documentToReactComponents(intro?.content?.json)} diff --git a/website/src/components/page-contents/index.tsx b/website/src/components/page-contents/index.tsx index e9cf879..0a1805e 100644 --- a/website/src/components/page-contents/index.tsx +++ b/website/src/components/page-contents/index.tsx @@ -3,7 +3,11 @@ import styles from './index.module.scss'; import type { AvailableLocale, LocalisedString } from '@i18n/locales'; -interface PageContentsProps { +interface HeadingsProps { + headings: string[]; +} + +interface PageContentsProps extends HeadingsProps { lang: AvailableLocale; } @@ -14,62 +18,32 @@ const summary: LocalisedString = { de: 'Seiteninhalt', }; -const PageContents: React.FC = ({ lang }) => { +const Headings: React.FC = ({ headings }) => { + return ( + + ); +}; + +const PageContents: React.FC = ({ lang, headings }) => { const summaryText = summary[lang]; return ( );