diff --git a/src/components/NetworkPanel/NetworkPanel.tsx b/src/components/NetworkPanel/NetworkPanel.tsx index f29e7629..215f6506 100644 --- a/src/components/NetworkPanel/NetworkPanel.tsx +++ b/src/components/NetworkPanel/NetworkPanel.tsx @@ -15,6 +15,7 @@ import { useRendererStore } from '../../store/RendererStore' interface NetworkPanelProps { networkId: IdType + failedToLoad?: boolean } /** @@ -23,7 +24,10 @@ interface NetworkPanelProps { * @param networkId - the ID of the network model to display * */ -const NetworkPanel = ({ networkId }: NetworkPanelProps): ReactElement => { +const NetworkPanel = ({ + networkId, + failedToLoad = false, +}: NetworkPanelProps): ReactElement => { const [isActive, setIsActive] = useState(false) const ui = useUiStateStore((state) => state.ui) @@ -62,6 +66,10 @@ const NetworkPanel = ({ networkId }: NetworkPanelProps): ReactElement => { (state) => state.viewModels, ) + if (failedToLoad) { + return + } + if (networks.size === 0) { return } diff --git a/src/components/Workspace/WorkspaceEditor.tsx b/src/components/Workspace/WorkspaceEditor.tsx index 25b5a90a..501f1deb 100644 --- a/src/components/Workspace/WorkspaceEditor.tsx +++ b/src/components/Workspace/WorkspaceEditor.tsx @@ -87,7 +87,8 @@ const WorkSpaceEditor = (): JSX.Element => { // Check if the component is initialized const isInitializedRef = useRef(false) - + // Indicates if a network failed to load + const [failedToLoad, setFailedToLoad] = useState(false) const showTableJoinForm = useJoinTableToNetworkStore((state) => state.setShow) const showCreateNetworkFromTableForm = useCreateNetworkFromTableStore( (state) => state.setShow, @@ -288,86 +289,91 @@ const WorkSpaceEditor = (): JSX.Element => { }, []) const loadCurrentNetworkById = async (networkId: IdType): Promise => { - const currentToken = await getToken() + try { + const currentToken = await getToken() - const summaryMap = await useNdexNetworkSummary( - [networkId], - ndexBaseUrl, - currentToken, - ) - const summary = summaryMap[networkId] - const res: NetworkWithView = await useNdexNetwork( - networkId, - ndexBaseUrl, - currentToken, - ) - const { - network, - nodeTable, - edgeTable, - visualStyle, - networkViews, - visualStyleOptions, - otherAspects, - } = res - - setVisualStyleOptions(networkId, visualStyleOptions) - addNewNetwork(network) - addVisualStyle(networkId, visualStyle) - addTable(networkId, nodeTable, edgeTable) - addViewModel(networkId, networkViews[0]) - if (otherAspects !== undefined) { - addAllOpaqueAspects(networkId, otherAspects) - } - - if (isHCX(summary)) { - const version = - summary.properties.find( - (p) => p.predicateString === HcxMetaTag.ndexSchema, - )?.value ?? '' - const validationRes = validateHcx(version as string, summary, nodeTable) - - if (!validationRes.isValid) { - addMessage({ - message: `This network is not a valid HCX network. Some features may not work properly.`, - duration: 8000, - }) + const summaryMap = await useNdexNetworkSummary( + [networkId], + ndexBaseUrl, + currentToken, + ) + const summary = summaryMap[networkId] + const res: NetworkWithView = await useNdexNetwork( + networkId, + ndexBaseUrl, + currentToken, + ) + const { + network, + nodeTable, + edgeTable, + visualStyle, + networkViews, + visualStyleOptions, + otherAspects, + } = res + + setVisualStyleOptions(networkId, visualStyleOptions) + addNewNetwork(network) + addVisualStyle(networkId, visualStyle) + addTable(networkId, nodeTable, edgeTable) + addViewModel(networkId, networkViews[0]) + if (otherAspects !== undefined) { + addAllOpaqueAspects(networkId, otherAspects) } - setValidationResult(networkId, validationRes) - } - if (!summary.hasLayout) { - const defaultLayout = getDefaultLayout( - summary, - network.nodes.length + network.edges.length, - maxNetworkElementsThreshold, - ) + if (isHCX(summary)) { + const version = + summary.properties.find( + (p) => p.predicateString === HcxMetaTag.ndexSchema, + )?.value ?? '' + const validationRes = validateHcx(version as string, summary, nodeTable) + + if (!validationRes.isValid) { + addMessage({ + message: `This network is not a valid HCX network. Some features may not work properly.`, + duration: 8000, + }) + } + setValidationResult(networkId, validationRes) + } - if (defaultLayout !== undefined) { - const engine: LayoutEngine | undefined = layoutEngines.find( - (engine) => engine.name === defaultLayout.engineName, + if (!summary.hasLayout) { + const defaultLayout = getDefaultLayout( + summary, + network.nodes.length + network.edges.length, + maxNetworkElementsThreshold, ) - if (engine !== undefined) { - const nextSummary = { ...summary, hasLayout: true } + if (defaultLayout !== undefined) { + const engine: LayoutEngine | undefined = layoutEngines.find( + (engine) => engine.name === defaultLayout.engineName, + ) - setIsRunning(true) - const afterLayout = ( - positionMap: Map, - ): void => { - updateNodePositions(networkId, positionMap) - updateSummary(networkId, nextSummary) - setIsRunning(false) - } + if (engine !== undefined) { + const nextSummary = { ...summary, hasLayout: true } - engine.apply( - network.nodes, - network.edges, - afterLayout, - engine.algorithms[defaultLayout.algorithmName], - ) + setIsRunning(true) + const afterLayout = ( + positionMap: Map, + ): void => { + updateNodePositions(networkId, positionMap) + updateSummary(networkId, nextSummary) + setIsRunning(false) + } + + engine.apply( + network.nodes, + network.edges, + afterLayout, + engine.algorithms[defaultLayout.algorithmName], + ) + } } } + } catch (e) { + console.error('Failed to load network:', e) + setFailedToLoad(true) } } @@ -485,7 +491,7 @@ const WorkSpaceEditor = (): JSX.Element => { } isLoadingRef.current = true - + setFailedToLoad(false) if (currentNetworkView === undefined) { loadCurrentNetworkById(currentNetworkId) .then(() => { @@ -616,7 +622,10 @@ const WorkSpaceEditor = (): JSX.Element => { - +