- {isError ? (
-
Failed to fetch event
- ) : (
- <>
-
- {renderKind(data)}
-
- >
- )}
+
+
+
+
+ {isFetching ? (
+
+
-
-
- >
- )}
-
-
+ ) : (
+ <>
+
+ {isError ? (
+
Failed to fetch event
+ ) : (
+ <>
+
+ {renderKind(data)}
+
+ >
+ )}
+
+
+
+ >
+ )}
+
+
+
);
}
diff --git a/src/shared/widgets/titleBar.tsx b/src/shared/widgets/titleBar.tsx
deleted file mode 100644
index 593454b2..00000000
--- a/src/shared/widgets/titleBar.tsx
+++ /dev/null
@@ -1,64 +0,0 @@
-import { useArk } from '@libs/ark';
-import { CancelIcon } from '@shared/icons';
-import { User } from '@shared/user';
-import { useWidget } from '@utils/hooks/useWidget';
-
-export function TitleBar({
- id,
- title,
- isLive,
-}: {
- id?: string;
- title?: string;
- isLive?: boolean;
-}) {
- const ark = useArk();
- const { removeWidget } = useWidget();
-
- return (
-
-
- {isLive ? (
-
- ) : null}
-
-
- {id === '9999' ? (
-
- {ark.account.contacts
- ?.slice(0, 8)
- .map((item) =>
)}
- {ark.account.contacts?.length > 8 ? (
-
-
- +{ark.account.contacts?.length - 8}
-
-
- ) : null}
-
- ) : (
-
- {title}
-
- )}
-
-
- {id !== '9999' && id !== '9998' ? (
-
- ) : null}
-
-
- );
-}
diff --git a/src/shared/widgets/topic.tsx b/src/shared/widgets/topic.tsx
index 26ef784e..d7a5fe70 100644
--- a/src/shared/widgets/topic.tsx
+++ b/src/shared/widgets/topic.tsx
@@ -1,8 +1,8 @@
import { NDKEvent, NDKFilter, NDKKind } from '@nostr-dev-kit/ndk';
import { useInfiniteQuery } from '@tanstack/react-query';
-import { useCallback, useMemo } from 'react';
+import { useMemo } from 'react';
import { VList } from 'virtua';
-import { useArk } from '@libs/ark';
+import { Widget, useArk } from '@libs/ark';
import { ArrowRightCircleIcon, LoaderIcon } from '@shared/icons';
import {
MemoizedRepost,
@@ -10,15 +10,14 @@ import {
NoteSkeleton,
UnknownNote,
} from '@shared/notes';
-import { TitleBar, WidgetWrapper } from '@shared/widgets';
import { FETCH_LIMIT } from '@utils/constants';
-import { Widget } from '@utils/types';
+import { type WidgetProps } from '@utils/types';
-export function TopicWidget({ widget }: { widget: Widget }) {
+export function TopicWidget({ props }: { props: WidgetProps }) {
const ark = useArk();
const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
useInfiniteQuery({
- queryKey: ['topic', widget.id],
+ queryKey: ['topic', props.id],
initialPageParam: 0,
queryFn: async ({
signal,
@@ -27,7 +26,7 @@ export function TopicWidget({ widget }: { widget: Widget }) {
signal: AbortSignal;
pageParam: number;
}) => {
- const hashtags: string[] = JSON.parse(widget.content as string);
+ const hashtags: string[] = JSON.parse(props.content as string);
const filter: NDKFilter = {
kinds: [NDKKind.Text, NDKKind.Repost],
'#t': hashtags.map((tag) => tag.replace('#', '')),
@@ -55,53 +54,52 @@ export function TopicWidget({ widget }: { widget: Widget }) {
[data]
);
- const renderItem = useCallback(
- (event: NDKEvent) => {
- switch (event.kind) {
- case NDKKind.Text:
- return
;
- case NDKKind.Repost:
- return
;
- default:
- return
;
- }
- },
- [data]
- );
+ const renderItem = (event: NDKEvent) => {
+ switch (event.kind) {
+ case NDKKind.Text:
+ return
;
+ case NDKKind.Repost:
+ return
;
+ default:
+ return
;
+ }
+ };
return (
-
-
-
- {status === 'pending' ? (
-
-
-
+
+
+
+
+ {status === 'pending' ? (
+
+ ) : (
+ allEvents.map((item) => renderItem(item))
+ )}
+
+ {hasNextPage ? (
+
+ ) : null}
- ) : (
- allEvents.map((item) => renderItem(item))
- )}
-
- {hasNextPage ? (
-
- ) : null}
-
-
-
+
+
+
);
}
diff --git a/src/shared/widgets/user.tsx b/src/shared/widgets/user.tsx
index 84b5a57f..94d10877 100644
--- a/src/shared/widgets/user.tsx
+++ b/src/shared/widgets/user.tsx
@@ -2,7 +2,7 @@ import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk';
import { useInfiniteQuery } from '@tanstack/react-query';
import { useCallback, useMemo } from 'react';
import { WVList } from 'virtua';
-import { useArk } from '@libs/ark';
+import { Widget, useArk } from '@libs/ark';
import { ArrowRightCircleIcon, LoaderIcon } from '@shared/icons';
import {
MemoizedRepost,
@@ -10,15 +10,15 @@ import {
NoteSkeleton,
UnknownNote,
} from '@shared/notes';
-import { TitleBar, UserProfile, WidgetWrapper } from '@shared/widgets';
+import { UserProfile } from '@shared/widgets';
import { FETCH_LIMIT } from '@utils/constants';
-import { Widget } from '@utils/types';
+import { type WidgetProps } from '@utils/types';
-export function UserWidget({ widget }: { widget: Widget }) {
+export function UserWidget({ props }: { props: WidgetProps }) {
const ark = useArk();
const { status, data, hasNextPage, isFetchingNextPage, fetchNextPage } =
useInfiniteQuery({
- queryKey: ['user-posts', widget.content],
+ queryKey: ['user-posts', props.content],
initialPageParam: 0,
queryFn: async ({
signal,
@@ -30,7 +30,7 @@ export function UserWidget({ widget }: { widget: Widget }) {
const events = await ark.getInfiniteEvents({
filter: {
kinds: [NDKKind.Text, NDKKind.Repost],
- authors: [widget.content],
+ authors: [props.content],
},
limit: FETCH_LIMIT,
pageParam,
@@ -68,48 +68,50 @@ export function UserWidget({ widget }: { widget: Widget }) {
);
return (
-
-
-
-
-
-
-
-
- Latest posts
-
-
- {status === 'pending' ? (
-
-
-
+
+
+
+
+
+
+
+
+
+ Latest posts
+
+
+ {status === 'pending' ? (
+
+ ) : (
+ allEvents.map((item) => renderItem(item))
+ )}
+
+ {hasNextPage ? (
+
+ ) : null}
- ) : (
- allEvents.map((item) => renderItem(item))
- )}
-
- {hasNextPage ? (
-
- ) : null}
-
-
-
+
+
+
);
}
diff --git a/src/utils/types.d.ts b/src/utils/types.d.ts
index 01ceb2d0..85fca12f 100644
--- a/src/utils/types.d.ts
+++ b/src/utils/types.d.ts
@@ -30,7 +30,7 @@ export interface WidgetGroupItem {
icon?: string;
}
-export interface Widget {
+export interface WidgetProps {
id?: string;
account_id?: number;
kind: number;