From be77b188b851b121c3a95cda5157c9ed63350f1b Mon Sep 17 00:00:00 2001 From: Colin Diesh Date: Tue, 4 Jun 2024 14:12:48 -0400 Subject: [PATCH] Add ability to get refNames for a track in the "About track" panel (#3992) --- .../BaseFeatureDetail/index.tsx | 2 +- .../__snapshots__/index.test.tsx.snap | 4 +- .../src/ui/AboutDialogContents.tsx | 50 +++++-- .../product-core/src/ui/RefNameInfoDialog.tsx | 126 ++++++++++++++++++ .../__snapshots__/index.test.tsx.snap | 1 - .../VariantFeatureWidget.test.tsx.snap | 1 - 6 files changed, 164 insertions(+), 20 deletions(-) create mode 100644 packages/product-core/src/ui/RefNameInfoDialog.tsx diff --git a/packages/core/BaseFeatureWidget/BaseFeatureDetail/index.tsx b/packages/core/BaseFeatureWidget/BaseFeatureDetail/index.tsx index f9b3f65726..637e32fe1f 100644 --- a/packages/core/BaseFeatureWidget/BaseFeatureDetail/index.tsx +++ b/packages/core/BaseFeatureWidget/BaseFeatureDetail/index.tsx @@ -67,7 +67,7 @@ export function BaseCard({ } > - {title} + {title} {children} diff --git a/packages/core/BaseFeatureWidget/__snapshots__/index.test.tsx.snap b/packages/core/BaseFeatureWidget/__snapshots__/index.test.tsx.snap index 834b741137..77380841b7 100644 --- a/packages/core/BaseFeatureWidget/__snapshots__/index.test.tsx.snap +++ b/packages/core/BaseFeatureWidget/__snapshots__/index.test.tsx.snap @@ -16,9 +16,7 @@ exports[`open up a widget 1`] = ` > - - + />
, attr: string) { @@ -32,7 +37,7 @@ function removeAttr(obj: Record, attr: string) { return obj } -export default function AboutContents({ +const AboutDialogContents = observer(function ({ config, }: { config: AnyConfigurationModel @@ -41,6 +46,7 @@ export default function AboutContents({ const conf = readConfObject(config) const session = getSession(config) const { classes } = useStyles() + const [showRefNames, setShowRefNames] = useState(false) const hideUris = getConf(session, ['formatAbout', 'hideUris']) || @@ -71,18 +77,26 @@ export default function AboutContents({
{!hideUris ? ( - + + + + ) : null} ) : null} + {showRefNames ? ( + setShowRefNames(false)} + /> + ) : null}
) -} +}) + +export default AboutDialogContents diff --git a/packages/product-core/src/ui/RefNameInfoDialog.tsx b/packages/product-core/src/ui/RefNameInfoDialog.tsx new file mode 100644 index 0000000000..5bab3fca73 --- /dev/null +++ b/packages/product-core/src/ui/RefNameInfoDialog.tsx @@ -0,0 +1,126 @@ +import React, { useState, useEffect } from 'react' +import { Button, DialogContent, Typography } from '@mui/material' +import { + readConfObject, + AnyConfigurationModel, +} from '@jbrowse/core/configuration' +import { Dialog, LoadingEllipses } from '@jbrowse/core/ui' +import { getSession } from '@jbrowse/core/util' +import { observer } from 'mobx-react' +import { makeStyles } from 'tss-react/mui' +import copy from 'copy-to-clipboard' + +const MAX_REF_NAMES = 10_000 + +const useStyles = makeStyles()(theme => ({ + container: { + minWidth: 800, + }, + refNames: { + maxHeight: 300, + width: '100%', + overflow: 'auto', + flexGrow: 1, + background: theme.palette.background.default, + }, +})) + +const RefNameInfoDialog = observer(function ({ + config, + onClose, +}: { + config: AnyConfigurationModel + onClose: () => void +}) { + const [error, setError] = useState() + const [refNames, setRefNames] = useState>() + const [copied, setCopied] = useState(false) + const { classes } = useStyles() + const session = getSession(config) + const { rpcManager } = session + + useEffect(() => { + // eslint-disable-next-line @typescript-eslint/no-floating-promises + ;(async () => { + try { + const assemblyNames = [ + ...new Set(readConfObject(config, 'assemblyNames') as string[]), + ] + const map = await Promise.all( + assemblyNames.map(async assemblyName => { + const adapterConfig = readConfObject(config, 'adapter') + return [ + assemblyName, + (await rpcManager.call(config.trackId, 'CoreGetRefNames', { + adapterConfig, + // hack for synteny adapters + regions: [{ assemblyName }], + })) as string[], + ] as const + }), + ) + setRefNames(Object.fromEntries(map)) + } catch (e) { + console.error(e) + setError(e) + } + })() + }, [config, rpcManager]) + + const names = refNames ? Object.entries(refNames) : [] + const result = names + .flatMap(([assemblyName, refNames]) => { + return [ + `--- ${assemblyName} ---`, + ...refNames.slice(0, MAX_REF_NAMES), + `${ + refNames.length > MAX_REF_NAMES + ? `\nToo many refNames to show in browser for ${assemblyName}, use "Copy ref names" button to copy to clipboard` + : '' + }`, + ] + }) + .filter(f => !!f) + .join('\n') + + return ( + + + {error ? ( + {`${error}`} + ) : refNames === undefined ? ( + + ) : ( + <> + + + 
{result}
+ + )} + + + ) +}) + +export default RefNameInfoDialog diff --git a/plugins/alignments/src/AlignmentsFeatureDetail/__snapshots__/index.test.tsx.snap b/plugins/alignments/src/AlignmentsFeatureDetail/__snapshots__/index.test.tsx.snap index 2ae866665c..938d2b1179 100644 --- a/plugins/alignments/src/AlignmentsFeatureDetail/__snapshots__/index.test.tsx.snap +++ b/plugins/alignments/src/AlignmentsFeatureDetail/__snapshots__/index.test.tsx.snap @@ -21,7 +21,6 @@ exports[`open up a widget 1`] = ` - ctgA_3_555_0:0:0_2:0... - match
diff --git a/plugins/variants/src/VariantFeatureWidget/__snapshots__/VariantFeatureWidget.test.tsx.snap b/plugins/variants/src/VariantFeatureWidget/__snapshots__/VariantFeatureWidget.test.tsx.snap index a11dee23c9..0f17aac7ba 100644 --- a/plugins/variants/src/VariantFeatureWidget/__snapshots__/VariantFeatureWidget.test.tsx.snap +++ b/plugins/variants/src/VariantFeatureWidget/__snapshots__/VariantFeatureWidget.test.tsx.snap @@ -21,7 +21,6 @@ exports[`renders with just the required model elements 1`] = ` - rs123