diff --git a/package.json b/package.json index 1372d70..1c2916b 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,7 @@ "@radix-ui/react-dialog": "^1.0.4", "@radix-ui/react-tabs": "^1.0.4", "@react-hook/resize-observer": "^1.2.6", - "@snort/system-react": "^1.0.10", + "@snort/system-react": "^1.0.11", "@testing-library/jest-dom": "^5.14.1", "@testing-library/react": "^13.0.0", "@testing-library/user-event": "^13.2.1", @@ -25,6 +25,7 @@ "react-dom": "^18.2.0", "react-intersection-observer": "^9.5.1", "react-router-dom": "^6.13.0", + "react-tag-input-component": "^2.0.2", "semantic-sdp": "^3.26.2", "usehooks-ts": "^2.9.1", "web-vitals": "^2.1.0", diff --git a/public/tag_suggestions.json b/public/tag_suggestions.json new file mode 100644 index 0000000..eb259b4 --- /dev/null +++ b/public/tag_suggestions.json @@ -0,0 +1,3 @@ +[ + { "id": "nsfw", "text": "NSFW" } +] \ No newline at end of file diff --git a/src/element/live-chat.css b/src/element/live-chat.css index 6c0f4f1..46165bc 100644 --- a/src/element/live-chat.css +++ b/src/element/live-chat.css @@ -94,7 +94,6 @@ .live-chat .write-message input { background: unset; border: unset; - outline: unset; color: inherit; font: inherit; flex-grow: 1; diff --git a/src/element/new-stream.css b/src/element/new-stream.css index b46fd51..b512d6a 100644 --- a/src/element/new-stream.css +++ b/src/element/new-stream.css @@ -27,7 +27,7 @@ .new-stream div.paper { background: #262626; - height: 32px; + padding: 12px 16px; } .new-stream .btn:disabled { diff --git a/src/element/stream-editor.css b/src/element/stream-editor.css new file mode 100644 index 0000000..97a44cd --- /dev/null +++ b/src/element/stream-editor.css @@ -0,0 +1,14 @@ +.rti--container { + background-color: unset !important; + border: 0 !important; + border-radius: 0 !important; + padding: 0 !important; + box-shadow: unset !important; +} + +.rti--tag { + color: black !important; + padding: 4px 10px !important; + border-radius: 12px !important; + display: unset !important; +} \ No newline at end of file diff --git a/src/element/stream-editor.tsx b/src/element/stream-editor.tsx index 0d1b305..c8eb883 100644 --- a/src/element/stream-editor.tsx +++ b/src/element/stream-editor.tsx @@ -1,10 +1,12 @@ +import "./stream-editor.css"; import { useEffect, useState, useCallback } from "react"; import { EventPublisher, NostrEvent } from "@snort/system"; import { unixNow } from "@snort/shared"; +import { TagsInput } from "react-tag-input-component"; import AsyncButton from "./async-button"; -import { StreamState, System } from "index"; -import { findTag } from "utils"; +import { StreamState } from "../index"; +import { findTag } from "../utils"; export interface StreamEditorProps { ev?: NostrEvent; @@ -27,6 +29,9 @@ export function StreamEditor({ ev, onFinish, options }: StreamEditorProps) { findTag(ev, "status") ?? StreamState.Live ); const [start, setStart] = useState(findTag(ev, "starts")); + const [tags, setTags] = useState( + ev?.tags.filter(a => a[0] === "t").map(a => a[1]) ?? [] + ); const [isValid, setIsValid] = useState(false); const validate = useCallback(() => { @@ -65,6 +70,9 @@ export function StreamEditor({ ev, onFinish, options }: StreamEditorProps) { if (status === StreamState.Ended) { eb.tag(["ends", ends]); } + for (const tx of tags) { + eb.tag(["t", tx.trim()]); + } return eb; }); console.debug(evNew); @@ -151,6 +159,18 @@ export function StreamEditor({ ev, onFinish, options }: StreamEditorProps) { )}} +
+

Tags

+
+ +
+ Stream type should be HLS +
a[0] === "t").map(a => a[1]); await this.#getJson("PATCH", "event", { - title, summary, image + title, summary, image, tags }); } diff --git a/yarn.lock b/yarn.lock index 8282d90..a06209f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1532,19 +1532,19 @@ dexie "^3.2.4" light-bolt11-decoder "^3.0.0" -"@snort/system-react@^1.0.10": - version "1.0.10" - resolved "https://registry.yarnpkg.com/@snort/system-react/-/system-react-1.0.10.tgz#72947af286602022dc468f7d04b01c7b18c14389" - integrity sha512-mBgHVmcrt9Sblm3/IN1vHLgoyQGH1xOpYg+v2+ARlFVOUdvkcQTxzQzt4sxWsdF4C63WFiju9hAahW/Dg4UhEw== +"@snort/system-react@^1.0.11": + version "1.0.11" + resolved "https://registry.yarnpkg.com/@snort/system-react/-/system-react-1.0.11.tgz#ab17de07e061eee6f6ff76083650c412b35703fe" + integrity sha512-eNjVMYWAA0kLpnpaNL/xH3sL+CrTVuGfzBsF/F2JHLqcmR3LASilZMBw6jEwyH/B+LKN7NCaei8PrqzWEU084Q== dependencies: "@snort/shared" "^1.0.4" - "@snort/system" "^1.0.15" + "@snort/system" "^1.0.16" react "^18.2.0" -"@snort/system@^1.0.15": - version "1.0.15" - resolved "https://registry.yarnpkg.com/@snort/system/-/system-1.0.15.tgz#845a2aaafcb75e469e7836c143f217404172cee0" - integrity sha512-mVXj2ZCS0T/m3EPqn0ICWrp96XUlhBCT4ci1CLzmtT8zXojAE/2eONv4ZR/OzGrvftUIBqarfpFbtJ7q1vohSg== +"@snort/system@^1.0.16": + version "1.0.16" + resolved "https://registry.yarnpkg.com/@snort/system/-/system-1.0.16.tgz#3acdb873fd9e36de05315a331b98c25cd861a36e" + integrity sha512-eMATT2yNwkNFOJiB11bW2r4O+0DjYpUyAn+eeGDGk0LY3s2hDCw7VhZGShNk7Pbeb9VrvlXJtAT7f5YS2OBjnQ== dependencies: "@noble/curves" "^1.0.0" "@scure/base" "^1.1.1" @@ -5419,6 +5419,11 @@ react-style-singleton@^2.2.1: invariant "^2.2.4" tslib "^2.0.0" +react-tag-input-component@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/react-tag-input-component/-/react-tag-input-component-2.0.2.tgz#f62f013c6a535141dd1c6c3a88858223170150f1" + integrity sha512-dydI9luVwwv9vrjE5u1TTnkcOVkOVL6mhFti8r6hLi78V2F2EKWQOLptURz79UYbDHLSk6tnbvGl8FE+sMpADg== + react@^18.2.0: version "18.2.0" resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5"