mirror of
https://github.com/luminous-devs/lume.git
synced 2024-10-02 09:50:47 +00:00
migrate to tanstack query v5
This commit is contained in:
reya
parent
42eb882f52
commit
555c8ec08a
@ -63,7 +63,7 @@
|
||||
"html-to-text": "^9.0.5",
|
||||
"light-bolt11-decoder": "^3.0.0",
|
||||
"lru-cache": "^10.0.1",
|
||||
"media-chrome": "^1.4.4",
|
||||
"media-chrome": "^1.4.5",
|
||||
"million": "^2.6.4",
|
||||
"minidenticons": "^4.2.0",
|
||||
"nostr-fetch": "^0.13.0",
|
||||
@ -86,7 +86,7 @@
|
||||
"tauri-controls": "^0.2.0",
|
||||
"tippy.js": "^6.3.7",
|
||||
"tiptap-markdown": "^0.8.2",
|
||||
"virtua": "^0.15.4",
|
||||
"virtua": "^0.15.6",
|
||||
"zustand": "^4.4.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@ -51,43 +51,43 @@ dependencies:
|
||||
specifier: ^5.0.5
|
||||
version: 5.0.5(react-dom@18.2.0)(react@18.2.0)
|
||||
'@tauri-apps/api':
|
||||
specifier: ^2.0.0-alpha.9
|
||||
specifier: 2.0.0-alpha.9
|
||||
version: 2.0.0-alpha.9
|
||||
'@tauri-apps/cli':
|
||||
specifier: ^2.0.0-alpha.16
|
||||
specifier: 2.0.0-alpha.16
|
||||
version: 2.0.0-alpha.16
|
||||
'@tauri-apps/plugin-clipboard-manager':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-dialog':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-fs':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-http':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-notification':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-os':
|
||||
specifier: ^2.0.0-alpha.3
|
||||
specifier: 2.0.0-alpha.3
|
||||
version: 2.0.0-alpha.3
|
||||
'@tauri-apps/plugin-process':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-shell':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-sql':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-updater':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tauri-apps/plugin-upload':
|
||||
specifier: ^2.0.0-alpha.2
|
||||
specifier: 2.0.0-alpha.2
|
||||
version: 2.0.0-alpha.2
|
||||
'@tiptap/extension-character-count':
|
||||
specifier: ^2.1.12
|
||||
@ -141,8 +141,8 @@ dependencies:
|
||||
specifier: ^10.0.1
|
||||
version: 10.0.1
|
||||
media-chrome:
|
||||
specifier: ^1.4.4
|
||||
version: 1.4.4
|
||||
specifier: ^1.4.5
|
||||
version: 1.4.5
|
||||
million:
|
||||
specifier: ^2.6.4
|
||||
version: 2.6.4
|
||||
@ -210,8 +210,8 @@ dependencies:
|
||||
specifier: ^0.8.2
|
||||
version: 0.8.2(@tiptap/core@2.1.12)
|
||||
virtua:
|
||||
specifier: ^0.15.4
|
||||
version: 0.15.4(react-dom@18.2.0)(react@18.2.0)
|
||||
specifier: ^0.15.6
|
||||
version: 0.15.6(react-dom@18.2.0)(react@18.2.0)
|
||||
zustand:
|
||||
specifier: ^4.4.4
|
||||
version: 4.4.4(@types/react@18.2.33)(react@18.2.0)
|
||||
@ -2549,9 +2549,9 @@ packages:
|
||||
prosemirror-schema-list: 1.3.0
|
||||
prosemirror-state: 1.4.3
|
||||
prosemirror-tables: 1.3.4
|
||||
prosemirror-trailing-node: 2.0.7(prosemirror-model@1.19.3)(prosemirror-state@1.4.3)(prosemirror-view@1.32.1)
|
||||
prosemirror-trailing-node: 2.0.7(prosemirror-model@1.19.3)(prosemirror-state@1.4.3)(prosemirror-view@1.32.2)
|
||||
prosemirror-transform: 1.8.0
|
||||
prosemirror-view: 1.32.1
|
||||
prosemirror-view: 1.32.2
|
||||
dev: false
|
||||
|
||||
/@tiptap/react@2.1.12(@tiptap/core@2.1.12)(@tiptap/pm@2.1.12)(react-dom@18.2.0)(react@18.2.0):
|
||||
@ -3047,16 +3047,16 @@ packages:
|
||||
- '@swc/helpers'
|
||||
dev: true
|
||||
|
||||
/acorn-jsx@5.3.2(acorn@8.11.1):
|
||||
/acorn-jsx@5.3.2(acorn@8.11.2):
|
||||
resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
|
||||
peerDependencies:
|
||||
acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
|
||||
dependencies:
|
||||
acorn: 8.11.1
|
||||
acorn: 8.11.2
|
||||
dev: true
|
||||
|
||||
/acorn@8.11.1:
|
||||
resolution: {integrity: sha512-IJTNCJMRHfRfb8un89z1QtS0x890C2QUrUxFMK8zy+RizcId6mfnqOf68Bu9YkDgpLYuvCm6aYbwDatXVZPjMQ==}
|
||||
/acorn@8.11.2:
|
||||
resolution: {integrity: sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==}
|
||||
engines: {node: '>=0.4.0'}
|
||||
hasBin: true
|
||||
|
||||
@ -3217,7 +3217,7 @@ packages:
|
||||
postcss: ^8.1.0
|
||||
dependencies:
|
||||
browserslist: 4.22.1
|
||||
caniuse-lite: 1.0.30001554
|
||||
caniuse-lite: 1.0.30001555
|
||||
fraction.js: 4.3.7
|
||||
normalize-range: 0.1.2
|
||||
picocolors: 1.0.0
|
||||
@ -3269,8 +3269,8 @@ packages:
|
||||
engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
|
||||
hasBin: true
|
||||
dependencies:
|
||||
caniuse-lite: 1.0.30001554
|
||||
electron-to-chromium: 1.4.568
|
||||
caniuse-lite: 1.0.30001555
|
||||
electron-to-chromium: 1.4.569
|
||||
node-releases: 2.0.13
|
||||
update-browserslist-db: 1.0.13(browserslist@4.22.1)
|
||||
|
||||
@ -3299,8 +3299,8 @@ packages:
|
||||
resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
|
||||
engines: {node: '>= 6'}
|
||||
|
||||
/caniuse-lite@1.0.30001554:
|
||||
resolution: {integrity: sha512-A2E3U//MBwbJVzebddm1YfNp7Nud5Ip+IPn4BozBmn4KqVX7AvluoIDFWjsv5OkGnKUXQVmMSoMKLa3ScCblcQ==}
|
||||
/caniuse-lite@1.0.30001555:
|
||||
resolution: {integrity: sha512-NzbUFKUnJ3DTcq6YyZB6+qqhfD112uR3uoEnkmfzm2wVzUNsFkU7AwBjKQ654Sp5cau0JxhFyRSn/tQZ+XfygA==}
|
||||
|
||||
/case-anything@2.1.13:
|
||||
resolution: {integrity: sha512-zlOQ80VrQ2Ue+ymH5OuM/DlDq64mEm+B9UTdHULv5osUMD6HalNTblf2b1u/m6QecjsnOkBpqVZ+XPwIVsy7Ng==}
|
||||
@ -3674,8 +3674,8 @@ packages:
|
||||
resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
|
||||
dev: true
|
||||
|
||||
/electron-to-chromium@1.4.568:
|
||||
resolution: {integrity: sha512-3TCOv8+BY6Ltpt1/CmGBMups2IdKOyfEmz4J8yIS4xLSeMm0Rf+psSaxLuswG9qMKt+XbNbmADybtXGpTFlbDg==}
|
||||
/electron-to-chromium@1.4.569:
|
||||
resolution: {integrity: sha512-LsrJjZ0IbVy12ApW3gpYpcmHS3iRxH4bkKOW98y1/D+3cvDUWGcbzbsFinfUS8knpcZk/PG/2p/RnkMCYN7PVg==}
|
||||
|
||||
/emoji-regex@9.2.2:
|
||||
resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
|
||||
@ -3988,8 +3988,8 @@ packages:
|
||||
resolution: {integrity: sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==}
|
||||
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
|
||||
dependencies:
|
||||
acorn: 8.11.1
|
||||
acorn-jsx: 5.3.2(acorn@8.11.1)
|
||||
acorn: 8.11.2
|
||||
acorn-jsx: 5.3.2(acorn@8.11.2)
|
||||
eslint-visitor-keys: 3.4.3
|
||||
dev: true
|
||||
|
||||
@ -5026,8 +5026,8 @@ packages:
|
||||
resolution: {integrity: sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==}
|
||||
dev: false
|
||||
|
||||
/media-chrome@1.4.4:
|
||||
resolution: {integrity: sha512-L3EImWE2ft3dEXnku7mwEl71L8GWFvsnqQQsmtlbuLqekCkIACjL1KjLErReALB9JmrY19ffB4GeGZjLZDwALg==}
|
||||
/media-chrome@1.4.5:
|
||||
resolution: {integrity: sha512-WRi+4XV4oCx8nwUEhhKxqF78mdQDVTPHgq2g/Mkt8C8lmIaca9WwnahZ0MHx8fy8XAEaiIv1B25555lpvZncJQ==}
|
||||
dev: false
|
||||
|
||||
/merge-stream@2.0.0:
|
||||
@ -5791,7 +5791,7 @@ packages:
|
||||
dependencies:
|
||||
prosemirror-state: 1.4.3
|
||||
prosemirror-transform: 1.8.0
|
||||
prosemirror-view: 1.32.1
|
||||
prosemirror-view: 1.32.2
|
||||
dev: false
|
||||
|
||||
/prosemirror-gapcursor@1.3.2:
|
||||
@ -5800,7 +5800,7 @@ packages:
|
||||
prosemirror-keymap: 1.2.2
|
||||
prosemirror-model: 1.19.3
|
||||
prosemirror-state: 1.4.3
|
||||
prosemirror-view: 1.32.1
|
||||
prosemirror-view: 1.32.2
|
||||
dev: false
|
||||
|
||||
/prosemirror-history@1.3.2:
|
||||
@ -5808,7 +5808,7 @@ packages:
|
||||
dependencies:
|
||||
prosemirror-state: 1.4.3
|
||||
prosemirror-transform: 1.8.0
|
||||
prosemirror-view: 1.32.1
|
||||
prosemirror-view: 1.32.2
|
||||
rope-sequence: 1.3.4
|
||||
dev: false
|
||||
|
||||
@ -5867,7 +5867,7 @@ packages:
|
||||
dependencies:
|
||||
prosemirror-model: 1.19.3
|
||||
prosemirror-transform: 1.8.0
|
||||
prosemirror-view: 1.32.1
|
||||
prosemirror-view: 1.32.2
|
||||
dev: false
|
||||
|
||||
/prosemirror-tables@1.3.4:
|
||||
@ -5877,10 +5877,10 @@ packages:
|
||||
prosemirror-model: 1.19.3
|
||||
prosemirror-state: 1.4.3
|
||||
prosemirror-transform: 1.8.0
|
||||
prosemirror-view: 1.32.1
|
||||
prosemirror-view: 1.32.2
|
||||
dev: false
|
||||
|
||||
/prosemirror-trailing-node@2.0.7(prosemirror-model@1.19.3)(prosemirror-state@1.4.3)(prosemirror-view@1.32.1):
|
||||
/prosemirror-trailing-node@2.0.7(prosemirror-model@1.19.3)(prosemirror-state@1.4.3)(prosemirror-view@1.32.2):
|
||||
resolution: {integrity: sha512-8zcZORYj/8WEwsGo6yVCRXFMOfBo0Ub3hCUvmoWIZYfMP26WqENU0mpEP27w7mt8buZWuGrydBewr0tOArPb1Q==}
|
||||
peerDependencies:
|
||||
prosemirror-model: ^1.19.0
|
||||
@ -5892,7 +5892,7 @@ packages:
|
||||
escape-string-regexp: 4.0.0
|
||||
prosemirror-model: 1.19.3
|
||||
prosemirror-state: 1.4.3
|
||||
prosemirror-view: 1.32.1
|
||||
prosemirror-view: 1.32.2
|
||||
dev: false
|
||||
|
||||
/prosemirror-transform@1.8.0:
|
||||
@ -5901,8 +5901,8 @@ packages:
|
||||
prosemirror-model: 1.19.3
|
||||
dev: false
|
||||
|
||||
/prosemirror-view@1.32.1:
|
||||
resolution: {integrity: sha512-9SnB4HBgRczzTyIMZLPE1iszegL04hNfUyS8uPtP1RPxNM2NTCiIs8KwNsJU4nbZO9rxJTwVTv7Jm3zU4CR78A==}
|
||||
/prosemirror-view@1.32.2:
|
||||
resolution: {integrity: sha512-l2RQUGaiDI8SG8ZjWIkjT8yjGmNwdzMFMzQmxv/Kh8Vx+ICnz5R+K0mrOS16rhfjX7n2t4emU0goh7TerQC3mw==}
|
||||
dependencies:
|
||||
prosemirror-model: 1.19.3
|
||||
prosemirror-state: 1.4.3
|
||||
@ -6795,7 +6795,7 @@ packages:
|
||||
/unplugin@1.5.0:
|
||||
resolution: {integrity: sha512-9ZdRwbh/4gcm1JTOkp9lAkIDrtOyOxgHmY7cjuwI8L/2RTikMcVG25GsZwNAgRuap3iDw2jeq7eoqtAsz5rW3A==}
|
||||
dependencies:
|
||||
acorn: 8.11.1
|
||||
acorn: 8.11.2
|
||||
chokidar: 3.5.3
|
||||
webpack-sources: 3.2.3
|
||||
webpack-virtual-modules: 0.5.0
|
||||
@ -6887,8 +6887,8 @@ packages:
|
||||
vfile-message: 4.0.2
|
||||
dev: false
|
||||
|
||||
/virtua@0.15.4(react-dom@18.2.0)(react@18.2.0):
|
||||
resolution: {integrity: sha512-gC52UMvipt5ejDuolszdMAIapoDZul3cpsYIznjEUUbws169/dFHRwzzoI7e5niViDBBt6e+N4RnicGdcuc0UQ==}
|
||||
/virtua@0.15.6(react-dom@18.2.0)(react@18.2.0):
|
||||
resolution: {integrity: sha512-j9EfyAmpp6VwuHmnXkWpzciHRdlY7XGPzZg3ZqOPFW+phNUnFQALYdrThc3CYHZFsj380ieIegdjPGS+Qbkuyg==}
|
||||
peerDependencies:
|
||||
react: '>=16.14.0'
|
||||
react-dom: '>=16.14.0'
|
||||
|
||||
@ -9,9 +9,9 @@ import { User } from '@shared/user';
|
||||
export function FollowList() {
|
||||
const { db } = useStorage();
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['follows'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['follows'],
|
||||
queryFn: async () => {
|
||||
const user = ndk.getUser({ hexpubkey: db.account.pubkey });
|
||||
const follows = await user.follows();
|
||||
const followsAsArr = [];
|
||||
@ -29,16 +29,14 @@ export function FollowList() {
|
||||
|
||||
return followsAsArr;
|
||||
},
|
||||
{
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="relative rounded-xl bg-neutral-100 p-3 text-neutral-800 dark:bg-neutral-900 dark:text-neutral-200">
|
||||
<h5 className="font-semibold">Your follows</h5>
|
||||
<div className="mt-2 flex w-full items-center justify-center">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<LoaderIcon className="h-4 w-4 animate-spin text-neutral-900 dark:text-neutral-100" />
|
||||
) : (
|
||||
<div className="isolate flex -space-x-2">
|
||||
|
||||
@ -17,12 +17,15 @@ import { arrayToNIP02 } from '@utils/transform';
|
||||
export function OnboardEnrichScreen() {
|
||||
const { ndk } = useNDK();
|
||||
const { db } = useStorage();
|
||||
const { status, data } = useQuery(['trending-profiles-widget'], async () => {
|
||||
const res = await fetch('https://api.nostr.band/v0/trending/profiles');
|
||||
if (!res.ok) {
|
||||
throw new Error('Error');
|
||||
}
|
||||
return res.json();
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['trending-profiles-widget'],
|
||||
queryFn: async () => {
|
||||
const res = await fetch('https://api.nostr.band/v0/trending/profiles');
|
||||
if (!res.ok) {
|
||||
throw new Error('Error');
|
||||
}
|
||||
return res.json();
|
||||
},
|
||||
});
|
||||
|
||||
const [loading, setLoading] = useState(false);
|
||||
@ -90,7 +93,7 @@ export function OnboardEnrichScreen() {
|
||||
</h1>
|
||||
</div>
|
||||
<div className="flex w-full flex-nowrap items-center gap-4 overflow-x-auto px-4 scrollbar-none">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<LoaderIcon className="h-4 w-4 animate-spin text-neutral-900 dark:text-neutral-100" />
|
||||
</div>
|
||||
|
||||
@ -24,15 +24,13 @@ export function OnboardRelaysScreen() {
|
||||
const { db } = useStorage();
|
||||
const { ndk } = useNDK();
|
||||
const { getAllRelaysByUsers } = useNostr();
|
||||
const { status, data } = useQuery(
|
||||
['relays'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['relays'],
|
||||
queryFn: async () => {
|
||||
return await getAllRelaysByUsers();
|
||||
},
|
||||
{
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
const toggleRelay = (relay: string) => {
|
||||
if (relays.has(relay)) {
|
||||
@ -89,7 +87,7 @@ export function OnboardRelaysScreen() {
|
||||
</h1>
|
||||
<div className="flex flex-col gap-4">
|
||||
<div className="flex h-[420px] w-full flex-col overflow-y-auto rounded-xl bg-neutral-100 dark:bg-neutral-900">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<LoaderIcon className="h-4 w-4 animate-spin text-neutral-900 dark:text-neutral-100" />
|
||||
</div>
|
||||
|
||||
@ -22,8 +22,12 @@ export function ChatScreen() {
|
||||
const { ndk } = useNDK();
|
||||
const { pubkey } = useParams();
|
||||
const { fetchNIP04Messages } = useNostr();
|
||||
const { status, data } = useQuery(['nip04-dm', pubkey], async () => {
|
||||
return await fetchNIP04Messages(pubkey);
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['nip04-dm', pubkey],
|
||||
queryFn: async () => {
|
||||
return await fetchNIP04Messages(pubkey);
|
||||
},
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
const renderItem = useCallback(
|
||||
@ -69,7 +73,7 @@ export function ChatScreen() {
|
||||
<User pubkey={pubkey} variant="simple" />
|
||||
</div>
|
||||
<div className="h-full w-full flex-1 px-3 py-3">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<div className="flex flex-col items-center gap-1.5">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-neutral-900 dark:text-neutral-100" />
|
||||
|
||||
@ -19,7 +19,7 @@ export const ChatListItem = memo(function ChatListItem({ event }: { event: NDKEv
|
||||
const svgURI =
|
||||
'data:image/svg+xml;utf8,' + encodeURIComponent(minidenticon(event.pubkey, 90, 50));
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="flex items-center gap-2.5 rounded-md px-3">
|
||||
<div className="h-10 w-10 shrink-0 animate-pulse rounded-lg bg-neutral-400 dark:bg-neutral-600" />
|
||||
|
||||
@ -3,14 +3,11 @@ import { Dispatch, SetStateAction, useState } from 'react';
|
||||
|
||||
import { LoaderIcon, MediaIcon } from '@shared/icons';
|
||||
|
||||
import { useNostr } from '@utils/hooks/useNostr';
|
||||
|
||||
export function MediaUploader({
|
||||
setState,
|
||||
}: {
|
||||
setState: Dispatch<SetStateAction<string>>;
|
||||
}) {
|
||||
const { upload } = useNostr();
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const uploadMedia = async () => {
|
||||
|
||||
@ -11,18 +11,16 @@ import { useNostr } from '@utils/hooks/useNostr';
|
||||
|
||||
export function ChatsScreen() {
|
||||
const { getAllNIP04Chats } = useNostr();
|
||||
const { status, data } = useQuery(
|
||||
['nip04-chats'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['nip04-chats'],
|
||||
queryFn: async () => {
|
||||
return await getAllNIP04Chats();
|
||||
},
|
||||
{
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
staleTime: Infinity,
|
||||
}
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
staleTime: Infinity,
|
||||
});
|
||||
|
||||
const renderItem = useCallback(
|
||||
(event: NDKEvent) => {
|
||||
@ -43,7 +41,7 @@ export function ChatsScreen() {
|
||||
</h3>
|
||||
</div>
|
||||
<div className="flex h-full flex-col gap-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center pb-16">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-neutral-900 dark:text-neutral-100" />
|
||||
|
||||
@ -8,7 +8,6 @@ interface RouteError {
|
||||
|
||||
interface DebugInfo {
|
||||
os: null | string;
|
||||
version: null | string;
|
||||
appDir: null | string;
|
||||
}
|
||||
|
||||
@ -18,24 +17,20 @@ export function ErrorScreen() {
|
||||
|
||||
const [debugInfo, setDebugInfo] = useState<DebugInfo>({
|
||||
os: null,
|
||||
version: null,
|
||||
appDir: null,
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
async function getInformation() {
|
||||
const { platform, version } = await import('@tauri-apps/plugin-os');
|
||||
const { getVersion } = await import('@tauri-apps/plugin-app');
|
||||
const { appConfigDir } = await import('@tauri-apps/api/path');
|
||||
|
||||
const platformName = await platform();
|
||||
const osVersion = await version();
|
||||
const appVersion = await getVersion();
|
||||
const appDir = await appConfigDir();
|
||||
|
||||
setDebugInfo({
|
||||
os: platformName + ' ' + osVersion,
|
||||
version: appVersion,
|
||||
appDir: appDir,
|
||||
});
|
||||
}
|
||||
@ -59,9 +54,6 @@ export function ErrorScreen() {
|
||||
<p className="font-medium text-neutral-600 dark:text-neutral-400">
|
||||
Current location: {location.pathname}
|
||||
</p>
|
||||
<p className="font-medium text-neutral-600 dark:text-neutral-400">
|
||||
App version: {debugInfo.version}
|
||||
</p>
|
||||
<p className="font-medium text-neutral-600 dark:text-neutral-400">
|
||||
Platform: {debugInfo.os}
|
||||
</p>
|
||||
|
||||
@ -5,7 +5,7 @@ import { useProfile } from '@utils/hooks/useProfile';
|
||||
export const GroupTitle = memo(function GroupTitle({ pubkey }: { pubkey: string }) {
|
||||
const { status, user } = useProfile(pubkey);
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return <div className="h-3 w-24 animate-pulse rounded bg-white/10" />;
|
||||
}
|
||||
|
||||
|
||||
@ -16,8 +16,12 @@ import { useNostr } from '@utils/hooks/useNostr';
|
||||
|
||||
export function UserLatestPosts({ pubkey }: { pubkey: string }) {
|
||||
const { getEventsByPubkey } = useNostr();
|
||||
const { status, data } = useQuery(['user-posts', pubkey], async () => {
|
||||
return await getEventsByPubkey(pubkey);
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['user-posts', pubkey],
|
||||
queryFn: async () => {
|
||||
return await getEventsByPubkey(pubkey);
|
||||
},
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
const renderItem = useCallback(
|
||||
@ -60,7 +64,7 @@ export function UserLatestPosts({ pubkey }: { pubkey: string }) {
|
||||
Latest post
|
||||
</h3>
|
||||
<div>
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="px-3">
|
||||
<div className="inline-flex h-16 w-full items-center justify-center gap-1.5 rounded-lg bg-neutral-300 text-sm font-medium dark:bg-neutral-700">
|
||||
<LoaderIcon className="h-4 w-4 animate-spin" />
|
||||
|
||||
@ -84,7 +84,7 @@ export const UserWithDrawer = memo(function UserWithDrawer({
|
||||
<Dialog.Portal>
|
||||
<Dialog.Content className="fixed right-0 top-0 z-50 flex h-full w-[400px] animate-slideRightAndFade items-center justify-center px-4 pb-4 pt-16 transition-all">
|
||||
<div className="h-full w-full overflow-y-auto rounded-lg border border-neutral-300 bg-neutral-200 py-3 dark:border-neutral-700 dark:bg-neutral-800">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div>
|
||||
<p>Loading...</p>
|
||||
</div>
|
||||
|
||||
@ -6,7 +6,7 @@ import { displayNpub } from '@utils/shortenKey';
|
||||
export function MentionPopupItem({ pubkey, embed }: { pubkey: string; embed?: string }) {
|
||||
const { status, user } = useProfile(pubkey, embed);
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="flex items-center gap-2.5 px-2">
|
||||
<div className="relative h-8 w-8 shrink-0 animate-pulse rounded bg-neutral-400 dark:bg-neutral-600" />
|
||||
|
||||
@ -72,7 +72,7 @@ export function ArticleNoteScreen() {
|
||||
</div>
|
||||
<div className="relative col-span-6 flex flex-col overflow-y-auto">
|
||||
<div className="mx-auto w-full max-w-2xl">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="px-3 py-1.5">Loading...</div>
|
||||
) : (
|
||||
<div className="flex h-min w-full flex-col px-3">
|
||||
|
||||
@ -91,7 +91,7 @@ export function TextNoteScreen() {
|
||||
</div>
|
||||
<div className="relative col-span-6 flex flex-col overflow-y-auto">
|
||||
<div className="mx-auto w-full max-w-2xl">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="px-3 py-1.5">Loading...</div>
|
||||
) : (
|
||||
<div className="flex h-min w-full flex-col px-3">
|
||||
|
||||
@ -17,9 +17,9 @@ import {
|
||||
|
||||
export function RelayEventList({ relayUrl }: { relayUrl: string }) {
|
||||
const { fetcher } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['relay-event'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['relay-event'],
|
||||
queryFn: async () => {
|
||||
const url = 'wss://' + relayUrl;
|
||||
const events = await fetcher.fetchLatestEvents(
|
||||
[url],
|
||||
@ -30,8 +30,8 @@ export function RelayEventList({ relayUrl }: { relayUrl: string }) {
|
||||
);
|
||||
return events as unknown as NDKEvent[];
|
||||
},
|
||||
{ refetchOnWindowFocus: false }
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
const renderItem = useCallback(
|
||||
(event: NDKEvent) => {
|
||||
@ -70,7 +70,7 @@ export function RelayEventList({ relayUrl }: { relayUrl: string }) {
|
||||
return (
|
||||
<div className="h-full">
|
||||
<div className="mx-auto w-full max-w-[500px]">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-white" />
|
||||
@ -78,7 +78,7 @@ export function RelayEventList({ relayUrl }: { relayUrl: string }) {
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<VList className="scrollbar-none h-full">
|
||||
<VList className="h-full scrollbar-none">
|
||||
<div className="h-10" />
|
||||
{data.map((item) => renderItem(item))}
|
||||
<div className="h-16" />
|
||||
|
||||
@ -25,7 +25,10 @@ export function RelayForm() {
|
||||
const res = await db.createRelay(url);
|
||||
if (!res) return setError("You're already using this relay");
|
||||
|
||||
queryClient.invalidateQueries(['user-relay']);
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['user-relay'],
|
||||
});
|
||||
|
||||
setError('');
|
||||
setUrl('');
|
||||
} else {
|
||||
|
||||
@ -17,18 +17,16 @@ export function RelayList() {
|
||||
|
||||
const { getAllRelaysByUsers } = useNostr();
|
||||
const { db } = useStorage();
|
||||
const { status, data } = useQuery(
|
||||
['relays'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['relays'],
|
||||
queryFn: async () => {
|
||||
return await getAllRelaysByUsers();
|
||||
},
|
||||
{
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
staleTime: Infinity,
|
||||
}
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
staleTime: Infinity,
|
||||
});
|
||||
|
||||
const inspectRelay = (relayUrl: string) => {
|
||||
const url = new URL(relayUrl);
|
||||
@ -40,12 +38,14 @@ export function RelayList() {
|
||||
const res = await db.createRelay(url);
|
||||
|
||||
if (!res) await message("You're aldready connected to this relay");
|
||||
queryClient.invalidateQueries(['user-relay']);
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['user-relay'],
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="col-span-2 border-r border-neutral-100 dark:border-neutral-900">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center pb-10">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-neutral-900 dark:text-neutral-100" />
|
||||
|
||||
@ -12,22 +12,24 @@ export function UserRelay() {
|
||||
|
||||
const { relayUrls } = useNDK();
|
||||
const { db } = useStorage();
|
||||
const { status, data } = useQuery(
|
||||
['user-relay'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['user-relay'],
|
||||
queryFn: async () => {
|
||||
return await db.getExplicitRelayUrls();
|
||||
},
|
||||
{ refetchOnWindowFocus: false }
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
const removeRelay = async (relayUrl: string) => {
|
||||
await db.removeRelay(relayUrl);
|
||||
queryClient.invalidateQueries(['user-relay']);
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['user-relay'],
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="mt-3 px-3">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<p>Loading...</p>
|
||||
) : (
|
||||
<div className="flex flex-col gap-2">
|
||||
|
||||
@ -1,17 +1,4 @@
|
||||
import { getVersion } from '@tauri-apps/plugin-app';
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
export function VersionSetting() {
|
||||
const [version, setVersion] = useState<string>('');
|
||||
|
||||
useEffect(() => {
|
||||
async function checkVersion() {
|
||||
const appVersion = await getVersion();
|
||||
setVersion(appVersion);
|
||||
}
|
||||
checkVersion();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="inline-flex items-center justify-between px-5 py-4">
|
||||
<div className="flex flex-col gap-1">
|
||||
@ -21,7 +8,7 @@ export function VersionSetting() {
|
||||
</span>
|
||||
</div>
|
||||
<div className="inline-flex items-center gap-2">
|
||||
<span className="font-medium text-neutral-300">{version}</span>
|
||||
<span className="font-medium text-neutral-300">2</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -210,7 +210,9 @@ export function EditProfileModal() {
|
||||
|
||||
if (publishedRelays) {
|
||||
// invalid cache
|
||||
queryClient.invalidateQueries(['user', db.account.pubkey]);
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['user', db.account.pubkey]
|
||||
});
|
||||
// reset form
|
||||
reset();
|
||||
// reset state
|
||||
|
||||
@ -5,15 +5,19 @@ import { LoaderIcon } from '@shared/icons';
|
||||
import { compactNumber } from '@utils/number';
|
||||
|
||||
export function UserStats({ pubkey }: { pubkey: string }) {
|
||||
const { status, data } = useQuery(['user-metadata', pubkey], async () => {
|
||||
const res = await fetch(`https://api.nostr.band/v0/stats/profile/${pubkey}`);
|
||||
if (!res.ok) {
|
||||
throw new Error('Error');
|
||||
}
|
||||
return await res.json();
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['user-metadata', pubkey],
|
||||
|
||||
...async () => {
|
||||
const res = await fetch(`https://api.nostr.band/v0/stats/profile/${pubkey}`);
|
||||
if (!res.ok) {
|
||||
throw new Error('Error');
|
||||
}
|
||||
return await res.json();
|
||||
},
|
||||
});
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="flex w-full items-center justify-center">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-neutral-900 dark:text-neutral-100" />
|
||||
|
||||
@ -19,14 +19,18 @@ import {
|
||||
export function UserScreen() {
|
||||
const { pubkey } = useParams();
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(['user-feed', pubkey], async () => {
|
||||
const events = await ndk.fetchEvents({
|
||||
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Article],
|
||||
authors: [pubkey],
|
||||
limit: 50,
|
||||
});
|
||||
const sorted = [...events].sort((a, b) => b.created_at - a.created_at);
|
||||
return sorted;
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['user-feed', pubkey],
|
||||
queryFn: async () => {
|
||||
const events = await ndk.fetchEvents({
|
||||
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Article],
|
||||
authors: [pubkey],
|
||||
limit: 50,
|
||||
});
|
||||
const sorted = [...events].sort((a, b) => b.created_at - a.created_at);
|
||||
return sorted;
|
||||
},
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
// render event match event kind
|
||||
@ -73,7 +77,7 @@ export function UserScreen() {
|
||||
Latest posts
|
||||
</h3>
|
||||
<div className="mx-auto flex h-full max-w-[500px] flex-col justify-between gap-1.5 pb-4 pt-1.5">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div>Loading...</div>
|
||||
) : data.length === 0 ? (
|
||||
<div className="px-3 py-1.5">
|
||||
|
||||
@ -94,7 +94,7 @@ export function ActiveAccount() {
|
||||
);
|
||||
}, []);
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="aspect-square h-auto w-full animate-pulse rounded-lg bg-neutral-300 dark:bg-neutral-700" />
|
||||
);
|
||||
|
||||
@ -20,9 +20,9 @@ export const NIP05 = memo(function NIP05({
|
||||
nip05: string;
|
||||
className?: string;
|
||||
}) {
|
||||
const { status, data } = useQuery(
|
||||
['nip05', nip05],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['nip05', nip05],
|
||||
queryFn: async () => {
|
||||
try {
|
||||
const localPath = nip05.split('@')[0];
|
||||
const service = nip05.split('@')[1];
|
||||
@ -47,15 +47,13 @@ export const NIP05 = memo(function NIP05({
|
||||
throw new Error(`Failed to verify NIP-05, error: ${e}`);
|
||||
}
|
||||
},
|
||||
{
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
}
|
||||
);
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
});
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
<div className="h-3 w-20 animate-pulse rounded bg-white/10" />;
|
||||
}
|
||||
|
||||
|
||||
@ -30,7 +30,7 @@ export function ChildNote({ id, root }: { id: string; root?: string }) {
|
||||
}
|
||||
};
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<>
|
||||
<div className="absolute bottom-0 left-[18px] h-[calc(100%-3.4rem)] w-0.5 bg-gradient-to-t from-black/20 to-black/10 dark:from-white/20 dark:to-white/10" />
|
||||
|
||||
@ -28,9 +28,9 @@ export function Repost({
|
||||
event.content.length > 0 ? JSON.parse(event.content) : null;
|
||||
|
||||
const { ndk } = useNDK();
|
||||
const { status, isError, data } = useQuery(
|
||||
['repost', event.id],
|
||||
async () => {
|
||||
const { status, isError, data } = useQuery({
|
||||
queryKey: ['repost', event.id],
|
||||
queryFn: async () => {
|
||||
const id = event.tags.find((el) => el[0] === 'e')[1];
|
||||
if (!id) throw new Error('wrong id');
|
||||
|
||||
@ -39,11 +39,9 @@ export function Repost({
|
||||
|
||||
return ndkEvent;
|
||||
},
|
||||
{
|
||||
enabled: embedEvent === null,
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
enabled: embedEvent === null,
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
const renderKind = useCallback((repostEvent: NDKEvent) => {
|
||||
switch (repostEvent.kind) {
|
||||
@ -87,7 +85,7 @@ export function Repost({
|
||||
);
|
||||
}
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="h-min w-full px-3 pb-3">
|
||||
<div className="relative overflow-hidden rounded-xl border border-neutral-300 bg-neutral-200 p-3 dark:border-neutral-700 dark:bg-neutral-800">
|
||||
|
||||
@ -46,7 +46,7 @@ export const MentionNote = memo(function MentionNote({ id }: { id: string }) {
|
||||
}
|
||||
};
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="mt-3 cursor-default rounded-lg border border-neutral-300 bg-neutral-200 p-3 dark:border-neutral-700 dark:bg-neutral-800">
|
||||
<NoteSkeleton />
|
||||
|
||||
@ -17,9 +17,9 @@ export function NoteMetadata({ id }: { id: string }) {
|
||||
|
||||
const { db } = useStorage();
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['note-metadata', id],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['note-metadata', id],
|
||||
queryFn: async () => {
|
||||
let replies = 0;
|
||||
let zap = 0;
|
||||
const users = [];
|
||||
@ -53,14 +53,12 @@ export function NoteMetadata({ id }: { id: string }) {
|
||||
|
||||
return { replies, users, zap };
|
||||
},
|
||||
{
|
||||
enabled: !!ndk,
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnReconnect: false,
|
||||
}
|
||||
);
|
||||
enabled: !!ndk,
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnReconnect: false,
|
||||
});
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="relative z-10 flex items-center gap-3 pb-3">
|
||||
<div className="mt-2 h-6 w-11 shrink-0"></div>
|
||||
|
||||
@ -8,7 +8,7 @@ export function LinkPreview({ urls }: { urls: string[] }) {
|
||||
|
||||
return (
|
||||
<div className="my-2">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex flex-col bg-neutral-200 dark:bg-neutral-800">
|
||||
<div className="h-44 w-full animate-pulse bg-neutral-400 dark:bg-neutral-600" />
|
||||
<div className="flex flex-col gap-2 px-3 py-3">
|
||||
|
||||
@ -10,9 +10,9 @@ import { compactNumber } from '@utils/number';
|
||||
|
||||
export function NoteStats({ id }: { id: string }) {
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['note-stats', id],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['note-stats', id],
|
||||
queryFn: async () => {
|
||||
let reactions = 0;
|
||||
let reposts = 0;
|
||||
let zaps = 0;
|
||||
@ -48,10 +48,11 @@ export function NoteStats({ id }: { id: string }) {
|
||||
|
||||
return { reposts, reactions, zaps };
|
||||
},
|
||||
{ refetchOnWindowFocus: false, refetchOnReconnect: false }
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnReconnect: false,
|
||||
});
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="flex h-11 items-center">
|
||||
<LoaderIcon className="h-4 w-4 animate-spin text-white" />
|
||||
|
||||
@ -62,7 +62,7 @@ export function NotifyNote({ event }: { event: NDKEvent }) {
|
||||
}
|
||||
};
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
return (
|
||||
<div className="h-min w-full px-3 pb-3">
|
||||
<div className="relative overflow-hidden rounded-xl bg-white/10 px-3 py-3 backdrop-blur-xl">
|
||||
|
||||
@ -46,7 +46,7 @@ export const User = memo(function User({
|
||||
const svgURI =
|
||||
'data:image/svg+xml;utf8,' + encodeURIComponent(minidenticon(pubkey, 90, 50));
|
||||
|
||||
if (status === 'loading') {
|
||||
if (status === 'pending') {
|
||||
if (variant === 'avatar') {
|
||||
return (
|
||||
<div className="h-12 w-12 animate-pulse overflow-hidden rounded-lg bg-neutral-300 dark:bg-neutral-700" />
|
||||
|
||||
@ -29,7 +29,9 @@ export function EventLoader({ firstTime }: { firstTime: boolean }) {
|
||||
setProgress(100);
|
||||
setIsFetched();
|
||||
// invalidate queries
|
||||
queryClient.invalidateQueries(['local-network-widget']);
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ['local-network-widget']
|
||||
});
|
||||
await db.updateLastLogin();
|
||||
}
|
||||
}
|
||||
|
||||
@ -14,9 +14,9 @@ import { Widget } from '@utils/types';
|
||||
|
||||
export function GlobalArticlesWidget({ params }: { params: Widget }) {
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['global-articles'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['global-articles'],
|
||||
queryFn: async () => {
|
||||
const events = await ndk.fetchEvents({
|
||||
kinds: [NDKKind.Article],
|
||||
limit: 200,
|
||||
@ -24,8 +24,8 @@ export function GlobalArticlesWidget({ params }: { params: Widget }) {
|
||||
const sortedEvents = [...events].sort((x, y) => y.created_at - x.created_at);
|
||||
return sortedEvents;
|
||||
},
|
||||
{ refetchOnWindowFocus: false }
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
// render event match event kind
|
||||
const renderItem = useCallback(
|
||||
@ -43,7 +43,7 @@ export function GlobalArticlesWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title={params.title} />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center ">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -15,9 +15,9 @@ import { Widget } from '@utils/types';
|
||||
|
||||
export function GlobalFilesWidget({ params }: { params: Widget }) {
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['global-file-sharing'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['global-file-sharing'],
|
||||
queryFn: async () => {
|
||||
const events = await ndk.fetchEvents({
|
||||
// @ts-expect-error, NDK not support file metadata yet
|
||||
kinds: [1063],
|
||||
@ -26,8 +26,8 @@ export function GlobalFilesWidget({ params }: { params: Widget }) {
|
||||
const sortedEvents = [...events].sort((x, y) => y.created_at - x.created_at);
|
||||
return sortedEvents;
|
||||
},
|
||||
{ refetchOnWindowFocus: false }
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
// render event match event kind
|
||||
const renderItem = useCallback(
|
||||
@ -45,7 +45,7 @@ export function GlobalFilesWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title={params.title} />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center ">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -22,9 +22,9 @@ import { Widget } from '@utils/types';
|
||||
|
||||
export function GlobalHashtagWidget({ params }: { params: Widget }) {
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['hashtag-' + params.title],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['hashtag-' + params.title],
|
||||
queryFn: async () => {
|
||||
const events = await ndk.fetchEvents({
|
||||
kinds: [NDKKind.Text, NDKKind.Repost, NDKKind.Article],
|
||||
'#t': [params.content],
|
||||
@ -33,8 +33,8 @@ export function GlobalHashtagWidget({ params }: { params: Widget }) {
|
||||
const sortedEvents = [...events].sort((x, y) => y.created_at - x.created_at);
|
||||
return sortedEvents;
|
||||
},
|
||||
{ refetchOnWindowFocus: false }
|
||||
);
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
// render event match event kind
|
||||
const renderItem = useCallback(
|
||||
@ -75,7 +75,7 @@ export function GlobalHashtagWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title={params.title} />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -17,6 +17,7 @@ export function LocalArticlesWidget({ params }: { params: Widget }) {
|
||||
const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
|
||||
useInfiniteQuery({
|
||||
queryKey: ['local-articles'],
|
||||
initialPageParam: 0,
|
||||
queryFn: async ({ pageParam = 0 }) => {
|
||||
return await db.getAllEventsByKinds([NDKKind.Article], 20, pageParam);
|
||||
},
|
||||
@ -45,7 +46,7 @@ export function LocalArticlesWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title={params.title} />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center ">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -24,6 +24,7 @@ export function LocalFeedsWidget({ params }: { params: Widget }) {
|
||||
const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
|
||||
useInfiniteQuery({
|
||||
queryKey: ['group-feeds-' + params.id],
|
||||
initialPageParam: 0,
|
||||
queryFn: async ({ pageParam = 0 }) => {
|
||||
const authors = JSON.parse(params.content);
|
||||
return await db.getAllEventsByAuthors(authors, 20, pageParam);
|
||||
@ -81,7 +82,7 @@ export function LocalFeedsWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title={params.title} />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -17,6 +17,7 @@ export function LocalFilesWidget({ params }: { params: Widget }) {
|
||||
const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
|
||||
useInfiniteQuery({
|
||||
queryKey: ['local-file-sharing'],
|
||||
initialPageParam: 0,
|
||||
queryFn: async ({ pageParam = 0 }) => {
|
||||
return await db.getAllEventsByKinds([1063], 20, pageParam);
|
||||
},
|
||||
@ -45,7 +46,7 @@ export function LocalFilesWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title={params.title} />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center ">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -24,6 +24,7 @@ export function LocalFollowsWidget({ params }: { params: Widget }) {
|
||||
const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
|
||||
useInfiniteQuery({
|
||||
queryKey: ['follows-' + params.title],
|
||||
initialPageParam: 0,
|
||||
queryFn: async ({ pageParam = 0 }) => {
|
||||
return await db.getAllEventsByAuthors(db.account.follows, 20, pageParam);
|
||||
},
|
||||
@ -80,7 +81,7 @@ export function LocalFollowsWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title="Follows" />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center ">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -29,6 +29,7 @@ export function LocalNetworkWidget() {
|
||||
const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
|
||||
useInfiniteQuery({
|
||||
queryKey: ['local-network-widget'],
|
||||
initialPageParam: 0,
|
||||
queryFn: async ({ pageParam = 0 }) => {
|
||||
return await db.getAllEvents(20, pageParam);
|
||||
},
|
||||
@ -136,7 +137,7 @@ export function LocalNetworkWidget() {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id="9999" />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="px-3 py-1.5">
|
||||
<div className="rounded-xl bg-neutral-100 px-3 py-3 dark:bg-neutral-900">
|
||||
<NoteSkeleton />
|
||||
|
||||
@ -43,7 +43,7 @@ export function LocalThreadWidget({ params }: { params: Widget }) {
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title={params.title} />
|
||||
<WVList className="flex-1 overflow-y-auto px-3">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-16 items-center justify-center rounded-xl bg-neutral-100 px-3 py-3 dark:bg-neutral-900">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin" />
|
||||
</div>
|
||||
|
||||
@ -23,9 +23,9 @@ import { Widget } from '@utils/types';
|
||||
|
||||
export function LocalUserWidget({ params }: { params: Widget }) {
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['user-posts', params.content],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['user-posts', params.content],
|
||||
queryFn: async () => {
|
||||
const events = await ndk.fetchEvents({
|
||||
// @ts-expect-error, NDK not support file metadata yet
|
||||
kinds: [NDKKind.Text, NDKKind.Repost, 1063, NDKKind.Article],
|
||||
@ -35,13 +35,11 @@ export function LocalUserWidget({ params }: { params: Widget }) {
|
||||
const sortedEvents = [...events].sort((x, y) => y.created_at - x.created_at);
|
||||
return sortedEvents;
|
||||
},
|
||||
{
|
||||
staleTime: Infinity,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
staleTime: Infinity,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
// render event match event kind
|
||||
const renderItem = useCallback(
|
||||
@ -90,7 +88,7 @@ export function LocalUserWidget({ params }: { params: Widget }) {
|
||||
Latest posts
|
||||
</h3>
|
||||
<div className="flex h-full w-full flex-col justify-between gap-1.5 pb-10">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="px-3 py-1.5">
|
||||
<div className="rounded-xl bg-neutral-100 px-3 py-3 dark:bg-neutral-900">
|
||||
<NoteSkeleton />
|
||||
|
||||
@ -13,9 +13,9 @@ interface Response {
|
||||
}
|
||||
|
||||
export function TrendingAccountsWidget({ params }: { params: Widget }) {
|
||||
const { status, data } = useQuery(
|
||||
['trending-profiles-widget'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['trending-profiles-widget'],
|
||||
queryFn: async () => {
|
||||
const res = await fetch('https://api.nostr.band/v0/trending/profiles');
|
||||
if (!res.ok) {
|
||||
throw new Error('Error');
|
||||
@ -24,19 +24,17 @@ export function TrendingAccountsWidget({ params }: { params: Widget }) {
|
||||
if (!json.profiles) return [];
|
||||
return json.profiles;
|
||||
},
|
||||
{
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
}
|
||||
);
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
});
|
||||
|
||||
return (
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title="Trending Accounts" />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center ">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -14,9 +14,9 @@ interface Response {
|
||||
}
|
||||
|
||||
export function TrendingNotesWidget({ params }: { params: Widget }) {
|
||||
const { status, data } = useQuery(
|
||||
['trending-notes-widget'],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['trending-notes-widget'],
|
||||
queryFn: async () => {
|
||||
const res = await fetch('https://api.nostr.band/v0/trending/notes');
|
||||
if (!res.ok) {
|
||||
throw new Error('failed to fecht trending notes');
|
||||
@ -25,19 +25,17 @@ export function TrendingNotesWidget({ params }: { params: Widget }) {
|
||||
if (!json.notes) return null;
|
||||
return json.notes;
|
||||
},
|
||||
{
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
}
|
||||
);
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
});
|
||||
|
||||
return (
|
||||
<WidgetWrapper>
|
||||
<TitleBar id={params.id} title="Trending Notes" />
|
||||
<div className="flex-1">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<div className="flex h-full w-full items-center justify-center ">
|
||||
<div className="inline-flex flex-col items-center justify-center gap-2">
|
||||
<LoaderIcon className="h-5 w-5 animate-spin text-black dark:text-white" />
|
||||
|
||||
@ -3,6 +3,7 @@ import { useQuery } from '@tanstack/react-query';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { toast } from 'sonner';
|
||||
|
||||
import { useNDK } from '@libs/ndk/provider';
|
||||
import { useStorage } from '@libs/storage/provider';
|
||||
|
||||
import { FollowIcon, UnfollowIcon } from '@shared/icons';
|
||||
@ -18,20 +19,18 @@ export interface Profile {
|
||||
|
||||
export function NostrBandUserProfile({ data }: { data: Profile }) {
|
||||
const { db } = useStorage();
|
||||
const { ndk } = useStorage();
|
||||
const { status, data: userStats } = useQuery(
|
||||
['user-stats', data.pubkey],
|
||||
async () => {
|
||||
const { ndk } = useNDK();
|
||||
const { status, data: userStats } = useQuery({
|
||||
queryKey: ['user-stats', data.pubkey],
|
||||
queryFn: async () => {
|
||||
const res = await fetch(`https://api.nostr.band/v0/stats/profile/${data.pubkey}`);
|
||||
return res.json();
|
||||
},
|
||||
{
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
}
|
||||
);
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
refetchOnWindowFocus: false,
|
||||
staleTime: Infinity,
|
||||
});
|
||||
|
||||
const embedProfile = data.profile ? JSON.parse(data.profile.content) : null;
|
||||
const profile = embedProfile;
|
||||
@ -137,7 +136,7 @@ export function NostrBandUserProfile({ data }: { data: Profile }) {
|
||||
</p>
|
||||
</div>
|
||||
<div className="mt-8">
|
||||
{status === 'loading' ? (
|
||||
{status === 'pending' ? (
|
||||
<p>Loading...</p>
|
||||
) : (
|
||||
<div className="flex w-full items-center gap-8">
|
||||
|
||||
@ -12,9 +12,9 @@ export function useEvent(
|
||||
) {
|
||||
const { db } = useStorage();
|
||||
const { ndk } = useNDK();
|
||||
const { status, data } = useQuery(
|
||||
['event', id],
|
||||
async () => {
|
||||
const { status, data } = useQuery({
|
||||
queryKey: ['event', id],
|
||||
queryFn: async () => {
|
||||
// return event refer from naddr
|
||||
if (naddr) {
|
||||
const rEvents = await ndk.fetchEvents({
|
||||
@ -45,11 +45,9 @@ export function useEvent(
|
||||
|
||||
return event;
|
||||
},
|
||||
{
|
||||
enabled: !!ndk,
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
enabled: !!ndk,
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
|
||||
return { status, data };
|
||||
}
|
||||
|
||||
@ -4,22 +4,20 @@ import { invoke } from '@tauri-apps/api/primitives';
|
||||
import { Opengraph } from '@utils/types';
|
||||
|
||||
export function useOpenGraph(url: string) {
|
||||
const { status, data, error } = useQuery(
|
||||
['opg', url],
|
||||
async () => {
|
||||
const { status, data, error } = useQuery({
|
||||
queryKey: ['opg', url],
|
||||
queryFn: async () => {
|
||||
const res: Opengraph = await invoke('opengraph', { url });
|
||||
if (!res) {
|
||||
throw new Error('fetch preview failed');
|
||||
}
|
||||
return res;
|
||||
},
|
||||
{
|
||||
staleTime: Infinity,
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
}
|
||||
);
|
||||
staleTime: Infinity,
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnMount: false,
|
||||
refetchOnReconnect: false,
|
||||
});
|
||||
|
||||
return {
|
||||
status,
|
||||
|
||||
@ -9,9 +9,9 @@ export function useProfile(pubkey: string, embed?: string) {
|
||||
status,
|
||||
data: user,
|
||||
error,
|
||||
} = useQuery(
|
||||
['user', pubkey],
|
||||
async () => {
|
||||
} = useQuery({
|
||||
queryKey: ['user', pubkey],
|
||||
queryFn: async () => {
|
||||
if (embed) {
|
||||
const profile: NDKUserProfile = JSON.parse(embed);
|
||||
return profile;
|
||||
@ -21,15 +21,13 @@ export function useProfile(pubkey: string, embed?: string) {
|
||||
const user = ndk.getUser({ hexpubkey: cleanPubkey });
|
||||
return await user.fetchProfile();
|
||||
},
|
||||
{
|
||||
enabled: !!ndk,
|
||||
staleTime: Infinity,
|
||||
refetchOnMount: false,
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnReconnect: false,
|
||||
retry: 2,
|
||||
}
|
||||
);
|
||||
enabled: !!ndk,
|
||||
staleTime: Infinity,
|
||||
refetchOnMount: false,
|
||||
refetchOnWindowFocus: false,
|
||||
refetchOnReconnect: false,
|
||||
retry: 2,
|
||||
});
|
||||
|
||||
return { status, user, error };
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user