Does useMemo work here? | Next.js | Page 1

Here.
"use client";

//imports

const AddFriendComponent = (props: { user: User; uuid: UUID }) => {
  const [user, setUser] = useState<User>(props.user);
  const [friendBeingAdded, setFriendBeingAdded] = useState<string>("");
  const submitButtonRef = useRef<HTMLInputElement>(null);
  const channel = websocketChannel(props.uuid); //What I only want to be created once
  useEffect(() => {
    channel.bind(
      "friend-request-sent",
      function (data: { newFriendRequest: IncomingFriendRequest }) {
        const currentUser = JSON.parse(JSON.stringify(user)) as User;
        currentUser.incomingFriendRequests.push(data.newFriendRequest);
        setUser(currentUser);
        toast.info("New friend request", {
          description: `${data.newFriendRequest.from[0].concat(
            data.newFriendRequest.from.substring(1).toLowerCase()
          )} has sent you a friend request`,
        });
      }
    );
    channel.bind(
      "friend-request-declined",
      function (data: { outgoingFriendRequests: OutgoingFriendRequest[] }) {
        const currentUser = JSON.parse(JSON.stringify(user)) as User;
        currentUser.outgoingFriendRequests = data.outgoingFriendRequests;
        setUser(currentUser);
        const indexDeleted = user?.outgoingFriendRequests.indexOf(
          user?.outgoingFriendRequests.filter((val) =>
            data.outgoingFriendRequests.every((val2) => !compare(val, val2))
          )[0]
        );
        toast.info("Friend requests declined", {
          description: `${
            user?.outgoingFriendRequests[indexDeleted as number].toDisplayName
          } has declined your friend request`,
        });
      }
    );
  }, [user]);

  return (
    <div className={styles.page}>
     {/*stuff*/}
    </div>
  );
};

export default AddFriendComponent;
#Does useMemo work here?
