chore: cleanup warnings

src/Element/Nip5Service.tsx

@@ -33,7 +33,7 @@ export default function Nip5Service(props: Nip05ServiceProps) {
     const pubkey = useSelector<ReduxStore, string>(s => s.login.publicKey);
     const user = useProfile(pubkey);
     const publisher = useEventPublisher();
-    const svc = new ServiceProvider(props.service);
+    const svc = useMemo(() => new ServiceProvider(props.service), [props.service]);
     const [serviceConfig, setServiceConfig] = useState<ServiceConfig>();
     const [error, setError] = useState<ServiceError>();
     const [handle, setHandle] = useState<string>("");
@@ -43,7 +43,7 @@ export default function Nip5Service(props: Nip05ServiceProps) {
     const [showInvoice, setShowInvoice] = useState<boolean>(false);
     const [registerStatus, setRegisterStatus] = useState<CheckRegisterResponse>();
 
-    const domainConfig = useMemo(() => serviceConfig?.domains.find(a => a.name === domain), [domain]);
+    const domainConfig = useMemo(() => serviceConfig?.domains.find(a => a.name === domain), [domain, serviceConfig]);
 
     useEffect(() => {
         svc.GetConfig()
@@ -58,7 +58,7 @@ export default function Nip5Service(props: Nip05ServiceProps) {
                 }
             })
             .catch(console.error)
-    }, [props]);
+    }, [props, svc]);
 
     useEffect(() => {
         setError(undefined);
@@ -89,7 +89,7 @@ export default function Nip5Service(props: Nip05ServiceProps) {
                     .catch(console.error);
             });
         }
-    }, [handle, domain]);
+    }, [handle, domain, domainConfig, svc]);
 
     useEffect(() => {
         if (registerResponse && showInvoice) {
@@ -111,7 +111,7 @@ export default function Nip5Service(props: Nip05ServiceProps) {
             }, 2_000);
             return () => clearInterval(t);
         }
-    }, [registerResponse, showInvoice])
+    }, [registerResponse, showInvoice, svc])
 
     function mapError(e: ServiceErrorCode, t: string | null): string | undefined {
         let whyMap = new Map([

src/Element/NoteCreator.css

@@ -16,13 +16,8 @@
     min-height: 40px;
     background-color: var(--note-bg);
     border-radius: 10px 10px 0 0;
-    max-width: -webkit-fill-available;
-    max-width: -moz-available;
-    max-width: fill-available;
-    min-width: 100%;
-    min-width: -webkit-fill-available;
-    min-width: -moz-available;
-    min-width: fill-available;
+    max-width: stretch;
+    min-width: stretch;
 }
 
 .note-creator .actions {

src/Element/NoteFooter.tsx

@@ -31,8 +31,8 @@ export default function NoteFooter(props: NoteFooterProps) {
   const [reply, setReply] = useState(false);
   const [tip, setTip] = useState(false);
   const isMine = ev.RootPubKey === login;
-  const reactions = useMemo(() => getReactions(related, ev.Id, EventKind.Reaction), [related]);
-  const reposts = useMemo(() => getReactions(related, ev.Id, EventKind.Repost), [related]);
+  const reactions = useMemo(() => getReactions(related, ev.Id, EventKind.Reaction), [related, ev]);
+  const reposts = useMemo(() => getReactions(related, ev.Id, EventKind.Repost), [related, ev]);
   const groupReactions = useMemo(() => {
     return reactions?.reduce((acc, { content }) => {
       let r = normalizeReaction(content);

src/Element/NoteReaction.tsx

@@ -16,7 +16,8 @@ export interface NoteReactionProps {
     root?: TaggedRawEvent
 }
 export default function NoteReaction(props: NoteReactionProps) {
-    const ev = useMemo(() => props["data-ev"] || new NEvent(props.data), [props.data, props["data-ev"]])
+    const { ["data-ev"]: dataEv, data } = props;
+    const ev = useMemo(() => dataEv || new NEvent(data), [data, dataEv])
 
     const refEvent = useMemo(() => {
         if (ev) {
@@ -32,19 +33,6 @@ export default function NoteReaction(props: NoteReactionProps) {
         return null;
     }
 
-    function mapReaction(c: string) {
-        switch (c) {
-            case "+": return "❤️";
-            case "-": return "👎";
-            default: {
-                if (c.length === 0) {
-                    return "❤️";
-                }
-                return c;
-            }
-        }
-    }
-
     /**
      * Some clients embed the reposted note in the content
      */

src/Element/Relay.tsx

@@ -1,11 +1,11 @@
 import "./Relay.css"
 
-import { faPlug, faTrash, faSquareCheck, faSquareXmark, faWifi, faPlugCircleXmark, faGear } from "@fortawesome/free-solid-svg-icons";
+import { faPlug, faSquareCheck, faSquareXmark, faWifi, faPlugCircleXmark, faGear } from "@fortawesome/free-solid-svg-icons";
 import useRelayState from "Feed/RelayState";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { useMemo, useState } from "react";
+import { useMemo } from "react";
 import { useDispatch, useSelector } from "react-redux";
-import { removeRelay, setRelays } from "State/Login";
+import { setRelays } from "State/Login";
 import { RootState } from "State/Store";
 import { RelaySettings } from "Nostr/Connection";
 import { useNavigate } from "react-router-dom";

src/Element/Timeline.tsx

@@ -1,5 +1,5 @@
 import "./Timeline.css";
-import { useMemo } from "react";
+import { useCallback, useMemo } from "react";
 import useTimelineFeed, { TimelineSubject } from "Feed/TimelineFeed";
 import { TaggedRawEvent } from "Nostr";
 import EventKind from "Nostr/EventKind";
@@ -23,17 +23,17 @@ export default function Timeline({ subject, postsOnly = false, method }: Timelin
         method
     });
 
-    const filterPosts = (notes: TaggedRawEvent[]) => {
-        return [...notes].sort((a, b) => b.created_at - a.created_at)?.filter(a => postsOnly ? !a.tags.some(b => b[0] === "e") : true);
-    }
+    const filterPosts = useCallback((nts: TaggedRawEvent[]) => {
+        return [...nts].sort((a, b) => b.created_at - a.created_at)?.filter(a => postsOnly ? !a.tags.some(b => b[0] === "e") : true);
+    }, [postsOnly]);
 
     const mainFeed = useMemo(() => {
         return filterPosts(main.notes);
-    }, [main]);
+    }, [main, filterPosts]);
 
     const latestFeed = useMemo(() => {
         return filterPosts(latest.notes).filter(a => !mainFeed.some(b => b.id === a.id));
-    }, [latest]);
+    }, [latest, mainFeed, filterPosts]);
 
     function eventElement(e: TaggedRawEvent) {
         switch (e.kind) {