add notification modal

src/shared/lumeBar.tsx

@@ -1,7 +1,7 @@
 import { ActiveAccount } from "@shared/accounts/active";
 import { SettingsIcon } from "@shared/icons";
 import { Logout } from "@shared/logout";
-import { Notification } from "@shared/notification";
+import { NotificationModal } from "@shared/notification/modal";
 import { useAccount } from "@utils/hooks/useAccount";
 import { Link } from "react-router-dom";
 
@@ -12,11 +12,16 @@ export function LumeBar() {
 		<div className="rounded-xl p-2 border-t border-zinc-800/50 bg-zinc-900/80 backdrop-blur-md">
 			<div className="flex items-center justify-between">
 				{status === "loading" ? (
-					<div className="group relative flex h-9 w-9 shrink animate-pulse items-center justify-center rounded-md bg-zinc-900" />
+					<>
+						<div className="group relative flex h-9 w-9 shrink animate-pulse items-center justify-center rounded-md bg-zinc-900" />
+						<div className="group relative flex h-9 w-9 shrink animate-pulse items-center justify-center rounded-md bg-zinc-900" />
+					</>
 				) : (
-					<ActiveAccount data={account} />
+					<>
+						<ActiveAccount data={account} />
+						<NotificationModal pubkey={account.pubkey} />
+					</>
 				)}
-				<Notification />
 				<Link
 					to="/settings/general"
 					className="inline-flex items-center justify-center w-9 h-9 rounded-md border-t bg-zinc-800 border-zinc-700/50 transform active:translate-y-1"