extract ProfileTab from ProfilePage
This commit is contained in:
Martti Malmi
parent
585f031ce1
commit
e949708cec
@ -6,8 +6,6 @@ import {
|
||||
encodeTLV,
|
||||
encodeTLVEntries,
|
||||
EventKind,
|
||||
HexKey,
|
||||
NostrLink,
|
||||
NostrPrefix,
|
||||
TLVEntryType,
|
||||
tryParseNostrLink,
|
||||
@ -16,22 +14,14 @@ import { LNURL } from "@snort/shared";
|
||||
import { useUserProfile } from "@snort/system-react";
|
||||
|
||||
import { findTag, getReactions, unwrap } from "SnortUtils";
|
||||
import { formatShort } from "Number";
|
||||
import Note from "Element/Event/Note";
|
||||
import Bookmarks from "Element/Bookmarks";
|
||||
import RelaysMetadata from "Element/Relay/RelaysMetadata";
|
||||
import { Tab, TabElement } from "Element/Tabs";
|
||||
import Icon from "Icons/Icon";
|
||||
import useMutedFeed from "Feed/MuteList";
|
||||
import useRelaysFeed from "Feed/RelaysFeed";
|
||||
import usePinnedFeed from "Feed/PinnedFeed";
|
||||
import useBookmarkFeed from "Feed/BookmarkFeed";
|
||||
import useFollowersFeed from "Feed/FollowersFeed";
|
||||
import useFollowsFeed from "Feed/FollowsFeed";
|
||||
import useProfileBadges from "Feed/BadgesFeed";
|
||||
import useModeration from "Hooks/useModeration";
|
||||
import useZapsFeed from "Feed/ZapsFeed";
|
||||
import { default as ZapElement } from "Element/Event/Zap";
|
||||
import FollowButton from "Element/User/FollowButton";
|
||||
import { parseId, hexToBech32 } from "SnortUtils";
|
||||
import Avatar from "Element/User/Avatar";
|
||||
@ -57,59 +47,16 @@ import useLogin from "Hooks/useLogin";
|
||||
import { ZapTarget } from "Zapper";
|
||||
import { useStatusFeed } from "Feed/StatusFeed";
|
||||
|
||||
import messages from "./messages";
|
||||
import messages from "../messages";
|
||||
import { SpotlightMediaModal } from "Element/Deck/SpotlightMedia";
|
||||
|
||||
const NOTES = 0;
|
||||
const REACTIONS = 1;
|
||||
const FOLLOWERS = 2;
|
||||
const FOLLOWS = 3;
|
||||
const ZAPS = 4;
|
||||
const MUTED = 5;
|
||||
const BLOCKED = 6;
|
||||
const RELAYS = 7;
|
||||
const BOOKMARKS = 8;
|
||||
|
||||
function ZapsProfileTab({ id }: { id: HexKey }) {
|
||||
const zaps = useZapsFeed(new NostrLink(NostrPrefix.PublicKey, id));
|
||||
const zapsTotal = zaps.reduce((acc, z) => acc + z.amount, 0);
|
||||
return (
|
||||
<div className="main-content">
|
||||
<h2 className="p">
|
||||
<FormattedMessage {...messages.Sats} values={{ n: formatShort(zapsTotal) }} />
|
||||
</h2>
|
||||
{zaps.map(z => (
|
||||
<ZapElement showZapped={false} zap={z} />
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function FollowersTab({ id }: { id: HexKey }) {
|
||||
const followers = useFollowersFeed(id);
|
||||
return <FollowsList pubkeys={followers} showAbout={true} className="p" />;
|
||||
}
|
||||
|
||||
function FollowsTab({ id }: { id: HexKey }) {
|
||||
const follows = useFollowsFeed(id);
|
||||
return <FollowsList pubkeys={follows} showAbout={true} className="p" />;
|
||||
}
|
||||
|
||||
function RelaysTab({ id }: { id: HexKey }) {
|
||||
const relays = useRelaysFeed(id);
|
||||
return <RelaysMetadata relays={relays} />;
|
||||
}
|
||||
|
||||
function BookMarksTab({ id }: { id: HexKey }) {
|
||||
const bookmarks = useBookmarkFeed(id);
|
||||
return (
|
||||
<Bookmarks
|
||||
pubkey={id}
|
||||
bookmarks={bookmarks.filter(e => e.kind === EventKind.TextNote)}
|
||||
related={bookmarks.filter(e => e.kind !== EventKind.TextNote)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
import ProfileTab, {
|
||||
BookMarksTab,
|
||||
FollowersTab,
|
||||
FollowsTab,
|
||||
ProfileTabType,
|
||||
RelaysTab,
|
||||
ZapsProfileTab
|
||||
} from "Pages/Profile/ProfileTab";
|
||||
|
||||
export default function ProfilePage() {
|
||||
const params = useParams();
|
||||
@ -146,89 +93,6 @@ export default function ProfilePage() {
|
||||
const status = useStatusFeed(showStatus ? id : undefined, true);
|
||||
|
||||
// tabs
|
||||
const ProfileTab = {
|
||||
Notes: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="pencil" size={16} />
|
||||
<FormattedMessage defaultMessage="Notes" />
|
||||
</>
|
||||
),
|
||||
value: NOTES,
|
||||
},
|
||||
Reactions: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="reaction" size={16} />
|
||||
<FormattedMessage defaultMessage="Reactions" />
|
||||
</>
|
||||
),
|
||||
value: REACTIONS,
|
||||
},
|
||||
Followers: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="user-v2" size={16} />
|
||||
<FormattedMessage defaultMessage="Followers" />
|
||||
</>
|
||||
),
|
||||
value: FOLLOWERS,
|
||||
},
|
||||
Follows: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="stars" size={16} />
|
||||
<FormattedMessage defaultMessage="Follows" />
|
||||
</>
|
||||
),
|
||||
value: FOLLOWS,
|
||||
},
|
||||
Zaps: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="zap-solid" size={16} />
|
||||
<FormattedMessage defaultMessage="Zaps" />
|
||||
</>
|
||||
),
|
||||
value: ZAPS,
|
||||
},
|
||||
Muted: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="mute" size={16} />
|
||||
<FormattedMessage defaultMessage="Muted" />
|
||||
</>
|
||||
),
|
||||
value: MUTED,
|
||||
},
|
||||
Blocked: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="block" size={16} />
|
||||
<FormattedMessage defaultMessage="Blocked" />
|
||||
</>
|
||||
),
|
||||
value: BLOCKED,
|
||||
},
|
||||
Relays: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="wifi" size={16} />
|
||||
<FormattedMessage defaultMessage="Relays" />
|
||||
</>
|
||||
),
|
||||
value: RELAYS,
|
||||
},
|
||||
Bookmarks: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="bookmark-solid" size={16} />
|
||||
<FormattedMessage defaultMessage="Bookmarks" />
|
||||
</>
|
||||
),
|
||||
value: BOOKMARKS,
|
||||
},
|
||||
} as { [key: string]: Tab };
|
||||
const [tab, setTab] = useState<Tab>(ProfileTab.Notes);
|
||||
const optionalTabs = [ProfileTab.Zaps, ProfileTab.Relays, ProfileTab.Bookmarks, ProfileTab.Muted].filter(a =>
|
||||
unwrap(a),
|
||||
@ -369,7 +233,7 @@ export default function ProfilePage() {
|
||||
if (!id) return null;
|
||||
|
||||
switch (tab.value) {
|
||||
case NOTES:
|
||||
case ProfileTabType.NOTES:
|
||||
return (
|
||||
<>
|
||||
{pinned
|
||||
@ -399,29 +263,29 @@ export default function ProfilePage() {
|
||||
/>
|
||||
</>
|
||||
);
|
||||
case ZAPS: {
|
||||
case ProfileTabType.ZAPS: {
|
||||
return <ZapsProfileTab id={id} />;
|
||||
}
|
||||
case FOLLOWS: {
|
||||
case ProfileTabType.FOLLOWS: {
|
||||
if (isMe) {
|
||||
return <FollowsList pubkeys={follows} showFollowAll={!isMe} showAbout={false} className="p" />;
|
||||
} else {
|
||||
return <FollowsTab id={id} />;
|
||||
}
|
||||
}
|
||||
case FOLLOWERS: {
|
||||
case ProfileTabType.FOLLOWERS: {
|
||||
return <FollowersTab id={id} />;
|
||||
}
|
||||
case MUTED: {
|
||||
case ProfileTabType.MUTED: {
|
||||
return <MutedList pubkeys={muted} />;
|
||||
}
|
||||
case BLOCKED: {
|
||||
case ProfileTabType.BLOCKED: {
|
||||
return <BlockList />;
|
||||
}
|
||||
case RELAYS: {
|
||||
case ProfileTabType.RELAYS: {
|
||||
return <RelaysTab id={id} />;
|
||||
}
|
||||
case BOOKMARKS: {
|
||||
case ProfileTabType.BOOKMARKS: {
|
||||
return <BookMarksTab id={id} />;
|
||||
}
|
||||
}
|
||||
154
packages/app/src/Pages/Profile/ProfileTab.tsx
Normal file
154
packages/app/src/Pages/Profile/ProfileTab.tsx
Normal file
@ -0,0 +1,154 @@
|
||||
import useZapsFeed from "../../Feed/ZapsFeed";
|
||||
import FormattedMessage from "../../Element/FormattedMessage";
|
||||
import messages from "../messages";
|
||||
import {formatShort} from "../../Number";
|
||||
import useFollowersFeed from "../../Feed/FollowersFeed";
|
||||
import FollowsList from "../../Element/User/FollowListBase";
|
||||
import useFollowsFeed from "../../Feed/FollowsFeed";
|
||||
import useRelaysFeed from "../../Feed/RelaysFeed";
|
||||
import RelaysMetadata from "../../Element/Relay/RelaysMetadata";
|
||||
import useBookmarkFeed from "../../Feed/BookmarkFeed";
|
||||
import Bookmarks from "../../Element/Bookmarks";
|
||||
import Icon from "../../Icons/Icon";
|
||||
import {Tab} from "../../Element/Tabs";
|
||||
import {EventKind, HexKey, NostrLink, NostrPrefix} from "@snort/system";
|
||||
import { default as ZapElement } from "Element/Event/Zap";
|
||||
|
||||
export enum ProfileTabType {
|
||||
NOTES = 0,
|
||||
REACTIONS = 1,
|
||||
FOLLOWERS = 2,
|
||||
FOLLOWS = 3,
|
||||
ZAPS = 4,
|
||||
MUTED = 5,
|
||||
BLOCKED = 6,
|
||||
RELAYS = 7,
|
||||
BOOKMARKS = 8,
|
||||
}
|
||||
|
||||
export function ZapsProfileTab({ id }: { id: HexKey }) {
|
||||
const zaps = useZapsFeed(new NostrLink(NostrPrefix.PublicKey, id));
|
||||
const zapsTotal = zaps.reduce((acc, z) => acc + z.amount, 0);
|
||||
return (
|
||||
<div className="main-content">
|
||||
<h2 className="p">
|
||||
<FormattedMessage {...messages.Sats} values={{ n: formatShort(zapsTotal) }} />
|
||||
</h2>
|
||||
{zaps.map(z => (
|
||||
<ZapElement showZapped={false} zap={z} />
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function FollowersTab({ id }: { id: HexKey }) {
|
||||
const followers = useFollowersFeed(id);
|
||||
return <FollowsList pubkeys={followers} showAbout={true} className="p" />;
|
||||
}
|
||||
|
||||
export function FollowsTab({ id }: { id: HexKey }) {
|
||||
const follows = useFollowsFeed(id);
|
||||
return <FollowsList pubkeys={follows} showAbout={true} className="p" />;
|
||||
}
|
||||
|
||||
export function RelaysTab({ id }: { id: HexKey }) {
|
||||
const relays = useRelaysFeed(id);
|
||||
return <RelaysMetadata relays={relays} />;
|
||||
}
|
||||
|
||||
export function BookMarksTab({ id }: { id: HexKey }) {
|
||||
const bookmarks = useBookmarkFeed(id);
|
||||
return (
|
||||
<Bookmarks
|
||||
pubkey={id}
|
||||
bookmarks={bookmarks.filter(e => e.kind === EventKind.TextNote)}
|
||||
related={bookmarks.filter(e => e.kind !== EventKind.TextNote)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const ProfileTab = {
|
||||
Notes: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="pencil" size={16} />
|
||||
<FormattedMessage defaultMessage="Notes" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.NOTES,
|
||||
},
|
||||
Reactions: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="reaction" size={16} />
|
||||
<FormattedMessage defaultMessage="Reactions" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.REACTIONS,
|
||||
},
|
||||
Followers: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="user-v2" size={16} />
|
||||
<FormattedMessage defaultMessage="Followers" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.FOLLOWERS,
|
||||
},
|
||||
Follows: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="stars" size={16} />
|
||||
<FormattedMessage defaultMessage="Follows" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.FOLLOWS,
|
||||
},
|
||||
Zaps: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="zap-solid" size={16} />
|
||||
<FormattedMessage defaultMessage="Zaps" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.ZAPS,
|
||||
},
|
||||
Muted: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="mute" size={16} />
|
||||
<FormattedMessage defaultMessage="Muted" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.MUTED,
|
||||
},
|
||||
Blocked: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="block" size={16} />
|
||||
<FormattedMessage defaultMessage="Blocked" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.BLOCKED,
|
||||
},
|
||||
Relays: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="wifi" size={16} />
|
||||
<FormattedMessage defaultMessage="Relays" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.RELAYS,
|
||||
},
|
||||
Bookmarks: {
|
||||
text: (
|
||||
<>
|
||||
<Icon name="bookmark-solid" size={16} />
|
||||
<FormattedMessage defaultMessage="Bookmarks" />
|
||||
</>
|
||||
),
|
||||
value: ProfileTabType.BOOKMARKS,
|
||||
},
|
||||
} as { [key: string]: Tab };
|
||||
|
||||
export default ProfileTab;
|
||||
@ -24,7 +24,7 @@ import { IntlProvider } from "IntlProvider";
|
||||
import { unwrap } from "SnortUtils";
|
||||
import Layout from "Pages/Layout";
|
||||
import LoginPage from "Pages/LoginPage";
|
||||
import ProfilePage from "Pages/ProfilePage";
|
||||
import ProfilePage from "Pages/Profile/ProfilePage";
|
||||
import { RootRoutes, RootTabRoutes } from "Pages/Root";
|
||||
import NotificationsPage from "Pages/Notifications";
|
||||
import SettingsPage, { SettingsRoutes } from "Pages/SettingsPage";
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user