urbit/shrub
1
1
Fork 0
mirror of https://github.com/urbit/shrub.git synced 2024-12-22 10:21:31 +03:00
Code Issues Packages Projects Releases Wiki Activity

permalinks: placeholder for unloaded nodes, author-content spacing

Browse Source
This commit is contained in:
James Acklin 2021-05-18 09:16:31 -04:00
parent e5514b1386
commit c7e9b82e68
2 changed files with 18 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
pkg/interface/src/views/apps/permalinks/TranscludedNode.tsx
View File

@ -57,7 +57,7 @@ function TranscludedLinkNode(props: {
/> />
<Box <Box
borderRadius='2' borderRadius='2'
mt='1' mt='3'
ml='44px' ml='44px'
mr='3' mr='3'
p='2' p='2'
@ -128,7 +128,7 @@ function TranscludedComment(props: {
date={comment.post?.['time-sent']} date={comment.post?.['time-sent']}
group={group} group={group}
/> />
<Box pl="44px" pt='1'> <Box pl="44px" pt='2'>
<GraphContent <GraphContent
api={api} api={api}
transcluded={transcluded} transcluded={transcluded}
@ -182,7 +182,7 @@ function TranscludedPublishNode(props: {
date={post.post?.['time-sent']} date={post.post?.['time-sent']}
group={group} group={group}
/> />
<Text pl='44px' fontSize="2" fontWeight="medium"> <Text mt='3' pl='44px' fontSize="2" fontWeight="medium">
{(post.post.contents[0] as TextContent)?.text} {(post.post.contents[0] as TextContent)?.text}
</Text> </Text>
<Box pl="44px" pr='3'> <Box pl="44px" pr='3'>
@ -242,7 +242,7 @@ export function TranscludedPost(props: {
date={post?.['time-sent']} date={post?.['time-sent']}
group={group} group={group}
/> />
<Box pl='44px' pt='2' pr='3'> <Box pl='44px' pt='3' pr='3'>
<MentionText <MentionText
api={api} api={api}
transcluded={transcluded} transcluded={transcluded}

14
pkg/interface/src/views/apps/permalinks/embed.tsx
View File

@ -13,6 +13,15 @@ import useMetadataState from "~/logic/state/metadata";
import { GroupLink } from "~/views/components/GroupLink"; import { GroupLink } from "~/views/components/GroupLink";
import { TranscludedNode } from "./TranscludedNode"; import { TranscludedNode } from "./TranscludedNode";
function Placeholder() {
return (
<Row margin='12px' marginBottom='0' height='4'>
<Box backgroundColor='washedGray' size='4' marginRight='2' borderRadius='2' />
<Box backgroundColor='washedGray' heigh='4' width='75%' borderRadius='2' />
</Row>
)
}
function GroupPermalink(props: { group: string; api: GlobalApi }) { function GroupPermalink(props: { group: string; api: GlobalApi }) {
const { group, api } = props; const { group, api } = props;
return ( return (
@ -47,6 +56,7 @@ function GraphPermalink(
]) ])
); );
const [errored, setErrored] = useState(false); const [errored, setErrored] = useState(false);
const [loading, setLoading] = useState(false);
const association = useMetadataState( const association = useMetadataState(
useCallback(s => s.associations.graph[graph] as Association | null, [ useCallback(s => s.associations.graph[graph] as Association | null, [
graph graph
@ -60,9 +70,12 @@ function GraphPermalink(
return; return;
} }
try { try {
setLoading(true);
await api.graph.getNode(ship, name, index); await api.graph.getNode(ship, name, index);
setLoading(false);
} catch (e) { } catch (e) {
console.log(e); console.log(e);
setLoading(false);
setErrored(true); setErrored(true);
} }
})(); })();
@ -108,6 +121,7 @@ function GraphPermalink(
navigate(e); navigate(e);
}} }}
> >
{loading && Placeholder()}
{showTransclusion && index && ( {showTransclusion && index && (
<TranscludedNode <TranscludedNode
api={api} api={api}