forked from Kieran/zap.stream
Edit stream info
This commit is contained in:
parent
88497ad00a
commit
870cdbc2f4
@ -1,15 +1,16 @@
|
|||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { EventPublisher } from "@snort/system";
|
import { EventPublisher, NostrEvent } from "@snort/system";
|
||||||
import { unixNow } from "@snort/shared";
|
import { unixNow } from "@snort/shared";
|
||||||
import "./new-stream.css";
|
import "./new-stream.css";
|
||||||
import AsyncButton from "./async-button";
|
import AsyncButton from "./async-button";
|
||||||
import { System } from "index";
|
import { System } from "index";
|
||||||
|
import { findTag } from "utils";
|
||||||
|
|
||||||
export function NewStream() {
|
export function NewStream({ ev, onFinish }: { ev?: NostrEvent, onFinish: () => void }) {
|
||||||
const [title, setTitle] = useState("");
|
const [title, setTitle] = useState(findTag(ev, "title") ?? "");
|
||||||
const [summary, setSummary] = useState("");
|
const [summary, setSummary] = useState(findTag(ev, "summary") ?? "");
|
||||||
const [image, setImage] = useState("");
|
const [image, setImage] = useState(findTag(ev, "image") ?? "");
|
||||||
const [stream, setStream] = useState("");
|
const [stream, setStream] = useState(findTag(ev, "streaming") ?? "");
|
||||||
const [isValid, setIsValid] = useState(false);
|
const [isValid, setIsValid] = useState(false);
|
||||||
|
|
||||||
function validate() {
|
function validate() {
|
||||||
@ -32,26 +33,27 @@ export function NewStream() {
|
|||||||
async function publishStream() {
|
async function publishStream() {
|
||||||
const pub = await EventPublisher.nip7();
|
const pub = await EventPublisher.nip7();
|
||||||
if (pub) {
|
if (pub) {
|
||||||
const ev = await pub.generic(eb => {
|
const evNew = await pub.generic(eb => {
|
||||||
const now = unixNow();
|
const now = unixNow();
|
||||||
|
const dTag = findTag(ev, "d") ?? now.toString();
|
||||||
return eb.kind(30_311)
|
return eb.kind(30_311)
|
||||||
.tag(["d", now.toString()])
|
.tag(["d", dTag])
|
||||||
.tag(["title", title])
|
.tag(["title", title])
|
||||||
.tag(["summary", summary])
|
.tag(["summary", summary])
|
||||||
.tag(["image", image])
|
.tag(["image", image])
|
||||||
.tag(["streaming", stream])
|
.tag(["streaming", stream])
|
||||||
.tag(["status", "live"])
|
.tag(["status", "live"])
|
||||||
});
|
});
|
||||||
console.debug(ev);
|
console.debug(evNew);
|
||||||
System.BroadcastEvent(ev);
|
System.BroadcastEvent(evNew);
|
||||||
|
onFinish();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return <div className="new-stream">
|
return <div className="new-stream">
|
||||||
<h3>
|
<h3>
|
||||||
New Stream
|
{ev ? "Edit Stream" : "New Stream"}
|
||||||
</h3>
|
</h3>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<p>
|
<p>
|
||||||
Title
|
Title
|
||||||
@ -89,7 +91,7 @@ export function NewStream() {
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<AsyncButton type="button" className="btn btn-primary" disabled={!isValid} onClick={publishStream}>
|
<AsyncButton type="button" className="btn btn-primary" disabled={!isValid} onClick={publishStream}>
|
||||||
Start Stream
|
{ev ? "Save" : "Start Stream"}
|
||||||
</AsyncButton>
|
</AsyncButton>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -72,6 +72,11 @@ a {
|
|||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn-red {
|
||||||
|
background: rgb(143, 0, 0);
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
.btn>span {
|
.btn>span {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -63,7 +63,7 @@ export function LayoutPage() {
|
|||||||
</header>
|
</header>
|
||||||
<Outlet />
|
<Outlet />
|
||||||
{newStream && <Modal onClose={() => setNewStream(false)} >
|
{newStream && <Modal onClose={() => setNewStream(false)} >
|
||||||
<NewStream />
|
<NewStream onFinish={() => navigate("/")} />
|
||||||
</Modal>}
|
</Modal>}
|
||||||
</>
|
</>
|
||||||
}
|
}
|
@ -54,6 +54,8 @@
|
|||||||
|
|
||||||
.live-page .actions {
|
.live-page .actions {
|
||||||
margin: 8px 0 0 0;
|
margin: 8px 0 0 0;
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.live-page .btn.zap {
|
.live-page .btn.zap {
|
||||||
|
@ -15,6 +15,7 @@ import { System } from "index";
|
|||||||
import Modal from "element/modal";
|
import Modal from "element/modal";
|
||||||
import { SendZaps } from "element/send-zap";
|
import { SendZaps } from "element/send-zap";
|
||||||
import { useUserProfile } from "@snort/system-react";
|
import { useUserProfile } from "@snort/system-react";
|
||||||
|
import { NewStream } from "element/new-stream";
|
||||||
|
|
||||||
export function StreamPage() {
|
export function StreamPage() {
|
||||||
const params = useParams();
|
const params = useParams();
|
||||||
@ -23,6 +24,7 @@ export function StreamPage() {
|
|||||||
const login = useLogin();
|
const login = useLogin();
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const [zap, setZap] = useState(false);
|
const [zap, setZap] = useState(false);
|
||||||
|
const [edit, setEdit] = useState(false);
|
||||||
const profile = useUserProfile(System, thisEvent.data?.pubkey);
|
const profile = useUserProfile(System, thisEvent.data?.pubkey);
|
||||||
|
|
||||||
const stream = findTag(thisEvent.data, "streaming");
|
const stream = findTag(thisEvent.data, "streaming");
|
||||||
@ -62,11 +64,14 @@ export function StreamPage() {
|
|||||||
</span>
|
</span>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
<div className="actions">
|
{isMine && <div className="actions">
|
||||||
{isMine && <AsyncButton type="button" className="btn" onClick={deleteStream}>
|
<button type="button" className="btn" onClick={() => setEdit(true)}>
|
||||||
|
Edit
|
||||||
|
</button>
|
||||||
|
<AsyncButton type="button" className="btn btn-red" onClick={deleteStream}>
|
||||||
Delete
|
Delete
|
||||||
</AsyncButton>}
|
</AsyncButton>
|
||||||
</div>
|
</div>}
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div className="flex g24">
|
<div className="flex g24">
|
||||||
@ -89,6 +94,9 @@ export function StreamPage() {
|
|||||||
targetName={getName(thisEvent.data.pubkey, profile)}
|
targetName={getName(thisEvent.data.pubkey, profile)}
|
||||||
onFinish={() => setZap(false)} />
|
onFinish={() => setZap(false)} />
|
||||||
</Modal>}
|
</Modal>}
|
||||||
|
{edit && thisEvent.data && <Modal onClose={() => setEdit(false)}>
|
||||||
|
<NewStream ev={thisEvent.data} onFinish={() => window.location.reload()} />
|
||||||
|
</Modal>}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user