-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
refactor(website): extract GenericSequencingEffortsPage (#412)
resolves #406
- Loading branch information
1 parent
bbaaba4
commit d2a4d03
Showing
22 changed files
with
235 additions
and
523 deletions.
There are no files selected for viewing
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
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,103 +1,6 @@ | ||
--- | ||
import ComponentWrapper from '../../components/ComponentWrapper.astro'; | ||
import ComponentsGrid from '../../components/ComponentsGrid.astro'; | ||
import { SequencingEffortsSelectorFallback } from '../../components/pageStateSelectors/FallbackElement'; | ||
import { SequencingEffortsPageStateSelector } from '../../components/pageStateSelectors/SequencingEffortsPageStateSelector'; | ||
import { getDashboardsConfig } from '../../config'; | ||
import SingleVariantOrganismPageLayout from '../../layouts/OrganismPage/SingleVariantOrganismPageLayout.astro'; | ||
import { chooseGranularityBasedOnDateRange } from '../../util/chooseGranularityBasedOnDateRange'; | ||
import { defaultTablePageSize } from '../../views/View'; | ||
import { getLocationSubdivision } from '../../views/helpers'; | ||
import type { OrganismViewKey } from '../../views/routing'; | ||
import { ServerSide } from '../../views/serverSideRouting'; | ||
const organismViewKey: OrganismViewKey = 'covid.sequencingEffortsView'; | ||
const view = ServerSide.routing.getOrganismView(organismViewKey); | ||
const pageState = view.pageStateHandler.parsePageStateFromUrl(Astro.url); | ||
const datasetLapisFilter = view.pageStateHandler.toLapisFilter(pageState); | ||
const timeGranularity = chooseGranularityBasedOnDateRange( | ||
pageState.datasetFilter.dateRange, | ||
new Date(view.organismConstants.earliestDate), | ||
); | ||
const { label: subdivisionLabel, field: subdivisionField } = getLocationSubdivision( | ||
view.organismConstants.locationFields, | ||
pageState.datasetFilter.location, | ||
); | ||
import GenericSequencingEffortsPage from '../../components/views/sequencingEfforts/GenericSequencingEffortsPage.astro'; | ||
import { Organisms } from '../../types/Organism'; | ||
--- | ||
|
||
<SingleVariantOrganismPageLayout view={view}> | ||
<SequencingEffortsPageStateSelector | ||
slot='filters' | ||
locationFilterConfig={{ | ||
locationFields: view.organismConstants.locationFields, | ||
initialLocation: pageState.datasetFilter.location, | ||
placeholderText: 'Sampling location', | ||
}} | ||
dateRangeFilterConfig={{ | ||
initialDateRange: pageState.datasetFilter.dateRange, | ||
dateRangeOptions: view.organismConstants.dateRangeOptions, | ||
earliestDate: view.organismConstants.earliestDate, | ||
dateColumn: view.organismConstants.mainDateField, | ||
}} | ||
organismViewKey={organismViewKey} | ||
organismsConfig={getDashboardsConfig().dashboards.organisms} | ||
client:only='react' | ||
> | ||
<SequencingEffortsSelectorFallback slot='fallback' /> | ||
</SequencingEffortsPageStateSelector> | ||
|
||
<ComponentsGrid slot='dataDisplay'> | ||
<ComponentWrapper title='Number sequences' height='600px'> | ||
<gs-number-sequences-over-time | ||
lapisFilter={JSON.stringify({ | ||
displayName: '', | ||
lapisFilter: datasetLapisFilter, | ||
})} | ||
lapisDateField={view.organismConstants.mainDateField} | ||
views='["bar", "line", "table"]' | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%' | ||
granularity={timeGranularity}></gs-number-sequences-over-time> | ||
</ComponentWrapper> | ||
{ | ||
subdivisionField !== undefined && ( | ||
<ComponentWrapper title={subdivisionLabel} height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([subdivisionField])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%' | ||
/> | ||
</ComponentWrapper> | ||
) | ||
} | ||
<ComponentWrapper title='Hosts' height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([view.organismConstants.hostField])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%'></gs-aggregate> | ||
</ComponentWrapper> | ||
<ComponentWrapper title='Originating lab' height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([view.organismConstants.originatingLabField])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%'></gs-aggregate> | ||
</ComponentWrapper> | ||
<ComponentWrapper title='Submitting lab' height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([view.organismConstants.submittingLabField])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%'></gs-aggregate> | ||
</ComponentWrapper> | ||
</ComponentsGrid> | ||
</SingleVariantOrganismPageLayout> | ||
<GenericSequencingEffortsPage organism={Organisms.covid} /> |
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,106 +1,6 @@ | ||
--- | ||
import ComponentWrapper from '../../../components/ComponentWrapper.astro'; | ||
import ComponentsGrid from '../../../components/ComponentsGrid.astro'; | ||
import { SequencingEffortsSelectorFallback } from '../../../components/pageStateSelectors/FallbackElement'; | ||
import { SequencingEffortsPageStateSelector } from '../../../components/pageStateSelectors/SequencingEffortsPageStateSelector'; | ||
import { getDashboardsConfig } from '../../../config'; | ||
import SingleVariantOrganismPageLayout from '../../../layouts/OrganismPage/SingleVariantOrganismPageLayout.astro'; | ||
import { chooseGranularityBasedOnDateRange } from '../../../util/chooseGranularityBasedOnDateRange'; | ||
import { defaultTablePageSize } from '../../../views/View'; | ||
import { getLocationSubdivision } from '../../../views/helpers'; | ||
import type { OrganismViewKey } from '../../../views/routing'; | ||
import { ServerSide } from '../../../views/serverSideRouting'; | ||
const organismViewKey: OrganismViewKey = 'h5n1.sequencingEffortsView'; | ||
const view = ServerSide.routing.getOrganismView(organismViewKey); | ||
const pageState = view.pageStateHandler.parsePageStateFromUrl(Astro.url); | ||
const datasetLapisFilter = view.pageStateHandler.toLapisFilter(pageState); | ||
const timeGranularity = chooseGranularityBasedOnDateRange( | ||
pageState.datasetFilter.dateRange, | ||
new Date(view.organismConstants.earliestDate), | ||
); | ||
const { label: subdivisionLabel, field: subdivisionField } = getLocationSubdivision( | ||
view.organismConstants.locationFields, | ||
pageState.datasetFilter.location, | ||
); | ||
import GenericSequencingEffortsPage from '../../../components/views/sequencingEfforts/GenericSequencingEffortsPage.astro'; | ||
import { Organisms } from '../../../types/Organism'; | ||
--- | ||
|
||
<SingleVariantOrganismPageLayout view={view}> | ||
<SequencingEffortsPageStateSelector | ||
slot='filters' | ||
locationFilterConfig={{ | ||
locationFields: view.organismConstants.locationFields, | ||
initialLocation: pageState.datasetFilter.location, | ||
placeholderText: 'Sampling location', | ||
}} | ||
dateRangeFilterConfig={{ | ||
initialDateRange: pageState.datasetFilter.dateRange, | ||
dateRangeOptions: view.organismConstants.dateRangeOptions, | ||
earliestDate: view.organismConstants.earliestDate, | ||
dateColumn: view.organismConstants.mainDateField, | ||
}} | ||
organismViewKey={organismViewKey} | ||
organismsConfig={getDashboardsConfig().dashboards.organisms} | ||
client:only='react' | ||
> | ||
<SequencingEffortsSelectorFallback slot='fallback' /> | ||
</SequencingEffortsPageStateSelector> | ||
|
||
<ComponentsGrid slot='dataDisplay'> | ||
<ComponentWrapper title='Number sequences' height='600px'> | ||
<gs-number-sequences-over-time | ||
lapisFilter={JSON.stringify({ | ||
displayName: '', | ||
lapisFilter: datasetLapisFilter, | ||
})} | ||
lapisDateField={view.organismConstants.mainDateField} | ||
views='["bar", "line", "table"]' | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%' | ||
granularity={timeGranularity}></gs-number-sequences-over-time> | ||
</ComponentWrapper> | ||
{ | ||
subdivisionField !== undefined && ( | ||
<ComponentWrapper title={subdivisionLabel} height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([subdivisionField])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%' | ||
/> | ||
</ComponentWrapper> | ||
) | ||
} | ||
<ComponentWrapper title='Hosts' height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([view.organismConstants.hostField])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%'></gs-aggregate> | ||
</ComponentWrapper> | ||
<ComponentWrapper title='Author affiliations' height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([view.organismConstants.authorAffiliationsField])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%'></gs-aggregate> | ||
</ComponentWrapper> | ||
<ComponentWrapper title='Authors' height='600px'> | ||
<gs-aggregate | ||
fields={JSON.stringify([ | ||
view.organismConstants.authorsField, | ||
view.organismConstants.authorAffiliationsField, | ||
])} | ||
filter={JSON.stringify(datasetLapisFilter)} | ||
pageSize={defaultTablePageSize} | ||
width='100%' | ||
height='100%'></gs-aggregate> | ||
</ComponentWrapper> | ||
</ComponentsGrid> | ||
</SingleVariantOrganismPageLayout> | ||
<GenericSequencingEffortsPage organism={Organisms.h5n1} /> |
Oops, something went wrong.