npm - synapse-react-client - Versions diffs - 4.0.19 → 4.0.21 - Mend

synapse-react-client 4.0.19 → 4.0.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1619) hide show

package/dist/components/Plot/UpsetPlot.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UpsetPlot.js","names":[],"sources":["../../../src/components/Plot/UpsetPlot.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport LargeButton from '@/components/styled/LargeButton'\nimport SynapseClient from '@/synapse-client'\nimport { SynapseConstants } from '@/utils'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions/SqlFunctions'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { ReactComponent as DiagonalLinePattern } from '@/assets/illustrations/diagonalLinePattern.svg'\n\nimport UpSetJS, {\n extractSets,\n generateCombinations,\n ISet,\n ISetCombinations,\n ISetLike,\n ISets,\n UpSetFontSizes,\n UpSetSelectionProps,\n} from '@upsetjs/react'\n/ eslint-disable @typescript-eslint/no-unsafe-member-access /\n/ eslint-disable @typescript-eslint/no-unsafe-assignment /\nimport { useEffect, useState } from 'react'\nimport { getColorPalette } from '../ColorGradient/ColorGradient'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport loadingScreen from '../LoadingScreen/LoadingScreen'\nimport { Box, SxProps, useTheme } from '@mui/material'\nimport { useMeasure } from '@react-hookz/web'\n\nexport type UpsetPlotProps = {\n sql: string // first column should contain values, second column should contain a single set value. ie. SELECT distinct individualID, assay FROM syn20821313\n rgbIndex?: number // color plot based on portal\n customPlotColor?: string\n selectionOpacity?: number\n variant?: 'ampals'\n maxBarCount?: number // will show all if not set\n setName?: string // instead of \"Set Size\"\n combinationName?: string // instead of \"Intersection Size\"\n height?: number\n summaryLinkText?: string // text for home page link below chart\n summaryLink?: string // url for home page link below chart\n} & Pick<UpSetSelectionProps, 'onClick'>\n\nexport type UpsetPlotData = {\n sets: ISets<any>\n combinations: ISetCombinations<any>\n}\n/\n Upset plot. See https://medium.com/@sgratzl/upset-js-javascript-tutorial-1b84bfd6896d\n * Currently this is driven by a Synapse Table/View, but we may want to alter it to read in the data from a flat file instead.\n */\nexport function UpsetPlot({\n sql,\n variant,\n rgbIndex,\n maxBarCount,\n setName,\n combinationName,\n height = 700,\n summaryLinkText,\n summaryLink,\n onClick,\n customPlotColor,\n selectionOpacity,\n}: UpsetPlotProps) {\n const { accessToken } = useSynapseContext()\n const [isLoading, setIsLoading] = useState<boolean>()\n const [data, setData] = useState<UpsetPlotData>()\n const [error, setError] = useState<string>()\n const [selection, setSelection] = useState(null as ISetLike<any> \| null)\n const theme = useTheme()\n\n const [plotContainerMeasurements, plotContainerRef] = useMeasure()\n\n const variantStyles: Record<string, SxProps> = {\n default: {\n 'text[class^=\"sChartTextStyle-upset-\"], text[class^= \"cChartTextStyle-upset-\"]':\n {\n textTransform: 'uppercase',\n },\n },\n ampals: {\n width: '100%',\n '& .selectionHint-upset-': {\n stroke: 'transparent !important',\n },\n '& [class^=\"selectionHint-upset-\"]': {\n stroke: 'transparent !important',\n },\n '& g[class^=\"interactive-upset-\"]:hover line[class^=\"upsetLine-\"]': {\n stroke: theme.palette.primary.main,\n strokeWidth: '4px',\n strokeOpacity: 1,\n },\n '& g[class^=\"interactive-upset-\"]:hover circle[class^=\"fillNotMember-upset-\"]':\n {\n opacity: 0.2,\n },\n '& line[class^=\"upsetLine-\"]': {\n strokeOpacity: 0,\n },\n '& rect[class^=\"fillPrimary-upset-\"]': {\n fill: 'url(#diagonalLinePattern)',\n stroke: theme.palette.grey[700],\n strokeWidth: 2,\n },\n '& circle[class^=\"fillNotMember-upset-\"]': {\n stroke: theme.palette.grey[600],\n strokeWidth: 2,\n },\n '& text[class^=\"sChartTextStyle-upset-\"], & text[class^=\"cChartTextStyle-upset-\"]':\n {\n fontWeight: 700,\n fill: theme.palette.grey[800],\n lineHeight: '150%',\n },\n '& text[class^=\"cChartTextStyle-upset-\"]': {\n transform: 'translate(-60px, 190px) rotate(-90deg)',\n },\n '& text[class^=\"sChartTextStyle-upset-\"]': {\n transform: 'translate(-10px, 100px) rotate(-90deg)',\n },\n },\n }\n\n let plotColor: string, selectionColor: string\n if (rgbIndex != null) {\n const { colorPalette } = getColorPalette(rgbIndex, 2)\n plotColor = colorPalette[0]\n selectionColor = colorPalette[0]\n } else {\n plotColor = theme.palette.grey[700]\n selectionColor = customPlotColor \|\| theme.palette.primary.main\n }\n\n const updateFontSizes: UpSetFontSizes = {\n setLabel: '14px',\n }\n\n useEffect(() => {\n let isCancelled: boolean = false\n const getPlotData = async () => {\n setIsLoading(true)\n try {\n const entityId = parseEntityIdFromSqlStatement(sql)\n const partMask = SynapseConstants.BUNDLE_MASK_QUERY_RESULTS\n const queryRequest: QueryBundleRequest = {\n partMask,\n concreteType:\n 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n entityId,\n query: {\n sql,\n },\n }\n const { queryResult } = await SynapseClient.getFullQueryTableResults(\n queryRequest,\n accessToken,\n )\n // transform query data into plot data, and store.\n // collect all values for each key\n const keyValuesMap: Record<string, { name: string; sets: string[] }> =\n {}\n // keyValuesMap looks like { 'A': {name: 'A', sets: ['S1', 'S2'] }, 'B': { name: 'B', sets: ['S1'] }, ... }\n // It's a little redundant, but makes the next step much easier.\n\n const caseInsensitiveSetNames: Record<string, string> = {}\n // caseInsensitiveSetNames looks like { 'RNASEQ': 'rnaSeq', 'NOMe-SEQ': 'NOMe-seq'}.\n\n for (const row of queryResult?.queryResults.rows ?? []) {\n for (let j = 1; j < row.values.length; j += 1) {\n const rowValues: string[] = row.values as string[]\n if (rowValues.some(value => value === null)) {\n console.warn('Row has null value(s) when no nulls expected')\n }\n\n const key = rowValues[0]\n let newValue = rowValues[j]\n keyValuesMap[key] = keyValuesMap[key] \|\| {}\n keyValuesMap[key].name = key\n\n keyValuesMap[key].sets = keyValuesMap[key].sets \|\| []\n const found = keyValuesMap[key].sets.find((v: any) => v == newValue)\n if (!found && newValue) {\n if (caseInsensitiveSetNames[newValue.toUpperCase()]) {\n newValue = caseInsensitiveSetNames[newValue.toUpperCase()]\n } else {\n caseInsensitiveSetNames[newValue.toUpperCase()] = newValue\n }\n keyValuesMap[key].sets.push(newValue)\n }\n }\n }\n // now create the expected elems set\n const elems = Object.values(keyValuesMap)\n // elems looks like [{ name: 'A', sets: ['S1', 'S2'] }, { name: 'B', sets: ['S1'] }, ...]\n const sets = extractSets(elems)\n // PORTALS-1673: sort by assay name\n const sortedSets = (sets as ISet[]).sort((a, b) => {\n return ('' + b.name).localeCompare(a.name)\n })\n\n const combinations = generateCombinations(sortedSets, {\n type: 'intersection',\n min: 1,\n limit: maxBarCount,\n order: 'cardinality:desc',\n })\n if (!isCancelled) {\n setData({ sets, combinations })\n setIsLoading(false)\n }\n } catch (err) {\n if (!isCancelled) {\n setIsLoading(false)\n let errorMessage = err['reason']\n if (!errorMessage) {\n console.error(err)\n errorMessage = 'Error retrieving data'\n }\n setError(errorMessage)\n }\n }\n }\n getPlotData()\n return () => {\n isCancelled = true\n }\n }, [sql, accessToken])\n\n return (\n <>\n {isLoading && loadingScreen}\n {!isLoading && data && (\n <>\n {variantStyles['ampals'] && (\n // Render DiagonalLinePattern so UpsetPlot can use `fill: url(#diagonalLinePattern)`.\n // The SVG element must be added to the DOM so we can reference its ID (which is set in the SVG file) in the `fill` style\n // Ideally, we would reference the asset URL imported by Vite, but this isn't working.\n <Box\n sx={{\n '& path': {\n stroke: '#D9D9D9 !important',\n },\n width: 0,\n height: 0,\n position: 'absolute',\n }}\n >\n <DiagonalLinePattern />\n </Box>\n )}\n <Box\n className=\"UpsetPlot\"\n sx={variant ? variantStyles[variant] : variantStyles['default']}\n ref={plotContainerRef}\n >\n <UpSetJS\n sets={data.sets}\n combinations={data.combinations}\n width={plotContainerMeasurements?.width \|\| 800}\n height={height}\n onHover={setSelection}\n onClick={onClick}\n selection={selection}\n color={plotColor}\n selectionColor={selectionColor}\n hoverHintColor={'orange'}\n hasSelectionOpacity={selectionOpacity ? selectionOpacity : 0.3}\n // alternatingBackgroundColor={false}\n setName={setName}\n combinationName={combinationName}\n fontFamily=\"'DM Sans', sans-serif\"\n fontSizes={updateFontSizes}\n exportButtons={false}\n notMemberColor=\"transparent\"\n />\n {summaryLink && summaryLinkText && (\n <div className=\"UpsetPlot__summary\">\n <LargeButton\n color=\"secondary\"\n variant=\"contained\"\n href={summaryLink}\n >\n {summaryLinkText}\n </LargeButton>\n </div>\n )}\n </Box>\n </>\n )}\n <ErrorBanner error={error} />\n </>\n )\n}\n\nexport default UpsetPlot\n"],"mappings":"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"}
1	+ {"version":3,"file":"UpsetPlot.js","names":[],"sources":["../../../src/components/Plot/UpsetPlot.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any /\nimport LargeButton from '@/components/styled/LargeButton'\nimport SynapseClient from '@/synapse-client'\nimport { SynapseConstants } from '@/utils'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions/SqlFunctions'\nimport { QueryBundleRequest } from '@sage-bionetworks/synapse-types'\nimport { ReactComponent as DiagonalLinePattern } from '@/assets/illustrations/diagonalLinePattern.svg'\n\nimport UpSetJS, {\n extractSets,\n generateCombinations,\n ISet,\n ISetCombinations,\n ISetLike,\n ISets,\n UpSetFontSizes,\n UpSetSelectionProps,\n} from '@upsetjs/react'\n/ eslint-disable @typescript-eslint/no-unsafe-member-access /\n/ eslint-disable @typescript-eslint/no-unsafe-assignment /\nimport { useEffect, useState } from 'react'\nimport { getColorPalette } from '../ColorGradient/ColorGradient'\nimport { ErrorBanner } from '../error/ErrorBanner'\nimport loadingScreen from '../LoadingScreen/LoadingScreen'\nimport { Box, SxProps, useTheme } from '@mui/material'\nimport { useMeasure } from '@react-hookz/web'\n\nexport type UpsetPlotProps = {\n sql: string // first column should contain values, second column should contain a single set value. ie. SELECT distinct individualID, assay FROM syn20821313\n rgbIndex?: number // color plot based on portal\n customPlotColor?: string\n selectionOpacity?: number\n variant?: 'ampals'\n maxBarCount?: number // will show all if not set\n setName?: string // instead of \"Set Size\"\n combinationName?: string // instead of \"Intersection Size\"\n height?: number\n summaryLinkText?: string // text for home page link below chart\n summaryLink?: string // url for home page link below chart\n} & Pick<UpSetSelectionProps, 'onClick'>\n\nexport type UpsetPlotData = {\n sets: ISets<any>\n combinations: ISetCombinations<any>\n}\n/\n Upset plot. See https://medium.com/@sgratzl/upset-js-javascript-tutorial-1b84bfd6896d\n * Currently this is driven by a Synapse Table/View, but we may want to alter it to read in the data from a flat file instead.\n */\nexport function UpsetPlot({\n sql,\n variant,\n rgbIndex,\n maxBarCount,\n setName,\n combinationName,\n height = 700,\n summaryLinkText,\n summaryLink,\n onClick,\n customPlotColor,\n selectionOpacity,\n}: UpsetPlotProps) {\n const { accessToken } = useSynapseContext()\n const [isLoading, setIsLoading] = useState<boolean>()\n const [data, setData] = useState<UpsetPlotData>()\n const [error, setError] = useState<string>()\n const [selection, setSelection] = useState(null as ISetLike<any> \| null)\n const theme = useTheme()\n\n const [plotContainerMeasurements, plotContainerRef] = useMeasure()\n\n const variantStyles: Record<string, SxProps> = {\n default: {\n 'text[class^=\"sChartTextStyle-upset-\"], text[class^= \"cChartTextStyle-upset-\"]':\n {\n textTransform: 'uppercase',\n },\n },\n ampals: {\n width: '100%',\n '& .selectionHint-upset-': {\n stroke: 'transparent !important',\n },\n '& [class^=\"selectionHint-upset-\"]': {\n stroke: 'transparent !important',\n },\n '& g[class^=\"interactive-upset-\"]:hover line[class^=\"upsetLine-\"]': {\n stroke: theme.palette.primary.main,\n strokeWidth: '4px',\n strokeOpacity: 1,\n },\n '& g[class^=\"interactive-upset-\"]:hover circle[class^=\"fillNotMember-upset-\"]':\n {\n opacity: 0.2,\n },\n '& line[class^=\"upsetLine-\"]': {\n strokeOpacity: 0,\n },\n '& rect[class^=\"fillPrimary-upset-\"]': {\n fill: 'url(#diagonalLinePattern)',\n stroke: theme.palette.grey[700],\n strokeWidth: 2,\n },\n '& circle[class^=\"fillNotMember-upset-\"]': {\n stroke: theme.palette.grey[600],\n strokeWidth: 2,\n },\n '& text[class^=\"sChartTextStyle-upset-\"], & text[class^=\"cChartTextStyle-upset-\"]':\n {\n fontWeight: 700,\n fill: theme.palette.grey[800],\n lineHeight: '150%',\n },\n '& text[class^=\"cChartTextStyle-upset-\"]': {\n transform: 'translate(-60px, 190px) rotate(-90deg)',\n },\n '& text[class^=\"sChartTextStyle-upset-\"]': {\n transform: 'translate(-10px, 100px) rotate(-90deg)',\n },\n },\n }\n\n let plotColor: string, selectionColor: string\n if (rgbIndex != null) {\n const { colorPalette } = getColorPalette(rgbIndex, 2)\n plotColor = colorPalette[0]\n selectionColor = colorPalette[0]\n } else {\n plotColor = theme.palette.grey[700]\n selectionColor = customPlotColor \|\| theme.palette.primary.main\n }\n\n const updateFontSizes: UpSetFontSizes = {\n setLabel: '14px',\n }\n\n useEffect(() => {\n let isCancelled: boolean = false\n const getPlotData = async () => {\n setIsLoading(true)\n try {\n const entityId = parseEntityIdFromSqlStatement(sql)\n const partMask = SynapseConstants.BUNDLE_MASK_QUERY_RESULTS\n const queryRequest: QueryBundleRequest = {\n partMask,\n concreteType:\n 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n entityId,\n query: {\n sql,\n },\n }\n const { queryResult } = await SynapseClient.getFullQueryTableResults(\n queryRequest,\n accessToken,\n )\n // transform query data into plot data, and store.\n // collect all values for each key\n const keyValuesMap: Record<string, { name: string; sets: string[] }> =\n {}\n // keyValuesMap looks like { 'A': {name: 'A', sets: ['S1', 'S2'] }, 'B': { name: 'B', sets: ['S1'] }, ... }\n // It's a little redundant, but makes the next step much easier.\n\n const caseInsensitiveSetNames: Record<string, string> = {}\n // caseInsensitiveSetNames looks like { 'RNASEQ': 'rnaSeq', 'NOMe-SEQ': 'NOMe-seq'}.\n\n for (const row of queryResult?.queryResults.rows ?? []) {\n for (let j = 1; j < row.values.length; j += 1) {\n const rowValues: string[] = row.values as string[]\n if (rowValues.some(value => value === null)) {\n console.warn('Row has null value(s) when no nulls expected')\n }\n\n const key = rowValues[0]\n let newValue = rowValues[j]\n keyValuesMap[key] = keyValuesMap[key] \|\| {}\n keyValuesMap[key].name = key\n\n keyValuesMap[key].sets = keyValuesMap[key].sets \|\| []\n const found = keyValuesMap[key].sets.find((v: any) => v == newValue)\n if (!found && newValue) {\n if (caseInsensitiveSetNames[newValue.toUpperCase()]) {\n newValue = caseInsensitiveSetNames[newValue.toUpperCase()]\n } else {\n caseInsensitiveSetNames[newValue.toUpperCase()] = newValue\n }\n keyValuesMap[key].sets.push(newValue)\n }\n }\n }\n // now create the expected elems set\n const elems = Object.values(keyValuesMap)\n // elems looks like [{ name: 'A', sets: ['S1', 'S2'] }, { name: 'B', sets: ['S1'] }, ...]\n const sets = extractSets(elems)\n // PORTALS-1673: sort by assay name\n const sortedSets = (sets as ISet[]).sort((a, b) => {\n return ('' + b.name).localeCompare(a.name)\n })\n\n const combinations = generateCombinations(sortedSets, {\n type: 'intersection',\n min: 1,\n limit: maxBarCount,\n order: 'cardinality:desc',\n })\n if (!isCancelled) {\n setData({ sets, combinations })\n setIsLoading(false)\n }\n } catch (err) {\n if (!isCancelled) {\n setIsLoading(false)\n let errorMessage = err['reason']\n if (!errorMessage) {\n console.error(err)\n errorMessage = 'Error retrieving data'\n }\n setError(errorMessage)\n }\n }\n }\n getPlotData()\n return () => {\n isCancelled = true\n }\n }, [sql, accessToken])\n\n return (\n <>\n {isLoading && loadingScreen}\n {!isLoading && data && (\n <>\n {variantStyles['ampals'] && (\n // Render DiagonalLinePattern so UpsetPlot can use `fill: url(#diagonalLinePattern)`.\n // The SVG element must be added to the DOM so we can reference its ID (which is set in the SVG file) in the `fill` style\n // Ideally, we would reference the asset URL imported by Vite, but this isn't working.\n <Box\n sx={{\n '& path': {\n stroke: '#D9D9D9 !important',\n },\n width: 0,\n height: 0,\n position: 'absolute',\n }}\n >\n <DiagonalLinePattern />\n </Box>\n )}\n <Box\n className=\"UpsetPlot\"\n sx={variant ? variantStyles[variant] : variantStyles['default']}\n ref={plotContainerRef}\n >\n <UpSetJS\n sets={data.sets}\n combinations={data.combinations}\n width={plotContainerMeasurements?.width \|\| 800}\n height={height}\n onHover={setSelection}\n onClick={onClick}\n selection={selection}\n color={plotColor}\n selectionColor={selectionColor}\n hoverHintColor={'orange'}\n hasSelectionOpacity={selectionOpacity ? selectionOpacity : 0.3}\n // alternatingBackgroundColor={false}\n setName={setName}\n combinationName={combinationName}\n fontFamily=\"'DM Sans', sans-serif\"\n fontSizes={updateFontSizes}\n exportButtons={false}\n notMemberColor=\"transparent\"\n />\n {summaryLink && summaryLinkText && (\n <div className=\"UpsetPlot__summary\">\n <LargeButton\n color=\"secondary\"\n variant=\"contained\"\n href={summaryLink}\n >\n {summaryLinkText}\n </LargeButton>\n </div>\n )}\n </Box>\n </>\n )}\n <ErrorBanner error={error} />\n </>\n )\n}\n\nexport default UpsetPlot\n"],"mappings":"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"}

package/dist/components/Plot/index.d.ts CHANGED Viewed

@@ -4,7 +4,9 @@ import { UpsetPlot } from './UpsetPlot';
 import type { UpsetPlotProps } from './UpsetPlot';
 import { SynapsePlot } from './SynapsePlot';
 import type { SynapsePlotProps } from './SynapsePlot';
+import { SynapseSankeyPlot } from './SynapseSankeyPlot';
+import type { SynapseSankeyPlotProps } from './SynapseSankeyPlot';
 import type { ClickCallbackParams } from './types';
 import type { GraphItem } from './types';
-export { ThemesPlot, ThemesPlotProps, UpsetPlot, UpsetPlotProps, SynapsePlot, SynapsePlotProps, ClickCallbackParams, GraphItem, };
+export { ThemesPlot, ThemesPlotProps, UpsetPlot, UpsetPlotProps, SynapsePlot, SynapsePlotProps, SynapseSankeyPlot, SynapseSankeyPlotProps, ClickCallbackParams, GraphItem, };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Plot/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Plot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACxC,OAAO,EACL,UAAU,EACV,eAAe,EACf,SAAS,EACT,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,mBAAmB,EACnB,SAAS,GACV,CAAA"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Plot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAA;AACjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACxC,OAAO,EACL,UAAU,EACV,eAAe,EACf,SAAS,EACT,cAAc,EACd,WAAW,EACX,gBAAgB,EAChB,iBAAiB,EACjB,sBAAsB,EACtB,mBAAmB,EACnB,SAAS,GACV,CAAA"}

package/dist/components/Plot/index.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { ThemesPlot as e } from "./ThemesPlot.js";
 import { UpsetPlot as t } from "./UpsetPlot.js";
 import { SynapsePlot as n } from "./SynapsePlot.js";
-export { n as SynapsePlot, e as ThemesPlot, t as UpsetPlot };
+import { SynapseSankeyPlot as r } from "./SynapseSankeyPlot.js";
+export { n as SynapsePlot, r as SynapseSankeyPlot, e as ThemesPlot, t as UpsetPlot };

package/dist/components/Plot/safe-react-plotly-factory.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"safe-react-plotly-factory.js","names":[],"sources":["../../../src/components/Plot/safe-react-plotly-factory.ts"],"sourcesContent":["import _createPlotlyComponent from 'react-plotly.js/factory'\n\n// We want to bundle browser-compatible code, but use ESM (`\"type\": \"module\"` in package.json) when we use Node (e.g. tests).\n// esbuild (used by Vite in development mode) has a quirk where this will cause packages react-plotly.js/factory to be\n// imported in 'node mode', which breaks imports in the browser.\n// For further explanation and source of workaround, see: https://github.com/evanw/esbuild/issues/2480#issuecomment-1970337003\n\nconst safeESModule = <T>(a: T \| { default: T }): T => {\n const b = a as any\n return b.__esModule \|\| b[Symbol.toStringTag] === 'Module' ? b.default : b\n}\n\nconst createPlotlyComponent = safeESModule(_createPlotlyComponent)\n\nexport default createPlotlyComponent\n"],"mappings":";AAYA,IAAM,MALmB,MAA6B;CACpD,IAAM,IAAI;~~AACV~~,~~QAAO~~,EAAE,cAAc,EAAE,OAAO,iBAAiB,WAAW,EAAE,UAAU;~~GAG/B~~,~~EAAuB~~"}
1	+ {"version":3,"file":"safe-react-plotly-factory.js","names":[],"sources":["../../../src/components/Plot/safe-react-plotly-factory.ts"],"sourcesContent":["import _createPlotlyComponent from 'react-plotly.js/factory'\n\n// We want to bundle browser-compatible code, but use ESM (`\"type\": \"module\"` in package.json) when we use Node (e.g. tests).\n// esbuild (used by Vite in development mode) has a quirk where this will cause packages react-plotly.js/factory to be\n// imported in 'node mode', which breaks imports in the browser.\n// For further explanation and source of workaround, see: https://github.com/evanw/esbuild/issues/2480#issuecomment-1970337003\n\nconst safeESModule = <T>(a: T \| { default: T }): T => {\n const b = a as any\n return b.__esModule \|\| b[Symbol.toStringTag] === 'Module' ? b.default : b\n}\n\nconst createPlotlyComponent = safeESModule(_createPlotlyComponent)\n\nexport default createPlotlyComponent\n"],"mappings":";AAYA,IAAM,MALmB,MAA6B;CACpD,IAAM,IAAI;CACV,OAAO,EAAE,cAAc,EAAE,OAAO,iBAAiB,WAAW,EAAE,UAAU;AAC1E,GAE2C,CAAsB"}

package/dist/components/PortalAclEditor/PortalAclEditor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalAclEditor.js","names":[],"sources":["../../../src/components/PortalAclEditor/PortalAclEditor.tsx"],"sourcesContent":["import { useGetPortalACL, useUpdatePortalACL } from '@/synapse-queries'\nimport {\n getAccessTypeFromPermissionLevel,\n PermissionLevel,\n} from '@/utils/PermissionLevelToAccessType'\nimport { Alert, Stack } from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n consolidateResourceAccessList,\n convertResourceAccessSetToSRC,\n updateACLWithSRCResourceAccessList,\n} from '@/utils/functions/AccessControlListUtils'\nimport { isEqual } from 'lodash-es'\nimport {\n ForwardedRef,\n forwardRef,\n useEffect,\n useImperativeHandle,\n useMemo,\n useState,\n} from 'react'\nimport { AclEditor } from '../AclEditor/AclEditor'\nimport useUpdateAcl from '../AclEditor/useUpdateAcl'\nimport { AccessControlList } from '@sage-bionetworks/synapse-client'\n\nconst availablePermissionLevels: PermissionLevel[] = ['CAN_ADMINISTER_PORTAL']\n\nexport type PortalAclEditorHandle = {\n /* Allow the parent component to trigger saving the ACL, so this may be embedded in an arbitrary modal. /\n save: () => void\n}\n\nexport type PortalAclEditorProps = {\n portalId: string\n onSaveComplete: (saveSuccessful: boolean) => void\n}\n\nexport const PortalAclEditor = forwardRef(function PortalAclEditor(\n props: PortalAclEditorProps,\n ref: ForwardedRef<PortalAclEditorHandle>,\n) {\n const { portalId, onSaveComplete } = props\n const [error, setError] = useState<string \| null>(null)\n\n const onMutationSuccess = () => {\n setError(null)\n onSaveComplete(true)\n }\n\n const onMutationError = (error: SynapseClientError) => {\n setError(error.reason)\n onSaveComplete(false)\n }\n\n const { data: originalAcl, isLoading: isLoadingOriginalAcl } =\n useGetPortalACL(portalId, {\n // Infinite staleTime ensures this won't get re-fetched unless explicitly invalidated by the mutation\n staleTime: Infinity,\n })\n\n const consolidatedOriginalResourceAccess = useMemo(\n () =>\n consolidateResourceAccessList(\n convertResourceAccessSetToSRC(originalAcl?.resourceAccess),\n ),\n [originalAcl],\n )\n\n const {\n resourceAccessList,\n setResourceAccessList,\n addResourceAccessItem,\n updateResourceAccessItem,\n removeResourceAccessItem,\n resetDirtyState,\n } = useUpdateAcl({\n onChange: () => setError(null),\n onError: setError,\n })\n\n // set resourceAccessList when the fetched acl changes\n useEffect(() => {\n if (originalAcl) {\n resetDirtyState()\n setResourceAccessList(consolidatedOriginalResourceAccess)\n }\n }, [\n originalAcl,\n consolidatedOriginalResourceAccess,\n resetDirtyState,\n setResourceAccessList,\n ])\n\n const { mutate: updateAcl } = useUpdatePortalACL({\n onSuccess: () => onMutationSuccess(),\n onError: (error: SynapseClientError) => onMutationError(error),\n })\n\n useImperativeHandle(ref, () => {\n return {\n save() {\n const updatedAcl: AccessControlList =\n updateACLWithSRCResourceAccessList(originalAcl, resourceAccessList)\n const aclIsUnchanged =\n (originalAcl === null && updatedAcl == null) \|\|\n // ignore properties that will change when the ACL is saved (etag, modifiedOn)\n (isEqual(consolidatedOriginalResourceAccess, resourceAccessList) &&\n originalAcl?.id === updatedAcl?.id)\n\n if (aclIsUnchanged) {\n // noop\n onSaveComplete(true)\n } else {\n updateAcl(updatedAcl)\n }\n },\n }\n }, [\n portalId,\n originalAcl,\n consolidatedOriginalResourceAccess,\n resourceAccessList,\n onSaveComplete,\n updateAcl,\n ])\n\n return (\n <Stack\n direction=\"column\"\n sx={{\n gap: '20px',\n }}\n >\n <AclEditor\n resourceAccessList={resourceAccessList}\n availablePermissionLevels={availablePermissionLevels}\n isLoading={isLoadingOriginalAcl}\n canEdit={true}\n emptyText={/ This should never happen */ ''}\n onAddPrincipalToAcl={id =>\n addResourceAccessItem(\n id,\n getAccessTypeFromPermissionLevel('CAN_ADMINISTER_PORTAL'),\n )\n }\n updateResourceAccessItem={updateResourceAccessItem}\n removeResourceAccessItem={removeResourceAccessItem}\n showAddRemovePublicButton={false}\n showNotifyCheckbox={false}\n isInherited={false}\n />\n {error && <Alert severity=\"error\">{error}</Alert>}\n </Stack>\n )\n})\n"],"mappings":";;;;;;;;;;;AAyBA,IAAM,IAA+C,CAAC,~~wBAAwB~~,~~EAYjE~~,IAAkB,EAAW,SACxC,GACA,GACA;CACA,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAO,KAAY,EAAwB,~~KAAK~~,~~EAEjD~~,UAA0B;~~AAE9B~~,~~EADA~~,EAAS,~~KAAK~~,~~EACd~~,EAAe,~~GAAK~~;~~IAGhB~~,KAAmB,MAA8B;~~AAErD~~,~~EADA~~,EAAS,EAAM,~~OAAO~~,~~EACtB~~,EAAe,~~GAAM~~;~~IAGjB~~,EAAE,MAAM,GAAa,WAAW,MACpC,EAAgB,GAAU,EAExB,WAAW,~~UACZ~~,CAAC,~~EAEE~~,IAAqC,QAEvC,EACE,EAA8B,GAAa,~~eAAe~~,CAC3D,~~EACH~~,CAAC,~~EAAY~~,CACd,~~EAEK~~,EACJ,uBACA,0BACA,0BACA,6BACA,6BACA,uBACE,EAAa;EACf,gBAAgB,EAAS,~~KAAK~~;~~EAC9B~~,SAAS;~~EACV~~,CAAC;~~AAGF~~,~~SAAgB~~;~~AACd~~,~~EAAI~~,MACF,~~GAAiB~~,~~EACjB~~,EAAsB,~~EAAmC~~;~~IAE1D~~;EACD;EACA;EACA;EACA;~~EACD~~,CAAC;~~CAEF~~,IAAM,EAAE,QAAQ,MAAc,EAAmB;EAC/C,iBAAiB,~~GAAmB~~;~~EACpC~~,UAAU,MAA8B,EAAgB,~~EAAM~~;~~EAC~~/D,CAAC;~~AA8BF~~,~~QA5BA~~,EAAoB,UACX,EACL,OAAO;EACL,IAAM,IACJ,EAAmC,GAAa,~~EAAmB~~;~~AAOrE~~,~~EALG~~,MAAgB,QAAQ,KAAc,QAEtC,EAAQ,GAAoC,~~EAAmB~~,~~IAC9D~~,GAAa,OAAO,GAAY,KAIlC,EAAe,~~GAAK~~,~~GAEpB~~,EAAU,~~EAAW~~;~~IAG1B~~,~~GACA~~;EACD;EACA;EACA;EACA;EACA;EACA;~~EACD~~,CAAC,~~EAGA~~,kBAAC,GAAD;EACE,WAAU;EACV,IAAI,EACF,KAAK,~~QACN~~;~~YAJH~~,CAME,kBAAC,GAAD;GACsB;GACO;GAC3B,WAAW;GACX,SAAS;GACT,WAA0C;GAC1C,sBAAqB,MACnB,EACE,GACA,EAAiC,~~wBAAwB~~,CAC1D;~~GAEuB~~;GACA;GAC1B,2BAA2B;GAC3B,oBAAoB;GACpB,aAAa;~~GACb~~,CAAA,~~EACD~~,KAAS,kBAAC,GAAD;GAAO,UAAS;aAAS;~~GAAc~~,CAAA,CAC3C;;~~EAEV~~"}
1	+ {"version":3,"file":"PortalAclEditor.js","names":[],"sources":["../../../src/components/PortalAclEditor/PortalAclEditor.tsx"],"sourcesContent":["import { useGetPortalACL, useUpdatePortalACL } from '@/synapse-queries'\nimport {\n getAccessTypeFromPermissionLevel,\n PermissionLevel,\n} from '@/utils/PermissionLevelToAccessType'\nimport { Alert, Stack } from '@mui/material'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n consolidateResourceAccessList,\n convertResourceAccessSetToSRC,\n updateACLWithSRCResourceAccessList,\n} from '@/utils/functions/AccessControlListUtils'\nimport { isEqual } from 'lodash-es'\nimport {\n ForwardedRef,\n forwardRef,\n useEffect,\n useImperativeHandle,\n useMemo,\n useState,\n} from 'react'\nimport { AclEditor } from '../AclEditor/AclEditor'\nimport useUpdateAcl from '../AclEditor/useUpdateAcl'\nimport { AccessControlList } from '@sage-bionetworks/synapse-client'\n\nconst availablePermissionLevels: PermissionLevel[] = ['CAN_ADMINISTER_PORTAL']\n\nexport type PortalAclEditorHandle = {\n /* Allow the parent component to trigger saving the ACL, so this may be embedded in an arbitrary modal. /\n save: () => void\n}\n\nexport type PortalAclEditorProps = {\n portalId: string\n onSaveComplete: (saveSuccessful: boolean) => void\n}\n\nexport const PortalAclEditor = forwardRef(function PortalAclEditor(\n props: PortalAclEditorProps,\n ref: ForwardedRef<PortalAclEditorHandle>,\n) {\n const { portalId, onSaveComplete } = props\n const [error, setError] = useState<string \| null>(null)\n\n const onMutationSuccess = () => {\n setError(null)\n onSaveComplete(true)\n }\n\n const onMutationError = (error: SynapseClientError) => {\n setError(error.reason)\n onSaveComplete(false)\n }\n\n const { data: originalAcl, isLoading: isLoadingOriginalAcl } =\n useGetPortalACL(portalId, {\n // Infinite staleTime ensures this won't get re-fetched unless explicitly invalidated by the mutation\n staleTime: Infinity,\n })\n\n const consolidatedOriginalResourceAccess = useMemo(\n () =>\n consolidateResourceAccessList(\n convertResourceAccessSetToSRC(originalAcl?.resourceAccess),\n ),\n [originalAcl],\n )\n\n const {\n resourceAccessList,\n setResourceAccessList,\n addResourceAccessItem,\n updateResourceAccessItem,\n removeResourceAccessItem,\n resetDirtyState,\n } = useUpdateAcl({\n onChange: () => setError(null),\n onError: setError,\n })\n\n // set resourceAccessList when the fetched acl changes\n useEffect(() => {\n if (originalAcl) {\n resetDirtyState()\n setResourceAccessList(consolidatedOriginalResourceAccess)\n }\n }, [\n originalAcl,\n consolidatedOriginalResourceAccess,\n resetDirtyState,\n setResourceAccessList,\n ])\n\n const { mutate: updateAcl } = useUpdatePortalACL({\n onSuccess: () => onMutationSuccess(),\n onError: (error: SynapseClientError) => onMutationError(error),\n })\n\n useImperativeHandle(ref, () => {\n return {\n save() {\n const updatedAcl: AccessControlList =\n updateACLWithSRCResourceAccessList(originalAcl, resourceAccessList)\n const aclIsUnchanged =\n (originalAcl === null && updatedAcl == null) \|\|\n // ignore properties that will change when the ACL is saved (etag, modifiedOn)\n (isEqual(consolidatedOriginalResourceAccess, resourceAccessList) &&\n originalAcl?.id === updatedAcl?.id)\n\n if (aclIsUnchanged) {\n // noop\n onSaveComplete(true)\n } else {\n updateAcl(updatedAcl)\n }\n },\n }\n }, [\n portalId,\n originalAcl,\n consolidatedOriginalResourceAccess,\n resourceAccessList,\n onSaveComplete,\n updateAcl,\n ])\n\n return (\n <Stack\n direction=\"column\"\n sx={{\n gap: '20px',\n }}\n >\n <AclEditor\n resourceAccessList={resourceAccessList}\n availablePermissionLevels={availablePermissionLevels}\n isLoading={isLoadingOriginalAcl}\n canEdit={true}\n emptyText={/ This should never happen */ ''}\n onAddPrincipalToAcl={id =>\n addResourceAccessItem(\n id,\n getAccessTypeFromPermissionLevel('CAN_ADMINISTER_PORTAL'),\n )\n }\n updateResourceAccessItem={updateResourceAccessItem}\n removeResourceAccessItem={removeResourceAccessItem}\n showAddRemovePublicButton={false}\n showNotifyCheckbox={false}\n isInherited={false}\n />\n {error && <Alert severity=\"error\">{error}</Alert>}\n </Stack>\n )\n})\n"],"mappings":";;;;;;;;;;;AAyBA,IAAM,IAA+C,CAAC,uBAAuB,GAYhE,IAAkB,EAAW,SACxC,GACA,GACA;CACA,IAAM,EAAE,aAAU,sBAAmB,GAC/B,CAAC,GAAO,KAAY,EAAwB,IAAI,GAEhD,UAA0B;EAE9B,AADA,EAAS,IAAI,GACb,EAAe,EAAI;CACrB,GAEM,KAAmB,MAA8B;EAErD,AADA,EAAS,EAAM,MAAM,GACrB,EAAe,EAAK;CACtB,GAEM,EAAE,MAAM,GAAa,WAAW,MACpC,EAAgB,GAAU,EAExB,WAAW,SACb,CAAC,GAEG,IAAqC,QAEvC,EACE,EAA8B,GAAa,cAAc,CAC3D,GACF,CAAC,CAAW,CACd,GAEM,EACJ,uBACA,0BACA,0BACA,6BACA,6BACA,uBACE,EAAa;EACf,gBAAgB,EAAS,IAAI;EAC7B,SAAS;CACX,CAAC;CAGD,QAAgB;EACd,AAAI,MACF,EAAgB,GAChB,EAAsB,CAAkC;CAE5D,GAAG;EACD;EACA;EACA;EACA;CACF,CAAC;CAED,IAAM,EAAE,QAAQ,MAAc,EAAmB;EAC/C,iBAAiB,EAAkB;EACnC,UAAU,MAA8B,EAAgB,CAAK;CAC/D,CAAC;CA8BD,OA5BA,EAAoB,UACX,EACL,OAAO;EACL,IAAM,IACJ,EAAmC,GAAa,CAAkB;EAOpE,AALG,MAAgB,QAAQ,KAAc,QAEtC,EAAQ,GAAoC,CAAkB,KAC7D,GAAa,OAAO,GAAY,KAIlC,EAAe,EAAI,IAEnB,EAAU,CAAU;CAExB,EACF,IACC;EACD;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,GAGC,kBAAC,GAAD;EACE,WAAU;EACV,IAAI,EACF,KAAK,OACP;YAJF,CAME,kBAAC,GAAD;GACsB;GACO;GAC3B,WAAW;GACX,SAAS;GACT,WAA0C;GAC1C,sBAAqB,MACnB,EACE,GACA,EAAiC,uBAAuB,CAC1D;GAEwB;GACA;GAC1B,2BAA2B;GAC3B,oBAAoB;GACpB,aAAa;EACd,CAAA,GACA,KAAS,kBAAC,GAAD;GAAO,UAAS;aAAS;EAAa,CAAA,CAC3C;;AAEX,CAAC"}

package/dist/components/PortalAclEditor/PortalAclEditorModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalAclEditorModal.js","names":[],"sources":["../../../src/components/PortalAclEditor/PortalAclEditorModal.tsx"],"sourcesContent":["import { noop } from 'lodash-es'\nimport { useRef } from 'react'\nimport { displayToast } from '../ToastMessage'\nimport { PortalAclEditor, PortalAclEditorHandle } from './PortalAclEditor'\nimport { DialogBase } from '../DialogBase'\nimport { Button } from '@mui/material'\n\nexport type PortalAclEditorModalProps = {\n portalId: string\n open: boolean\n onUpdateSuccess?: () => void\n onClose: () => void\n}\n\nexport default function PortalAclEditorModal(\n props: PortalAclEditorModalProps,\n): React.ReactNode {\n const { portalId, open, onUpdateSuccess = noop, onClose } = props\n const ref = useRef<PortalAclEditorHandle>(null)\n return (\n <>\n <DialogBase\n open={open}\n title=\"Portal Sharing Settings\"\n onCancel={onClose}\n maxWidth={'md'}\n content={\n <PortalAclEditor\n ref={ref}\n portalId={portalId}\n onSaveComplete={() => {\n displayToast(\n 'Permissions were successfully saved to Synapse',\n 'info',\n )\n onUpdateSuccess()\n onClose()\n }}\n />\n }\n actions={\n <>\n <Button\n variant=\"outlined\"\n onClick={() => {\n onClose()\n }}\n >\n Cancel\n </Button>\n <Button\n variant=\"contained\"\n color=\"primary\"\n onClick={() => {\n ref.current?.save()\n }}\n >\n Save\n </Button>\n </>\n }\n />\n </>\n )\n}\n"],"mappings":";;;;;;;;;AAcA,SAAwB,EACtB,GACiB;CACjB,IAAM,EAAE,aAAU,SAAM,qBAAkB,GAAM,eAAY,GACtD,IAAM,EAA8B,~~KAAK~~;~~AAC/C~~,~~QACE~~,kBAAA,GAAA,EAAA,UACE,kBAAC,GAAD;EACQ;EACN,OAAM;EACN,UAAU;EACV,UAAU;EACV,SACE,kBAAC,GAAD;GACO;GACK;GACV,sBAAsB;~~AAMpB~~,~~IALA~~,EACE,kDACA,~~OACD~~,~~EACD~~,~~GAAiB~~,~~EACjB~~,~~GAAS;;GAEX~~,CAAA;~~EAEJ~~,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAQ;GACR,eAAe;~~AACb~~,~~OAAS;;aAEZ~~;~~GAEQ~~,CAAA,~~EACT~~,kBAAC,GAAD;GACE,SAAQ;GACR,OAAM;GACN,eAAe;~~AACb~~,~~MAAI~~,SAAS,~~MAAM;;aAEtB~~;~~GAEQ~~,CAAA,CACR,EAAA,CAAA;~~EAEL~~,CAAA,EACD,CAAA"}
1	+ {"version":3,"file":"PortalAclEditorModal.js","names":[],"sources":["../../../src/components/PortalAclEditor/PortalAclEditorModal.tsx"],"sourcesContent":["import { noop } from 'lodash-es'\nimport { useRef } from 'react'\nimport { displayToast } from '../ToastMessage'\nimport { PortalAclEditor, PortalAclEditorHandle } from './PortalAclEditor'\nimport { DialogBase } from '../DialogBase'\nimport { Button } from '@mui/material'\n\nexport type PortalAclEditorModalProps = {\n portalId: string\n open: boolean\n onUpdateSuccess?: () => void\n onClose: () => void\n}\n\nexport default function PortalAclEditorModal(\n props: PortalAclEditorModalProps,\n): React.ReactNode {\n const { portalId, open, onUpdateSuccess = noop, onClose } = props\n const ref = useRef<PortalAclEditorHandle>(null)\n return (\n <>\n <DialogBase\n open={open}\n title=\"Portal Sharing Settings\"\n onCancel={onClose}\n maxWidth={'md'}\n content={\n <PortalAclEditor\n ref={ref}\n portalId={portalId}\n onSaveComplete={() => {\n displayToast(\n 'Permissions were successfully saved to Synapse',\n 'info',\n )\n onUpdateSuccess()\n onClose()\n }}\n />\n }\n actions={\n <>\n <Button\n variant=\"outlined\"\n onClick={() => {\n onClose()\n }}\n >\n Cancel\n </Button>\n <Button\n variant=\"contained\"\n color=\"primary\"\n onClick={() => {\n ref.current?.save()\n }}\n >\n Save\n </Button>\n </>\n }\n />\n </>\n )\n}\n"],"mappings":";;;;;;;;;AAcA,SAAwB,EACtB,GACiB;CACjB,IAAM,EAAE,aAAU,SAAM,qBAAkB,GAAM,eAAY,GACtD,IAAM,EAA8B,IAAI;CAC9C,OACE,kBAAA,GAAA,EAAA,UACE,kBAAC,GAAD;EACQ;EACN,OAAM;EACN,UAAU;EACV,UAAU;EACV,SACE,kBAAC,GAAD;GACO;GACK;GACV,sBAAsB;IAMpB,AALA,EACE,kDACA,MACF,GACA,EAAgB,GAChB,EAAQ;GACV;EACD,CAAA;EAEH,SACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;GACE,SAAQ;GACR,eAAe;IACb,EAAQ;GACV;aACD;EAEO,CAAA,GACR,kBAAC,GAAD;GACE,SAAQ;GACR,OAAM;GACN,eAAe;IACb,EAAI,SAAS,KAAK;GACpB;aACD;EAEO,CAAA,CACR,EAAA,CAAA;CAEL,CAAA,EACD,CAAA;AAEN"}

package/dist/components/PortalFeatureHighlights/PortalFeatureHighlights.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalFeatureHighlights.js","names":[],"sources":["../../../src/components/PortalFeatureHighlights/PortalFeatureHighlights.tsx"],"sourcesContent":["import { Box, CardMedia, Fade, Slide } from '@mui/material'\nimport React from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport PortalSectionHeader from '../PortalSectionHeader'\n\nexport type PortalFeatureHighlightsProps = {\n reverseOrder?: boolean\n title: string\n image?: string\n buttonText?: string\n summaryText?: React.ReactNode\n link?: string\n}\n\nconst transitionTimeoutMs = 400\n\nconst PortalFeatureHighlights = (\n props: PortalFeatureHighlightsProps,\n): React.ReactNode => {\n const { reverseOrder, image, title, buttonText, summaryText, link } = props\n const [ref, inView] = useInView({ threshold: 0.3, triggerOnce: true })\n return (\n <Box\n ref={ref}\n sx={{\n display: 'grid',\n padding: { xs: '40px', lg: '80px' },\n gap: { xs: '38px', md: '80px' },\n gridTemplateColumns: {\n xs: 'minmax(100px, 1fr)',\n md: '1fr 1fr',\n lg: reverseOrder\n ? 'minmax(150px, 1fr) minmax(300px, 2fr)'\n : 'minmax(300px, 2fr) minmax(150px, 1fr)',\n },\n gridTemplateAreas: {\n xs: `'image' 'content'`,\n md: reverseOrder ? `'content image'` : `'image content'`,\n },\n }}\n >\n <Fade in={inView} timeout={transitionTimeoutMs}>\n <div>\n <Slide\n direction={reverseOrder ? 'left' : 'right'}\n timeout={transitionTimeoutMs}\n in={inView}\n >\n <div>\n <CardMedia\n component=\"img\"\n image={image}\n sx={{\n gridArea: 'image',\n borderRadius: '12px',\n height: '100%',\n width: '100%',\n objectFit: 'cover',\n }}\n />\n </div>\n </Slide>\n </div>\n </Fade>\n <PortalSectionHeader\n title={title}\n buttonText={buttonText}\n link={link}\n summaryText={summaryText}\n sx={{ gridArea: 'content', h2: { width: '100%' } }}\n />\n </Box>\n )\n}\n\nexport default PortalFeatureHighlights\n"],"mappings":";;;;;;AAcA,IAAM,IAAsB,KAEtB,KACJ,MACoB;CACpB,IAAM,EAAE,iBAAc,UAAO,UAAO,eAAY,gBAAa,YAAS,GAChE,CAAC,GAAK,KAAU,EAAU;EAAE,WAAW;EAAK,aAAa;~~EAAM~~,CAAC;~~AACtE~~,~~QACE~~,kBAAC,GAAD;EACO;EACL,IAAI;GACF,SAAS;GACT,SAAS;IAAE,IAAI;IAAQ,IAAI;~~IAAQ~~;~~GACnC~~,KAAK;IAAE,IAAI;IAAQ,IAAI;~~IAAQ~~;~~GAC/B~~,qBAAqB;IACnB,IAAI;IACJ,IAAI;IACJ,IAAI,IACA,0CACA;~~IACL~~;~~GACD~~,mBAAmB;IACjB,IAAI;IACJ,IAAI,IAAe,oBAAoB;~~IACxC~~;~~GACF~~;~~YAjBH~~,CAmBE,kBAAC,GAAD;GAAM,IAAI;GAAQ,SAAS;aACzB,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD;IACE,WAAW,IAAe,SAAS;IACnC,SAAS;IACT,IAAI;cAEJ,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD;KACE,WAAU;KACH;KACP,IAAI;MACF,UAAU;MACV,cAAc;MACd,QAAQ;MACR,OAAO;MACP,WAAW;~~MACZ~~;~~KACD~~,CAAA,EACE,CAAA;~~IACA~~,CAAA,EACJ,CAAA;~~GACD~~,CAAA,~~EACP~~,kBAAC,GAAD;GACS;GACK;GACN;GACO;GACb,IAAI;IAAE,UAAU;IAAW,IAAI,EAAE,OAAO,~~QAAQ~~;~~IAAE~~;~~GAClD~~,CAAA,CACE"}
1	+ {"version":3,"file":"PortalFeatureHighlights.js","names":[],"sources":["../../../src/components/PortalFeatureHighlights/PortalFeatureHighlights.tsx"],"sourcesContent":["import { Box, CardMedia, Fade, Slide } from '@mui/material'\nimport React from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport PortalSectionHeader from '../PortalSectionHeader'\n\nexport type PortalFeatureHighlightsProps = {\n reverseOrder?: boolean\n title: string\n image?: string\n buttonText?: string\n summaryText?: React.ReactNode\n link?: string\n}\n\nconst transitionTimeoutMs = 400\n\nconst PortalFeatureHighlights = (\n props: PortalFeatureHighlightsProps,\n): React.ReactNode => {\n const { reverseOrder, image, title, buttonText, summaryText, link } = props\n const [ref, inView] = useInView({ threshold: 0.3, triggerOnce: true })\n return (\n <Box\n ref={ref}\n sx={{\n display: 'grid',\n padding: { xs: '40px', lg: '80px' },\n gap: { xs: '38px', md: '80px' },\n gridTemplateColumns: {\n xs: 'minmax(100px, 1fr)',\n md: '1fr 1fr',\n lg: reverseOrder\n ? 'minmax(150px, 1fr) minmax(300px, 2fr)'\n : 'minmax(300px, 2fr) minmax(150px, 1fr)',\n },\n gridTemplateAreas: {\n xs: `'image' 'content'`,\n md: reverseOrder ? `'content image'` : `'image content'`,\n },\n }}\n >\n <Fade in={inView} timeout={transitionTimeoutMs}>\n <div>\n <Slide\n direction={reverseOrder ? 'left' : 'right'}\n timeout={transitionTimeoutMs}\n in={inView}\n >\n <div>\n <CardMedia\n component=\"img\"\n image={image}\n sx={{\n gridArea: 'image',\n borderRadius: '12px',\n height: '100%',\n width: '100%',\n objectFit: 'cover',\n }}\n />\n </div>\n </Slide>\n </div>\n </Fade>\n <PortalSectionHeader\n title={title}\n buttonText={buttonText}\n link={link}\n summaryText={summaryText}\n sx={{ gridArea: 'content', h2: { width: '100%' } }}\n />\n </Box>\n )\n}\n\nexport default PortalFeatureHighlights\n"],"mappings":";;;;;;AAcA,IAAM,IAAsB,KAEtB,KACJ,MACoB;CACpB,IAAM,EAAE,iBAAc,UAAO,UAAO,eAAY,gBAAa,YAAS,GAChE,CAAC,GAAK,KAAU,EAAU;EAAE,WAAW;EAAK,aAAa;CAAK,CAAC;CACrE,OACE,kBAAC,GAAD;EACO;EACL,IAAI;GACF,SAAS;GACT,SAAS;IAAE,IAAI;IAAQ,IAAI;GAAO;GAClC,KAAK;IAAE,IAAI;IAAQ,IAAI;GAAO;GAC9B,qBAAqB;IACnB,IAAI;IACJ,IAAI;IACJ,IAAI,IACA,0CACA;GACN;GACA,mBAAmB;IACjB,IAAI;IACJ,IAAI,IAAe,oBAAoB;GACzC;EACF;YAjBF,CAmBE,kBAAC,GAAD;GAAM,IAAI;GAAQ,SAAS;aACzB,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD;IACE,WAAW,IAAe,SAAS;IACnC,SAAS;IACT,IAAI;cAEJ,kBAAC,OAAD,EAAA,UACE,kBAAC,GAAD;KACE,WAAU;KACH;KACP,IAAI;MACF,UAAU;MACV,cAAc;MACd,QAAQ;MACR,OAAO;MACP,WAAW;KACb;IACD,CAAA,EACE,CAAA;GACA,CAAA,EACJ,CAAA;EACD,CAAA,GACN,kBAAC,GAAD;GACS;GACK;GACN;GACO;GACb,IAAI;IAAE,UAAU;IAAW,IAAI,EAAE,OAAO,OAAO;GAAE;EAClD,CAAA,CACE;;AAET"}

package/dist/components/PortalFeaturedPartners/PortalFeaturedPartners.js CHANGED Viewed

@@ -87,9 +87,7 @@ var f = 101, p = 156, m = ({ website: e, children: t }) => {
 		concreteType: "org.sagebionetworks.repo.model.table.QueryBundleRequest",
 		entityId: f,
 		query: { sql: i }
-	}), g = p?.queryResult.queryResults.rows ?? [], _ = /* @__PURE__ */ function(e) {
-		return e.CARDLOGO = "cardLogo", e.ORGANIZATION_NAME = "organizationName", e.WEBSITE = "website", e;
-	}({}), v = t(_.CARDLOGO, p), y = t(_.ORGANIZATION_NAME, p), b = t(_.WEBSITE, p);
+	}), g = p?.queryResult.queryResults.rows ?? [], _ = t("cardLogo", p), v = t("organizationName", p), y = t("website", p);
 	return /* @__PURE__ */ d(a, {
 		sx: {
 			display: "grid",
@@ -130,9 +128,9 @@ var f = 101, p = 156, m = ({ website: e, children: t }) => {
 			}),
 			children: g?.map((e, t) => /* @__PURE__ */ u(h, {
 				partner: e,
-				imageColIndex: v,
-				organizationNameColIndex: y,
-				websiteColIndex: b,
+				imageColIndex: _,
+				organizationNameColIndex: v,
+				websiteColIndex: y,
 				entityId: f,
 				isLoading: m
 			}, `partner-${t}`))

package/dist/components/PortalFeaturedPartners/PortalFeaturedPartners.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalFeaturedPartners.js","names":[],"sources":["../../../src/components/PortalFeaturedPartners/PortalFeaturedPartners.tsx"],"sourcesContent":["import React from 'react'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport { useImageUrl } from '@/utils/hooks/useImageUrlUtils'\nimport {\n Box,\n CardMedia,\n Link,\n Skeleton,\n SxProps,\n Typography,\n} from '@mui/material'\nimport { QueryBundleRequest, Row } from '@sage-bionetworks/synapse-types'\nimport PortalSectionHeader from '../PortalSectionHeader'\n\nconst partnerIconHeight = 101\nconst partnerIconWidth = 156\n\nexport type PortalFeaturedPartnersProps = {\n variation?: 'default' \| 'centered'\n sql: string\n titleText?: string\n sx?: SxProps\n}\n\ntype PartnerIcons = {\n partner: Row\n imageColIndex: number\n organizationNameColIndex: number\n websiteColIndex: number\n entityId: string\n isLoading?: boolean\n}\n\ntype PartnerWrapperProps = {\n website?: string \| null\n children: React.ReactNode\n}\n\nconst PartnerWrapper = ({\n website,\n children,\n}: PartnerWrapperProps): React.ReactNode => {\n const commonSx = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }\n\n return website ? (\n <Link\n href={website}\n target=\"_blank\"\n sx={{\n ...commonSx,\n textDecoration: 'none !important',\n }}\n >\n {children}\n </Link>\n ) : (\n <Box sx={commonSx}>{children}</Box>\n )\n}\n\nconst PartnerIcon = ({\n partner,\n imageColIndex,\n organizationNameColIndex,\n websiteColIndex,\n entityId,\n isLoading,\n}: PartnerIcons): React.ReactNode => {\n const fileId = partner.values[imageColIndex] ?? ''\n const organizationName = partner.values[organizationNameColIndex]\n const website = partner.values[websiteColIndex]\n const imageUrl = useImageUrl(fileId, entityId)\n\n if (!imageUrl && !organizationName) return null\n\n if (isLoading)\n return (\n <Skeleton\n variant=\"rectangular\"\n height={partnerIconHeight}\n width={partnerIconWidth}\n />\n )\n\n const PartnerContent = imageUrl ? (\n <CardMedia\n component=\"img\"\n image={imageUrl}\n aria-hidden=\"true\"\n sx={{\n width: `${partnerIconWidth}px`,\n height: `${partnerIconHeight}px`,\n objectFit: 'contain',\n borderRadius: '10px',\n }}\n />\n ) : (\n <Box\n sx={{\n display: 'flex',\n width: '165px',\n padding: '3px',\n flexDirection: 'column',\n gap: '10px',\n border: '2px solid',\n borderColor: 'grey.900',\n backgroundColor: '#FFF',\n textAlign: 'center',\n }}\n >\n <Box\n sx={{\n display: 'flex',\n padding: '10px',\n justifyContent: 'center',\n alignItems: 'center',\n gap: '10px',\n border: '1px solid',\n borderColor: 'grey.900',\n }}\n >\n <Typography\n variant=\"headline3\"\n sx={{\n fontSize: '14px',\n fontWeight: 400,\n lineHeight: '130%',\n color: 'grey.900',\n }}\n >\n {organizationName}\n </Typography>\n </Box>\n </Box>\n )\n\n return <PartnerWrapper website={website}>{PartnerContent}</PartnerWrapper>\n}\n\nconst PortalFeaturedPartners = ({\n sql,\n titleText = 'Our Partners',\n variation = 'default',\n sx,\n}: PortalFeaturedPartnersProps): React.ReactNode => {\n const entityId = parseEntityIdFromSqlStatement(sql)\n\n const queryBundleRequest: QueryBundleRequest = {\n partMask:\n SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS \|\n SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n entityId,\n query: {\n sql,\n },\n }\n const { data: queryResultBundle, isLoading } =\n useGetQueryResultBundle(queryBundleRequest)\n\n const dataRows = queryResultBundle?.queryResult!.queryResults.rows ?? []\n\n enum ExpectedColumns {\n CARDLOGO = 'cardLogo',\n ORGANIZATION_NAME = 'organizationName',\n WEBSITE = 'website',\n }\n\n const imageColIndex = getFieldIndex(\n ExpectedColumns.CARDLOGO,\n queryResultBundle,\n )\n\n const organizationNameColIndex = getFieldIndex(\n ExpectedColumns.ORGANIZATION_NAME,\n queryResultBundle,\n )\n\n const websiteColIndex = getFieldIndex(\n ExpectedColumns.WEBSITE,\n queryResultBundle,\n )\n\n return (\n <Box\n sx={{\n display: 'grid',\n padding: { xs: '40px', lg: '20px 80px' },\n gridTemplateColumns:\n variation === 'centered'\n ? { xs: '1fr' }\n : { xs: '1fr', md: '1fr 3fr' },\n gap: '50px',\n textAlign: variation === 'centered' ? 'center' : 'left',\n ...sx,\n }}\n >\n {variation === 'default' ? (\n <PortalSectionHeader\n title={titleText}\n sx={{ h2: { fontSize: '24px', paddingTop: '26px', width: '100%' } }}\n />\n ) : (\n <Typography\n variant=\"headline1\"\n sx={{ fontSize: '48px', color: 'grey.900' }}\n >\n {titleText}\n </Typography>\n )}\n <Box\n sx={theme => ({\n display: 'flex',\n flexWrap: 'wrap',\n gap: '64px',\n flex: '1 1 0',\n justifyContent: variation === 'centered' ? 'center' : 'flex-start',\n [theme.breakpoints.down('sm')]: {\n justifyContent: 'center',\n },\n })}\n >\n {dataRows?.map((partner, index) => (\n <PartnerIcon\n key={`partner-${index}`}\n partner={partner}\n imageColIndex={imageColIndex}\n organizationNameColIndex={organizationNameColIndex}\n websiteColIndex={websiteColIndex}\n entityId={entityId}\n isLoading={isLoading}\n />\n ))}\n </Box>\n </Box>\n )\n}\n\nexport default PortalFeaturedPartners\n"],"mappings":";;;;;;;;;;;;AAiBA,IAAM,IAAoB,KACpB,IAAmB,KAuBnB,KAAkB,EACtB,YACA,kBAC0C;CAC1C,IAAM,IAAW;EACf,SAAS;EACT,YAAY;EACZ,gBAAgB;~~EACjB~~;~~AAED~~,~~QAAO~~,IACL,kBAAC,GAAD;EACE,MAAM;EACN,QAAO;EACP,IAAI;GACF,GAAG;GACH,gBAAgB;~~GACjB~~;~~EAEA~~;~~EACI~~,CAAA,~~GAEP~~,kBAAC,GAAD;EAAK,IAAI;EAAW;~~EAAe~~,CAAA;~~GAIjC~~,KAAe,EACnB,YACA,kBACA,6BACA,oBACA,aACA,mBACmC;CACnC,IAAM,IAAS,EAAQ,OAAO,MAAkB,IAC1C,IAAmB,EAAQ,OAAO,IAClC,IAAU,EAAQ,OAAO,IACzB,IAAW,EAAY,GAAQ,~~EAAS~~;~~AAiE9C~~,QA/DI,CAAC,KAAY,CAAC,IAAyB,OAEvC,IAEA,kBAAC,GAAD;EACE,SAAQ;EACR,QAAQ;EACR,OAAO;~~EACP~~,CAAA,~~GAuDC~~,kBAAC,GAAD;EAAyB;YApDT,IACrB,kBAAC,GAAD;GACE,WAAU;GACV,OAAO;GACP,eAAY;GACZ,IAAI;IACF,OAAO,GAAG,EAAiB;IAC3B,QAAQ,GAAG,EAAkB;IAC7B,WAAW;IACX,cAAc;~~IACf~~;~~GACD~~,CAAA,~~GAEF~~,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,OAAO;IACP,SAAS;IACT,eAAe;IACf,KAAK;IACL,QAAQ;IACR,aAAa;IACb,iBAAiB;IACjB,WAAW;~~IACZ~~;~~aAED~~,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,SAAS;KACT,gBAAgB;KAChB,YAAY;KACZ,KAAK;KACL,QAAQ;KACR,aAAa;~~KACd~~;~~cAED~~,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,UAAU;MACV,YAAY;MACZ,YAAY;MACZ,OAAO;~~MACR~~;~~eAEA~~;~~KACU~~,CAAA;~~IACT~~,CAAA;~~GACF~~,CAAA;~~EAGkE~~,CAAA;~~GAGtE~~,KAA0B,EAC9B,QACA,eAAY,gBACZ,eAAY,WACZ,YACkD;CAClD,IAAM,IAAW,EAA8B,~~EAAI~~,~~EAY7C~~,EAAE,MAAM,GAAmB,iBAC/B,EAAwB;EAVxB,UACE;EAEF,cAAc;EACd;EACA,OAAO,EACL,~~QACD~~;~~EAGuB~~,~~CAAmB~~,~~EAEvC~~,IAAW,GAAmB,YAAa,aAAa,QAAQ,~~EAAE~~,~~EAEnE~~,~~IAAL~~,~~yBAAA,GAAA;SACE,~~EAAA,~~WAAW~~,~~YACX~~,~~EAAA~~,~~oBAAoB~~,~~oBACpB,~~EAAA,~~UAAU;MACX,EAEK,IAAgB,EACpB,EAAgB,UAChB,EACD,EAEK,IAA2B,EAC~~/B,~~EAAgB~~,~~mBAChB~~,~~EACD,EAEK,~~IAAkB,~~EACtB~~,~~EAAgB~~,~~SAChB,EACD~~;~~AAED~~,~~QACE~~,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,SAAS;IAAE,IAAI;IAAQ,IAAI;~~IAAa~~;~~GACxC~~,qBACE,MAAc,aACV,EAAE,IAAI,~~OAAO~~,~~GACb~~;IAAE,IAAI;IAAO,IAAI;~~IAAW~~;~~GAClC~~,KAAK;GACL,WAAW,MAAc,aAAa,WAAW;GACjD,GAAG;~~GACJ~~;~~YAXH~~,CAaG,MAAc,YACb,kBAAC,GAAD;GACE,OAAO;GACP,IAAI,EAAE,IAAI;IAAE,UAAU;IAAQ,YAAY;IAAQ,OAAO;~~IAAQ~~,EAAE;~~GACnE~~,CAAA,~~GAEF~~,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IAAE,UAAU;IAAQ,OAAO;~~IAAY~~;~~aAE1C~~;~~GACU~~,CAAA,~~EAEf~~,kBAAC,GAAD;GACE,KAAI,OAAU;IACZ,SAAS;IACT,UAAU;IACV,KAAK;IACL,MAAM;IACN,gBAAgB,MAAc,aAAa,WAAW;KACrD,EAAM,YAAY,KAAK,~~KAAK~~,~~GAAG~~,EAC9B,gBAAgB,~~UACjB~~;~~IACF~~;~~aAEA~~,GAAU,KAAK,GAAS,MACvB,kBAAC,GAAD;IAEW;IACM;IACW;IACT;IACP;IACC;~~IACX~~,~~EAPK~~,WAAW,~~IAOhB~~,CACF;~~GACE~~,CAAA,CACF"}
1	+ {"version":3,"file":"PortalFeaturedPartners.js","names":[],"sources":["../../../src/components/PortalFeaturedPartners/PortalFeaturedPartners.tsx"],"sourcesContent":["import React from 'react'\nimport useGetQueryResultBundle from '@/synapse-queries/entity/useGetQueryResultBundle'\nimport { SynapseConstants } from '@/utils'\nimport { parseEntityIdFromSqlStatement } from '@/utils/functions'\nimport { getFieldIndex } from '@/utils/functions/queryUtils'\nimport { useImageUrl } from '@/utils/hooks/useImageUrlUtils'\nimport {\n Box,\n CardMedia,\n Link,\n Skeleton,\n SxProps,\n Typography,\n} from '@mui/material'\nimport { QueryBundleRequest, Row } from '@sage-bionetworks/synapse-types'\nimport PortalSectionHeader from '../PortalSectionHeader'\n\nconst partnerIconHeight = 101\nconst partnerIconWidth = 156\n\nexport type PortalFeaturedPartnersProps = {\n variation?: 'default' \| 'centered'\n sql: string\n titleText?: string\n sx?: SxProps\n}\n\ntype PartnerIcons = {\n partner: Row\n imageColIndex: number\n organizationNameColIndex: number\n websiteColIndex: number\n entityId: string\n isLoading?: boolean\n}\n\ntype PartnerWrapperProps = {\n website?: string \| null\n children: React.ReactNode\n}\n\nconst PartnerWrapper = ({\n website,\n children,\n}: PartnerWrapperProps): React.ReactNode => {\n const commonSx = {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }\n\n return website ? (\n <Link\n href={website}\n target=\"_blank\"\n sx={{\n ...commonSx,\n textDecoration: 'none !important',\n }}\n >\n {children}\n </Link>\n ) : (\n <Box sx={commonSx}>{children}</Box>\n )\n}\n\nconst PartnerIcon = ({\n partner,\n imageColIndex,\n organizationNameColIndex,\n websiteColIndex,\n entityId,\n isLoading,\n}: PartnerIcons): React.ReactNode => {\n const fileId = partner.values[imageColIndex] ?? ''\n const organizationName = partner.values[organizationNameColIndex]\n const website = partner.values[websiteColIndex]\n const imageUrl = useImageUrl(fileId, entityId)\n\n if (!imageUrl && !organizationName) return null\n\n if (isLoading)\n return (\n <Skeleton\n variant=\"rectangular\"\n height={partnerIconHeight}\n width={partnerIconWidth}\n />\n )\n\n const PartnerContent = imageUrl ? (\n <CardMedia\n component=\"img\"\n image={imageUrl}\n aria-hidden=\"true\"\n sx={{\n width: `${partnerIconWidth}px`,\n height: `${partnerIconHeight}px`,\n objectFit: 'contain',\n borderRadius: '10px',\n }}\n />\n ) : (\n <Box\n sx={{\n display: 'flex',\n width: '165px',\n padding: '3px',\n flexDirection: 'column',\n gap: '10px',\n border: '2px solid',\n borderColor: 'grey.900',\n backgroundColor: '#FFF',\n textAlign: 'center',\n }}\n >\n <Box\n sx={{\n display: 'flex',\n padding: '10px',\n justifyContent: 'center',\n alignItems: 'center',\n gap: '10px',\n border: '1px solid',\n borderColor: 'grey.900',\n }}\n >\n <Typography\n variant=\"headline3\"\n sx={{\n fontSize: '14px',\n fontWeight: 400,\n lineHeight: '130%',\n color: 'grey.900',\n }}\n >\n {organizationName}\n </Typography>\n </Box>\n </Box>\n )\n\n return <PartnerWrapper website={website}>{PartnerContent}</PartnerWrapper>\n}\n\nconst PortalFeaturedPartners = ({\n sql,\n titleText = 'Our Partners',\n variation = 'default',\n sx,\n}: PortalFeaturedPartnersProps): React.ReactNode => {\n const entityId = parseEntityIdFromSqlStatement(sql)\n\n const queryBundleRequest: QueryBundleRequest = {\n partMask:\n SynapseConstants.BUNDLE_MASK_QUERY_SELECT_COLUMNS \|\n SynapseConstants.BUNDLE_MASK_QUERY_RESULTS,\n concreteType: 'org.sagebionetworks.repo.model.table.QueryBundleRequest',\n entityId,\n query: {\n sql,\n },\n }\n const { data: queryResultBundle, isLoading } =\n useGetQueryResultBundle(queryBundleRequest)\n\n const dataRows = queryResultBundle?.queryResult!.queryResults.rows ?? []\n\n enum ExpectedColumns {\n CARDLOGO = 'cardLogo',\n ORGANIZATION_NAME = 'organizationName',\n WEBSITE = 'website',\n }\n\n const imageColIndex = getFieldIndex(\n ExpectedColumns.CARDLOGO,\n queryResultBundle,\n )\n\n const organizationNameColIndex = getFieldIndex(\n ExpectedColumns.ORGANIZATION_NAME,\n queryResultBundle,\n )\n\n const websiteColIndex = getFieldIndex(\n ExpectedColumns.WEBSITE,\n queryResultBundle,\n )\n\n return (\n <Box\n sx={{\n display: 'grid',\n padding: { xs: '40px', lg: '20px 80px' },\n gridTemplateColumns:\n variation === 'centered'\n ? { xs: '1fr' }\n : { xs: '1fr', md: '1fr 3fr' },\n gap: '50px',\n textAlign: variation === 'centered' ? 'center' : 'left',\n ...sx,\n }}\n >\n {variation === 'default' ? (\n <PortalSectionHeader\n title={titleText}\n sx={{ h2: { fontSize: '24px', paddingTop: '26px', width: '100%' } }}\n />\n ) : (\n <Typography\n variant=\"headline1\"\n sx={{ fontSize: '48px', color: 'grey.900' }}\n >\n {titleText}\n </Typography>\n )}\n <Box\n sx={theme => ({\n display: 'flex',\n flexWrap: 'wrap',\n gap: '64px',\n flex: '1 1 0',\n justifyContent: variation === 'centered' ? 'center' : 'flex-start',\n [theme.breakpoints.down('sm')]: {\n justifyContent: 'center',\n },\n })}\n >\n {dataRows?.map((partner, index) => (\n <PartnerIcon\n key={`partner-${index}`}\n partner={partner}\n imageColIndex={imageColIndex}\n organizationNameColIndex={organizationNameColIndex}\n websiteColIndex={websiteColIndex}\n entityId={entityId}\n isLoading={isLoading}\n />\n ))}\n </Box>\n </Box>\n )\n}\n\nexport default PortalFeaturedPartners\n"],"mappings":";;;;;;;;;;;;AAiBA,IAAM,IAAoB,KACpB,IAAmB,KAuBnB,KAAkB,EACtB,YACA,kBAC0C;CAC1C,IAAM,IAAW;EACf,SAAS;EACT,YAAY;EACZ,gBAAgB;CAClB;CAEA,OAAO,IACL,kBAAC,GAAD;EACE,MAAM;EACN,QAAO;EACP,IAAI;GACF,GAAG;GACH,gBAAgB;EAClB;EAEC;CACG,CAAA,IAEN,kBAAC,GAAD;EAAK,IAAI;EAAW;CAAc,CAAA;AAEtC,GAEM,KAAe,EACnB,YACA,kBACA,6BACA,oBACA,aACA,mBACmC;CACnC,IAAM,IAAS,EAAQ,OAAO,MAAkB,IAC1C,IAAmB,EAAQ,OAAO,IAClC,IAAU,EAAQ,OAAO,IACzB,IAAW,EAAY,GAAQ,CAAQ;CAiE7C,OA/DI,CAAC,KAAY,CAAC,IAAyB,OAEvC,IAEA,kBAAC,GAAD;EACE,SAAQ;EACR,QAAQ;EACR,OAAO;CACR,CAAA,IAuDE,kBAAC,GAAD;EAAyB;YApDT,IACrB,kBAAC,GAAD;GACE,WAAU;GACV,OAAO;GACP,eAAY;GACZ,IAAI;IACF,OAAO,GAAG,EAAiB;IAC3B,QAAQ,GAAG,EAAkB;IAC7B,WAAW;IACX,cAAc;GAChB;EACD,CAAA,IAED,kBAAC,GAAD;GACE,IAAI;IACF,SAAS;IACT,OAAO;IACP,SAAS;IACT,eAAe;IACf,KAAK;IACL,QAAQ;IACR,aAAa;IACb,iBAAiB;IACjB,WAAW;GACb;aAEA,kBAAC,GAAD;IACE,IAAI;KACF,SAAS;KACT,SAAS;KACT,gBAAgB;KAChB,YAAY;KACZ,KAAK;KACL,QAAQ;KACR,aAAa;IACf;cAEA,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,UAAU;MACV,YAAY;MACZ,YAAY;MACZ,OAAO;KACT;eAEC;IACS,CAAA;GACT,CAAA;EACF,CAAA;CAGkE,CAAA;AAC3E,GAEM,KAA0B,EAC9B,QACA,eAAY,gBACZ,eAAY,WACZ,YACkD;CAClD,IAAM,IAAW,EAA8B,CAAG,GAY5C,EAAE,MAAM,GAAmB,iBAC/B,EAAwB;EAVxB,UACE;EAEF,cAAc;EACd;EACA,OAAO,EACL,OACF;CAGwB,CAAkB,GAEtC,IAAW,GAAmB,YAAa,aAAa,QAAQ,CAAC,GAQjE,IAAgB,EAAA,YAEpB,CACF,GAEM,IAA2B,EAAA,oBAE/B,CACF,GAEM,IAAkB,EAAA,WAEtB,CACF;CAEA,OACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,SAAS;IAAE,IAAI;IAAQ,IAAI;GAAY;GACvC,qBACE,MAAc,aACV,EAAE,IAAI,MAAM,IACZ;IAAE,IAAI;IAAO,IAAI;GAAU;GACjC,KAAK;GACL,WAAW,MAAc,aAAa,WAAW;GACjD,GAAG;EACL;YAXF,CAaG,MAAc,YACb,kBAAC,GAAD;GACE,OAAO;GACP,IAAI,EAAE,IAAI;IAAE,UAAU;IAAQ,YAAY;IAAQ,OAAO;GAAO,EAAE;EACnE,CAAA,IAED,kBAAC,GAAD;GACE,SAAQ;GACR,IAAI;IAAE,UAAU;IAAQ,OAAO;GAAW;aAEzC;EACS,CAAA,GAEd,kBAAC,GAAD;GACE,KAAI,OAAU;IACZ,SAAS;IACT,UAAU;IACV,KAAK;IACL,MAAM;IACN,gBAAgB,MAAc,aAAa,WAAW;KACrD,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,gBAAgB,SAClB;GACF;aAEC,GAAU,KAAK,GAAS,MACvB,kBAAC,GAAD;IAEW;IACM;IACW;IACT;IACP;IACC;GACZ,GAPM,WAAW,GAOjB,CACF;EACE,CAAA,CACF;;AAET"}

package/dist/components/PortalHomePageHeader/PortalHomePageHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalHomePageHeader.js","names":[],"sources":["../../../src/components/PortalHomePageHeader/PortalHomePageHeader.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Stack, Typography, Button } from '@mui/material'\n\nexport type PortalHomePageHeaderProps = {\n backgroundCss: string // background of entire header\n buttonLink?: string\n title: React.ReactNode\n subTitle?: React.ReactNode\n description: React.ReactNode\n backgroundMp4?: string\n backgroundMp4Css?: string // while video is loading, what should the background color be?\n textAreaWidth?: string // default is 746px. used for md and up screen sizes\n}\n\nconst PortalHomePageHeader = ({\n backgroundCss,\n buttonLink,\n title,\n subTitle,\n description,\n backgroundMp4,\n backgroundMp4Css,\n textAreaWidth = '746px',\n}: PortalHomePageHeaderProps): React.ReactNode => {\n return (\n <Box\n data-testid=\"HeaderContainer\"\n sx={{\n background: backgroundCss,\n padding: { xs: 0, md: '50px 80px' },\n position: 'relative',\n }}\n >\n {backgroundMp4 && (\n <Box\n component=\"video\"\n autoPlay\n loop\n muted\n playsInline\n sx={{\n position: 'absolute',\n top: 0,\n left: 0,\n width: '100%',\n height: '100%',\n objectFit: 'fill',\n zIndex: -1,\n background: backgroundMp4Css,\n }}\n >\n <source src={backgroundMp4} type=\"video/mp4\" />\n Your browser does not support the video tag.\n </Box>\n )}\n <Stack\n sx={{\n alignItems: 'flex-start',\n padding: { xs: '40px', md: '40px 0' },\n gap: '24px',\n width: { sm: '100%', md: textAreaWidth },\n }}\n >\n <Typography\n variant=\"headline2\"\n sx={{\n fontWeight: 300,\n lineHeight: '130%',\n fontSize: { xs: '36px', md: '42px' },\n color: 'grey.1000',\n }}\n >\n {title}\n </Typography>\n {subTitle && (\n <Typography\n variant=\"headline3\"\n sx={{\n fontSize: '24px',\n fontWeight: '400',\n lineHeight: '160%',\n color: 'grey.1000',\n }}\n >\n {subTitle}\n </Typography>\n )}\n <Typography\n sx={{ fontSize: '18px', lineHeight: '140%', color: 'grey.900' }}\n >\n {description}\n </Typography>\n {buttonLink && (\n <Button\n href={buttonLink}\n target=\"_blank\"\n variant=\"contained\"\n role=\"button\"\n sx={theme => ({\n whiteSpace: 'nowrap',\n alignSelf: 'flex-start',\n padding: '6px 24px',\n fontWeight: 600,\n boxShadow:\n '0px 16px 16px 0px rgba(0, 0, 0, 0.10), 0px 4px 4px 0px rgba(0, 0, 0, 0.10), 0px 1px 1px 0px rgba(0, 0, 0, 0.10)',\n '&:hover': {\n boxShadow:\n '0px 16px 16px 0px rgba(0, 0, 0, 0.10), 0px 4px 4px 0px rgba(0, 0, 0, 0.10), 0px 1px 1px 0px rgba(0, 0, 0, 0.10)',\n },\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n },\n })}\n >\n Learn more\n </Button>\n )}\n </Stack>\n </Box>\n )\n}\n\nexport default PortalHomePageHeader\n"],"mappings":";;;;AAcA,IAAM,KAAwB,EAC5B,kBACA,eACA,UACA,aACA,gBACA,kBACA,qBACA,mBAAgB,cAGd,kBAAC,GAAD;CACE,eAAY;CACZ,IAAI;EACF,YAAY;EACZ,SAAS;GAAE,IAAI;GAAG,IAAI;~~GAAa~~;~~EACnC~~,UAAU;~~EACX~~;~~WANH~~,CAQG,KACC,kBAAC,GAAD;EACE,WAAU;EACV,UAAA;EACA,MAAA;EACA,OAAA;EACA,aAAA;EACA,IAAI;GACF,UAAU;GACV,KAAK;GACL,MAAM;GACN,OAAO;GACP,QAAQ;GACR,WAAW;GACX,QAAQ;GACR,YAAY;~~GACb~~;~~YAfH~~,CAiBE,kBAAC,UAAD;GAAQ,KAAK;GAAe,MAAK;~~GAAc~~,CAAA,~~EAAA,+CAE3C~~;~~KAER~~,kBAAC,GAAD;EACE,IAAI;GACF,YAAY;GACZ,SAAS;IAAE,IAAI;IAAQ,IAAI;~~IAAU~~;~~GACrC~~,KAAK;GACL,OAAO;IAAE,IAAI;IAAQ,IAAI;~~IAAe~~;~~GACzC~~;~~YANH~~;GAQE,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,YAAY;KACZ,YAAY;KACZ,UAAU;MAAE,IAAI;MAAQ,IAAI;~~MAAQ~~;~~KACpC~~,OAAO;~~KACR~~;~~cAEA~~;~~IACU~~,CAAA;~~GACZ~~,KACC,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,UAAU;KACV,YAAY;KACZ,YAAY;KACZ,OAAO;~~KACR~~;~~cAEA~~;~~IACU~~,CAAA;~~GAEf~~,kBAAC,GAAD;IACE,IAAI;KAAE,UAAU;KAAQ,YAAY;KAAQ,OAAO;~~KAAY~~;~~cAE9D~~;~~IACU~~,CAAA;~~GACZ~~,KACC,kBAAC,GAAD;IACE,MAAM;IACN,QAAO;IACP,SAAQ;IACR,MAAK;IACL,KAAI,OAAU;KACZ,YAAY;KACZ,WAAW;KACX,SAAS;KACT,YAAY;KACZ,WACE;KACF,WAAW,EACT,WACE,~~mHACH~~;~~MACA~~,EAAM,YAAY,KAAK,~~KAAK~~,~~GAAG~~,EAC9B,OAAO,~~QACR~~;~~KACF~~;~~cACF~~;~~IAEQ~~,CAAA;~~GAEL~~;~~IACJ~~"}
1	+ {"version":3,"file":"PortalHomePageHeader.js","names":[],"sources":["../../../src/components/PortalHomePageHeader/PortalHomePageHeader.tsx"],"sourcesContent":["import React from 'react'\nimport { Box, Stack, Typography, Button } from '@mui/material'\n\nexport type PortalHomePageHeaderProps = {\n backgroundCss: string // background of entire header\n buttonLink?: string\n title: React.ReactNode\n subTitle?: React.ReactNode\n description: React.ReactNode\n backgroundMp4?: string\n backgroundMp4Css?: string // while video is loading, what should the background color be?\n textAreaWidth?: string // default is 746px. used for md and up screen sizes\n}\n\nconst PortalHomePageHeader = ({\n backgroundCss,\n buttonLink,\n title,\n subTitle,\n description,\n backgroundMp4,\n backgroundMp4Css,\n textAreaWidth = '746px',\n}: PortalHomePageHeaderProps): React.ReactNode => {\n return (\n <Box\n data-testid=\"HeaderContainer\"\n sx={{\n background: backgroundCss,\n padding: { xs: 0, md: '50px 80px' },\n position: 'relative',\n }}\n >\n {backgroundMp4 && (\n <Box\n component=\"video\"\n autoPlay\n loop\n muted\n playsInline\n sx={{\n position: 'absolute',\n top: 0,\n left: 0,\n width: '100%',\n height: '100%',\n objectFit: 'fill',\n zIndex: -1,\n background: backgroundMp4Css,\n }}\n >\n <source src={backgroundMp4} type=\"video/mp4\" />\n Your browser does not support the video tag.\n </Box>\n )}\n <Stack\n sx={{\n alignItems: 'flex-start',\n padding: { xs: '40px', md: '40px 0' },\n gap: '24px',\n width: { sm: '100%', md: textAreaWidth },\n }}\n >\n <Typography\n variant=\"headline2\"\n sx={{\n fontWeight: 300,\n lineHeight: '130%',\n fontSize: { xs: '36px', md: '42px' },\n color: 'grey.1000',\n }}\n >\n {title}\n </Typography>\n {subTitle && (\n <Typography\n variant=\"headline3\"\n sx={{\n fontSize: '24px',\n fontWeight: '400',\n lineHeight: '160%',\n color: 'grey.1000',\n }}\n >\n {subTitle}\n </Typography>\n )}\n <Typography\n sx={{ fontSize: '18px', lineHeight: '140%', color: 'grey.900' }}\n >\n {description}\n </Typography>\n {buttonLink && (\n <Button\n href={buttonLink}\n target=\"_blank\"\n variant=\"contained\"\n role=\"button\"\n sx={theme => ({\n whiteSpace: 'nowrap',\n alignSelf: 'flex-start',\n padding: '6px 24px',\n fontWeight: 600,\n boxShadow:\n '0px 16px 16px 0px rgba(0, 0, 0, 0.10), 0px 4px 4px 0px rgba(0, 0, 0, 0.10), 0px 1px 1px 0px rgba(0, 0, 0, 0.10)',\n '&:hover': {\n boxShadow:\n '0px 16px 16px 0px rgba(0, 0, 0, 0.10), 0px 4px 4px 0px rgba(0, 0, 0, 0.10), 0px 1px 1px 0px rgba(0, 0, 0, 0.10)',\n },\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n },\n })}\n >\n Learn more\n </Button>\n )}\n </Stack>\n </Box>\n )\n}\n\nexport default PortalHomePageHeader\n"],"mappings":";;;;AAcA,IAAM,KAAwB,EAC5B,kBACA,eACA,UACA,aACA,gBACA,kBACA,qBACA,mBAAgB,cAGd,kBAAC,GAAD;CACE,eAAY;CACZ,IAAI;EACF,YAAY;EACZ,SAAS;GAAE,IAAI;GAAG,IAAI;EAAY;EAClC,UAAU;CACZ;WANF,CAQG,KACC,kBAAC,GAAD;EACE,WAAU;EACV,UAAA;EACA,MAAA;EACA,OAAA;EACA,aAAA;EACA,IAAI;GACF,UAAU;GACV,KAAK;GACL,MAAM;GACN,OAAO;GACP,QAAQ;GACR,WAAW;GACX,QAAQ;GACR,YAAY;EACd;YAfF,CAiBE,kBAAC,UAAD;GAAQ,KAAK;GAAe,MAAK;EAAa,CAAA,GAAC,8CAE5C;KAEP,kBAAC,GAAD;EACE,IAAI;GACF,YAAY;GACZ,SAAS;IAAE,IAAI;IAAQ,IAAI;GAAS;GACpC,KAAK;GACL,OAAO;IAAE,IAAI;IAAQ,IAAI;GAAc;EACzC;YANF;GAQE,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,YAAY;KACZ,YAAY;KACZ,UAAU;MAAE,IAAI;MAAQ,IAAI;KAAO;KACnC,OAAO;IACT;cAEC;GACS,CAAA;GACX,KACC,kBAAC,GAAD;IACE,SAAQ;IACR,IAAI;KACF,UAAU;KACV,YAAY;KACZ,YAAY;KACZ,OAAO;IACT;cAEC;GACS,CAAA;GAEd,kBAAC,GAAD;IACE,IAAI;KAAE,UAAU;KAAQ,YAAY;KAAQ,OAAO;IAAW;cAE7D;GACS,CAAA;GACX,KACC,kBAAC,GAAD;IACE,MAAM;IACN,QAAO;IACP,SAAQ;IACR,MAAK;IACL,KAAI,OAAU;KACZ,YAAY;KACZ,WAAW;KACX,SAAS;KACT,YAAY;KACZ,WACE;KACF,WAAW,EACT,WACE,kHACJ;MACC,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,OAAO,OACT;IACF;cACD;GAEO,CAAA;EAEL;GACJ"}

package/dist/components/PortalList/CreatePortalModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CreatePortalModal.js","names":[],"sources":["../../../src/components/PortalList/CreatePortalModal.tsx"],"sourcesContent":["import { useCreatePortal } from '@/synapse-queries/portal/usePortal'\nimport { Alert, Stack } from '@mui/material'\nimport { Portal } from '@sage-bionetworks/synapse-client'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { KeyboardEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\nimport { displayToast } from '../ToastMessage'\nimport TextField from '../TextField/TextField'\n\nexport type CreatePortalModalProps = {\n open: boolean\n onClose: () => void\n onSuccess?: (portal: Portal) => void\n}\n\nexport function CreatePortalModal({\n open,\n onClose,\n onSuccess,\n}: CreatePortalModalProps): React.ReactNode {\n const [portalName, setPortalName] = useState<string>('')\n const [portalUrl, setPortalUrl] = useState<string>('')\n const [errorMessage, setErrorMessage] = useState<string>()\n\n const { mutate: createPortal, isPending } = useCreatePortal({\n onSuccess: portal => {\n displayToast('Portal created successfully', 'success')\n handleClose()\n onSuccess?.(portal)\n },\n onError: (error: SynapseClientError) => {\n setErrorMessage(error.reason \|\| error.message)\n },\n })\n\n const handleClose = () => {\n setPortalName('')\n setPortalUrl('')\n setErrorMessage(undefined)\n onClose()\n }\n\n const handleCreate = () => {\n if (!portalName.trim()) {\n setErrorMessage('Portal name is required')\n return\n }\n if (!portalUrl.trim()) {\n setErrorMessage('Portal URL is required')\n return\n }\n\n const newPortal: Portal = {\n name: portalName.trim(),\n url: portalUrl.trim(),\n }\n\n createPortal(newPortal)\n }\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' && portalName.trim() && portalUrl.trim()) {\n handleCreate()\n }\n }\n\n const dialogContent = (\n <Stack gap={2}>\n <TextField\n id=\"portalNameInput\"\n label=\"Portal Name\"\n value={portalName}\n fullWidth\n required\n onChange={event => {\n setPortalName(event.target.value)\n setErrorMessage(undefined)\n }}\n inputProps={{\n onKeyDown: handleKeyDown,\n }}\n />\n <TextField\n id=\"portalUrlInput\"\n label=\"Portal URL\"\n value={portalUrl}\n fullWidth\n required\n placeholder=\"https://example.synapse.org\"\n onChange={event => {\n setPortalUrl(event.target.value)\n setErrorMessage(undefined)\n }}\n inputProps={{\n onKeyDown: handleKeyDown,\n }}\n />\n {errorMessage && <Alert severity=\"error\">{errorMessage}</Alert>}\n </Stack>\n )\n\n return (\n <ConfirmationDialog\n open={open}\n title=\"Create a New Portal\"\n content={dialogContent}\n confirmButtonProps={{\n children: 'Create',\n disabled: isPending \|\| !portalName.trim() \|\| !portalUrl.trim(),\n }}\n onConfirm={handleCreate}\n onCancel={handleClose}\n maxWidth=\"sm\"\n />\n )\n}\n\nexport default CreatePortalModal\n"],"mappings":";;;;;;;;;AAeA,SAAgB,EAAkB,EAChC,SACA,YACA,gBAC0C;CAC1C,IAAM,CAAC,GAAY,KAAiB,EAAiB,~~GAAG~~,~~EAClD~~,CAAC,GAAW,KAAgB,EAAiB,~~GAAG~~,~~EAChD~~,CAAC,GAAc,KAAmB,~~GAAkB~~,~~EAEpD~~,EAAE,QAAQ,GAAc,iBAAc,EAAgB;EAC1D,YAAW,MAAU;~~AAGnB~~,~~GAFA~~,EAAa,+BAA+B,~~UAAU~~,~~EACtD~~,~~GAAa~~,~~EACb~~,IAAY,~~EAAO;;EAErB~~,UAAU,MAA8B;~~AACtC~~,~~KAAgB~~,EAAM,UAAU,EAAM,~~QAAQ;;EAEjD~~,CAAC,~~EAEI~~,UAAoB;~~AAIxB~~,~~EAHA~~,EAAc,~~GAAG~~,~~EACjB~~,EAAa,~~GAAG~~,~~EAChB~~,EAAgB,KAAA,~~EAAU~~,~~EAC1B~~,~~GAAS~~;~~IAGL~~,UAAqB;~~AACzB~~,~~MAAI~~,CAAC,EAAW,~~MAAM~~,~~EAAE~~;~~AACtB~~,~~KAAgB~~,~~0BAA0B~~;~~AAC1C;;AAEF~~,~~MAAI~~,CAAC,EAAU,~~MAAM~~,~~EAAE~~;~~AACrB~~,~~KAAgB~~,~~yBAAyB~~;~~AACzC;;AAQF~~,~~IAAa~~;GAJX,MAAM,EAAW,~~MAAM~~;~~GACvB~~,KAAK,EAAU,~~MAAM~~;~~GAGV~~,~~CAAU~~;~~IAGnB~~,KAAiB,MAA2C;~~AAChE~~,~~EAAI~~,EAAM,QAAQ,WAAW,EAAW,~~MAAM~~,~~IAAI~~,EAAU,~~MAAM~~,~~IAChE~~,~~GAAc;;AAuClB~~,~~QACE~~,kBAAC,GAAD;EACQ;EACN,OAAM;EACN,SAtCF,kBAAC,GAAD;GAAO,KAAK;aAAZ;IACE,kBAAC,GAAD;KACE,IAAG;KACH,OAAM;KACN,OAAO;KACP,WAAA;KACA,UAAA;KACA,WAAU,MAAS;~~AAEjB~~,~~MADA~~,EAAc,EAAM,OAAO,~~MAAM~~,~~EACjC~~,EAAgB,KAAA,~~EAAU;;KAE5B~~,YAAY,EACV,WAAW,~~GACZ~~;~~KACD~~,CAAA;~~IACF~~,kBAAC,GAAD;KACE,IAAG;KACH,OAAM;KACN,OAAO;KACP,WAAA;KACA,UAAA;KACA,aAAY;KACZ,WAAU,MAAS;~~AAEjB~~,~~MADA~~,EAAa,EAAM,OAAO,~~MAAM~~,~~EAChC~~,EAAgB,KAAA,~~EAAU;;KAE5B~~,YAAY,EACV,WAAW,~~GACZ~~;~~KACD~~,CAAA;~~IACD~~,KAAgB,kBAAC,GAAD;KAAO,UAAS;eAAS;~~KAAqB~~,CAAA;~~IACzD~~;~~IAOG~~;EACT,oBAAoB;GAClB,UAAU;GACV,UAAU,KAAa,CAAC,EAAW,~~MAAM~~,~~IAAI~~,CAAC,EAAU,~~MAAM~~;~~GAC~~/D;~~EACD~~,WAAW;EACX,UAAU;EACV,UAAS;~~EACT~~,CAAA"}
1	+ {"version":3,"file":"CreatePortalModal.js","names":[],"sources":["../../../src/components/PortalList/CreatePortalModal.tsx"],"sourcesContent":["import { useCreatePortal } from '@/synapse-queries/portal/usePortal'\nimport { Alert, Stack } from '@mui/material'\nimport { Portal } from '@sage-bionetworks/synapse-client'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport { KeyboardEvent, useState } from 'react'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\nimport { displayToast } from '../ToastMessage'\nimport TextField from '../TextField/TextField'\n\nexport type CreatePortalModalProps = {\n open: boolean\n onClose: () => void\n onSuccess?: (portal: Portal) => void\n}\n\nexport function CreatePortalModal({\n open,\n onClose,\n onSuccess,\n}: CreatePortalModalProps): React.ReactNode {\n const [portalName, setPortalName] = useState<string>('')\n const [portalUrl, setPortalUrl] = useState<string>('')\n const [errorMessage, setErrorMessage] = useState<string>()\n\n const { mutate: createPortal, isPending } = useCreatePortal({\n onSuccess: portal => {\n displayToast('Portal created successfully', 'success')\n handleClose()\n onSuccess?.(portal)\n },\n onError: (error: SynapseClientError) => {\n setErrorMessage(error.reason \|\| error.message)\n },\n })\n\n const handleClose = () => {\n setPortalName('')\n setPortalUrl('')\n setErrorMessage(undefined)\n onClose()\n }\n\n const handleCreate = () => {\n if (!portalName.trim()) {\n setErrorMessage('Portal name is required')\n return\n }\n if (!portalUrl.trim()) {\n setErrorMessage('Portal URL is required')\n return\n }\n\n const newPortal: Portal = {\n name: portalName.trim(),\n url: portalUrl.trim(),\n }\n\n createPortal(newPortal)\n }\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' && portalName.trim() && portalUrl.trim()) {\n handleCreate()\n }\n }\n\n const dialogContent = (\n <Stack gap={2}>\n <TextField\n id=\"portalNameInput\"\n label=\"Portal Name\"\n value={portalName}\n fullWidth\n required\n onChange={event => {\n setPortalName(event.target.value)\n setErrorMessage(undefined)\n }}\n inputProps={{\n onKeyDown: handleKeyDown,\n }}\n />\n <TextField\n id=\"portalUrlInput\"\n label=\"Portal URL\"\n value={portalUrl}\n fullWidth\n required\n placeholder=\"https://example.synapse.org\"\n onChange={event => {\n setPortalUrl(event.target.value)\n setErrorMessage(undefined)\n }}\n inputProps={{\n onKeyDown: handleKeyDown,\n }}\n />\n {errorMessage && <Alert severity=\"error\">{errorMessage}</Alert>}\n </Stack>\n )\n\n return (\n <ConfirmationDialog\n open={open}\n title=\"Create a New Portal\"\n content={dialogContent}\n confirmButtonProps={{\n children: 'Create',\n disabled: isPending \|\| !portalName.trim() \|\| !portalUrl.trim(),\n }}\n onConfirm={handleCreate}\n onCancel={handleClose}\n maxWidth=\"sm\"\n />\n )\n}\n\nexport default CreatePortalModal\n"],"mappings":";;;;;;;;;AAeA,SAAgB,EAAkB,EAChC,SACA,YACA,gBAC0C;CAC1C,IAAM,CAAC,GAAY,KAAiB,EAAiB,EAAE,GACjD,CAAC,GAAW,KAAgB,EAAiB,EAAE,GAC/C,CAAC,GAAc,KAAmB,EAAiB,GAEnD,EAAE,QAAQ,GAAc,iBAAc,EAAgB;EAC1D,YAAW,MAAU;GAGnB,AAFA,EAAa,+BAA+B,SAAS,GACrD,EAAY,GACZ,IAAY,CAAM;EACpB;EACA,UAAU,MAA8B;GACtC,EAAgB,EAAM,UAAU,EAAM,OAAO;EAC/C;CACF,CAAC,GAEK,UAAoB;EAIxB,AAHA,EAAc,EAAE,GAChB,EAAa,EAAE,GACf,EAAgB,KAAA,CAAS,GACzB,EAAQ;CACV,GAEM,UAAqB;EACzB,IAAI,CAAC,EAAW,KAAK,GAAG;GACtB,EAAgB,yBAAyB;GACzC;EACF;EACA,IAAI,CAAC,EAAU,KAAK,GAAG;GACrB,EAAgB,wBAAwB;GACxC;EACF;EAOA,EAAa;GAJX,MAAM,EAAW,KAAK;GACtB,KAAK,EAAU,KAAK;EAGT,CAAS;CACxB,GAEM,KAAiB,MAA2C;EAChE,AAAI,EAAM,QAAQ,WAAW,EAAW,KAAK,KAAK,EAAU,KAAK,KAC/D,EAAa;CAEjB;CAqCA,OACE,kBAAC,GAAD;EACQ;EACN,OAAM;EACN,SAtCF,kBAAC,GAAD;GAAO,KAAK;aAAZ;IACE,kBAAC,GAAD;KACE,IAAG;KACH,OAAM;KACN,OAAO;KACP,WAAA;KACA,UAAA;KACA,WAAU,MAAS;MAEjB,AADA,EAAc,EAAM,OAAO,KAAK,GAChC,EAAgB,KAAA,CAAS;KAC3B;KACA,YAAY,EACV,WAAW,EACb;IACD,CAAA;IACD,kBAAC,GAAD;KACE,IAAG;KACH,OAAM;KACN,OAAO;KACP,WAAA;KACA,UAAA;KACA,aAAY;KACZ,WAAU,MAAS;MAEjB,AADA,EAAa,EAAM,OAAO,KAAK,GAC/B,EAAgB,KAAA,CAAS;KAC3B;KACA,YAAY,EACV,WAAW,EACb;IACD,CAAA;IACA,KAAgB,kBAAC,GAAD;KAAO,UAAS;eAAS;IAAoB,CAAA;GACzD;GAOI;EACT,oBAAoB;GAClB,UAAU;GACV,UAAU,KAAa,CAAC,EAAW,KAAK,KAAK,CAAC,EAAU,KAAK;EAC/D;EACA,WAAW;EACX,UAAU;EACV,UAAS;CACV,CAAA;AAEL"}

package/dist/components/PortalList/PortalCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalCard.js","names":[],"sources":["../../../src/components/PortalList/PortalCard.tsx"],"sourcesContent":["import { Portal } from '@sage-bionetworks/synapse-client'\nimport {\n Card,\n CardContent,\n Typography,\n Box,\n Link as MuiLink,\n IconButton,\n} from '@mui/material'\nimport styles from './PortalCard.module.scss'\nimport UserCard from '../UserCard/UserCard'\nimport dayjs from 'dayjs'\nimport { useState } from 'react'\nimport PortalAclEditorModal from '../PortalAclEditor/PortalAclEditorModal'\nimport { Settings, Delete } from '@mui/icons-material'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\nimport { useDeletePortal } from '@/synapse-queries/portal/usePortal'\nimport { displayToast } from '../ToastMessage'\n\n// Synapse itself is portal ID 1 and should not have ACL management\nconst SYNAPSE_PORTAL_ID = '1'\n\nexport type PortalCardProps = {\n portal: Portal\n}\n\nexport function PortalCard({ portal }: PortalCardProps): React.ReactNode {\n const { id, name, url, createdBy, createdOn, modifiedBy, modifiedOn } = portal\n const [isAclEditorOpen, setIsAclEditorOpen] = useState(false)\n const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false)\n const showAclEditor = id && id !== SYNAPSE_PORTAL_ID\n const showDeleteButton = id && id !== SYNAPSE_PORTAL_ID\n\n const { mutate: deletePortal } = useDeletePortal({\n onSuccess: () => {\n displayToast(`Portal \"${name}\" was successfully deleted`, 'success')\n setIsDeleteDialogOpen(false)\n },\n onError: error => {\n displayToast(`Failed to delete portal: ${error.reason}`, 'danger')\n },\n })\n\n return (\n <>\n <Card className={styles.portalCard}>\n <CardContent>\n <Box className={styles.header}>\n <Box className={styles.titleRow}>\n <Typography variant=\"h6\" component=\"h3\">\n {name}\n </Typography>\n <Box className={styles.actions}>\n {showAclEditor && (\n <IconButton\n size=\"small\"\n onClick={() => setIsAclEditorOpen(true)}\n aria-label=\"Manage portal permissions\"\n title=\"Manage portal permissions\"\n >\n <Settings fontSize=\"small\" />\n </IconButton>\n )}\n {showDeleteButton && (\n <IconButton\n size=\"small\"\n onClick={() => setIsDeleteDialogOpen(true)}\n aria-label=\"Delete portal\"\n title=\"Delete portal\"\n color=\"error\"\n >\n <Delete fontSize=\"small\" />\n </IconButton>\n )}\n </Box>\n </Box>\n {url && (\n <MuiLink\n href={url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={styles.url}\n >\n {url}\n </MuiLink>\n )}\n </Box>\n\n <Box className={styles.metadata}>\n {id && (\n <Typography variant=\"body2\" color=\"text.secondary\">\n <strong>ID:</strong> {id}\n </Typography>\n )}\n\n {createdBy && (\n <Box className={styles.userInfo}>\n <Typography variant=\"body2\" color=\"text.secondary\">\n <strong>Created by:</strong>\n </Typography>\n <UserCard\n ownerId={createdBy}\n size=\"SMALL USER CARD\"\n hideEmail\n disableLink={false}\n />\n {createdOn && (\n <Typography variant=\"caption\" color=\"text.secondary\">\n on {dayjs(createdOn).format('MMMM D, YYYY')}\n </Typography>\n )}\n </Box>\n )}\n\n {modifiedBy && (\n <Box className={styles.userInfo}>\n <Typography variant=\"body2\" color=\"text.secondary\">\n <strong>Last modified by:</strong>\n </Typography>\n <UserCard\n ownerId={modifiedBy}\n size=\"SMALL USER CARD\"\n hideEmail\n disableLink={false}\n />\n {modifiedOn && (\n <Typography variant=\"caption\" color=\"text.secondary\">\n on {dayjs(modifiedOn).format('MMMM D, YYYY')}\n </Typography>\n )}\n </Box>\n )}\n </Box>\n </CardContent>\n </Card>\n\n {showAclEditor && id && (\n <PortalAclEditorModal\n portalId={id}\n open={isAclEditorOpen}\n onClose={() => setIsAclEditorOpen(false)}\n />\n )}\n\n {id && (\n <ConfirmationDialog\n open={isDeleteDialogOpen}\n title=\"Delete Portal\"\n content={\n <Box>\n <Typography variant=\"body1\" sx={{ mb: 2 }}>\n Are you sure you want to delete this portal?\n </Typography>\n <Typography variant=\"body2\" sx={{ mb: 1 }}>\n <strong>Name:</strong> {name}\n </Typography>\n {url && (\n <Typography variant=\"body2\">\n <strong>URL:</strong> {url}\n </Typography>\n )}\n </Box>\n }\n confirmButtonProps={{\n children: 'Delete',\n color: 'error',\n variant: 'contained',\n }}\n onConfirm={() => {\n if (id) {\n deletePortal(id)\n }\n }}\n onCancel={() => setIsDeleteDialogOpen(false)}\n maxWidth=\"sm\"\n />\n )}\n </>\n )\n}\n\nexport default PortalCard\n"],"mappings":";;;;;;;;;;;;;AAoBA,IAAM,IAAoB;AAM1B,SAAgB,EAAW,EAAE,aAA4C;CACvE,IAAM,EAAE,OAAI,SAAM,QAAK,cAAW,cAAW,eAAY,kBAAe,GAClE,CAAC,GAAiB,KAAsB,EAAS,~~GAAM~~,~~EACvD~~,CAAC,GAAoB,KAAyB,EAAS,~~GAAM~~,~~EAC7D~~,IAAgB,KAAM,MAAO,GAC7B,IAAmB,KAAM,MAAO,GAEhC,EAAE,QAAQ,MAAiB,EAAgB;EAC/C,iBAAiB;~~AAEf~~,~~GADA~~,EAAa,WAAW,EAAK,6BAA6B,~~UAAU~~,~~EACpE~~,EAAsB,~~GAAM;;EAE9B~~,UAAS,MAAS;~~AAChB~~,~~KAAa~~,4BAA4B,EAAM,UAAU,~~SAAS;;EAErE~~,CAAC;~~AAEF~~,~~QACE~~,kBAAA,GAAA,EAAA,UAAA;EACE,kBAAC,GAAD;GAAM,WAAW,EAAO;aACtB,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;IAAK,WAAW,EAAO;cAAvB,CACE,kBAAC,GAAD;KAAK,WAAW,EAAO;eAAvB,CACE,kBAAC,GAAD;MAAY,SAAQ;MAAK,WAAU;gBAChC;~~MACU~~,CAAA,~~EACb~~,kBAAC,GAAD;MAAK,WAAW,EAAO;gBAAvB,CACG,KACC,kBAAC,GAAD;OACE,MAAK;OACL,eAAe,EAAmB,~~GAAK~~;~~OACvC~~,cAAW;OACX,OAAM;iBAEN,kBAAC,GAAD,EAAU,UAAS,~~SAAU~~,CAAA;~~OAClB~~,CAAA,~~EAEd~~,KACC,kBAAC,GAAD;OACE,MAAK;OACL,eAAe,EAAsB,~~GAAK~~;~~OAC1C~~,cAAW;OACX,OAAM;OACN,OAAM;iBAEN,kBAAC,GAAD,EAAQ,UAAS,~~SAAU~~,CAAA;~~OAChB~~,CAAA,CAEX;~~QACF~~;~~QACL~~,KACC,kBAAC,GAAD;KACE,MAAM;KACN,QAAO;KACP,KAAI;KACJ,WAAW,EAAO;eAEjB;~~KACO~~,CAAA,CAER;~~OAEN~~,kBAAC,GAAD;IAAK,WAAW,EAAO;cAAvB;KACG,KACC,kBAAC,GAAD;MAAY,SAAQ;MAAQ,OAAM;gBAAlC;OACE,kBAAC,UAAD,EAAA,UAAQ,~~OAAY~~,CAAA;;OAAE;~~OACX~~;;~~KAGd~~,KACC,kBAAC,GAAD;MAAK,WAAW,EAAO;gBAAvB;OACE,kBAAC,GAAD;QAAY,SAAQ;QAAQ,OAAM;kBAChC,kBAAC,UAAD,EAAA,UAAQ,~~eAAoB~~,CAAA;~~QACjB~~,CAAA;~~OACb~~,kBAAC,GAAD;QACE,SAAS;QACT,MAAK;QACL,WAAA;QACA,aAAa;~~QACb~~,CAAA;~~OACD~~,KACC,kBAAC,GAAD;QAAY,SAAQ;QAAU,OAAM;kBAApC,CAAqD,OAC/C,EAAM,~~EAAU~~,~~CAAC~~,OAAO,~~eAAe~~,CAChC;;~~OAEX~~;;~~KAGP~~,KACC,kBAAC,GAAD;MAAK,WAAW,EAAO;gBAAvB;OACE,kBAAC,GAAD;QAAY,SAAQ;QAAQ,OAAM;kBAChC,kBAAC,UAAD,EAAA,UAAQ,~~qBAA0B~~,CAAA;~~QACvB~~,CAAA;~~OACb~~,kBAAC,GAAD;QACE,SAAS;QACT,MAAK;QACL,WAAA;QACA,aAAa;~~QACb~~,CAAA;~~OACD~~,KACC,kBAAC,GAAD;QAAY,SAAQ;QAAU,OAAM;kBAApC,CAAqD,OAC/C,EAAM,~~EAAW~~,~~CAAC~~,OAAO,~~eAAe~~,CACjC;;~~OAEX~~;;~~KAEJ~~;~~MACM~~,EAAA,CAAA;~~GACT~~,CAAA;~~EAEN~~,KAAiB,KAChB,kBAAC,GAAD;GACE,UAAU;GACV,MAAM;GACN,eAAe,EAAmB,~~GAAM~~;~~GACxC~~,CAAA;~~EAGH~~,KACC,kBAAC,GAAD;GACE,MAAM;GACN,OAAM;GACN,SACE,kBAAC,GAAD,EAAA,UAAA;IACE,kBAAC,GAAD;KAAY,SAAQ;KAAQ,IAAI,EAAE,IAAI,~~GAAG~~;~~eAAE~~;~~KAE9B~~,CAAA;~~IACb~~,kBAAC,GAAD;KAAY,SAAQ;KAAQ,IAAI,EAAE,IAAI,~~GAAG~~;~~eAAzC~~;MACE,kBAAC,UAAD,EAAA,UAAQ,~~SAAc~~,CAAA;;MAAE;~~MACb~~;;~~IACZ~~,KACC,kBAAC,GAAD;KAAY,SAAQ;eAApB;MACE,kBAAC,UAAD,EAAA,UAAQ,~~QAAa~~,CAAA;;MAAE;~~MACZ~~;;~~IAEX~~,EAAA,CAAA;~~GAER~~,oBAAoB;IAClB,UAAU;IACV,OAAO;IACP,SAAS;~~IACV~~;~~GACD~~,iBAAiB;~~AACf~~,~~IAAI~~,KACF,EAAa,~~EAAG;;GAGpB~~,gBAAgB,EAAsB,~~GAAM~~;~~GAC5C~~,UAAS;~~GACT~~,CAAA;~~EAEH~~,EAAA,CAAA"}
1	+ {"version":3,"file":"PortalCard.js","names":[],"sources":["../../../src/components/PortalList/PortalCard.tsx"],"sourcesContent":["import { Portal } from '@sage-bionetworks/synapse-client'\nimport {\n Card,\n CardContent,\n Typography,\n Box,\n Link as MuiLink,\n IconButton,\n} from '@mui/material'\nimport styles from './PortalCard.module.scss'\nimport UserCard from '../UserCard/UserCard'\nimport dayjs from 'dayjs'\nimport { useState } from 'react'\nimport PortalAclEditorModal from '../PortalAclEditor/PortalAclEditorModal'\nimport { Settings, Delete } from '@mui/icons-material'\nimport { ConfirmationDialog } from '../ConfirmationDialog/ConfirmationDialog'\nimport { useDeletePortal } from '@/synapse-queries/portal/usePortal'\nimport { displayToast } from '../ToastMessage'\n\n// Synapse itself is portal ID 1 and should not have ACL management\nconst SYNAPSE_PORTAL_ID = '1'\n\nexport type PortalCardProps = {\n portal: Portal\n}\n\nexport function PortalCard({ portal }: PortalCardProps): React.ReactNode {\n const { id, name, url, createdBy, createdOn, modifiedBy, modifiedOn } = portal\n const [isAclEditorOpen, setIsAclEditorOpen] = useState(false)\n const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false)\n const showAclEditor = id && id !== SYNAPSE_PORTAL_ID\n const showDeleteButton = id && id !== SYNAPSE_PORTAL_ID\n\n const { mutate: deletePortal } = useDeletePortal({\n onSuccess: () => {\n displayToast(`Portal \"${name}\" was successfully deleted`, 'success')\n setIsDeleteDialogOpen(false)\n },\n onError: error => {\n displayToast(`Failed to delete portal: ${error.reason}`, 'danger')\n },\n })\n\n return (\n <>\n <Card className={styles.portalCard}>\n <CardContent>\n <Box className={styles.header}>\n <Box className={styles.titleRow}>\n <Typography variant=\"h6\" component=\"h3\">\n {name}\n </Typography>\n <Box className={styles.actions}>\n {showAclEditor && (\n <IconButton\n size=\"small\"\n onClick={() => setIsAclEditorOpen(true)}\n aria-label=\"Manage portal permissions\"\n title=\"Manage portal permissions\"\n >\n <Settings fontSize=\"small\" />\n </IconButton>\n )}\n {showDeleteButton && (\n <IconButton\n size=\"small\"\n onClick={() => setIsDeleteDialogOpen(true)}\n aria-label=\"Delete portal\"\n title=\"Delete portal\"\n color=\"error\"\n >\n <Delete fontSize=\"small\" />\n </IconButton>\n )}\n </Box>\n </Box>\n {url && (\n <MuiLink\n href={url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={styles.url}\n >\n {url}\n </MuiLink>\n )}\n </Box>\n\n <Box className={styles.metadata}>\n {id && (\n <Typography variant=\"body2\" color=\"text.secondary\">\n <strong>ID:</strong> {id}\n </Typography>\n )}\n\n {createdBy && (\n <Box className={styles.userInfo}>\n <Typography variant=\"body2\" color=\"text.secondary\">\n <strong>Created by:</strong>\n </Typography>\n <UserCard\n ownerId={createdBy}\n size=\"SMALL USER CARD\"\n hideEmail\n disableLink={false}\n />\n {createdOn && (\n <Typography variant=\"caption\" color=\"text.secondary\">\n on {dayjs(createdOn).format('MMMM D, YYYY')}\n </Typography>\n )}\n </Box>\n )}\n\n {modifiedBy && (\n <Box className={styles.userInfo}>\n <Typography variant=\"body2\" color=\"text.secondary\">\n <strong>Last modified by:</strong>\n </Typography>\n <UserCard\n ownerId={modifiedBy}\n size=\"SMALL USER CARD\"\n hideEmail\n disableLink={false}\n />\n {modifiedOn && (\n <Typography variant=\"caption\" color=\"text.secondary\">\n on {dayjs(modifiedOn).format('MMMM D, YYYY')}\n </Typography>\n )}\n </Box>\n )}\n </Box>\n </CardContent>\n </Card>\n\n {showAclEditor && id && (\n <PortalAclEditorModal\n portalId={id}\n open={isAclEditorOpen}\n onClose={() => setIsAclEditorOpen(false)}\n />\n )}\n\n {id && (\n <ConfirmationDialog\n open={isDeleteDialogOpen}\n title=\"Delete Portal\"\n content={\n <Box>\n <Typography variant=\"body1\" sx={{ mb: 2 }}>\n Are you sure you want to delete this portal?\n </Typography>\n <Typography variant=\"body2\" sx={{ mb: 1 }}>\n <strong>Name:</strong> {name}\n </Typography>\n {url && (\n <Typography variant=\"body2\">\n <strong>URL:</strong> {url}\n </Typography>\n )}\n </Box>\n }\n confirmButtonProps={{\n children: 'Delete',\n color: 'error',\n variant: 'contained',\n }}\n onConfirm={() => {\n if (id) {\n deletePortal(id)\n }\n }}\n onCancel={() => setIsDeleteDialogOpen(false)}\n maxWidth=\"sm\"\n />\n )}\n </>\n )\n}\n\nexport default PortalCard\n"],"mappings":"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"}

package/dist/components/PortalList/PortalList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalList.js","names":[],"sources":["../../../src/components/PortalList/PortalList.tsx"],"sourcesContent":["import { useListPortalsInfinite } from '@/synapse-queries/portal/useListPortals'\nimport { Box, Typography, CircularProgress, Alert, Button } from '@mui/material'\nimport { Fragment, useEffect, useState } from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport PortalCard from './PortalCard'\nimport CreatePortalModal from './CreatePortalModal'\nimport styles from './PortalList.module.scss'\nimport { Add } from '@mui/icons-material'\n\nexport function PortalList(): React.ReactNode {\n const { ref, inView } = useInView()\n const [isCreateModalOpen, setIsCreateModalOpen] = useState(false)\n\n const {\n data,\n status,\n error,\n isLoading,\n hasNextPage,\n isFetchingNextPage,\n fetchNextPage,\n } = useListPortalsInfinite({\n throwOnError: false,\n })\n\n useEffect(() => {\n if (\n status === 'success' &&\n !isFetchingNextPage &&\n hasNextPage &&\n fetchNextPage &&\n inView\n ) {\n fetchNextPage()\n }\n }, [status, hasNextPage, isFetchingNextPage, fetchNextPage, inView])\n\n const allPortals = data?.pages.flatMap(page => page.page ?? []) ?? []\n\n if (error) {\n return (\n <Alert severity=\"error\" className={styles.errorAlert}>\n Error loading portals: {error.message}\n </Alert>\n )\n }\n\n return (\n <Box className={styles.portalListContainer}>\n <Box className={styles.header}>\n <Typography variant=\"h4\" component=\"h2\" className={styles.title}>\n Portals\n </Typography>\n <Button\n variant=\"contained\"\n color=\"primary\"\n startIcon={<Add />}\n onClick={() => setIsCreateModalOpen(true)}\n >\n Create New Portal\n </Button>\n </Box>\n\n {isLoading && (\n <Box className={styles.loadingContainer}>\n <CircularProgress />\n </Box>\n )}\n\n {!isLoading && allPortals.length === 0 && (\n <Typography variant=\"body1\" color=\"text.secondary\">\n No portals found.\n </Typography>\n )}\n\n {allPortals.length > 0 && (\n <Box className={styles.portalGrid}>\n {allPortals.map(portal => (\n <Fragment key={portal.id ?? JSON.stringify(portal)}>\n <PortalCard portal={portal} />\n </Fragment>\n ))}\n </Box>\n )}\n\n {/* Trigger for loading next page */}\n {hasNextPage && <div ref={ref} className={styles.loadMoreTrigger} />}\n\n {isFetchingNextPage && (\n <Box className={styles.loadingMoreContainer}>\n <CircularProgress size={32} />\n </Box>\n )}\n\n <CreatePortalModal\n open={isCreateModalOpen}\n onClose={() => setIsCreateModalOpen(false)}\n />\n </Box>\n )\n}\n\nexport default PortalList\n"],"mappings":";;;;;;;;;;AASA,SAAgB,IAA8B;CAC5C,IAAM,EAAE,QAAK,cAAW,~~GAAW~~,~~EAC7B~~,CAAC,GAAmB,KAAwB,EAAS,~~GAAM~~,~~EAE3D~~,EACJ,SACA,WACA,UACA,cACA,gBACA,uBACA,qBACE,EAAuB,EACzB,cAAc,~~IACf~~,CAAC;~~AAEF~~,~~SAAgB~~;~~AACd~~,~~EACE~~,MAAW,aACX,CAAC,KACD,KACA,KACA,KAEA,~~GAAe~~;~~IAEhB~~;EAAC;EAAQ;EAAa;EAAoB;EAAe;~~EAAO~~,CAAC;~~CAEpE~~,IAAM,IAAa,GAAM,MAAM,SAAQ,MAAQ,EAAK,QAAQ,~~EAAE~~,CAAC,~~IAAI~~,~~EAAE~~;~~AAUrE~~,~~QARI~~,IAEA,kBAAC,GAAD;EAAO,UAAS;EAAQ,WAAW,EAAO;YAA1C,CAAsD,2BAC5B,EAAM,~~QACxB~~;~~MAKV~~,kBAAC,GAAD;EAAK,WAAW,EAAO;YAAvB;GACE,kBAAC,GAAD;IAAK,WAAW,EAAO;cAAvB,CACE,kBAAC,GAAD;KAAY,SAAQ;KAAK,WAAU;KAAK,WAAW,EAAO;eAAO;~~KAEpD~~,CAAA,~~EACb~~,kBAAC,GAAD;KACE,SAAQ;KACR,OAAM;KACN,WAAW,kBAAC,GAAD,~~EAAO~~,CAAA;~~KAClB~~,eAAe,EAAqB,~~GAAK~~;~~eAC1C~~;~~KAEQ~~,CAAA,CACL;;~~GAEL~~,KACC,kBAAC,GAAD;IAAK,WAAW,EAAO;cACrB,kBAAC,GAAD,~~EAAoB~~,CAAA;~~IAChB~~,CAAA;~~GAGP~~,CAAC,KAAa,EAAW,WAAW,KACnC,kBAAC,GAAD;IAAY,SAAQ;IAAQ,OAAM;cAAiB;~~IAEtC~~,CAAA;~~GAGd~~,EAAW,SAAS,KACnB,kBAAC,GAAD;IAAK,WAAW,EAAO;cACpB,EAAW,KAAI,MACd,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAoB,~~WAAU~~,CAAA,EACrB,~~EAFI~~,EAAO,MAAM,KAAK,UAAU,~~EAAO~~,CAEvC,CACX;~~IACE~~,CAAA;~~GAIP~~,KAAe,kBAAC,OAAD;IAAU;IAAK,WAAW,EAAO;~~IAAmB~~,CAAA;~~GAEnE~~,KACC,kBAAC,GAAD;IAAK,WAAW,EAAO;cACrB,kBAAC,GAAD,EAAkB,MAAM,~~IAAM~~,CAAA;~~IAC1B~~,CAAA;~~GAGR~~,kBAAC,GAAD;IACE,MAAM;IACN,eAAe,EAAqB,~~GAAM~~;~~IAC1C~~,CAAA;~~GACE~~"}
1	+ {"version":3,"file":"PortalList.js","names":[],"sources":["../../../src/components/PortalList/PortalList.tsx"],"sourcesContent":["import { useListPortalsInfinite } from '@/synapse-queries/portal/useListPortals'\nimport { Box, Typography, CircularProgress, Alert, Button } from '@mui/material'\nimport { Fragment, useEffect, useState } from 'react'\nimport { useInView } from 'react-intersection-observer'\nimport PortalCard from './PortalCard'\nimport CreatePortalModal from './CreatePortalModal'\nimport styles from './PortalList.module.scss'\nimport { Add } from '@mui/icons-material'\n\nexport function PortalList(): React.ReactNode {\n const { ref, inView } = useInView()\n const [isCreateModalOpen, setIsCreateModalOpen] = useState(false)\n\n const {\n data,\n status,\n error,\n isLoading,\n hasNextPage,\n isFetchingNextPage,\n fetchNextPage,\n } = useListPortalsInfinite({\n throwOnError: false,\n })\n\n useEffect(() => {\n if (\n status === 'success' &&\n !isFetchingNextPage &&\n hasNextPage &&\n fetchNextPage &&\n inView\n ) {\n fetchNextPage()\n }\n }, [status, hasNextPage, isFetchingNextPage, fetchNextPage, inView])\n\n const allPortals = data?.pages.flatMap(page => page.page ?? []) ?? []\n\n if (error) {\n return (\n <Alert severity=\"error\" className={styles.errorAlert}>\n Error loading portals: {error.message}\n </Alert>\n )\n }\n\n return (\n <Box className={styles.portalListContainer}>\n <Box className={styles.header}>\n <Typography variant=\"h4\" component=\"h2\" className={styles.title}>\n Portals\n </Typography>\n <Button\n variant=\"contained\"\n color=\"primary\"\n startIcon={<Add />}\n onClick={() => setIsCreateModalOpen(true)}\n >\n Create New Portal\n </Button>\n </Box>\n\n {isLoading && (\n <Box className={styles.loadingContainer}>\n <CircularProgress />\n </Box>\n )}\n\n {!isLoading && allPortals.length === 0 && (\n <Typography variant=\"body1\" color=\"text.secondary\">\n No portals found.\n </Typography>\n )}\n\n {allPortals.length > 0 && (\n <Box className={styles.portalGrid}>\n {allPortals.map(portal => (\n <Fragment key={portal.id ?? JSON.stringify(portal)}>\n <PortalCard portal={portal} />\n </Fragment>\n ))}\n </Box>\n )}\n\n {/* Trigger for loading next page */}\n {hasNextPage && <div ref={ref} className={styles.loadMoreTrigger} />}\n\n {isFetchingNextPage && (\n <Box className={styles.loadingMoreContainer}>\n <CircularProgress size={32} />\n </Box>\n )}\n\n <CreatePortalModal\n open={isCreateModalOpen}\n onClose={() => setIsCreateModalOpen(false)}\n />\n </Box>\n )\n}\n\nexport default PortalList\n"],"mappings":";;;;;;;;;;AASA,SAAgB,IAA8B;CAC5C,IAAM,EAAE,QAAK,cAAW,EAAU,GAC5B,CAAC,GAAmB,KAAwB,EAAS,EAAK,GAE1D,EACJ,SACA,WACA,UACA,cACA,gBACA,uBACA,qBACE,EAAuB,EACzB,cAAc,GAChB,CAAC;CAED,QAAgB;EACd,AACE,MAAW,aACX,CAAC,KACD,KACA,KACA,KAEA,EAAc;CAElB,GAAG;EAAC;EAAQ;EAAa;EAAoB;EAAe;CAAM,CAAC;CAEnE,IAAM,IAAa,GAAM,MAAM,SAAQ,MAAQ,EAAK,QAAQ,CAAC,CAAC,KAAK,CAAC;CAUpE,OARI,IAEA,kBAAC,GAAD;EAAO,UAAS;EAAQ,WAAW,EAAO;YAA1C,CAAsD,2BAC5B,EAAM,OACzB;MAKT,kBAAC,GAAD;EAAK,WAAW,EAAO;YAAvB;GACE,kBAAC,GAAD;IAAK,WAAW,EAAO;cAAvB,CACE,kBAAC,GAAD;KAAY,SAAQ;KAAK,WAAU;KAAK,WAAW,EAAO;eAAO;IAErD,CAAA,GACZ,kBAAC,GAAD;KACE,SAAQ;KACR,OAAM;KACN,WAAW,kBAAC,GAAD,CAAM,CAAA;KACjB,eAAe,EAAqB,EAAI;eACzC;IAEO,CAAA,CACL;;GAEJ,KACC,kBAAC,GAAD;IAAK,WAAW,EAAO;cACrB,kBAAC,GAAD,CAAmB,CAAA;GAChB,CAAA;GAGN,CAAC,KAAa,EAAW,WAAW,KACnC,kBAAC,GAAD;IAAY,SAAQ;IAAQ,OAAM;cAAiB;GAEvC,CAAA;GAGb,EAAW,SAAS,KACnB,kBAAC,GAAD;IAAK,WAAW,EAAO;cACpB,EAAW,KAAI,MACd,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAoB,UAAS,CAAA,EACrB,GAFK,EAAO,MAAM,KAAK,UAAU,CAAM,CAEvC,CACX;GACE,CAAA;GAIN,KAAe,kBAAC,OAAD;IAAU;IAAK,WAAW,EAAO;GAAkB,CAAA;GAElE,KACC,kBAAC,GAAD;IAAK,WAAW,EAAO;cACrB,kBAAC,GAAD,EAAkB,MAAM,GAAK,CAAA;GAC1B,CAAA;GAGP,kBAAC,GAAD;IACE,MAAM;IACN,eAAe,EAAqB,EAAK;GAC1C,CAAA;EACE;;AAET"}

package/dist/components/PortalSectionHeader/PortalSectionHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PortalSectionHeader.js","names":[],"sources":["../../../src/components/PortalSectionHeader/PortalSectionHeader.tsx"],"sourcesContent":["import React from 'react'\nimport { spreadSx } from '@/theme/spreadSx'\nimport { isExternalLink } from '@/utils/functions/IsExternalLink'\nimport {\n Box,\n Button,\n Link as MuiLink,\n Stack,\n SxProps,\n Theme,\n Typography,\n} from '@mui/material'\nimport { Link as RouterLink } from 'react-router'\n\nexport type PortalSectionHeaderProps = {\n title: string\n buttonText?: string\n summaryText?: React.ReactNode\n link?: string\n sx?: SxProps<Theme>\n centered?: boolean\n reverseButtonAndText?: boolean\n}\n\nconst PortalSectionHeader = ({\n title,\n buttonText,\n summaryText,\n link,\n sx,\n centered = false,\n reverseButtonAndText = false,\n}: PortalSectionHeaderProps): React.ReactNode => {\n const isExternal = isExternalLink(link ?? '')\n\n return (\n <Box\n sx={spreadSx(sx, {\n ...(centered && {\n width: '100%',\n }),\n })}\n >\n <Stack\n sx={{\n gap: '16px',\n ...(centered && {\n textAlign: 'center',\n alignItems: 'center',\n }),\n }}\n >\n <Typography\n variant=\"headline2\"\n sx={theme => ({\n paddingTop: '30px',\n color: 'grey.1000',\n fontSize: { xs: '24px', md: '32px' },\n borderTop: '4px solid',\n borderColor: 'grey.400',\n [theme.breakpoints.down('md')]: {\n width: '100%',\n },\n })}\n >\n {title}\n </Typography>\n {(buttonText \|\| summaryText) && (\n <Stack\n sx={{\n gap: '16px',\n width: '100%',\n ...(centered && {\n alignItems: 'center',\n width: '100%',\n }),\n ...(reverseButtonAndText && {\n flexDirection: 'column-reverse',\n }),\n }}\n >\n {buttonText && (\n <Button\n variant=\"contained\"\n component={isExternal ? MuiLink : RouterLink}\n {...(isExternal\n ? {\n href: link,\n target: '_blank',\n rel: 'noopener noreferrer',\n }\n : { to: link })}\n sx={theme => ({\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n },\n maxWidth: '100%',\n width: 'fit-content',\n whiteSpace: 'nowrap',\n padding: { xs: '6px', sm: '6px 24px' },\n fontWeight: '600',\n fontSize: { xs: '16px', sm: '18px' },\n lineHeight: '144%',\n })}\n >\n {buttonText}\n </Button>\n )}\n {summaryText && (\n <Typography\n variant=\"body1\"\n sx={{\n fontStyle: 'italic',\n color: 'grey.800',\n fontSize: '18px',\n lineHeight: '27px',\n }}\n >\n {summaryText}\n </Typography>\n )}\n </Stack>\n )}\n </Stack>\n </Box>\n )\n}\n\nexport default PortalSectionHeader\n"],"mappings":";;;;;;;AAwBA,IAAM,KAAuB,EAC3B,UACA,eACA,gBACA,SACA,OACA,cAAW,IACX,0BAAuB,SACwB;CAC/C,IAAM,IAAa,EAAe,KAAQ,~~GAAG~~;~~AAE7C~~,~~QACE~~,kBAAC,GAAD;EACE,IAAI,EAAS,GAAI,EACf,GAAI,KAAY,EACd,OAAO,~~QACR~~,EACF,CAAC;~~YAEF~~,kBAAC,GAAD;GACE,IAAI;IACF,KAAK;IACL,GAAI,KAAY;KACd,WAAW;KACX,YAAY;~~KACb~~;~~IACF~~;~~aAPH~~,CASE,kBAAC,GAAD;IACE,SAAQ;IACR,KAAI,OAAU;KACZ,YAAY;KACZ,OAAO;KACP,UAAU;MAAE,IAAI;MAAQ,IAAI;~~MAAQ~~;~~KACpC~~,WAAW;KACX,aAAa;MACZ,EAAM,YAAY,KAAK,~~KAAK~~,~~GAAG~~,EAC9B,OAAO,~~QACR~~;~~KACF~~;~~cAEA~~;~~IACU~~,CAAA,~~GACX~~,KAAc,MACd,kBAAC,GAAD;IACE,IAAI;KACF,KAAK;KACL,OAAO;KACP,GAAI,KAAY;MACd,YAAY;MACZ,OAAO;~~MACR~~;~~KACD~~,GAAI,KAAwB,EAC1B,eAAe,~~kBAChB~~;~~KACF~~;~~cAXH~~,CAaG,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,IAAa,IAAU;KAClC,GAAK,IACD;MACE,MAAM;MACN,QAAQ;MACR,KAAK;~~MACN~~,~~GACD~~,EAAE,IAAI,~~GAAM~~;~~KAChB~~,KAAI,OAAU;OACX,EAAM,YAAY,KAAK,~~KAAK~~,~~GAAG~~,EAC9B,OAAO,~~QACR~~;~~MACD~~,UAAU;MACV,OAAO;MACP,YAAY;MACZ,SAAS;OAAE,IAAI;OAAO,IAAI;~~OAAY~~;~~MACtC~~,YAAY;MACZ,UAAU;OAAE,IAAI;OAAQ,IAAI;~~OAAQ~~;~~MACpC~~,YAAY;~~MACb~~;~~eAEA~~;~~KACM~~,CAAA,~~EAEV~~,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,WAAW;MACX,OAAO;MACP,UAAU;MACV,YAAY;~~MACb~~;~~eAEA~~;~~KACU~~,CAAA,CAET;~~MAEJ~~;;~~EACJ~~,CAAA"}
1	+ {"version":3,"file":"PortalSectionHeader.js","names":[],"sources":["../../../src/components/PortalSectionHeader/PortalSectionHeader.tsx"],"sourcesContent":["import React from 'react'\nimport { spreadSx } from '@/theme/spreadSx'\nimport { isExternalLink } from '@/utils/functions/IsExternalLink'\nimport {\n Box,\n Button,\n Link as MuiLink,\n Stack,\n SxProps,\n Theme,\n Typography,\n} from '@mui/material'\nimport { Link as RouterLink } from 'react-router'\n\nexport type PortalSectionHeaderProps = {\n title: string\n buttonText?: string\n summaryText?: React.ReactNode\n link?: string\n sx?: SxProps<Theme>\n centered?: boolean\n reverseButtonAndText?: boolean\n}\n\nconst PortalSectionHeader = ({\n title,\n buttonText,\n summaryText,\n link,\n sx,\n centered = false,\n reverseButtonAndText = false,\n}: PortalSectionHeaderProps): React.ReactNode => {\n const isExternal = isExternalLink(link ?? '')\n\n return (\n <Box\n sx={spreadSx(sx, {\n ...(centered && {\n width: '100%',\n }),\n })}\n >\n <Stack\n sx={{\n gap: '16px',\n ...(centered && {\n textAlign: 'center',\n alignItems: 'center',\n }),\n }}\n >\n <Typography\n variant=\"headline2\"\n sx={theme => ({\n paddingTop: '30px',\n color: 'grey.1000',\n fontSize: { xs: '24px', md: '32px' },\n borderTop: '4px solid',\n borderColor: 'grey.400',\n [theme.breakpoints.down('md')]: {\n width: '100%',\n },\n })}\n >\n {title}\n </Typography>\n {(buttonText \|\| summaryText) && (\n <Stack\n sx={{\n gap: '16px',\n width: '100%',\n ...(centered && {\n alignItems: 'center',\n width: '100%',\n }),\n ...(reverseButtonAndText && {\n flexDirection: 'column-reverse',\n }),\n }}\n >\n {buttonText && (\n <Button\n variant=\"contained\"\n component={isExternal ? MuiLink : RouterLink}\n {...(isExternal\n ? {\n href: link,\n target: '_blank',\n rel: 'noopener noreferrer',\n }\n : { to: link })}\n sx={theme => ({\n [theme.breakpoints.down('sm')]: {\n width: '100%',\n },\n maxWidth: '100%',\n width: 'fit-content',\n whiteSpace: 'nowrap',\n padding: { xs: '6px', sm: '6px 24px' },\n fontWeight: '600',\n fontSize: { xs: '16px', sm: '18px' },\n lineHeight: '144%',\n })}\n >\n {buttonText}\n </Button>\n )}\n {summaryText && (\n <Typography\n variant=\"body1\"\n sx={{\n fontStyle: 'italic',\n color: 'grey.800',\n fontSize: '18px',\n lineHeight: '27px',\n }}\n >\n {summaryText}\n </Typography>\n )}\n </Stack>\n )}\n </Stack>\n </Box>\n )\n}\n\nexport default PortalSectionHeader\n"],"mappings":";;;;;;;AAwBA,IAAM,KAAuB,EAC3B,UACA,eACA,gBACA,SACA,OACA,cAAW,IACX,0BAAuB,SACwB;CAC/C,IAAM,IAAa,EAAe,KAAQ,EAAE;CAE5C,OACE,kBAAC,GAAD;EACE,IAAI,EAAS,GAAI,EACf,GAAI,KAAY,EACd,OAAO,OACT,EACF,CAAC;YAED,kBAAC,GAAD;GACE,IAAI;IACF,KAAK;IACL,GAAI,KAAY;KACd,WAAW;KACX,YAAY;IACd;GACF;aAPF,CASE,kBAAC,GAAD;IACE,SAAQ;IACR,KAAI,OAAU;KACZ,YAAY;KACZ,OAAO;KACP,UAAU;MAAE,IAAI;MAAQ,IAAI;KAAO;KACnC,WAAW;KACX,aAAa;MACZ,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,OAAO,OACT;IACF;cAEC;GACS,CAAA,IACV,KAAc,MACd,kBAAC,GAAD;IACE,IAAI;KACF,KAAK;KACL,OAAO;KACP,GAAI,KAAY;MACd,YAAY;MACZ,OAAO;KACT;KACA,GAAI,KAAwB,EAC1B,eAAe,iBACjB;IACF;cAXF,CAaG,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,WAAW,IAAa,IAAU;KAClC,GAAK,IACD;MACE,MAAM;MACN,QAAQ;MACR,KAAK;KACP,IACA,EAAE,IAAI,EAAK;KACf,KAAI,OAAU;OACX,EAAM,YAAY,KAAK,IAAI,IAAI,EAC9B,OAAO,OACT;MACA,UAAU;MACV,OAAO;MACP,YAAY;MACZ,SAAS;OAAE,IAAI;OAAO,IAAI;MAAW;MACrC,YAAY;MACZ,UAAU;OAAE,IAAI;OAAQ,IAAI;MAAO;MACnC,YAAY;KACd;eAEC;IACK,CAAA,GAET,KACC,kBAAC,GAAD;KACE,SAAQ;KACR,IAAI;MACF,WAAW;MACX,OAAO;MACP,UAAU;MACV,YAAY;KACd;eAEC;IACS,CAAA,CAET;KAEJ;;CACJ,CAAA;AAET"}

package/dist/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.js CHANGED Viewed

@@ -5,10 +5,10 @@ import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/ProgrammaticInstructionsModal/ProgrammaticInstructionsModal.tsx
 var u = /* @__PURE__ */ function(e) {
 	return e.COMMAND_LINE = "Command Line", e.R = "R", e.PYTHON = "Python", e;
-}({}), d = ({ show: d, title: f, onClose: p, pythonNotes: m, pythonCode: h, rNotes: g, rCode: _, cliNotes: v, cliCode: y, helpMarkdown: b, helpUrl: x }) => {
-	let S;
-	S = y ? u.COMMAND_LINE : h ? u.PYTHON : u.R;
-	let [C, w] = t(S), T = /* @__PURE__ */ l(o, {
+}({}), d = ({ show: u, title: d, onClose: f, pythonNotes: p, pythonCode: m, rNotes: h, rCode: g, cliNotes: _, cliCode: v, helpMarkdown: y, helpUrl: b }) => {
+	let x;
+	x = v ? "Command Line" : m ? "Python" : "R";
+	let [S, C] = t(x), w = /* @__PURE__ */ l(o, {
 		variant: "body1",
 		children: [
 			"Installation instructions are available at our",
@@ -21,74 +21,74 @@ var u = /* @__PURE__ */ function(e) {
 			}),
 			"."
 		]
-	}), E = /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n, {
-		sx: {
-			borderBottom: 1,
-			borderColor: "divider",
-			marginBottom: 4
-		},
-		children: /* @__PURE__ */ l(a, {
-			value: C,
-			onChange: (e, t) => {
-				e.stopPropagation(), w(t);
-			},
-			textColor: "secondary",
-			indicatorColor: "secondary",
-			children: [
-				y && /* @__PURE__ */ c(i, {
-					value: u.COMMAND_LINE,
-					label: u.COMMAND_LINE
-				}),
-				_ && /* @__PURE__ */ c(i, {
-					value: u.R,
-					label: u.R
-				}),
-				h && /* @__PURE__ */ c(i, {
-					value: u.PYTHON,
-					label: u.PYTHON
-				})
-			]
-		})
-	}), /* @__PURE__ */ l(n, {
-		sx: { "& > p": { marginBottom: 3 } },
-		children: [
-			C === u.COMMAND_LINE && /* @__PURE__ */ l(s, { children: [
-				/* @__PURE__ */ c(o, {
-					variant: "body1",
-					children: v
-				}),
-				T,
-				/* @__PURE__ */ c("pre", { children: y })
-			] }),
-			C === u.R && /* @__PURE__ */ l(s, { children: [
-				/* @__PURE__ */ c(o, {
-					variant: "body1",
-					children: g
-				}),
-				T,
-				/* @__PURE__ */ c("pre", { children: _ })
-			] }),
-			C === u.PYTHON && /* @__PURE__ */ l(s, { children: [
-				/* @__PURE__ */ c(o, {
-					variant: "body1",
-					children: m
-				}),
-				T,
-				/* @__PURE__ */ c("pre", { children: h })
-			] })
-		]
-	})] });
+	});
 	return /* @__PURE__ */ c(e, {
-		open: d,
-		title: f,
-		onCancel: p,
-		onConfirm: p,
+		open: u,
+		title: d,
+		onCancel: f,
+		onConfirm: f,
 		maxWidth: "md",
-		titleHelpPopoverProps: b ? {
-			markdownText: b,
-			helpUrl: x
+		titleHelpPopoverProps: y ? {
+			markdownText: y,
+			helpUrl: b
 		} : void 0,
-		content: E,
+		content: /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n, {
+			sx: {
+				borderBottom: 1,
+				borderColor: "divider",
+				marginBottom: 4
+			},
+			children: /* @__PURE__ */ l(a, {
+				value: S,
+				onChange: (e, t) => {
+					e.stopPropagation(), C(t);
+				},
+				textColor: "secondary",
+				indicatorColor: "secondary",
+				children: [
+					v && /* @__PURE__ */ c(i, {
+						value: "Command Line",
+						label: "Command Line"
+					}),
+					g && /* @__PURE__ */ c(i, {
+						value: "R",
+						label: "R"
+					}),
+					m && /* @__PURE__ */ c(i, {
+						value: "Python",
+						label: "Python"
+					})
+				]
+			})
+		}), /* @__PURE__ */ l(n, {
+			sx: { "& > p": { marginBottom: 3 } },
+			children: [
+				S === "Command Line" && /* @__PURE__ */ l(s, { children: [
+					/* @__PURE__ */ c(o, {
+						variant: "body1",
+						children: _
+					}),
+					w,
+					/* @__PURE__ */ c("pre", { children: v })
+				] }),
+				S === "R" && /* @__PURE__ */ l(s, { children: [
+					/* @__PURE__ */ c(o, {
+						variant: "body1",
+						children: h
+					}),
+					w,
+					/* @__PURE__ */ c("pre", { children: g })
+				] }),
+				S === "Python" && /* @__PURE__ */ l(s, { children: [
+					/* @__PURE__ */ c(o, {
+						variant: "body1",
+						children: p
+					}),
+					w,
+					/* @__PURE__ */ c("pre", { children: m })
+				] })
+			]
+		})] }),
 		hasCancelButton: !1
 	});
 };