Convert ncov and sars to app router [#1132]#1146
Merged
Conversation
…]/` pages into App Router style [#1132] This is a combination of file renames and deletions to get things switched over into new locations with no file content-level changes. These files were deleted; they were small stubs that loaded the same underlying content and presented it at two different URLs: * static-site/pages/ncov/[[...ncov]].jsx These files were moved and renamed, for the reason(s) given below: * `static-site/src/sections/sars-cov-2-page.jsx` was changed to `static-site/app/sars-cov-2/[[...sars-cov-2]]/page.tsx`, as this is where the base SARS-CoV-2 page content is found * `static-site/src/components/Datasets/pathogen-page-introduction.jsx` was changed to `static-site/app/sars-cov-2/[[...sars-cov-2]]/pathogen-page-introduction.tsx`, because the <PathogenPageIntroduction> component is only used by the SARS-CoV-2 page content * 'static-site/src/components/Datasets/situation-reports-by-language.jsx' was changed to `static-site/app/sars-cov-2/[[...sars-cov-2]]/situation-reports-by-language.tsx`, because the <SituationReportsByLanguage> component is only used by the SARS-CoV-2 page content * `static-site/src/components/Misc/collapse-title.jsx` was changed to `static-site/app/sars-cov-2/[[...sars-cov-2]]/collapse-title.tsx`, because the <CollapseTitle> component is only used by the <SituationReportsByLanguage> component Note: this commit will leave the site in a broken state; doing this to ensure better Git tracking of file renames and history.
This is a bulk copy of the JSX/JS files from `static-site/src/components/Datasets` into `static-site/components/dataset-select`. These files contain the <DatasetSelect> component and numerous child components used within <DatasetSelect> as well as supporting code, etc. The files are being copied rather than renamed, because they're used by additional pages, beyond the `/ncov` and `/sars-cov-2/[[...sars-cov-2]]` pages being converted in this branch. The site will be in a broken state with this commit, because the component has not yet been ported to App Router style.
joverlee521
approved these changes
Apr 9, 2025
Contributor
joverlee521
left a comment
There was a problem hiding this comment.
Mainly checked functionality and styling in the testing app and only skimmed the code changes. Left some nitpicky comments, but the ported pages worked as expected for me.
…to `React.ReactElement`. Needed to support the error message used by the `/ncov` and `/sars-cov-2` pages. Requires that the value of the `contents` prop in the <ErrorMessage> in `/staging` page be converted to a JSX <p>. Remove the <p> tags that were wrapping the `contents` prop previously.
…uter [#1132] * Converts <SituationReportsByLanguage> from a React Class Component to a regular React Client Component (non-class-based); this implementation based on `useState()` and `useEffect()` makes the data fetch and rendering process more consistent with other parts of the code base (e.g., `static-site/components/list-resources/use-data-fetch.ts`) * Converts styled components use to CSS module * Also converts <CollapseTitle> to use CSS module
Used as part of /sars-cov-2 content.
Used extensively in <DatasetSelect> and friends. This is a new addition, without removal of the existing (Styled Components-based) component, because it is also used in the Groups pages.
…1132] * Convert <DatasetMap> to a React Client Component; converted associated styles to CSS Module * Convert <DatasetSelect> to a React Client Component * Consolidate <FilterBadge>-associated components into <FilterDisplay> * Convert <FilterDispay> to a React Server Component; convert associated styles to CSS Module and remove unused styles. * Convert `filter-helpers` to Typescript * Convert <FilterSelect> to a React Server Component * Convert <ListDatasets> to a React Server Component; convert associated styles to CSS Module * Add <StyledTooltip> component (extracted from duplicated bits in <DatasetMap> and <FilterSelect> when converting those) * Convert <VirtualizedMenuList> to a React Client Component * Define types for all <DatasetSelect>-associated components and helper methods in `types.ts` and annotate types throughout code touched by this commit * Add JSDoc comments to undocumented functions and file-level constants throughout
…1132] * Remove h5 and h6 styling — there is no styled.H5 or styled.H6 * Refactor h1-h4 styling to pull out common parts, which had previously only been set for h1
2ea5178 to
d148c13
Compare
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description of proposed changes
Converts
/ncovand/sars-cov-2/[[...sars-cov-2]], and the<DatasetSelect>component they use, over to App Router style.Preview
Related issue(s)
Closes #1132
#1052
Checklist