diff --git a/pkg/interface/src/views/apps/permalinks/TranscludedNode.tsx b/pkg/interface/src/views/apps/permalinks/TranscludedNode.tsx index ddfcaae8f..994803cd7 100644 --- a/pkg/interface/src/views/apps/permalinks/TranscludedNode.tsx +++ b/pkg/interface/src/views/apps/permalinks/TranscludedNode.tsx @@ -57,7 +57,7 @@ function TranscludedLinkNode(props: { /> - + - + {(post.post.contents[0] as TextContent)?.text} @@ -242,7 +242,7 @@ export function TranscludedPost(props: { date={post?.['time-sent']} group={group} /> - + { + switch (type) { + case 'publish': + return 5; + case 'post': + return 3; + default: + return 1; + } + } + return ( + <> + + + + + {_.times(lines(type), () => ( + + + + ))} + + ); +} + function GroupPermalink(props: { group: string; api: GlobalApi }) { const { group, api } = props; return ( @@ -47,6 +89,7 @@ function GraphPermalink( ]) ); const [errored, setErrored] = useState(false); + const [loading, setLoading] = useState(false); const association = useMetadataState( useCallback(s => s.associations.graph[graph] as Association | null, [ graph @@ -60,9 +103,12 @@ function GraphPermalink( return; } try { + setLoading(true); await api.graph.getNode(ship, name, index); + setLoading(false); } catch (e) { console.log(e); + setLoading(false); setErrored(true); } })(); @@ -108,7 +154,8 @@ function GraphPermalink( navigate(e); }} > - {showTransclusion && index && ( + {loading && association && Placeholder((association.metadata.config as GraphConfig).graph)} + {showTransclusion && index && !loading && ( )} - {association && !isInSameResource && ( + {association && !isInSameResource && !loading && ( )} - {association && isInSameResource && transcluded === 2 && ( + {association && isInSameResource && transcluded === 2 && !loading && ( )} - {isInSameResource && transcluded !== 2 && } - {!association && ( + {isInSameResource && transcluded !== 2 && } + {!association && !loading && (