forked from Kieran/snort
feat: simple donate page
This commit is contained in:
parent
b35608c17d
commit
2f8f8d8075
@ -1,4 +1,6 @@
|
||||
import "./ProfilePreview.css";
|
||||
import { ReactNode } from "react";
|
||||
|
||||
import ProfileImage from "./ProfileImage";
|
||||
import FollowButton from "./FollowButton";
|
||||
import useProfile from "../feed/ProfileFeed";
|
||||
@ -8,7 +10,8 @@ export interface ProfilePreviewProps {
|
||||
pubkey: HexKey,
|
||||
options?: {
|
||||
about?: boolean
|
||||
}
|
||||
},
|
||||
actions?: ReactNode
|
||||
}
|
||||
export default function ProfilePreview(props: ProfilePreviewProps) {
|
||||
const pubkey = props.pubkey;
|
||||
@ -24,7 +27,7 @@ export default function ProfilePreview(props: ProfilePreviewProps) {
|
||||
{options.about ? <div className="f-ellipsis about">
|
||||
{user?.about}
|
||||
</div> : undefined} />
|
||||
<FollowButton pubkey={pubkey} className="ml5" />
|
||||
{props.actions ?? <FollowButton pubkey={pubkey} className="ml5" />}
|
||||
</div>
|
||||
)
|
||||
}
|
25
src/element/ZapButton.tsx
Normal file
25
src/element/ZapButton.tsx
Normal file
@ -0,0 +1,25 @@
|
||||
import { faBolt } from "@fortawesome/free-solid-svg-icons";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { useState } from "react";
|
||||
import useProfile from "../feed/ProfileFeed";
|
||||
import { HexKey } from "../nostr";
|
||||
import LNURLTip from "./LNURLTip";
|
||||
|
||||
const ZapButton = ({ pubkey }: { pubkey: HexKey }) => {
|
||||
const profile = useProfile(pubkey)?.get(pubkey);
|
||||
const [zap, setZap] = useState(false);
|
||||
const svc = profile?.lud16 || profile?.lud06;
|
||||
|
||||
if (!svc) return null;
|
||||
|
||||
return (
|
||||
<>
|
||||
<span className="pill" onClick={(e) => setZap(true)}>
|
||||
<FontAwesomeIcon icon={faBolt} />
|
||||
</span>
|
||||
<LNURLTip svc={svc} show={zap} onClose={() => setZap(false)} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default ZapButton;
|
@ -266,6 +266,14 @@ body.scroll-lock {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.m5 {
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.m10 {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.mr10 {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
@ -22,6 +22,7 @@ import ErrorPage from './pages/ErrorPage';
|
||||
import VerificationPage from './pages/Verification';
|
||||
import MessagesPage from './pages/MessagesPage';
|
||||
import ChatPage from './pages/ChatPage';
|
||||
import DonatePage from './pages/DonatePage';
|
||||
|
||||
/**
|
||||
* HTTP query provider
|
||||
@ -72,6 +73,10 @@ const router = createBrowserRouter([
|
||||
{
|
||||
path: "/messages/:id",
|
||||
element: <ChatPage />
|
||||
},
|
||||
{
|
||||
path: "/donate",
|
||||
element: <DonatePage />
|
||||
}
|
||||
]
|
||||
}
|
||||
|
29
src/pages/DonatePage.tsx
Normal file
29
src/pages/DonatePage.tsx
Normal file
@ -0,0 +1,29 @@
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import ProfilePreview from "../element/ProfilePreview";
|
||||
import ZapButton from "../element/ZapButton";
|
||||
|
||||
const Developers = [
|
||||
"63fe6318dc58583cfe16810f86dd09e18bfd76aabc24a0081ce2856f330504ed", // kieran
|
||||
"7fa56f5d6962ab1e3cd424e758c3002b8665f7b0d8dcee9fe9e288d7751ac194" // verbiricha
|
||||
];
|
||||
|
||||
const DonatePage = () => {
|
||||
return (
|
||||
<div className="m5">
|
||||
<h2>Help fund the development of Snort</h2>
|
||||
<p>
|
||||
Snort is an open source project built by passionate people in their free time
|
||||
</p>
|
||||
<p>
|
||||
Your donations are greatly appreciated
|
||||
</p>
|
||||
<p>
|
||||
Check out the code here: <a href="https://github.com/v0l/snort" rel="_noref" target="_blank">https://github.com/v0l/snort</a>
|
||||
</p>
|
||||
<h3>Developers</h3>
|
||||
{Developers.map(a => <ProfilePreview pubkey={a} key={a} actions={<ZapButton pubkey={a} />} />)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default DonatePage;
|
Loading…
Reference in New Issue
Block a user