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

interface: update transclusion for reference content

Browse Source
This commit is contained in:
Liam Fitzgerald 2021-03-19 08:51:29 +10:00
parent c186bad1c1
commit dd44377624
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB
11 changed files with 121 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pkg/arvo/lib/graph-store.hoon
View File

@ -202,8 +202,8 @@
++ graph
|= [grp=res gra=res idx=^index]
%- pairs
:~ graph+s+(enjs-path:res grp)
group+s+(enjs-path:res gra)
:~ graph+s+(enjs-path:res gra)
group+s+(enjs-path:res grp)
index+(index idx)
==
::

19
pkg/interface/src/logic/lib/permalinks.ts
View File

@ -57,6 +57,25 @@ function parseGraphPermalink(
};
}
export function referenceToPermalink({ reference }: ReferenceContent): Permalink {
if('graph' in reference) {
const { graph, group, index } = reference.graph;
const link = `web+urbit://group${group.slice(5)}/graph${graph.slice(5)}${index}`;
return {
type: 'graph',
link,
...reference.graph
};
} else {
const link = `web+urbit://group${reference.group.slice(5)}`;
return {
type: 'group',
link,
...reference
}
}
}
export function parsePermalink(url: string): Permalink | null {
const [kind, ...rest] = url.slice(12).split("/");
if (kind === "group") {

15
pkg/interface/src/logic/lib/tokenizeMessage.js
View File

@ -45,7 +45,20 @@ const tokenizeMessage = (text) => {
isInCodeBlock = false;
}
if (isUrl(str) && !isInCodeBlock) {
if(isRef(str) && !isInCodeBlock) {
if (message.length > 0) {
// If we're in the middle of a message, add it to the stack and reset
messages.push({ text: message.join(' ') });
}
const link = parsePermalink(str);
if(!link) {
messages.push({ url: str });
} else {
const reference = permalinkToReference(link);
messages.push({ reference });
}
message = [];
} else if (isUrl(str) && !isInCodeBlock) {
if (message.length > 0) {
// If we're in the middle of a message, add it to the stack and reset
messages.push({ text: message.join(' ') });

23
pkg/interface/src/views/apps/chat/components/ChatMessage.tsx
View File

@ -42,6 +42,7 @@ import useContactState from '~/logic/state/contact';
import { useIdlingState } from '~/logic/lib/idling';
import {useCopy} from '~/logic/lib/useCopy';
import {PermalinkEmbed} from '../../permalinks/embed';
import {referenceToPermalink} from '~/logic/lib/permalinks';
export const DATESTAMP_FORMAT = '[~]YYYY.M.D';
@ -573,18 +574,18 @@ export const Message = ({
/>
);
case 'code':
return <CodeContent key={i} content={content} />;
case 'url':
if(content.url.startsWith('web+urbit:/')) {
return (
<PermalinkEmbed
transcluded={transcluded}
api={api}
link={content.url}
/>
);
}
return <CodeContent key={i} content={content} />;
case 'reference':
const { link } = referenceToPermalink(content);
return (
<PermalinkEmbed
link={link}
api={api}
transcluded={transcluded}
/>
);
case 'url':
return (
<Box
key={i}
flexShrink={0}

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

@ -9,9 +9,15 @@ import { NoteContent } from "../publish/components/Note";
import bigInt from "big-integer";
import { getSnippet } from "~/logic/lib/publish";
import { NotePreviewContent } from "../publish/components/NotePreview";
import GlobalApi from "~/logic/api/global";
function TranscludedLinkNode(props: { node: GraphNode; assoc: Association }) {
const { node, assoc } = props;
function TranscludedLinkNode(props: {
node: GraphNode;
assoc: Association;
transcluded: number;
api: GlobalApi;
}) {
const { node, assoc, transcluded } = props;
const idx = node.post.index.slice(1).split("/");
switch (idx.length) {
@ -26,14 +32,26 @@ function TranscludedLinkNode(props: { node: GraphNode; assoc: Association }) {
</Box>
);
case 2:
return <TranscludedComment node={node} assoc={assoc} />;
return (
<TranscludedComment
api={api}
transcluded={transcluded}
node={node}
assoc={assoc}
/>
);
default:
return null;
}
}
function TranscludedComment(props: { node: GraphNode; assoc: Association }) {
const { assoc, node } = props;
function TranscludedComment(props: {
node: GraphNode;
assoc: Association;
api: GlobalApi;
transcluded: number;
}) {
const { assoc, node, api, transcluded } = props;
const group = useGroupForAssoc(assoc)!;
const comment = node.children?.peekLargest()![1]!;
@ -47,7 +65,12 @@ function TranscludedComment(props: { node: GraphNode; assoc: Association }) {
group={group}
/>
<Box p="2">
<MentionText content={comment.post.contents} group={group} />;
<MentionText
api={api}
transcluded={transcluded}
content={comment.post.contents}
group={group}
/>
</Box>
</Col>
);
@ -56,8 +79,10 @@ function TranscludedComment(props: { node: GraphNode; assoc: Association }) {
function TranscludedPublishNode(props: {
node: GraphNode;
assoc: Association;
api: GlobalApi;
transcluded: number;
}) {
const { node, assoc } = props;
const { node, assoc, transcluded, api } = props;
const group = useGroupForAssoc(assoc)!;
const idx = node.post.index.slice(1).split("/");
switch (idx.length) {
@ -86,7 +111,14 @@ function TranscludedPublishNode(props: {
);
case 3:
return <TranscludedComment node={node} assoc={assoc} />;
return (
<TranscludedComment
transcluded={transcluded}
api={api}
node={node}
assoc={assoc}
/>
);
default:
return null;
}

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

@ -55,7 +55,7 @@ function GraphPermalink(
}
})();
}, [graph, index]);
const showTransclusion = !!(association && node && transcluded < 2);
const showTransclusion = !!(association && node && transcluded < 1);
const rowTransclusionStyle = showTransclusion
? {
@ -77,7 +77,7 @@ function GraphPermalink(
{showTransclusion && (
<Box p="2">
<TranscludedNode
transcluded={transcluded}
transcluded={transcluded + 1}
node={node}
assoc={association!}
/>

2
pkg/interface/src/views/components/CommentItem.tsx
View File

@ -108,6 +108,8 @@ export function CommentItem(props: CommentItemProps): ReactElement {
backgroundColor={props.highlighted ? 'lightGray' : 'white'}
>
<MentionText
transcluded={0}
api={api}
group={group}
content={post?.contents}
/>

4
pkg/interface/src/views/components/Comments.tsx
View File

@ -15,6 +15,7 @@ import { PropFunc } from '~/types/util';
import { isWriter } from '~/logic/lib/group';
import useHarkState from '~/logic/state/hark';
import {useQuery} from '~/logic/lib/useQuery';
import {referenceToPermalink} from '~/logic/lib/permalinks';
interface CommentsProps {
comments: GraphNode;
@ -107,7 +108,10 @@ export function Comments(props: CommentsProps & PropFunc<typeof Col>) {
val = val + curr.url;
} else if ('code' in curr) {
val = val + curr.code.expression;
} else if ('reference' in curr) {
val = `${val}web+urbit:/${referenceToPermalink(curr).link}`;
}
return val;
}, '');
}

7
pkg/interface/src/views/components/MentionText.tsx
View File

@ -7,11 +7,15 @@ import { cite, useShowNickname, uxToHex } from '~/logic/lib/util';
import OverlaySigil from '~/views/components/OverlaySigil';
import { useHistory } from 'react-router-dom';
import useContactState from '~/logic/state/contact';
import {referenceToPermalink} from '~/logic/lib/permalinks';
import GlobalApi from '~/logic/api/global';
interface MentionTextProps {
contact?: Contact;
content: Content[];
group: Group;
transcluded: number;
api: GlobalApi;
}
export function MentionText(props: MentionTextProps) {
const { content, contact, group, ...rest } = props;
@ -25,6 +29,9 @@ export function MentionText(props: MentionTextProps) {
return accum + `[~${c.mention}]`;
} else if ('url' in c) {
return accum + `\n ${c.url}`;
} else if ('reference' in c) {
const { link } = referenceToPermalink(c);
return accum + `\n [${link}]`;
}
return accum;
}, '')}

6
pkg/interface/src/views/components/RichText.js
View File

@ -5,6 +5,7 @@ import ReactMarkdown from 'react-markdown';
import RemarkDisableTokenizers from 'remark-disable-tokenizers';
import { Anchor, Text } from '@tlon/indigo-react';
import { isValidPatp } from 'urbit-ob';
import { PermalinkEmbed } from "~/views/apps/permalinks/embed"
import { deSig } from '~/logic/lib/util';
import { Mention } from '~/views/components/MentionText';
@ -22,7 +23,7 @@ const DISABLED_BLOCK_TOKENS = [
const DISABLED_INLINE_TOKENS = [];
const RichText = React.memo(({ disableRemoteContent, ...props }) => (
const RichText = React.memo(({ disableRemoteContent, api, ...props }) => (
<ReactMarkdown
{...props}
renderers={{
@ -43,6 +44,9 @@ const RichText = React.memo(({ disableRemoteContent, ...props }) => (
const linkText = String(linkProps.children[0].props.children);
if (isValidPatp(linkText)) {
return <Mention contact={props.contact || {}} group={props.group} ship={deSig(linkText)} />;
} else if(linkText.startsWith('web+urbit://')) {
return <PermalinkEmbed link={linkText} transcluded={props.transcluded} api={api}/>;
}
return linkText;
},

15
pkg/npm/api/graph/types.ts
View File

@ -15,8 +15,21 @@ export interface CodeContent {
}
export interface ReferenceContent {
uid: string;
reference: GraphReference | GroupReference;
}
export interface GraphReference {
graph: {
graph: string;
group: string;
index: string;
}
}
export interface GroupReference {
group: string;
}
export interface MentionContent {
mention: string;
}