reorganize code into smaller files & dirs

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

@@ -0,0 +1,50 @@
+import "./ZapButton.css";
+import { useState } from "react";
+import { HexKey } from "@snort/system";
+import { useUserProfile } from "@snort/system-react";
+
+import SendSats from "@/Components/SendSats/SendSats";
+import Icon from "@/Components/Icons/Icon";
+import { ZapTarget } from "@/Utils/Zapper";
+
+const ZapButton = ({
+  pubkey,
+  lnurl,
+  children,
+  event,
+}: {
+  pubkey: HexKey;
+  lnurl?: string;
+  children?: React.ReactNode;
+  event?: string;
+}) => {
+  const profile = useUserProfile(pubkey);
+  const [zap, setZap] = useState(false);
+  const service = lnurl ?? (profile?.lud16 || profile?.lud06);
+  if (!service) return null;
+
+  return (
+    <>
+      <button type="button" className="flex g8" onClick={() => setZap(true)}>
+        <Icon name="zap-solid" />
+        {children}
+      </button>
+      <SendSats
+        targets={[
+          {
+            type: "lnurl",
+            value: service,
+            weight: 1,
+            name: profile?.display_name || profile?.name,
+            zap: { pubkey: pubkey },
+          } as ZapTarget,
+        ]}
+        show={zap}
+        onClose={() => setZap(false)}
+        note={event}
+      />
+    </>
+  );
+};
+
+export default ZapButton;