From c1877b35adf40633ce9568182f4c5302efffbaba Mon Sep 17 00:00:00 2001 From: Alejandro Gomez Date: Sat, 14 Jan 2023 23:46:28 +0100 Subject: [PATCH] address review comments --- package.json | 1 + src/element/NoteCreator.css | 3 +-- src/element/{Textarea.js => Textarea.tsx} | 22 ++++++++++++++++------ src/feed/EventPublisher.js | 20 +++++++++----------- src/nostr/types.tsx | 9 +++++++++ yarn.lock | 7 +++++++ 6 files changed, 43 insertions(+), 19 deletions(-) rename src/element/{Textarea.js => Textarea.tsx} (71%) create mode 100644 src/nostr/types.tsx diff --git a/package.json b/package.json index 26a92e5b..14e09b75 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "@types/node": "^18.11.18", "@types/react": "^18.0.26", "@types/react-dom": "^18.0.10", + "@types/webscopeio__react-textarea-autocomplete": "^4.7.2", "@webscopeio/react-textarea-autocomplete": "^4.9.2", "bech32": "^2.0.0", "light-bolt11-decoder": "^2.1.0", diff --git a/src/element/NoteCreator.css b/src/element/NoteCreator.css index 2ff5b0e9..04d3c578 100644 --- a/src/element/NoteCreator.css +++ b/src/element/NoteCreator.css @@ -2,7 +2,6 @@ margin-bottom: 10px; background-color: var(--gray); border-radius: 10px; - overflow: hidden; } .note-creator textarea { @@ -20,7 +19,7 @@ } .note-creator .textarea--focused { - min-height: 150px; + min-height: 120px; } .note-creator .actions { diff --git a/src/element/Textarea.js b/src/element/Textarea.tsx similarity index 71% rename from src/element/Textarea.js rename to src/element/Textarea.tsx index 70d5e986..f4d290d3 100644 --- a/src/element/Textarea.js +++ b/src/element/Textarea.tsx @@ -2,19 +2,27 @@ import { Component } from "react"; import ReactTextareaAutocomplete from "@webscopeio/react-textarea-autocomplete"; +// @ts-expect-error import Nip05, { useIsVerified } from "./Nip05"; import "@webscopeio/react-textarea-autocomplete/style.css"; import "./Textarea.css"; +// @ts-expect-error import Nostrich from "../nostrich.jpg"; +// @ts-expect-error +import { hexToBech32 } from "../Util"; +import type { User } from "../nostr/types"; -function searchUsers(query, users) { +function searchUsers(query: string, users: Record) { const q = query.toLowerCase() - return Object.values(users).filter(({ name, display_name, about }) => { - return name.toLowerCase().includes(q) || display_name?.includes(q) || about?.includes(q) + return Object.values(users).filter(({ name, display_name, about, nip05 }) => { + return name?.toLowerCase().includes(q) + || display_name?.toLowerCase().includes(q) + || about?.toLowerCase().includes(q) + || nip05?.toLowerCase().includes(q) }).slice(0, 3) } -const UserItem = ({ pubkey, display_name, picture, nip05, ...rest }) => { +const UserItem = ({ pubkey, display_name, picture, nip05, ...rest }: User) => { const { isVerified, couldNotVerify, name, domain } = useIsVerified(nip05, pubkey) return (
@@ -31,6 +39,7 @@ const UserItem = ({ pubkey, display_name, picture, nip05, ...rest }) => { export default class Textarea extends Component { render() { + // @ts-expect-error const { users, onChange, ...rest } = this.props return ( Loading....} placeholder="Say something!" ref={rta => { + // @ts-expect-error this.rta = rta; }} onChange={onChange} @@ -45,8 +55,8 @@ export default class Textarea extends Component { "@": { afterWhitespace: true, dataProvider: token => searchUsers(token, users), - component: ({ entity }) => , - output: (item, trigger) => `@${item.pubkey}` + component: (props: any) => , + output: (item: any) => `@${hexToBech32("npub", item.pubkey)}` } }} /> diff --git a/src/feed/EventPublisher.js b/src/feed/EventPublisher.js index 8bb34b74..181d9885 100644 --- a/src/feed/EventPublisher.js +++ b/src/feed/EventPublisher.js @@ -32,20 +32,18 @@ export default function useEventPublisher() { function processMentions(ev, msg) { - const replaceHexKey = (match) => { - const idx = ev.Tags.length; - ev.Tags.push(new Tag(["p", match.slice(1)], idx)); - return `#[${idx}]` - } const replaceNpub = (match) => { const npub = match.slice(1); - const hex = bech32ToHex(npub); - const idx = ev.Tags.length; - ev.Tags.push(new Tag(["p", hex], idx)); - return `#[${idx}]` + try { + const hex = bech32ToHex(npub); + const idx = ev.Tags.length; + ev.Tags.push(new Tag(["p", hex], idx)); + return `#[${idx}]` + } catch (error) { + return match + } } - let content = msg.replace(/@[0-9A-Fa-f]{64}/g, replaceHexKey) - .replace(/@npub[a-z0-9]+/g, replaceNpub) + let content = msg.replace(/@npub[a-z0-9]+/g, replaceNpub) ev.Content = content; } diff --git a/src/nostr/types.tsx b/src/nostr/types.tsx new file mode 100644 index 00000000..9f9df606 --- /dev/null +++ b/src/nostr/types.tsx @@ -0,0 +1,9 @@ +export type User = { + name?: string + about?: string + display_name?: string + nip05?: string + pubkey: string + picture?: string +} + diff --git a/yarn.lock b/yarn.lock index 09530a20..1b412655 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2121,6 +2121,13 @@ resolved "https://registry.yarnpkg.com/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz#b6725d5f4af24ace33b36fafd295136e75509f43" integrity sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA== +"@types/webscopeio__react-textarea-autocomplete@^4.7.2": + version "4.7.2" + resolved "https://registry.yarnpkg.com/@types/webscopeio__react-textarea-autocomplete/-/webscopeio__react-textarea-autocomplete-4.7.2.tgz#605e8a6b4194fb4b6e55df8a19bc8fcd56319cfa" + integrity sha512-e1DZGD+eH19BnllTWCGXAdrMa2kI53wEMuhn/d+wUmnu8//ZI6BiuK/EPdw07fI4+tlyo5qdPZdXdpkoXHJVOw== + dependencies: + "@types/react" "*" + "@types/ws@^8.5.1": version "8.5.4" resolved "https://registry.yarnpkg.com/@types/ws/-/ws-8.5.4.tgz#bb10e36116d6e570dd943735f86c933c1587b8a5"