This commit is contained in:
parent
6bef3ccf58
commit
29bba9aef3
@ -21,10 +21,12 @@ export function LogoHeader({ showText = false }) {
|
|||||||
<Link to="/" className="logo" onClick={handleLogoClick}>
|
<Link to="/" className="logo" onClick={handleLogoClick}>
|
||||||
<h1 className="flex flex-row items-center">
|
<h1 className="flex flex-row items-center">
|
||||||
<img src={CONFIG.navLogo} className="w-8 h-8" />
|
<img src={CONFIG.navLogo} className="w-8 h-8" />
|
||||||
{showText && <div className="md:hidden xl:inline ml-2">
|
{showText && (
|
||||||
|
<div className="md:hidden xl:inline ml-2">
|
||||||
{extra()}
|
{extra()}
|
||||||
{CONFIG.appName}
|
{CONFIG.appName}
|
||||||
</div>}
|
</div>
|
||||||
|
)}
|
||||||
</h1>
|
</h1>
|
||||||
{currentSubscription && (
|
{currentSubscription && (
|
||||||
<div className="flex items-center g4 text-sm font-semibold tracking-wider">
|
<div className="flex items-center g4 text-sm font-semibold tracking-wider">
|
||||||
|
@ -52,7 +52,7 @@ const getNavLinkClass = (isActive: boolean, narrow: boolean) => {
|
|||||||
const c = isActive
|
const c = isActive
|
||||||
? "py-4 hover:no-underline flex flex-row items-center text-nostr-purple"
|
? "py-4 hover:no-underline flex flex-row items-center text-nostr-purple"
|
||||||
: "py-4 hover:no-underline hover:text-nostr-purple flex flex-row items-center";
|
: "py-4 hover:no-underline hover:text-nostr-purple flex flex-row items-center";
|
||||||
return classNames(c, { "xl:ml-1": !narrow })
|
return classNames(c, { "xl:ml-1": !narrow });
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function NavSidebar({ narrow = false }) {
|
export default function NavSidebar({ narrow = false }) {
|
||||||
@ -65,7 +65,10 @@ export default function NavSidebar({ narrow = false }) {
|
|||||||
const profile = useUserProfile(publicKey);
|
const profile = useUserProfile(publicKey);
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
const className = classNames({"xl:w-56 xl:gap-3 xl:items-start": !narrow}, "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 className = classNames(
|
||||||
|
{ "xl:w-56 xl:gap-3 xl:items-start": !narrow },
|
||||||
|
"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",
|
||||||
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={className}>
|
<div className={className}>
|
||||||
@ -91,9 +94,11 @@ export default function NavSidebar({ narrow = false }) {
|
|||||||
<div className="mt-2">
|
<div className="mt-2">
|
||||||
<button onClick={() => navigate("/login/sign-up")} className="flex flex-row items-center primary">
|
<button onClick={() => navigate("/login/sign-up")} className="flex flex-row items-center primary">
|
||||||
<Icon name="sign-in" size={24} />
|
<Icon name="sign-in" size={24} />
|
||||||
{!narrow && <span className="hidden xl:inline ml-3">
|
{!narrow && (
|
||||||
|
<span className="hidden xl:inline ml-3">
|
||||||
<FormattedMessage defaultMessage="Sign up" id="8HJxXG" />
|
<FormattedMessage defaultMessage="Sign up" id="8HJxXG" />
|
||||||
</span>}
|
</span>
|
||||||
|
)}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
@ -6,6 +6,8 @@ import * as THREE from "three";
|
|||||||
import { defaultAvatar } from "../SnortUtils";
|
import { defaultAvatar } from "../SnortUtils";
|
||||||
import { proxyImg } from "@/Hooks/useImgProxy";
|
import { proxyImg } from "@/Hooks/useImgProxy";
|
||||||
import { LoginStore } from "@/Login";
|
import { LoginStore } from "@/Login";
|
||||||
|
import { FormattedMessage } from "react-intl";
|
||||||
|
import Icon from "@/Icons/Icon";
|
||||||
|
|
||||||
interface GraphNode {
|
interface GraphNode {
|
||||||
id: UID;
|
id: UID;
|
||||||
@ -71,6 +73,27 @@ const NetworkGraph = () => {
|
|||||||
// const [direction, setDirection] = useState(Direction.OUTBOUND);
|
// const [direction, setDirection] = useState(Direction.OUTBOUND);
|
||||||
// const [renderLimit, setRenderLimit] = useState(NODE_LIMIT);
|
// const [renderLimit, setRenderLimit] = useState(NODE_LIMIT);
|
||||||
|
|
||||||
|
const handleCloseGraph = () => {
|
||||||
|
setOpen(false);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleKeyDown = (event: { key: string; }) => {
|
||||||
|
if (event.key === "Escape") {
|
||||||
|
handleCloseGraph();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (open) {
|
||||||
|
window.addEventListener("keydown", handleKeyDown);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Cleanup function to remove the event listener
|
||||||
|
return () => {
|
||||||
|
window.removeEventListener("keydown", handleKeyDown);
|
||||||
|
};
|
||||||
|
}, [open]);
|
||||||
|
|
||||||
const updateConfig = async (changes: Partial<GraphConfig>) => {
|
const updateConfig = async (changes: Partial<GraphConfig>) => {
|
||||||
setGraphConfig(old => {
|
setGraphConfig(old => {
|
||||||
const newConfig = Object.assign({}, old, changes);
|
const newConfig = Object.assign({}, old, changes);
|
||||||
@ -197,13 +220,13 @@ const NetworkGraph = () => {
|
|||||||
setOpen(true);
|
setOpen(true);
|
||||||
refreshData();
|
refreshData();
|
||||||
}}>
|
}}>
|
||||||
Show graph
|
<FormattedMessage defaultMessage="Show graph" id="ha8JKG" />
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
{open && graphData && (
|
{open && graphData && (
|
||||||
<div className="fixed top-0 left-0 right-0 bottom-0 z-20">
|
<div className="fixed top-0 left-0 right-0 bottom-0 z-20">
|
||||||
<button className="absolute top-6 right-6 z-30 btn hover:bg-gray-900" onClick={() => setOpen(false)}>
|
<button className="absolute top-6 right-6 z-30 btn hover:bg-gray-900" onClick={handleCloseGraph}>
|
||||||
X
|
<Icon name="x" size={24} />
|
||||||
</button>
|
</button>
|
||||||
<div className="absolute top-6 right-0 left-0 z-20 flex flex-col content-center justify-center text-center">
|
<div className="absolute top-6 right-0 left-0 z-20 flex flex-col content-center justify-center text-center">
|
||||||
<div className="text-center pb-2">Degrees of separation</div>
|
<div className="text-center pb-2">Degrees of separation</div>
|
||||||
|
@ -1122,6 +1122,9 @@
|
|||||||
"hY4lzx": {
|
"hY4lzx": {
|
||||||
"defaultMessage": "Supports"
|
"defaultMessage": "Supports"
|
||||||
},
|
},
|
||||||
|
"ha8JKG": {
|
||||||
|
"defaultMessage": "Show graph"
|
||||||
|
},
|
||||||
"hicxcO": {
|
"hicxcO": {
|
||||||
"defaultMessage": "Show replies"
|
"defaultMessage": "Show replies"
|
||||||
},
|
},
|
||||||
|
@ -369,6 +369,7 @@
|
|||||||
"hMzcSq": "Messages",
|
"hMzcSq": "Messages",
|
||||||
"hRTfTR": "PRO",
|
"hRTfTR": "PRO",
|
||||||
"hY4lzx": "Supports",
|
"hY4lzx": "Supports",
|
||||||
|
"ha8JKG": "Show graph",
|
||||||
"hicxcO": "Show replies",
|
"hicxcO": "Show replies",
|
||||||
"hmZ3Bz": "Media",
|
"hmZ3Bz": "Media",
|
||||||
"hniz8Z": "here",
|
"hniz8Z": "here",
|
||||||
|
Loading…
Reference in New Issue
Block a user