trycatchkamal/stream
1
0
Fork 0
forked from Kieran/zap.stream
Code Pull Requests Activity

chore: formatting

Browse Source
This commit is contained in:
Kieran 2023-12-04 12:18:47 +00:00
parent eb58fa4d2e
commit 04cdc1e08f
Signed by: Kieran
GPG Key ID: DE71CEB3925BE941
5 changed files with 89 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
postcss.config.js
View File

@ -3,4 +3,4 @@ module.exports = {
tailwindcss: {}, tailwindcss: {},
autoprefixer: {}, autoprefixer: {},
}, },
} };

128
src/element/nostr-provider-dialog.tsx
View File

@ -9,7 +9,11 @@ import { StreamEditor, StreamEditorProps } from "./stream-editor";
import Spinner from "./spinner"; import Spinner from "./spinner";
import AsyncButton from "./async-button"; import AsyncButton from "./async-button";
export function NostrProviderDialog({ provider, showEndpoints, ...others }: { provider: StreamProvider, showEndpoints: boolean } & StreamEditorProps) { export function NostrProviderDialog({
provider,
showEndpoints,
...others
}: { provider: StreamProvider; showEndpoints: boolean } & StreamEditorProps) {
const system = useContext(SnortContext); const system = useContext(SnortContext);
const [topup, setTopup] = useState(false); const [topup, setTopup] = useState(false);
const [info, setInfo] = useState<StreamProviderInfo>(); const [info, setInfo] = useState<StreamProviderInfo>();
@ -119,73 +123,75 @@ export function NostrProviderDialog({ provider, showEndpoints, ...others }: { pr
function streamEndpoints() { function streamEndpoints() {
if (!info) return; if (!info) return;
return <> return (
{info.endpoints.length > 1 && ( <>
{info.endpoints.length > 1 && (
<div>
<p>
<FormattedMessage defaultMessage="Endpoint" id="ljmS5P" />
</p>
<div className="flex gap-2">
{sortEndpoints(info.endpoints).map(a => (
<span className={`pill${ep?.name === a.name ? " active" : ""}`} onClick={() => setEndpoint(a)}>
{a.name}
</span>
))}
</div>
</div>
)}
<div> <div>
<p> <p>
<FormattedMessage defaultMessage="Endpoint" id="ljmS5P" /> <FormattedMessage defaultMessage="Server Url" id="5kx+2v" />
</p>
<div className="paper">
<input type="text" value={ep?.url} disabled />
</div>
</div>
<div>
<p>
<FormattedMessage defaultMessage="Stream Key" id="LknBsU" />
</p> </p>
<div className="flex gap-2"> <div className="flex gap-2">
{sortEndpoints(info.endpoints).map(a => ( <div className="paper grow">
<span className={`pill${ep?.name === a.name ? " active" : ""}`} onClick={() => setEndpoint(a)}> <input type="password" value={ep?.key} disabled />
{a.name} </div>
</span> <button className="btn btn-primary" onClick={() => window.navigator.clipboard.writeText(ep?.key ?? "")}>
<FormattedMessage defaultMessage="Copy" id="4l6vz1" />
</button>
</div>
</div>
<div>
<p>
<FormattedMessage defaultMessage="Balance" id="H5+NAX" />
</p>
<div className="flex gap-2">
<div className="paper grow">
<FormattedMessage
defaultMessage="{amount} sats"
id="vrTOHJ"
values={{ amount: info.balance?.toLocaleString() }}
/>
</div>
<button className="btn btn-primary" onClick={() => setTopup(true)}>
<FormattedMessage defaultMessage="Topup" id="nBCvvJ" />
</button>
</div>
<small>
<FormattedMessage defaultMessage="About {estimate}" id="Q3au2v" values={{ estimate: calcEstimate() }} />
</small>
</div>
<div>
<p>
<FormattedMessage defaultMessage="Resolutions" id="4uI538" />
</p>
<div className="flex gap-2">
{ep?.capabilities?.map(a => (
<span className="pill">{parseCapability(a)}</span>
))} ))}
</div> </div>
</div> </div>
)} </>
<div> );
<p>
<FormattedMessage defaultMessage="Server Url" id="5kx+2v" />
</p>
<div className="paper">
<input type="text" value={ep?.url} disabled />
</div>
</div>
<div>
<p>
<FormattedMessage defaultMessage="Stream Key" id="LknBsU" />
</p>
<div className="flex gap-2">
<div className="paper grow">
<input type="password" value={ep?.key} disabled />
</div>
<button className="btn btn-primary" onClick={() => window.navigator.clipboard.writeText(ep?.key ?? "")}>
<FormattedMessage defaultMessage="Copy" id="4l6vz1" />
</button>
</div>
</div>
<div>
<p>
<FormattedMessage defaultMessage="Balance" id="H5+NAX" />
</p>
<div className="flex gap-2">
<div className="paper grow">
<FormattedMessage
defaultMessage="{amount} sats"
id="vrTOHJ"
values={{ amount: info.balance?.toLocaleString() }}
/>
</div>
<button className="btn btn-primary" onClick={() => setTopup(true)}>
<FormattedMessage defaultMessage="Topup" id="nBCvvJ" />
</button>
</div>
<small>
<FormattedMessage defaultMessage="About {estimate}" id="Q3au2v" values={{ estimate: calcEstimate() }} />
</small>
</div>
<div>
<p>
<FormattedMessage defaultMessage="Resolutions" id="4uI538" />
</p>
<div className="flex gap-2">
{ep?.capabilities?.map(a => (
<span className="pill">{parseCapability(a)}</span>
))}
</div>
</div>
</>
} }
return ( return (
<> <>

28
src/pages/settings-page.tsx
View File

@ -9,7 +9,6 @@ import { useLogin } from "@/hooks/login";
import Copy from "@/element/copy"; import Copy from "@/element/copy";
import { NostrProviderDialog } from "@/element/nostr-provider-dialog"; import { NostrProviderDialog } from "@/element/nostr-provider-dialog";
import { useStreamProvider } from "@/hooks/stream-provider"; import { useStreamProvider } from "@/hooks/stream-provider";
import { StreamProviders } from "@/providers";
const enum Tab { const enum Tab {
Account, Account,
@ -61,20 +60,24 @@ export function SettingsPage() {
); );
} }
case Tab.Stream: { case Tab.Stream: {
return <> return (
<h1> <>
<FormattedMessage defaultMessage="Stream Key" id="LknBsU" /> <h1>
</h1> <FormattedMessage defaultMessage="Stream Key" id="LknBsU" />
<NostrProviderDialog provider={unwrap(providers.find(a => a.name === "zap.stream"))} showEndpoints={true} /> </h1>
</> <NostrProviderDialog provider={unwrap(providers.find(a => a.name === "zap.stream"))} showEndpoints={true} />
</>
);
} }
} }
} }
function tabName(t: Tab) { function tabName(t: Tab) {
switch (t) { switch (t) {
case Tab.Account: return <FormattedMessage defaultMessage="Account" id="TwyMau" />; case Tab.Account:
case Tab.Stream: return <FormattedMessage defaultMessage="Stream" id="uYw2LD" /> return <FormattedMessage defaultMessage="Account" id="TwyMau" />;
case Tab.Stream:
return <FormattedMessage defaultMessage="Stream" id="uYw2LD" />;
} }
} }
@ -86,10 +89,9 @@ export function SettingsPage() {
</h1> </h1>
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
<div className="flex gap-2 tab-options"> <div className="flex gap-2 tab-options">
{[Tab.Account, Tab.Stream].map(t => <div onClick={() => setTab(t)}> {[Tab.Account, Tab.Stream].map(t => (
{tabName(t)} <div onClick={() => setTab(t)}>{tabName(t)}</div>
</div> ))}
)}
</div> </div>
<div className="tab-content">{tabContent()}</div> <div className="tab-content">{tabContent()}</div>
</div> </div>

6
src/pages/widgets/zaps.tsx
View File

@ -64,7 +64,11 @@ export function ZapAlerts({ link }: { link: NostrLink }) {
} }
}, [zap?.id]); }, [zap?.id]);
return <div className="flex items-center flex-col gap-2 zap-alerts-widget">{zap && <ZapAlertItem key={zap.id} item={zap} />}</div>; return (
<div className="flex items-center flex-col gap-2 zap-alerts-widget">
{zap && <ZapAlertItem key={zap.id} item={zap} />}
</div>
);
} }
export function ZapAlertItem({ item }: { item: ParsedZap }) { export function ZapAlertItem({ item }: { item: ParsedZap }) {