Merge branch 'master' into next/arvo

pkg/arvo/mar/css.hoon

@@ -1,21 +0,0 @@
-::
-::::  /hoon/css/mar
-  ::
-/?    310
-=,  eyre
-=,  mimes:html
-|_  mud=@t
-++  grow                                                ::  convert to
-  |%  ++  mime  [/text/css (as-octs mud)]               ::  convert to %mime
-      ++  elem  ;style                                  ::  convert to %hymn
-                  ;-  (trip mud)
-                ==
-      ++  hymn  ;html:(head:"{elem}" body)
-  --
-++  grab
-  |%                                                    ::  convert from
-  ++  mime  |=([p=mite q=octs] (@t q.q))
-  ++  noun  @t                                         ::  clam from %noun
-  --
-++  grad  %mime
---

pkg/arvo/mar/css.hoon

@@ -0,0 +1 @@
+../../base-dev/mar/css.hoon

pkg/base-dev/mar/css.hoon

@@ -0,0 +1,21 @@
+::
+::::  /hoon/css/mar
+  ::
+/?    310
+=,  eyre
+=,  mimes:html
+|_  mud=@t
+++  grow                                                ::  convert to
+  |%  ++  mime  [/text/css (as-octs mud)]               ::  convert to %mime
+      ++  elem  ;style                                  ::  convert to %hymn
+                  ;-  (trip mud)
+                ==
+      ++  hymn  ;html:(head:"{elem}" body)
+  --
+++  grab
+  |%                                                    ::  convert from
+  ++  mime  |=([p=mite q=octs] (@t q.q))
+  ++  noun  @t                                         ::  clam from %noun
+  --
+++  grad  %mime
+--

pkg/garden/desk.docket-0

@@ -1,7 +1,7 @@
 :~  title+'System'
     info+'An app launcher for Urbit.'
     color+0xee.5432
-    glob-http+['https://bootstrap.urbit.org/glob-0v2.p3f6i.19q8d.lsgcb.mckg7.dtu8f.glob' 0v2.p3f6i.19q8d.lsgcb.mckg7.dtu8f]
+    glob-http+['https://bootstrap.urbit.org/glob-0v5.kgrq2.gp725.bo5bk.dmr7d.h41qk.glob' 0v5.kgrq2.gp725.bo5bk.dmr7d.h41qk]
     ::glob-ames+~zod^0v0
     base+'grid'
     version+[1 1 3]

pkg/garden/mar/css.hoon

@@ -0,0 +1 @@
+../../base-dev/mar/css.hoon

pkg/grid/package.json

@@ -15,8 +15,8 @@
     "tsc": "tsc --noEmit"
   },
   "dependencies": {
-    "@radix-ui/react-checkbox": "^0.1.5",
     "@fingerprintjs/fingerprintjs": "^3.3.3",
+    "@radix-ui/react-checkbox": "^0.1.5",
     "@radix-ui/react-dialog": "^0.0.20",
     "@radix-ui/react-dropdown-menu": "^0.0.23",
     "@radix-ui/react-icons": "^1.1.0",
@@ -25,7 +25,7 @@
     "@radix-ui/react-toggle": "^0.0.10",
     "@tlon/sigil-js": "^1.4.4",
     "@types/lodash": "^4.14.172",
-    "@urbit/api": "^2.1.0",
+    "@urbit/api": "^2.1.1",
     "@urbit/http-api": "^2.1.0",
     "big-integer": "^1.6.48",
     "classnames": "^2.3.1",

pkg/grid/src/nav/Leap.tsx

@@ -72,7 +72,6 @@ export const Leap = React.forwardRef(
 
     useEffect(() => {
       const newMatch = getMatch(rawInput);
-
       if (newMatch && rawInput) {
         useLeapStore.setState({ selectedMatch: newMatch });
       }
@@ -112,7 +111,10 @@ export const Leap = React.forwardRef(
 
     const navigateByInput = useCallback(
       (input: string) => {
-        const normalizedValue = input.trim().replace(/(~?[\w^_-]{3,13})\//, '$1/apps/');
+        const normalizedValue = input
+          .trim()
+          .replace('%', '')
+          .replace(/(~?[\w^_-]{3,13})\//, '$1/apps/$1/');
         push(`/leap/${menu}/${normalizedValue}`);
       },
       [menu]

pkg/interface/.eslintrc.js

@@ -7,6 +7,7 @@ module.exports = {
     // Because we use styled system, and use
     // the convention of each prop on a new line
     // we probably shouldn't keep this on
-    'max-lines-per-function': ['off', {}]
+    'max-lines-per-function': ['off', {}],
+    'max-lines': ['off', {}]
   }
 };

pkg/interface/package.json

@@ -37,10 +37,10 @@
     "prop-types": "^15.7.2",
     "querystring": "^0.2.0",
     "react": "^17.0.2",
-    "react-codemirror2": "git@github.com:scniro/react-codemirror2",
+    "react-codemirror2-react-17": "^1.0.0",
     "react-dom": "^17.0.2",
     "react-helmet": "^6.1.0",
-    "react-markdown": "^8.0.3",
+    "react-markdown": "^5.0.3",
     "react-oembed-container": "^1.0.1",
     "react-router-dom": "^5.2.0",
     "react-use-gesture": "^9.1.3",

pkg/interface/src/views/apps/chat/components/ChatEditor.tsx

@@ -5,7 +5,7 @@ import 'codemirror/addon/hint/show-hint';
 import 'codemirror/lib/codemirror.css';
 import 'codemirror/mode/markdown/markdown';
 import React, { useRef, ClipboardEvent, useEffect, useImperativeHandle } from 'react';
-import { Controlled as CodeEditor } from 'react-codemirror2';
+import { Controlled as CodeEditor } from 'react-codemirror2-react-17';
 import styled from 'styled-components';
 import { MOBILE_BROWSER_REGEX } from '~/logic/lib/util';
 import useSettingsState from '~/logic/state/settings';

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

@@ -6,7 +6,7 @@ import 'codemirror/lib/codemirror.css';
 import 'codemirror/mode/markdown/markdown';
 import { useFormikContext } from 'formik';
 import React, { useCallback, useRef } from 'react';
-import { UnControlled as CodeEditor } from 'react-codemirror2';
+import { UnControlled as CodeEditor } from 'react-codemirror2-react-17';
 import { Prompt } from 'react-router-dom';
 import { useFileUpload } from '~/logic/lib/useFileUpload';
 import { IuseStorage } from '~/logic/lib/useStorage';
@@ -96,7 +96,7 @@ export function MarkdownEditor(
       p={1}
       border={1}
       borderColor="lightGray"
-      backgroundColor={disabled ? '#eee' : '#fff'}
+      backgroundColor={disabled ? 'lightGray' : 'white'}
       borderRadius={2}
       height={['calc(100% - 22vh)', '100%']}
       {...boxProps}

pkg/interface/src/views/components/RichText.tsx

@@ -2,26 +2,12 @@ import { Anchor, Text } from '@tlon/indigo-react';
 import { Contact, Group } from '@urbit/api';
 import React from 'react';
 import ReactMarkdown, { ReactMarkdownProps } from 'react-markdown';
-import RemarkDisableTokenizers from 'remark-disable-tokenizers';
 import { isValidPatp } from 'urbit-ob';
 import { deSig } from '~/logic/lib/util';
 import { PermalinkEmbed } from '~/views/apps/permalinks/embed';
 import { Mention } from '~/views/components/MentionText';
 import RemoteContent from '~/views/components/RemoteContent';
 
-const DISABLED_BLOCK_TOKENS = [
-  'indentedCode',
-  'atxHeading',
-  'thematicBreak',
-  'list',
-  'setextHeading',
-  'html',
-  'definition',
-  'table'
-];
-
-const DISABLED_INLINE_TOKENS = [];
-
 type RichTextProps = ReactMarkdownProps & {
   disableRemoteContent?: boolean;
   contact?: Contact;
@@ -110,10 +96,6 @@ const RichText = React.memo(({ disableRemoteContent = false, ...props }: RichTex
         return <Text display={props.inline ? 'inline' : 'block'} mb={2} {...props}>{paraProps.children}</Text>;
       }
     }}
-    plugins={[[
-      RemarkDisableTokenizers,
-      { block: DISABLED_BLOCK_TOKENS, inline: DISABLED_INLINE_TOKENS }
-    ]]}
   />
 ));
 

pkg/interface/src/views/landscape/components/ChannelPopoverRoutes/ChannelPermissions.tsx

@@ -91,7 +91,7 @@ export function GraphPermissions(props: GraphPermissionsProps) {
 
   const initialValues = {
     writePerms,
-    writers: writers
+    writers: [...writers]
       .filter(x => x !== hostShip),
     readerComments: association.metadata.vip === 'reader-comments'
   };
@@ -104,7 +104,7 @@ export function GraphPermissions(props: GraphPermissionsProps) {
       resource: association.resource,
       tag: 'writers'
     };
-    const allWriters = writers.map(w => `~${w}`);
+    const allWriters = [...writers].map(w => `~${w}`);
     if (values.readerComments !== readerComments) {
       await airlock.poke(metadataEdit(association, {
         vip: values.readerComments ? 'reader-comments' : ''

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

@@ -34,26 +34,30 @@ interface GraphMentionNode {
   ship: string;
 }
 
-const addEmphasisToMention = (contents: Content[], content: Content, index: number) => {
+const addEmphasisToMention = (
+  contents: Content[],
+  content: Content,
+  index: number
+) => {
   const prevContent = contents[index - 1];
   const nextContent = contents[index + 1];
 
   if (
     'text' in content &&
-    (content.text.trim() === '**' || content.text.trim() === '*' )
-  )  {
+    (content.text.trim() === '**' || content.text.trim() === '*')
+  ) {
     return {
       text: ''
     };
   }
-  if(
+  if (
     'text' in content &&
     content.text.endsWith('*') &&
     !content.text.startsWith('*') &&
     nextContent !== undefined &&
     'mention' in nextContent
   ) {
-    if (content.text.charAt((content.text.length - 2)) === '*') {
+    if (content.text.charAt(content.text.length - 2) === '*') {
       return { text: content.text.slice(0, content.text.length - 2) };
     }
     return { text: content.text.slice(0, content.text.length - 1) };
@@ -116,72 +120,80 @@ const codeToMdAst = (content: CodeContent) => {
   };
 };
 
-const contentToMdAst = (tall: boolean) => (
-  content: Content
-): [StitchMode, any] => {
-  if ('text' in content) {
-    if (content.text.toString().trim().length === 0) {
+const contentToMdAst =
+  (tall: boolean) =>
+  (content: Content): [StitchMode, any] => {
+    if ('text' in content) {
+      if (content.text.toString().trim().length === 0) {
+        return [
+          'merge',
+          { type: 'root', children: [{ type: 'paragraph', children: [] }] }
+        ];
+      }
       return [
         'merge',
-        { type: 'root', children: [{ type: 'paragraph', children: [] }] }
+        tall ? parseTall(content.text) : parseWide(content.text)
+      ] as [StitchMode, any];
+    } else if ('code' in content) {
+      return ['block', codeToMdAst(content)];
+    } else if ('reference' in content) {
+      return [
+        'block',
+        {
+          type: 'root',
+          children: [
+            {
+              type: 'graph-reference',
+              reference: content.reference
+            }
+          ]
+        }
+      ];
+    } else if ('url' in content) {
+      const images = ['.jpg', '.jpeg', '.png', '.gif', '.webp'];
+      return [
+        'inline',
+        {
+          type: 'root',
+          children: [
+            {
+              type: 'link',
+              url: content.url,
+              children: [
+                {
+                  type: 'text',
+                  value: !images.some(i => content.url.includes(i))
+                    ? content.url
+                    : ''
+                }
+              ]
+            }
+          ]
+        }
+      ];
+    } else if ('mention' in content) {
+      return [
+        'inline',
+        {
+          type: 'root',
+          children: [
+            {
+              type: 'graph-mention',
+              ship: content.mention,
+              emphasis: content.emphasis
+            }
+          ]
+        }
       ];
     }
-    return [
-      'merge',
-      tall ? parseTall(content.text) : parseWide(content.text)
-    ] as [StitchMode, any];
-  } else if ('code' in content) {
-    return ['block', codeToMdAst(content)];
-  } else if ('reference' in content) {
-    return [
-      'block',
-      {
-        type: 'root',
-        children: [
-          {
-            type: 'graph-reference',
-            reference: content.reference
-          }
-        ]
-      }
-    ];
-  } else if ('url' in content) {
     return [
       'inline',
       {
         type: 'root',
-        children: [
-          {
-            type: 'link',
-            url: content.url,
-            children: [{ type: 'text', value: content.url }]
-          }
-        ]
+        children: []
       }
     ];
-  } else if ('mention' in content) {
-    return [
-      'inline',
-      {
-        type: 'root',
-        children: [
-          {
-            type: 'graph-mention',
-            ship: content.mention,
-            emphasis: content.emphasis
-          }
-        ]
-      }
-    ];
-  }
-  return [
-    'inline',
-    {
-      type: 'root',
-      children: []
-    }
-  ];
-};
+  };
 
 function stitchInline(a: any, b: any) {
   if (!a?.children) {
@@ -230,9 +242,14 @@ function getChildren<T extends unknown>(node: T): AstContent[] {
 }
 
 export function asParent<T extends BlockContent>(node: T): Parent | undefined {
-    return ['paragraph', 'heading', 'list', 'listItem', 'table', 'blockquote'].includes(
-    node.type
-  )
+  return [
+    'paragraph',
+    'heading',
+    'list',
+    'listItem',
+    'table',
+    'blockquote'
+  ].includes(node.type)
     ? (node as Parent)
     : undefined;
 }
@@ -299,20 +316,10 @@ function stitchAsts(asts: [StitchMode, GraphAstNode][]) {
   );
 
   t[1].children.map((c, idx) => {
-    if (c.type === 'blockquote' && t[1].children[idx +1] !== undefined && t[1].children[idx +1].type === 'paragraph') {
-        const next = idx !== t[1].children.length -1
-            ? t[1].children.splice(idx +1, 1)
-            : [];
-
-        if (next.length > 0) {
-            t[1].children[idx].children.push(next[0]);
-        }
-    }
-
     const links = [];
     function addRichEmbedURL(nodes) {
       if (nodes?.children) {
-        nodes.children.filter((k) => {
+        nodes.children.filter(k => {
           if (k.type === 'link') {
             links.push({
               type: 'root',
@@ -324,7 +331,7 @@ function stitchAsts(asts: [StitchMode, GraphAstNode][]) {
               ]
             });
           } else if (k?.children) {
-            k.children.filter((o) => {
+            k.children.filter(o => {
               if (o.type === 'link') {
                 links.push({
                   type: 'root',
@@ -456,7 +463,7 @@ const renderers = {
     );
     return tall ? <Box mb={2}>{inner}</Box> : inner;
   },
-  link: (props) => {
+  link: props => {
     return (
       <Anchor
         display="inline"
@@ -472,9 +479,13 @@ const renderers = {
     );
   },
   list: ({ depth, ordered, children }) => {
-    return ordered ? <Ol fontSize="1">{children}</Ol> : <Ul fontSize="1">{children}</Ul>;
+    return ordered ? (
+      <Ol fontSize="1">{children}</Ol>
+    ) : (
+      <Ul fontSize="1">{children}</Ul>
+    );
   },
-  'graph-mention': (obj) => {
+  'graph-mention': obj => {
     return <Mention ship={obj.ship} emphasis={obj.emphasis} />;
   },
   image: ({ url, tall }) => (
@@ -483,17 +494,13 @@ const renderers = {
     </Box>
   ),
   'graph-url': ({ url, tall }) => (
-     <RemoteContent key={url} url={url} tall={tall} />
+    <RemoteContent key={url} url={url} tall={tall} />
   ),
   'graph-reference': ({ reference, transcluded }) => {
     const { link } = referenceToPermalink({ reference });
     return (
       <Box my={2} flexShrink={0}>
-        <PermalinkEmbed
-          link={link}
-          transcluded={transcluded}
-          showOurContact
-        />
+        <PermalinkEmbed link={link} transcluded={transcluded} showOurContact />
       </Box>
     );
   },
@@ -561,19 +568,13 @@ export type GraphContentProps = PropFunc<typeof Box> & {
   showOurContact: boolean;
 };
 
-export const GraphContent = React.memo((
-  props: GraphContentProps
-) => {
-  const {
-    contents,
-    tall = false,
-    transcluded = 0,
-    ...rest
-  } = props;
+export const GraphContent = React.memo((props: GraphContentProps) => {
+  const { contents, tall = false, transcluded = 0, ...rest } = props;
   const [, ast] = stitchAsts(
     contents
-    .map((content, index) => addEmphasisToMention(contents, content, index))
-    .map(contentToMdAst(tall)));
+      .map((content, index) => addEmphasisToMention(contents, content, index))
+      .map(contentToMdAst(tall))
+  );
   return (
     <Box {...rest}>
       <Graphdown transcluded={transcluded} ast={ast} tall={tall} />

pkg/npm/api/package.json

@@ -8,8 +8,12 @@
     "directory": "pkg/npm/api"
   },
   "type": "module",
-  "main": "dist/cjs/index.js",
+  "main": "dist/cjs/index.cjs",
   "module": "dist/esm/index.js",
+  "exports": {
+    "require": "./dist/cjs/index.cjs",
+    "import": "./dist/esm/index.js"
+  },
   "jsdelivr": "dist/urbit-api.min.js",
   "unpkg": "dist/urbit-api.min.js",
   "types": "dist/index.d.ts",

pkg/npm/api/rollup.config.ts

@@ -60,13 +60,13 @@ export default [
     ],
     output: [
       {
-        dir: 'dist/esm',
+        file: 'dist/esm/index.js',
         format: 'esm',
         exports: 'named',
-        sourcemap: true
+        sourcemap: true,
       },
       {
-        dir: 'dist/cjs',
+        file: 'dist/cjs/index.cjs',
         format: 'cjs',
         exports: 'named',
         sourcemap: true

pkg/npm/http-api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@urbit/http-api",
-  "version": "2.1.0",
+  "version": "2.1.3",
   "license": "MIT",
   "description": "Library to interact with an Urbit ship over HTTP",
   "repository": {
@@ -9,8 +9,12 @@
     "directory": "pkg/npm/http-api"
   },
   "type": "module",
-  "main": "dist/cjs/index.js",
+  "main": "dist/cjs/index.cjs",
   "module": "dist/esm/index.js",
+  "exports": {
+    "require": "./dist/cjs/index.cjs",
+    "import": "./dist/esm/index.js"
+  },
   "jsdelivr": "dist/urbit-http-api.min.js",
   "unpkg": "dist/urbit-http-api.min.js",
   "types": "dist/index.d.ts",

pkg/npm/http-api/rollup.config.ts

@@ -56,13 +56,13 @@ export default [
     ],
     output: [
       {
-        dir: 'dist/esm',
+        file: 'dist/esm/index.js',
         format: 'esm',
         exports: 'named',
         sourcemap: true,
       },
       {
-        dir: 'dist/cjs',
+        file: 'dist/cjs/index.cjs',
         format: 'cjs',
         exports: 'named',
         sourcemap: true,

pkg/npm/http-api/src/Urbit.ts

@@ -235,9 +235,9 @@ export class Urbit {
             console.log('Received SSE: ', event);
           }
           if (!event.id) return;
-          this.lastEventId = parseInt(event.id, 10);
-          if (this.lastEventId - this.lastAcknowledgedEventId > 20) {
-            this.ack(this.lastEventId);
+          const eventId = parseInt(event.id, 10);
+          if (eventId - this.lastAcknowledgedEventId > 20) {
+            this.ack(eventId);
           }
 
           if (event.data && JSON.parse(event.data)) {
@@ -312,7 +312,7 @@ export class Urbit {
    *
    */
   reset() {
-    if(this.verbose) {
+    if (this.verbose) {
       console.log('resetting');
     }
     this.delete();