split NoteContextMenu

packages/app/src/Components/Event/Note/Note.tsx

@@ -11,6 +11,7 @@ import NoteHeader from "@/Components/Event/Note/NoteHeader";
 import NoteQuote from "@/Components/Event/Note/NoteQuote";
 import { NoteText } from "@/Components/Event/Note/NoteText";
 import { TranslationInfo } from "@/Components/Event/Note/TranslationInfo";
+import {NoteTranslation} from "@/Components/Event/Note/types";
 import Username from "@/Components/User/Username";
 import useModeration from "@/Hooks/useModeration";
 import { findTag } from "@/Utils";
@@ -21,7 +22,6 @@ import Text from "../../Text/Text";
 import { NoteProps } from "../EventComponent";
 import HiddenNote from "../HiddenNote";
 import Poll from "../Poll";
-import { NoteTranslation } from "./NoteContextMenu";
 import NoteFooter from "./NoteFooter/NoteFooter";
 
 const defaultOptions = {

packages/app/src/Components/Event/Note/NoteContextMenu.tsx

@@ -1,34 +1,21 @@
-import { HexKey, NostrLink, NostrPrefix, TaggedNostrEvent } from "@snort/system";
-import { Menu, MenuItem } from "@szhsin/react-menu";
-import { useEffect, useState } from "react";
-import { FormattedMessage, useIntl } from "react-intl";
+import {HexKey, NostrLink, NostrPrefix} from "@snort/system";
+import {Menu, MenuItem} from "@szhsin/react-menu";
+import {useEffect, useState} from "react";
+import {FormattedMessage, useIntl} from "react-intl";
 
+import {NoteContextMenuProps, NoteTranslation} from "@/Components/Event/Note/types";
 import Icon from "@/Components/Icons/Icon";
 import messages from "@/Components/messages";
 import SnortApi from "@/External/SnortApi";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import useLogin from "@/Hooks/useLogin";
 import useModeration from "@/Hooks/useModeration";
-import { setBookmarked, setPinned } from "@/Utils/Login";
-import { getCurrentSubscription, SubscriptionType } from "@/Utils/Subscription";
+import {setBookmarked, setPinned} from "@/Utils/Login";
+import {getCurrentSubscription, SubscriptionType} from "@/Utils/Subscription";
 
-import { ReBroadcaster } from "../../ReBroadcaster";
+import {ReBroadcaster} from "../../ReBroadcaster";
 
-export interface NoteTranslation {
-  text: string;
-  fromLanguage: string;
-  confidence: number;
-  skipped?: boolean;
-}
-
-interface NosteContextMenuProps {
-  ev: TaggedNostrEvent;
-  setShowReactions(b: boolean): void;
-  react(content: string): Promise<void>;
-  onTranslated?: (t: NoteTranslation) => void;
-}
-
-export function NoteContextMenu({ ev, ...props }: NosteContextMenuProps) {
+export function NoteContextMenu({ ev, ...props }: NoteContextMenuProps) {
   const { formatMessage } = useIntl();
   const login = useLogin();
   const { mute, block } = useModeration();

packages/app/src/Components/Event/Note/NoteHeader.tsx

@@ -3,10 +3,11 @@ import React, { useState } from "react";
 import { FormattedMessage, useIntl } from "react-intl";
 
 import { NotePropsOptions } from "@/Components/Event/EventComponent";
-import { NoteContextMenu, NoteTranslation } from "@/Components/Event/Note/NoteContextMenu";
+import { NoteContextMenu } from "@/Components/Event/Note/NoteContextMenu";
 import NoteTime from "@/Components/Event/Note/NoteTime";
 import ReactionsModal from "@/Components/Event/Note/ReactionsModal";
 import ReplyTag from "@/Components/Event/Note/ReplyTag";
+import {NoteTranslation} from "@/Components/Event/Note/types";
 import Icon from "@/Components/Icons/Icon";
 import messages from "@/Components/messages";
 import ProfileImage from "@/Components/User/ProfileImage";

packages/app/src/Components/Event/Note/NoteText.tsx

@@ -3,7 +3,7 @@ import { FormattedMessage } from "react-intl";
 import { Link } from "react-router-dom";
 
 import { NoteProps } from "@/Components/Event/EventComponent";
-import { NoteTranslation } from "@/Components/Event/Note/NoteContextMenu";
+import {NoteTranslation} from "@/Components/Event/Note/types";
 import Reveal from "@/Components/Event/Reveal";
 import Text from "@/Components/Text/Text";
 import useLogin from "@/Hooks/useLogin";

packages/app/src/Components/Event/Note/TranslationInfo.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { FormattedMessage } from "react-intl";
 
-import { NoteTranslation } from "@/Components/Event/Note/NoteContextMenu";
+import {NoteTranslation} from "@/Components/Event/Note/types";
 import messages from "@/Components/messages";
 
 interface TranslationInfoProps {

packages/app/src/Components/Event/Note/types.tsx

@@ -0,0 +1,18 @@
+import {TaggedNostrEvent} from "@snort/system";
+
+export interface NoteTranslation {
+  text: string;
+  fromLanguage: string;
+  confidence: number;
+  skipped?: boolean;
+}
+
+export interface NoteContextMenuProps {
+  ev: TaggedNostrEvent;
+
+  setShowReactions(b: boolean): void;
+
+  react(content: string): Promise<void>;
+
+  onTranslated?: (t: NoteTranslation) => void;
+}

packages/app/src/Pages/DonatePage.tsx

@@ -12,12 +12,11 @@ import Modal from "@/Components/Modal/Modal";
 import QrCode from "@/Components/QrCode";
 import ProfilePreview from "@/Components/User/ProfilePreview";
 import SnortApi, { RevenueSplit, RevenueToday } from "@/External/SnortApi";
+import { ZapPoolTarget } from "@/Pages/ZapPool/ZapPoolTarget";
 import { bech32ToHex, unwrap } from "@/Utils";
 import { ApiHost, DeveloperAccounts, SnortPubKey } from "@/Utils/Const";
 import { ZapPoolController, ZapPoolRecipientType } from "@/Utils/ZapPoolController";
 
-import { ZapPoolTarget } from "./ZapPool";
-
 const Contributors = [
   bech32ToHex("npub10djxr5pvdu97rjkde7tgcsjxzpdzmdguwacfjwlchvj7t88dl7nsdl54nf"), // ivan
   bech32ToHex("npub148jmlutaa49y5wl5mcll003ftj59v79vf7wuv3apcwpf75hx22vs7kk9ay"), // liran cohen

packages/app/src/Pages/ZapPool/ZapPool.tsx

@@ -0,0 +1,11 @@
+import "./ZapPool.css";
+
+import { ZapPoolPageInner } from "@/Pages/ZapPool/ZapPoolPageInner";
+import { ZapPoolController } from "@/Utils/ZapPoolController";
+
+export default function ZapPoolPage() {
+  if (!ZapPoolController) {
+    return null;
+  }
+  return <ZapPoolPageInner />;
+}

packages/app/src/Pages/ZapPool/ZapPoolPageInner.tsx

@@ -1,17 +1,14 @@
-import "./ZapPool.css";
-
-import { useUserProfile } from "@snort/system-react";
 import { useMemo, useSyncExternalStore } from "react";
 import { FormattedMessage, FormattedNumber } from "react-intl";
 
 import AsyncButton from "@/Components/Button/AsyncButton";
-import ProfilePreview from "@/Components/User/ProfilePreview";
 import useEventPublisher from "@/Hooks/useEventPublisher";
 import useLogin from "@/Hooks/useLogin";
+import { ZapPoolTarget } from "@/Pages/ZapPool/ZapPoolTarget";
 import { bech32ToHex, getRelayName, trackEvent, unwrap } from "@/Utils";
 import { SnortPubKey } from "@/Utils/Const";
 import { UploaderServices } from "@/Utils/Upload";
-import { ZapPoolController, ZapPoolRecipient, ZapPoolRecipientType } from "@/Utils/ZapPoolController";
+import { ZapPoolController, ZapPoolRecipientType } from "@/Utils/ZapPoolController";
 import { useWallet } from "@/Wallet";
 
 const DataProviders = [
@@ -21,51 +18,7 @@ const DataProviders = [
   },
 ];
 
-function ZapPoolTargetInner({ target }: { target: ZapPoolRecipient }) {
-  const login = useLogin();
-  const profile = useUserProfile(target.pubkey);
-  const hasAddress = profile?.lud16 || profile?.lud06;
-  const defaultZapMount = Math.ceil(login.appData.item.preferences.defaultZapAmount * (target.split / 100));
-  return (
-    <ProfilePreview
-      pubkey={target.pubkey}
-      actions={
-        hasAddress ? (
-          <div>
-            <div>
-              <FormattedNumber value={target.split} />% (
-              <FormattedMessage defaultMessage="{n} sats" id="CsCUYo" values={{ n: defaultZapMount }} />)
-            </div>
-            <input
-              type="range"
-              min={0}
-              max={100}
-              step={0.5}
-              value={target.split}
-              onChange={e =>
-                ZapPoolController?.set({
-                  ...target,
-                  split: e.target.valueAsNumber,
-                })
-              }
-            />
-          </div>
-        ) : (
-          <FormattedMessage defaultMessage="No lightning address" id="JPFYIM" />
-        )
-      }
-    />
-  );
-}
-
-export function ZapPoolTarget({ target }: { target: ZapPoolRecipient }) {
-  if (!ZapPoolController) {
-    return null;
-  }
-  return <ZapPoolTargetInner target={target} />;
-}
-
-function ZapPoolPageInner() {
+export function ZapPoolPageInner() {
   const login = useLogin();
   const { system } = useEventPublisher();
   const zapPool = useSyncExternalStore(
@@ -232,10 +185,3 @@ function ZapPoolPageInner() {
     </div>
   );
 }
-
-export default function ZapPoolPage() {
-  if (!ZapPoolController) {
-    return null;
-  }
-  return <ZapPoolPageInner />;
-}

packages/app/src/Pages/ZapPool/ZapPoolTarget.tsx

@@ -0,0 +1,50 @@
+import { useUserProfile } from "@snort/system-react";
+import { FormattedMessage, FormattedNumber } from "react-intl";
+
+import ProfilePreview from "@/Components/User/ProfilePreview";
+import useLogin from "@/Hooks/useLogin";
+import { ZapPoolController, ZapPoolRecipient } from "@/Utils/ZapPoolController";
+
+function ZapPoolTargetInner({ target }: { target: ZapPoolRecipient }) {
+  const login = useLogin();
+  const profile = useUserProfile(target.pubkey);
+  const hasAddress = profile?.lud16 || profile?.lud06;
+  const defaultZapMount = Math.ceil(login.appData.item.preferences.defaultZapAmount * (target.split / 100));
+  return (
+    <ProfilePreview
+      pubkey={target.pubkey}
+      actions={
+        hasAddress ? (
+          <div>
+            <div>
+              <FormattedNumber value={target.split} />% (
+              <FormattedMessage defaultMessage="{n} sats" id="CsCUYo" values={{ n: defaultZapMount }} />)
+            </div>
+            <input
+              type="range"
+              min={0}
+              max={100}
+              step={0.5}
+              value={target.split}
+              onChange={e =>
+                ZapPoolController?.set({
+                  ...target,
+                  split: e.target.valueAsNumber,
+                })
+              }
+            />
+          </div>
+        ) : (
+          <FormattedMessage defaultMessage="No lightning address" id="JPFYIM" />
+        )
+      }
+    />
+  );
+}
+
+export function ZapPoolTarget({ target }: { target: ZapPoolRecipient }) {
+  if (!ZapPoolController) {
+    return null;
+  }
+  return <ZapPoolTargetInner target={target} />;
+}

packages/app/src/Pages/settings/Menu/Menu.tsx

@@ -1,10 +1,9 @@
-import classNames from "classnames";
 import { ReactNode, useCallback } from "react";
 import { FormattedMessage } from "react-intl";
-import { Link, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 
-import Icon from "@/Components/Icons/Icon";
 import useLogin from "@/Hooks/useLogin";
+import { SettingsMenuComponent } from "@/Pages/settings/Menu/SettingsMenuComponent";
 import { LoginStore, logout } from "@/Utils/Login";
 import { getCurrentSubscription } from "@/Utils/Subscription";
 
@@ -175,35 +174,4 @@ const SettingsIndex = () => {
   return <SettingsMenuComponent menu={settingsGroups} />;
 };
 
-export function SettingsMenuComponent({ menu }: { menu: SettingsMenuItems }) {
-  return (
-    <div className="flex flex-col">
-      {menu.map((group, groupIndex) => (
-        <div key={groupIndex} className="mb-4">
-          <div className="p-2 font-bold uppercase text-secondary text-xs tracking-wide">{group.title}</div>
-          {group.items.map(({ icon, iconBg, message, path, action }, index) => (
-            <Link
-              to={path || "#"}
-              onClick={action}
-              key={path || index}
-              className={classNames("px-2.5 py-1.5 flex justify-between items-center border border-border-color", {
-                "rounded-t-xl": index === 0,
-                "rounded-b-xl": index === group.items.length - 1,
-                "border-t-0": index !== 0,
-              })}>
-              <div className="flex items-center gap-3">
-                <div className={`p-1 ${iconBg} rounded-lg flex justify-center items-center text-white`}>
-                  <Icon name={icon} size={18} className="relative" />
-                </div>
-                <span className="text-base font-semibold flex-grow">{message}</span>
-              </div>
-              <Icon name="arrowFront" size={12} className="text-secondary" />
-            </Link>
-          ))}
-        </div>
-      ))}
-    </div>
-  );
-}
-
 export default SettingsIndex;

packages/app/src/Pages/settings/Menu/SettingsMenuComponent.tsx

@@ -0,0 +1,36 @@
+import classNames from "classnames";
+import { Link } from "react-router-dom";
+
+import Icon from "@/Components/Icons/Icon";
+import { SettingsMenuItems } from "@/Pages/settings/Menu/Menu";
+
+export function SettingsMenuComponent({ menu }: { menu: SettingsMenuItems }) {
+  return (
+    <div className="flex flex-col">
+      {menu.map((group, groupIndex) => (
+        <div key={groupIndex} className="mb-4">
+          <div className="p-2 font-bold uppercase text-secondary text-xs tracking-wide">{group.title}</div>
+          {group.items.map(({ icon, iconBg, message, path, action }, index) => (
+            <Link
+              to={path || "#"}
+              onClick={action}
+              key={path || index}
+              className={classNames("px-2.5 py-1.5 flex justify-between items-center border border-border-color", {
+                "rounded-t-xl": index === 0,
+                "rounded-b-xl": index === group.items.length - 1,
+                "border-t-0": index !== 0,
+              })}>
+              <div className="flex items-center gap-3">
+                <div className={`p-1 ${iconBg} rounded-lg flex justify-center items-center text-white`}>
+                  <Icon name={icon} size={18} className="relative" />
+                </div>
+                <span className="text-base font-semibold flex-grow">{message}</span>
+              </div>
+              <Icon name="arrowFront" size={12} className="text-secondary" />
+            </Link>
+          ))}
+        </div>
+      ))}
+    </div>
+  );
+}

packages/app/src/Pages/settings/Routes.tsx

@@ -4,7 +4,7 @@ import AccountsPage from "@/Pages/settings/Accounts";
 import { CacheSettings } from "@/Pages/settings/Cache";
 import { ManageHandleRoutes } from "@/Pages/settings/handle";
 import ExportKeys from "@/Pages/settings/Keys";
-import Menu from "@/Pages/settings/Menu";
+import Menu from "@/Pages/settings/Menu/Menu";
 import ModerationSettings from "@/Pages/settings/Moderation";
 import Notifications from "@/Pages/settings/Notifications";
 import Preferences from "@/Pages/settings/Preferences";

packages/app/src/Pages/settings/tools/index.tsx

@@ -1,7 +1,9 @@
 import { FormattedMessage } from "react-intl";
 import { Outlet, RouteObject } from "react-router-dom";
 
-import { SettingsMenuComponent, SettingsMenuItems } from "../Menu";
+import { SettingsMenuComponent } from "@/Pages/settings/Menu/SettingsMenuComponent";
+
+import { SettingsMenuItems } from "../Menu/Menu";
 import { FollowsRelayHealth } from "./follows-relay-health";
 import { PruneFollowList } from "./prune-follows";
 

packages/app/src/index.tsx

@@ -36,7 +36,7 @@ import { SubscribeRoutes } from "@/Pages/subscribe";
 import WalletPage from "@/Pages/wallet";
 import { WalletReceivePage } from "@/Pages/wallet/receive";
 import { WalletSendPage } from "@/Pages/wallet/send";
-import ZapPoolPage from "@/Pages/ZapPool";
+import ZapPoolPage from "@/Pages/ZapPool/ZapPool";
 import { System } from "@/system";
 import { storeRefCode, unwrap } from "@/Utils";
 import { LoginStore } from "@/Utils/Login";