forked from Kieran/snort
read-only mode nav avatar icon and text
This commit is contained in:
parent
96e49dac41
commit
91a10024e0
@ -3,7 +3,7 @@ import { useUserProfile } from "@snort/system-react";
|
||||
import { useMemo, useSyncExternalStore } from "react";
|
||||
import { base64 } from "@scure/base";
|
||||
import { unwrap } from "@snort/shared";
|
||||
import { FormattedMessage } from "react-intl";
|
||||
import { FormattedMessage, useIntl } from "react-intl";
|
||||
import SearchBox from "@/Element/SearchBox";
|
||||
import { ProfileLink } from "@/Element/User/ProfileLink";
|
||||
import Avatar from "@/Element/User/Avatar";
|
||||
@ -17,6 +17,7 @@ import { Notifications } from "@/Cache";
|
||||
|
||||
const AccountHeader = () => {
|
||||
const navigate = useNavigate();
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
useKeyboardShortcut("/", event => {
|
||||
// if event happened in a form element, do nothing, otherwise focus on search input
|
||||
@ -76,6 +77,13 @@ const AccountHeader = () => {
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
const readOnlyIcon = readonly && (
|
||||
<span style={{ transform: "rotate(135deg)" }} title={formatMessage({ defaultMessage: "Read-only", id: "djNL6D" })}>
|
||||
<Icon name="openeye" className="text-nostr-red" size={20} />
|
||||
</span>
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="header-actions">
|
||||
{!location.pathname.startsWith("/search") ? <SearchBox /> : <div className="grow"></div>}
|
||||
@ -90,7 +98,7 @@ const AccountHeader = () => {
|
||||
<HasNotificationsMarker />
|
||||
</Link>
|
||||
<ProfileLink pubkey={publicKey} user={profile}>
|
||||
<Avatar pubkey={publicKey} user={profile} />
|
||||
<Avatar pubkey={publicKey} user={profile} icons={readOnlyIcon} />
|
||||
</ProfileLink>
|
||||
</div>
|
||||
);
|
||||
|
@ -6,7 +6,7 @@ import Avatar from "../../Element/User/Avatar";
|
||||
import useLogin from "../../Hooks/useLogin";
|
||||
import { useUserProfile } from "@snort/system-react";
|
||||
import { NoteCreatorButton } from "../../Element/Event/Create/NoteCreatorButton";
|
||||
import { FormattedMessage } from "react-intl";
|
||||
import { FormattedMessage, useIntl } from "react-intl";
|
||||
import classNames from "classnames";
|
||||
import { HasNotificationsMarker } from "@/Pages/Layout/AccountHeader";
|
||||
import { getCurrentSubscription } from "@/Subscription";
|
||||
@ -65,19 +65,27 @@ const getNavLinkClass = (isActive: boolean, narrow: boolean) => {
|
||||
};
|
||||
|
||||
export default function NavSidebar({ narrow = false }) {
|
||||
const { publicKey, subscriptions } = useLogin(s => ({
|
||||
const { publicKey, subscriptions, readonly } = useLogin(s => ({
|
||||
publicKey: s.publicKey,
|
||||
subscriptions: s.subscriptions,
|
||||
readonly: s.readonly,
|
||||
}));
|
||||
const profile = useUserProfile(publicKey);
|
||||
const navigate = useNavigate();
|
||||
const sub = getCurrentSubscription(subscriptions);
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
const className = classNames(
|
||||
{ "xl:w-56 xl:gap-3 xl:items-start": !narrow },
|
||||
"overflow-y-auto hide-scrollbar sticky items-center border-r border-neutral-900 top-0 z-20 h-screen max-h-screen hidden md:flex flex-col px-2 py-4 flex-shrink-0 gap-2",
|
||||
);
|
||||
|
||||
const readOnlyIcon = readonly && (
|
||||
<span style={{ transform: "rotate(135deg)" }} title={formatMessage({ defaultMessage: "Read-only", id: "djNL6D" })}>
|
||||
<Icon name="openeye" className="text-nostr-red" size={20} />
|
||||
</span>
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={className}>
|
||||
<LogoHeader showText={!narrow} />
|
||||
@ -121,17 +129,20 @@ export default function NavSidebar({ narrow = false }) {
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{publicKey ? (
|
||||
{publicKey && (
|
||||
<>
|
||||
<ProfileLink pubkey={publicKey} user={profile}>
|
||||
<div className="flex flex-row items-center font-bold text-md">
|
||||
<Avatar pubkey={publicKey} user={profile} size={40} />
|
||||
<Avatar pubkey={publicKey} user={profile} size={40} icons={readOnlyIcon} />
|
||||
{!narrow && <span className="hidden xl:inline ml-3">{profile?.name}</span>}
|
||||
</div>
|
||||
</ProfileLink>
|
||||
{readonly && (
|
||||
<div className="hidden xl:block text-nostr-red text-sm">
|
||||
<FormattedMessage defaultMessage="Read-only" id="djNL6D" />
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
""
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
@ -1032,6 +1032,9 @@
|
||||
"deEeEI": {
|
||||
"defaultMessage": "Register"
|
||||
},
|
||||
"djNL6D": {
|
||||
"defaultMessage": "Read-only"
|
||||
},
|
||||
"dmsiLv": {
|
||||
"defaultMessage": "A default Zap Pool split of {n} has been configured for {site} developers, you can disable it at any time in {link}"
|
||||
},
|
||||
|
@ -339,6 +339,7 @@
|
||||
"dOQCL8": "Display name",
|
||||
"ddd3JX": "Popular Hashtags",
|
||||
"deEeEI": "Register",
|
||||
"djNL6D": "Read-only",
|
||||
"dmsiLv": "A default Zap Pool split of {n} has been configured for {site} developers, you can disable it at any time in {link}",
|
||||
"e61Jf3": "Coming soon",
|
||||
"e7VmYP": "Enter pin to unlock your private key",
|
||||
|
Loading…
Reference in New Issue
Block a user