-
Notifications
You must be signed in to change notification settings - Fork 24
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
10 changed files
with
248 additions
and
38 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk'; | ||
import { useQuery } from '@tanstack/react-query'; | ||
|
||
import { useNDK } from '@libs/ndk/provider'; | ||
|
||
export function RelayEventList({ relayUrl }: { relayUrl: string }) { | ||
const { fetcher } = useNDK(); | ||
const { status, data } = useQuery( | ||
['relay-event'], | ||
async () => { | ||
const events = await fetcher.fetchLatestEvents( | ||
[relayUrl], | ||
{ | ||
kinds: [NDKKind.Text, NDKKind.Repost, 1063, NDKKind.Article], | ||
}, | ||
100 | ||
); | ||
|
||
return events as unknown as NDKEvent[]; | ||
}, | ||
{ refetchOnWindowFocus: false } | ||
); | ||
|
||
return ( | ||
<div> | ||
<p>TODO</p> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,66 @@ | ||
import { useQueryClient } from '@tanstack/react-query'; | ||
import { useState } from 'react'; | ||
|
||
import { useStorage } from '@libs/storage/provider'; | ||
|
||
import { PlusIcon } from '@shared/icons'; | ||
|
||
const domainRegex = /^([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{2,}$/; | ||
|
||
export function RelayForm() { | ||
const { db } = useStorage(); | ||
const queryClient = useQueryClient(); | ||
|
||
const [url, setUrl] = useState(''); | ||
const [error, setError] = useState(''); | ||
|
||
const createRelay = async () => { | ||
if (url.length < 1) return setError('Please enter relay url'); | ||
try { | ||
const relay = new URL(url.replace(/\s/g, '')); | ||
if ( | ||
domainRegex.test(relay.host) && | ||
(relay.protocol === 'wss:' || relay.protocol === 'ws:') | ||
) { | ||
const res = await db.createRelay(url); | ||
if (!res) return setError("You're already using this relay"); | ||
|
||
queryClient.invalidateQueries(['user-relay']); | ||
setError(''); | ||
setUrl(''); | ||
} else { | ||
return setError( | ||
'URL is invalid, a relay must use websocket protocol (start with wss:// or ws://). Please check again' | ||
); | ||
} | ||
} catch { | ||
return setError('Relay URL is not valid. Please check again'); | ||
} | ||
}; | ||
|
||
return ( | ||
<div className="flex flex-col gap-1"> | ||
<div className="flex h-10 items-center justify-between rounded-lg bg-white/10 pr-1.5"> | ||
<input | ||
className="h-full w-full bg-transparent pl-3 pr-1.5 placeholder:text-white/70 focus:outline-none" | ||
type="url" | ||
placeholder="wss://" | ||
spellCheck={false} | ||
autoComplete="off" | ||
autoCorrect="off" | ||
autoCapitalize="off" | ||
value={url} | ||
onChange={(e) => setUrl(e.target.value)} | ||
/> | ||
<button | ||
type="button" | ||
onClick={() => createRelay()} | ||
className="inline-flex h-6 w-6 items-center justify-center rounded bg-fuchsia-500 text-white hover:bg-fuchsia-600" | ||
> | ||
<PlusIcon className="h-4 w-4" /> | ||
</button> | ||
</div> | ||
<span className="text-sm text-red-400">{error}</span> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,19 +1,61 @@ | ||
import { Suspense } from 'react'; | ||
import { Await, useLoaderData } from 'react-router-dom'; | ||
|
||
import { LoaderIcon } from '@shared/icons'; | ||
|
||
export function RelayScreen() { | ||
const data: { relay?: { [key: string]: string } } = useLoaderData(); | ||
|
||
return ( | ||
<div> | ||
<Suspense fallback={<p>Loading...</p>}> | ||
<Await | ||
resolve={data.relay} | ||
errorElement={<div>Could not load relay information 😬</div>} | ||
> | ||
{(resolvedRelay) => <p>{JSON.stringify(resolvedRelay)}</p>} | ||
</Await> | ||
</Suspense> | ||
<div className="grid h-full w-full grid-cols-3"> | ||
<div className="col-span-2 border-r border-white/5"></div> | ||
<div className="col-span-1"> | ||
<div className="inline-flex h-16 w-full items-center border-b border-white/5 px-3"> | ||
<h3 className="font-semibold text-white">Information</h3> | ||
</div> | ||
<div className="mt-4 px-3"> | ||
<Suspense | ||
fallback={ | ||
<div className="flex items-center gap-2 text-sm font-medium text-white"> | ||
<LoaderIcon className="h-4 w-4 animate-spin" /> | ||
Loading... | ||
</div> | ||
} | ||
> | ||
<Await | ||
resolve={data.relay} | ||
errorElement={ | ||
<div className="text-sm font-medium"> | ||
<p>Could not load relay information 😬</p> | ||
</div> | ||
} | ||
> | ||
{(resolvedRelay) => ( | ||
<div className="flex flex-col gap-2"> | ||
<p> | ||
<span className="font-semibold">Name</span> : {resolvedRelay.name} | ||
</p> | ||
<p> | ||
<span className="font-semibold">Description</span> :{' '} | ||
{resolvedRelay.description} | ||
</p> | ||
<p> | ||
<span className="font-semibold">Contact</span> :{' '} | ||
{resolvedRelay.contact} | ||
</p> | ||
<p> | ||
<span className="font-semibold">Software</span> : [open website] | ||
</p> | ||
<p> | ||
<span className="font-semibold">Version</span> :{' '} | ||
{resolvedRelay.version} | ||
</p> | ||
</div> | ||
)} | ||
</Await> | ||
</Suspense> | ||
</div> | ||
</div> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
import { SVGProps } from 'react'; | ||
|
||
export function RelayIcon(props: JSX.IntrinsicAttributes & SVGProps<SVGSVGElement>) { | ||
return ( | ||
<svg | ||
xmlns="http://www.w3.org/2000/svg" | ||
width="24" | ||
height="24" | ||
fill="none" | ||
viewBox="0 0 24 24" | ||
{...props} | ||
> | ||
<path | ||
stroke="currentColor" | ||
strokeLinecap="square" | ||
strokeLinejoin="round" | ||
strokeWidth="1.5" | ||
d="M21.25 12V5.75a1 1 0 00-1-1H3.75a1 1 0 00-1 1V12m18.5 0H2.75m18.5 0v6.25a1 1 0 01-1 1H3.75a1 1 0 01-1-1V12" | ||
/> | ||
<path | ||
fill="currentColor" | ||
stroke="currentColor" | ||
strokeWidth="0.5" | ||
d="M6.5 9.125a.75.75 0 100-1.5.75.75 0 000 1.5zm0 7.25a.75.75 0 100-1.5.75.75 0 000 1.5z" | ||
/> | ||
</svg> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters