Yarn 3 upgrade

.gitignore

@@ -1,8 +1,9 @@
 node_modules/
 .idea
-.yarn
+.yarn/
 yarn.lock
 dist/
 *.tgz
 *.log
-.DS_Store
+.DS_Store
+.pnp*

.vscode/extensions.json

@@ -0,0 +1,6 @@
+{
+  "recommendations": [
+    "arcanis.vscode-zipfs",
+    "dbaeumer.vscode-eslint"
+  ]
+}

.vscode/settings.json

@@ -7,5 +7,12 @@
     "**/.DS_Store": true,
     "**/Thumbs.db": true,
     "**/node_modules": true
-  }
+  },
+  "search.exclude": {
+    "**/.yarn": true,
+    "**/.pnp.*": true
+  },
+  "typescript.tsdk": ".yarn/sdks/typescript/lib",
+  "typescript.enablePromptUseWorkspaceTsdk": true,
+  "eslint.nodePath": ".yarn/sdks"
 }

.yarnrc

@@ -0,0 +1,5 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+yarn-path ".yarn/releases/yarn-1.22.19.cjs"

.yarnrc.yml

@@ -0,0 +1,4 @@
+yarnPath: .yarn/releases/yarn-3.6.1.cjs
+npmScopes:
+  void-cat:
+    npmRegistryServer: https://git.v0l.io/api/packages/Kieran/npm/

package.json

@@ -16,5 +16,10 @@
     "printWidth": 120,
     "bracketSameLine": true,
     "arrowParens": "avoid"
+  },
+  "packageManager": "yarn@3.6.1",
+  "dependencies": {
+    "eslint": "^8.44.0",
+    "typescript": "^5.1.6"
   }
 }

packages/app/custom.d.ts

@@ -29,3 +29,16 @@ declare module "translations/*.json" {
   const value: Record<string, string>;
   export default value;
 }
+
+type EmojiShape = {
+  [key: string]: {
+    keywords: Array<string>;
+    char: string;
+    fitzpatrick_scale: boolean;
+    category: string;
+  };
+};
+
+declare module "emojilib" {
+  const lib: EmojiShape;
+}

packages/app/package.json

@@ -1,23 +1,27 @@
 {
   "name": "@snort/app",
   "version": "0.1.10",
-  "private": true,
   "dependencies": {
     "@cashu/cashu-ts": "^0.6.1",
-    "@jukben/emoji-search": "^2.0.1",
     "@lightninglabs/lnc-web": "^0.2.3-alpha",
     "@noble/curves": "^1.0.0",
     "@noble/hashes": "^1.2.0",
     "@reduxjs/toolkit": "^1.9.1",
+    "@scure/base": "^1.1.1",
     "@scure/bip32": "^1.3.0",
     "@scure/bip39": "^1.1.1",
+    "@snort/shared": "workspace:*",
+    "@snort/system": "workspace:*",
+    "@snort/system-react": "workspace:*",
     "@szhsin/react-menu": "^3.3.1",
     "@void-cat/api": "^1.0.4",
     "debug": "^4.3.4",
     "dexie": "^3.2.4",
     "dns-over-http-resolver": "^2.1.1",
+    "emojilib": "^3.0.10",
     "hls.js": "^1.4.6",
     "light-bolt11-decoder": "^2.1.0",
+    "match-sorter": "^6.3.1",
     "qr-code-styling": "^1.6.0-rc.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
@@ -28,12 +32,13 @@
     "react-textarea-autosize": "^8.4.0",
     "react-twitter-embed": "^4.0.4",
     "use-long-press": "^2.0.3",
+    "uuid": "^9.0.0",
     "workbox-core": "^6.4.2",
     "workbox-routing": "^6.4.2",
     "workbox-strategies": "^6.4.2"
   },
   "scripts": {
-    "start": "webpack serve",
+    "start": "webpack serve --node-env=development",
     "build": "webpack --node-env=production",
     "test": "jest --runInBand",
     "intl-extract": "formatjs extract 'src/**/*.ts*' --ignore='**/*.d.ts' --out-file src/lang.json --flatten true",
@@ -62,16 +67,20 @@
     ]
   },
   "devDependencies": {
+    "@babel/core": "^7.22.9",
     "@babel/plugin-syntax-import-assertions": "^7.20.0",
     "@babel/preset-env": "^7.21.5",
     "@babel/preset-react": "^7.18.6",
+    "@babel/runtime": "^7.22.6",
     "@formatjs/cli": "^6.0.1",
     "@formatjs/ts-transformer": "^3.13.1",
+    "@jest/globals": "^29.6.1",
     "@types/debug": "^4.1.8",
     "@types/jest": "^29.5.1",
-    "@types/node": "^18.11.18",
+    "@types/node": "^20.4.1",
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.10",
+    "@types/uuid": "^9.0.2",
     "@types/webscopeio__react-textarea-autocomplete": "^4.7.2",
     "@types/webtorrent": "^0.109.3",
     "@webbtc/webln-types": "^1.0.10",
@@ -83,6 +92,7 @@
     "css-loader": "^6.7.3",
     "css-minimizer-webpack-plugin": "^5.0.0",
     "customize-cra": "^1.0.0",
+    "eslint": "^8.44.0",
     "eslint-plugin-formatjs": "^4.10.1",
     "eslint-webpack-plugin": "^4.0.1",
     "html-webpack-plugin": "^5.5.1",
@@ -92,9 +102,11 @@
     "lint-staged": ">=10",
     "mini-css-extract-plugin": "^2.7.5",
     "prettier": "2.8.3",
+    "prop-types": "^15.8.1",
+    "terser-webpack-plugin": "^5.3.9",
     "ts-jest": "^29.1.0",
     "ts-loader": "^9.4.2",
-    "typescript": "^5.0.4",
+    "typescript": "^5.1.6",
     "webpack": "^5.82.1",
     "webpack-bundle-analyzer": "^4.8.0",
     "webpack-cli": "^5.1.1",

packages/app/src/Element/ProxyImg.tsx

@@ -1,5 +1,5 @@
 import useImgProxy from "Hooks/useImgProxy";
-import { useEffect, useState } from "react";
+import React, { useState } from "react";
 import { FormattedMessage } from "react-intl";
 import { getUrlHostname } from "SnortUtils";
 

packages/app/src/Element/Text.tsx

@@ -19,59 +19,37 @@ export interface TextProps {
 }
 
 export default function Text({ content, tags, creator, disableMedia, depth, disableMediaSpotlight }: TextProps) {
-  function renderChunk(f: Array<ParsedFragment>) {
-    if (f.every(a => a.type === "media") && f.length === 1) {
+  function renderChunk(a: ParsedFragment) {
+    if (a.type === "media" && !a.mimeType?.startsWith("unknown")) {
       if (disableMedia ?? false) {
         return (
-          <a href={f[0].content} onClick={e => e.stopPropagation()} target="_blank" rel="noreferrer" className="ext">
-            {f[0].content}
+          <a href={a.content} onClick={e => e.stopPropagation()} target="_blank" rel="noreferrer" className="ext">
+            {a.content}
           </a>
         );
       }
-      return <RevealMedia link={f[0].content} creator={creator} disableSpotlight={disableMediaSpotlight} />;
+      return <RevealMedia link={a.content} creator={creator} disableSpotlight={disableMediaSpotlight} />;
     } else {
-      return (
-        <div className="text-frag">
-          {f.map(a => {
-            switch (a.type) {
-              case "invoice":
-                return <Invoice invoice={a.content} />;
-              case "hashtag":
-                return <Hashtag tag={a.content} />;
-              case "cashu":
-                return <CashuNuts token={a.content} />;
-              case "media":
-              case "link":
-                return <HyperText link={a.content} depth={depth} />;
-              case "custom_emoji":
-                return <ProxyImg src={a.content} size={15} className="custom-emoji" />;
-              default:
-                return <>{a.content}</>;
-            }
-          })}
-        </div>
-      );
+      switch (a.type) {
+        case "invoice":
+          return <Invoice invoice={a.content} />;
+        case "hashtag":
+          return <Hashtag tag={a.content} />;
+        case "cashu":
+          return <CashuNuts token={a.content} />;
+        case "media":
+        case "link":
+          return <HyperText link={a.content} depth={depth} />;
+        case "custom_emoji":
+          return <ProxyImg src={a.content} size={15} className="custom-emoji" />;
+        default:
+          return <div className="text-frag">{a.content}</div>;
+      }
     }
   }
+
   const elements = useMemo(() => {
-    const frags = transformText(content, tags);
-    const chunked = frags.reduce((acc, v) => {
-      if (v.type === "media" && !(v.mimeType?.startsWith("unknown") ?? true)) {
-        if (acc.length === 0) {
-          acc.push([], [v]);
-        } else {
-          acc.push([v]);
-        }
-      } else {
-        if (acc.length === 0) {
-          acc.push([v]);
-        } else {
-          acc[0].push(v);
-        }
-      }
-      return acc;
-    }, [] as Array<Array<ParsedFragment>>);
-    return chunked.reverse();
+    return transformText(content, tags);
   }, [content]);
 
   return (

packages/app/src/Element/Textarea.tsx

@@ -10,6 +10,7 @@ import Avatar from "Element/Avatar";
 import Nip05 from "Element/Nip05";
 import { hexToBech32 } from "SnortUtils";
 import { UserCache } from "Cache";
+import searchEmoji from "emoji-search";
 
 import messages from "./messages";
 
@@ -60,11 +61,7 @@ const Textarea = (props: TextareaProps) => {
   };
 
   const emojiDataProvider = async (token: string) => {
-    const emoji = await import("@jukben/emoji-search");
-    return emoji
-      .default(token)
-      .slice(0, 5)
-      .map(({ name, char }) => ({ name, char }));
+    return (await searchEmoji(token)).slice(0, 5).map(({ name, char }) => ({ name, char }));
   };
 
   return (

packages/app/src/Pages/SettingsPage.tsx

@@ -1,6 +1,6 @@
 import { FormattedMessage } from "react-intl";
 import { Outlet, RouteObject, useNavigate } from "react-router-dom";
-import SettingsIndex from "Pages/settings/Index";
+import SettingsIndex from "Pages/settings/Root";
 import Profile from "Pages/settings/Profile";
 import Relay from "Pages/settings/Relays";
 import Preferences from "Pages/settings/Preferences";

packages/app/src/Pages/settings/Preferences.tsx

@@ -6,6 +6,7 @@ import useLogin from "Hooks/useLogin";
 import { DefaultPreferences, updatePreferences, UserPreferences } from "Login";
 import { DefaultImgProxy } from "Const";
 import { unwrap } from "SnortUtils";
+import searchEmoji from "emoji-search";
 
 import messages from "./messages";
 
@@ -36,8 +37,7 @@ const PreferencesPage = () => {
 
   useEffect(() => {
     (async () => {
-      const emoji = await import("@jukben/emoji-search");
-      setEmoji(emoji.default("").map(a => ({ name: a.name, char: a.char })));
+      setEmoji((await searchEmoji("")).map(a => ({ name: a.name, char: a.char })));
     })();
   }, []);
 

packages/app/src/Pages/settings/Root.tsx

@@ -1,4 +1,4 @@
-import "./Index.css";
+import "./Root.css";
 import { FormattedMessage } from "react-intl";
 import { useNavigate } from "react-router-dom";
 import Icon from "Icons/Icon";

packages/app/src/emoji-search.ts

@@ -0,0 +1,12 @@
+import { matchSorter } from "match-sorter";
+
+export default async function searchEmoji(key: string) {
+  const { lib } = await import("emojilib");
+  /* build proper library with included name of the emoji */
+  const library = Object.entries(lib).map(([name, emojiObject]) => ({
+    ...emojiObject,
+    keywords: [name, ...emojiObject.keywords],
+    name,
+  }));
+  return matchSorter(library, key, { keys: ["keywords"] });
+}

packages/app/webpack.config.js

@@ -121,8 +121,9 @@ const config = {
     ],
   },
   resolve: {
-    extensions: [".tsx", ".ts", ".jsx", ".js", "..."],
-    modules: ["node_modules", __dirname, path.resolve(__dirname, "src")],
+    aliasFields: ["browser"],
+    extensions: ["...", ".tsx", ".ts", ".jsx", ".js"],
+    modules: ["...", __dirname, path.resolve(__dirname, "src")],
   },
 };
 

packages/nostr/package.json

@@ -16,6 +16,7 @@
     "@types/expect": "^24.3.0",
     "@types/express": "^4.17.17",
     "@types/mocha": "^10.0.1",
+    "@types/node": "^20.4.1",
     "@typescript-eslint/eslint-plugin": "^5.53.0",
     "@typescript-eslint/parser": "^5.53.0",
     "eslint": "^8.34.0",

packages/shared/package.json

@@ -7,7 +7,6 @@
   "repository": "https://git.v0l.io/Kieran/snort",
   "author": "Kieran",
   "license": "GPL-3.0-or-later",
-  "private": false,
   "scripts": {
     "build": "rm -rf dist && tsc"
   },
@@ -18,5 +17,9 @@
     "debug": "^4.3.4",
     "dexie": "^3.2.4",
     "light-bolt11-decoder": "^3.0.0"
+  },
+  "devDependencies": {
+    "@types/debug": "^4.1.8",
+    "typescript": "^5.1.6"
   }
 }

packages/system-react/package.json

@@ -7,7 +7,6 @@
   "repository": "https://git.v0l.io/Kieran/snort",
   "author": "Kieran",
   "license": "GPL-3.0-or-later",
-  "private": false,
   "scripts": {
     "build": "rm -rf dist && tsc"
   },
@@ -16,8 +15,12 @@
     "dist"
   ],
   "dependencies": {
-    "react": "^18.2.0",
+    "@snort/shared": "^1.0.4",
     "@snort/system": "^1.0.16",
-    "@snort/shared": "^1.0.4"
+    "react": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.14",
+    "typescript": "^5.1.6"
   }
 }

packages/system/package.json

@@ -18,16 +18,19 @@
   "devDependencies": {
     "@jest/globals": "^29.5.0",
     "@peculiar/webcrypto": "^1.4.3",
+    "@types/debug": "^4.1.8",
     "@types/jest": "^29.5.1",
+    "@types/uuid": "^9.0.2",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
     "ts-jest": "^29.1.0",
-    "typescript": "^5.0.4"
+    "typescript": "^5.1.6"
   },
   "dependencies": {
-    "@snort/shared": "^1.0.4",
     "@noble/curves": "^1.0.0",
+    "@noble/hashes": "^1.3.1",
     "@scure/base": "^1.1.1",
+    "@snort/shared": "^1.0.4",
     "@stablelib/xchacha20": "^1.0.1",
     "debug": "^4.3.4",
     "dexie": "^3.2.4",

packages/system/src/text.ts

@@ -12,11 +12,6 @@ export interface ParsedFragment {
 
 export type Fragment = string | ParsedFragment;
 
-export interface TextFragment {
-    body: React.ReactNode[];
-    tags: Array<Array<string>>;
-}
-
 function extractLinks(fragments: Fragment[]) {
     return fragments
         .map(f => {