Merge pull request #4869 from urbit/mp/publish-amazon

publish: amazon

pkg/interface/src/logic/lib/publish.ts

@@ -3,7 +3,7 @@ import BigIntOrderedMap from '@urbit/api/lib/BigIntOrderedMap';
 import bigInt, { BigInteger } from 'big-integer';
 import { buntPost } from '~/logic/lib/post';
 import { unixToDa } from '~/logic/lib/util';
-//import tokenizeMessage from './tokenizeMessage';
+import tokenizeMessage from './tokenizeMessage';
 
 export function newPost(
   title: string,
@@ -20,8 +20,7 @@ export function newPost(
     signatures: []
   };
 
-  // re-enable on mainnet deploy
-  //const tokenisedBody = tokenizeMessage(body);
+  const tokenisedBody = tokenizeMessage(body);
 
   const revContainer: Post = { ...root, index: root.index + '/1' };
   const commentsContainer = { ...root, index: root.index + '/2' };
@@ -29,8 +28,7 @@ export function newPost(
   const firstRevision: Post = {
     ...revContainer,
     index: revContainer.index + '/1',
-    contents: [{ text: title }, { text: body }]
-    //contents: [{ text: title }, { text: body } ...tokenisedBody]
+    contents: [{ text: title }, ...tokenisedBody]
   };
 
   const nodes = {
@@ -59,14 +57,12 @@ export function newPost(
 
 export function editPost(rev: number, noteId: BigInteger, title: string, body: string) {
   const now = Date.now();
-  // reenable
-  //const tokenisedBody = tokenizeMessage(body);
+  const tokenisedBody = tokenizeMessage(body);
   const newRev: Post = {
     author: `~${window.ship}`,
     index: `/${noteId.toString()}/1/${rev}`,
     'time-sent': now,
-    //contents: [{ text: title }, ...tokenisedBody],
-    contents: [{ text: title }, { text: body }],
+    contents: [{ text: title }, ...tokenisedBody],
     hash: null,
     signatures: []
   };

pkg/interface/src/views/apps/publish/components/Note.tsx

@@ -27,18 +27,10 @@ interface NoteProps {
   group: Group;
 }
 
-const renderers = {
-  link: ({ href, children }) => {
-    return (
-      <Anchor display="inline" target="_blank" href={href}>{children}</Anchor>
-    );
-  }
-};
-
 export function NoteContent({ post, api }) {
   return (
       <Box color="black" className="md" style={{ overflowWrap: 'break-word', overflow: 'hidden' }}>
-        <GraphContent tall contents={post.contents.slice(1)} showOurContact api={api} />
+        <GraphContent tall={true} contents={post.contents.slice(1)} showOurContact api={api} />
       </Box>
   );
 }

pkg/interface/src/views/landscape/components/Graph/GraphContent.tsx

@@ -230,13 +230,13 @@ const header = ({ children, depth, ...rest }) => {
   const level = depth;
   const inner =
     level === 1 ? (
-      <H1>{children}</H1>
+      <H1 display='block'>{children}</H1>
     ) : level === 2 ? (
-      <H2>{children}</H2>
+      <H2 display='block'>{children}</H2>
     ) : level === 3 ? (
-      <H3>{children}</H3>
+      <H3 display='block'>{children}</H3>
     ) : (
-      <H4>{children}</H4>
+      <H4 display='block'>{children}</H4>
     );
   return (
     <Box {...rest} mt="2" mb="4">
@@ -247,6 +247,12 @@ const header = ({ children, depth, ...rest }) => {
 
 const renderers = {
   heading: header,
+  break: () => {
+    return <Box display='block' width='100%' height={2}></Box>
+  },
+  thematicBreak: () => {
+    return <Box display='block' width='100%' height={2}></Box>
+  },
   inlineCode: ({ language, value }) => {
     return (
       <Text
@@ -262,12 +268,12 @@ const renderers = {
   },
   strong: ({ children }) => {
     return (
-      <Text fontWeight="bold">
+      <Text fontWeight="bold" lineHeight='1'>
         {children}
       </Text>
     );
-  }, 
-  emphasis: ({ children }) => { 
+  },
+  emphasis: ({ children }) => {
     return (
     <Text fontStyle="italic" fontSize="1" lineHeight={'20px'}>
         {children}
@@ -283,7 +289,7 @@ const renderers = {
         color="black"
         paddingLeft={2}
         py="1"
-        mb="1" 
+        mb="1"
       >
         {children}
       </Text>
@@ -333,7 +339,7 @@ const renderers = {
   },
   link: (props) => {
     return (
-      <Anchor href={props.href} borderBottom="1" color="black">
+      <Anchor href={props.url} borderBottom="1" color="black" target="_blank">
         {props.children}
       </Anchor>
     );
@@ -370,7 +376,7 @@ const renderers = {
     );
   },
   root: ({ tall, children }) =>
-    tall ? <Col gapY="2">{children}</Col> : <Box>{children}</Box>,
+    tall ? <Col display='grid' style={{ 'row-gap': '1rem' }}>{children}</Col> : <Box>{children}</Box>,
   text: ({ value }) => value,
 };
 
@@ -382,12 +388,12 @@ export function Graphdown<T extends {} = {}>(
     depth?: number;
   } & T
 ) {
-  const { ast, transcluded, depth = 0, ...rest } = props;
+  const { ast, transcluded, tall, depth = 0, ...rest } = props;
   const { type, children = [], ...nodeRest } = ast;
   const Renderer = renderers[ast.type] ?? (() => `unknown element: ${type}`);
 
   return (
-    <Renderer transcluded={transcluded} depth={depth} {...rest} {...nodeRest}>
+    <Renderer transcluded={transcluded} depth={depth} {...rest} {...nodeRest} tall={tall}>
       {children.map((c) => (
         <Graphdown
           transcluded={transcluded}
@@ -421,7 +427,7 @@ export const GraphContent = React.memo(function GraphContent(
   const [, ast] = stitchAsts(contents.map(contentToMdAst(tall)));
   return (
     <Box {...rest}>
-      <Graphdown transcluded={transcluded} api={api} ast={ast} />
+      <Graphdown transcluded={transcluded} api={api} ast={ast} tall={tall} />
     </Box>
   );
 });