Convert pathogens to app router [#1066] #1124
Open
Conversation
This file contains 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
Note: this will leave the site in a broken state; doing this to ensure better Git tracking of file renames.
Note: this is a copy, not a move, as `<ExpandableTiles>` is also used in the `splash` and `Groups` components in addition to the `ListResources` component that is consumed by the `/pathogens` page.
Note: this is a copy, not a move, as `<ErrorBoundary>` is used elsewhere in the site, in addition to the `ListResources` component that is consumed by the `/pathogens` page.
Note: this is a copy, not a move, as `<ListResources>` is used elsewhere in the site, in addition to the `/pathogens` page.
nextstrain-bot
temporarily deployed
to
nextstrain-s-convert-pa-9ilhrn
Note: despite the placement of the component outside the <ListResources> component, it is only used within that component. I considered relocating it to `static-site/components/list-resources/spinner.tsx` but elected to maintain it outside of the <ListResources> component to better support future re-use, which seems not unlikely.
genehack
force-pushed
the
convert-pathogens-to-app-router-1066
branch
from
bfd05fb to
2c2d562
Compare
nextstrain-bot
temporarily deployed
to
nextstrain-s-convert-pa-heatct
* add `use client` because of use of `useState` * rename `Tile` type to `GenericTileBase`; rename `AnyTile` to `Tile` * converted styled components to CSS module * swap various prop-driven styled components bits to dynamic inline styles
* move `div.errorContainer` into global CSS file because it is used in multiple places
* segregate types and functions * update formatting
* adjust leading/trailing whitespace
* move styling from styled components to CSS module
* refactor <ResourceModal> to `useContext` and `useCallback` to build
`dismissModal()` function, rather than passing it in — this was
necessary because all props of React Client Components need to be
serializable (i.e., not functions), and <ResourceModal> needs to
"use client" because it depends on `useState` and `useEffect`
* refactor the `_draw` function out into a distinct
file (`modal_draw.js`) to reflect the lack of typing in that code (I
briefly explored converting that file to Typescript and concluded
the juice was not worth the squeeze)
* note that this also means we don't need to add @types/d3 to
devDependencies
* export component as a function * convert to Typescript; light reformatting
* Refactor <Name>, <ResourceLinkWrapper>, and <ResourceLink> into <IndividualResourceLink>, and migrate into distinct file; in the future, <GroupLink> will also be refactored into that file, which is reflected in the `group-and-resource-links` file name * Refactor <IconContainer> into distinct file, rework to avoid need to pass non-serializable prop * Refactor <IndividualResource> and associated components from Styled to CSS Module * Refactor <IndividualResource> component to be passed `gapWidth` prop, which supports cleaner separation of concerns with where that constant is defined and used * Refactor <TooltipWrapper> into a distinct file, because it doesn't need to be a React Client component
* Refactored styles from structured component to CSS Module * Refactored <GroupLink> and <IndividualQuickLink> components out into `group-and-resource-links.tsx` * Refactored <ResourceGroup> and contained components
* convert `export const`` to `export default function` * add "use client" * refactor and update code
* convert to React Client Component * refactor code lightly
* convert from styled comp to css module * convert const fat-arrows to functions * update imports, etc.
genehack
force-pushed
the
convert-pathogens-to-app-router-1066
branch
from
2c2d562 to
042d526
Compare
31 tasks
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
Preview
Converts /pathogens and components used on that page to App Router style.
Converted components:
Note that all of these were done in two stages: first a move or copy of the old Pages Router style code to the new App Router location — which sometimes, inevitably, leaves the code in a broken state — and then a subsequent commit to convert to the App Router style/code layout.
Please see individual commits for extra details around some porting decisions.
Related issue(s)
Closes #1066
Checklist