Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Genomics: Finalize menu code for maps #477

Merged
merged 5 commits into from
Oct 18, 2023
Merged

Genomics: Finalize menu code for maps #477

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
0d7ccdc
Add try/catch to useStudyAccessApi since hooks cannot be called condi…
dmfalke Sep 6, 2023
991fcc9
Merge branch 'main' into fix-map-menu--studyAccessApi
dmfalke Sep 18, 2023
202dc84
Use new search MapStudiesForToolbar to drive site menu
dmfalke Sep 18, 2023
8d306d8
Add a comment
dmfalke Sep 19, 2023
fb9436c
Merge branch 'main' into fix-map-menu--studyAccessApi
dmfalke Oct 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
119 changes: 68 additions & 51 deletions ...genomics-site/webapp/wdkCustomization/js/client/components/homepage/VEuPathDBHomePage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -331,9 +331,7 @@ const VEuPathDB = 'VEuPathDB';
const UniDB = 'UniDB';
const DB = 'DB';

// TODO Update this const once we know the question name to use.
// const QUESTION_FOR_MAP_DATASETS = 'DatasetsForMapMenu';
const QUESTION_FOR_MAP_DATASETS = 'AllDatasets';
const QUESTION_FOR_MAP_DATASETS = 'MapStudiesForToolbar';

function makeStaticPageRoute(subPath: string) {
return `${STATIC_ROUTE_PATH}${subPath}`;
Expand Down Expand Up @@ -369,16 +367,8 @@ const useHeaderMenuItems = (
(q) => q.urlSegment === QUESTION_FOR_MAP_DATASETS
)
);
const mapStudy = useWdkService(
(wdkService) =>
wdkService
.getRecord('dataset', [{ name: 'dataset_id', value: 'DS_480c976ef9' }])
.catch(() => {}),
[]
);
// const showInteractiveMaps = mapMenuItemsQuestion != null;
// const mapMenuItems = useMapMenuItems(mapMenuItemsQuestion);
const showInteractiveMaps = projectId === VectorBase && !!useEda;
const showInteractiveMaps = mapMenuItemsQuestion != null;
const mapMenuItems = useMapMenuItems(mapMenuItemsQuestion);

// type: reactRoute, webAppRoute, externalLink, subMenu, custom
const fullMenuItemEntries: HeaderMenuItemEntry[] = [
Expand Down Expand Up @@ -586,40 +576,56 @@ const useHeaderMenuItems = (
include: [EuPathDB, UniDB],
},
},
// {
// key: 'maps-alpha',
// display: (
// <>
// Interactive maps <img alt="BETA" src={betaImage} />
// </>
// ),
// type: 'subMenu',
// metadata: {
// test: () => showInteractiveMaps,
// },
// items: mapMenuItems ?? [
// {
// key: 'maps-loading',
// type: 'custom',
// display: <Loading radius={4} />,
// },
// ],
// },
{
type: 'reactRoute',
display: (
<>
MapVEu - {safeHtml(mapStudy?.displayName ?? '')}{' '}
<img alt="BETA" src={betaImage} />
</>
),
key: 'map--mega-study',
url: '/workspace/maps/DS_480c976ef9/new',
target: '_blank',
metadata: {
test: () => showInteractiveMaps && mapStudy != null,
},
},
!showInteractiveMaps
? {
type: 'custom',
key: 'maps-alpha',
display: null,
metadata: {
test: () => showInteractiveMaps,
},
}
: mapMenuItems == null
? {
key: 'maps-alpha',
type: 'custom',
display: (
<>
MapVEu &mdash; Interactive maps{' '}
<img alt="BETA" src={betaImage} />{' '}
<Loading
style={{
display: 'inline-block',
height: '1em',
width: '1em',
padding: 0,
}}
radius={1}
/>
</>
),
}
: mapMenuItems.length === 1
? {
...mapMenuItems[0],
display: (
<>
MapVEu &mdash; {mapMenuItems[0].display}{' '}
<img alt="BETA" src={betaImage} />
</>
),
}
: {
key: 'maps-alpha',
type: 'subMenu',
display: (
<>
MapVEu &mdash; Interactive maps{' '}
<img alt="BETA" src={betaImage} />
</>
),
items: mapMenuItems,
},
{
key: 'pubcrawler',
display: 'PubMed and Entrez',
Expand Down Expand Up @@ -1196,21 +1202,21 @@ export const VEuPathDBHomePage = connect(mapStateToProps)(

function useMapMenuItems(question?: Question) {
const { wdkService } = useNonNullableContext(WdkDependenciesContext);
const studyAccessApi = useStudyAccessApi();
const studyAccessApi = useStudyAccessApi_tryCatch();
const subsettingClient = useMemo(
() => new SubsettingClient({ baseUrl: edaServiceUrl }, wdkService),
[wdkService]
);
const [mapMenuItems, setMapMenuItems] = useState<HeaderMenuItem[]>();
const [mapMenuItems, setMapMenuItems] = useState<HeaderMenuItemEntry[]>();
useEffect(() => {
if (question == null) return;
if (question == null || studyAccessApi == null) return;
getWdkStudyRecords(
{ studyAccessApi, subsettingClient, wdkService },
{ searchName: question.urlSegment }
).then(
(records) => {
const menuItems = records.map(
(record): HeaderMenuItem => ({
(record): HeaderMenuItemEntry => ({
key: `map-${record.id[0].value}`,
display: record.displayName,
type: 'reactRoute',
Expand All @@ -1237,3 +1243,14 @@ function useMapMenuItems(question?: Question) {
}, [question, studyAccessApi, subsettingClient, wdkService]);
return mapMenuItems;
}

function useStudyAccessApi_tryCatch() {
// useStudyAccessApi() will throw if WdkService isn't configured for study
// access. We can ignore the error and return `undefined` to allow the
// application to handle the absence of the configuration.
try {
return useStudyAccessApi();
} catch {
return;
}
}
Loading