-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
NickAkhmetov / HMP-235 Add support for text-only publication vignettes (
#3159) * HMP-235 Add support for text-only publication vignettes * Explanatory comments * Revert contexts to `jsx` for now to avoid breaking storybook * Update CHANGELOG-hmp-235.md Co-authored-by: L Choy <[email protected]> * Review fixes - Account for potentially undefined/null vignettes (no guarantee that it'll be an empty list) - Move multiFetcher to shared utils folder * Don't use fallback value for urls so `useSWR` properly handles conditional fetch --------- Co-authored-by: L Choy <[email protected]>
- Loading branch information
1 parent
f675369
commit ca6964b
Showing
7 changed files
with
91 additions
and
83 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
- Add support for text-only publication vignettes without Vitessce visualizations. |
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
42 changes: 42 additions & 0 deletions
42
context/app/static/js/components/publications/PublicationVignette/hooks.ts
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 |
---|---|---|
@@ -0,0 +1,42 @@ | ||
import useSWR from 'swr'; | ||
import { useAppContext } from 'js/components/Contexts'; | ||
import { multiFetcher } from 'js/helpers/multiFetcher'; | ||
import { fillUrls } from './utils'; | ||
import { PublicationVignette } from '../types'; | ||
|
||
type PublicationVignetteConfsInput = { | ||
uuid: string; | ||
vignette: PublicationVignette; | ||
vignetteDirName: string; | ||
}; | ||
|
||
export function usePublicationVignetteConfs({ uuid, vignetteDirName, vignette }: PublicationVignetteConfsInput) { | ||
const { assetsEndpoint, groupsToken } = useAppContext(); | ||
// Extract file paths from the vignette object to form the urls to fetch for this vignette | ||
const urls = vignette.figures?.map( | ||
({ file }) => `${assetsEndpoint}/${uuid}/vignettes/${vignetteDirName}/${file}?token=${groupsToken}`, | ||
); | ||
const { data } = useSWR(urls, multiFetcher, { | ||
revalidateOnFocus: false, | ||
revalidateOnReconnect: false, | ||
}); | ||
|
||
if (data) { | ||
const urlHandler = (url: string, isZarr: boolean) => { | ||
return `${url.replace('{{ base_url }}', `${assetsEndpoint}/${uuid}/data`)}${ | ||
isZarr ? '' : `?token=${groupsToken}` | ||
}`; | ||
}; | ||
|
||
const requestInitHandler = () => { | ||
return { | ||
headers: { Authorization: `Bearer ${groupsToken}` }, | ||
}; | ||
}; | ||
// Formats the vitessce config data to replace the {{ base_url }} placeholder with the actual url. | ||
// TODO: Improve this `unknown`; I couldn't figure out how to import the appropriate `VitessceConfig` type from Vitessce. | ||
const formattedData: unknown[] = data.map((d) => fillUrls(d, urlHandler, requestInitHandler)); | ||
return formattedData; | ||
} | ||
return undefined; | ||
} |
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 |
---|---|---|
@@ -0,0 +1,11 @@ | ||
export type VignetteFigure = { | ||
file: string; | ||
name: string; | ||
}; | ||
|
||
export type PublicationVignette = { | ||
name: string; | ||
description: string; | ||
figures?: VignetteFigure[]; | ||
directory_name: string; | ||
}; |
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 |
---|---|---|
@@ -0,0 +1,5 @@ | ||
// Fetcher function that lets SWR fetch multiple urls at once | ||
export const multiFetcher = (...urls: string[]) => { | ||
const f = (url: string) => fetch(url).then((response) => response.json()); | ||
return Promise.all(urls.map((url) => f(url))); | ||
}; |
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 |
---|---|---|
|
@@ -20,8 +20,8 @@ | |
"sourceMap": true, | ||
"noEmit": true, | ||
"paths": { | ||
"@/*": [ | ||
"./app/static/js/*" | ||
"js/*": [ | ||
"./*" | ||
] | ||
} | ||
}, | ||
|