Web/profile: Address review comments on message form

- Extract MessageUserButton mutation logic into useMessageUser hook
- Inline single-use types in NewMessage
- Make Overview's setIsRequesting/setIsMessaging optional and drop the
  TODO no-op stubs from ProfilePage

Co-authored-by: Aapeli <aapeliv@users.noreply.github.com>

Author: github-actions[bot]

app/web/features/profile/actions/MessageUserButton.tsx

@@ -1,15 +1,11 @@
-import { useMutation } from "@tanstack/react-query";
 import Button from "components/Button";
 import ProfileIncompleteDialog from "components/ProfileIncompleteDialog/ProfileIncompleteDialog";
 import useAccountInfo from "features/auth/useAccountInfo";
+import useMessageUser from "features/profile/hooks/useMessageUser";
 import { useTranslation } from "i18n";
 import { PROFILE } from "i18n/namespaces";
-import { useRouter } from "next/router";
 import { User } from "proto/api_pb";
 import { useState } from "react";
-import { service } from "service";
-
-import { routeToGroupChat } from "../../../routes";
 
 export default function MessageUserButton({
   user,
@@ -21,25 +17,10 @@ export default function MessageUserButton({
   setIsMessaging: (value: boolean) => void;
 }) {
   const { t } = useTranslation(PROFILE);
-  const router = useRouter();
-  const { mutate, isPending } = useMutation<number | false, Error>({
-    mutationFn: () => service.conversations.getDirectMessage(user.userId),
-
-    onMutate() {
-      setMutationError("");
-    },
-    onError(e) {
-      setMutationError(e.message);
-    },
-    onSuccess(data) {
-      if (!data) {
-        //no existing thread — open inline form
-        setIsMessaging(true);
-      } else {
-        //has thread
-        router.push(routeToGroupChat(data));
-      }
-    },
+  const { mutate, isPending } = useMessageUser({
+    userId: user.userId,
+    setMutationError,
+    setIsMessaging,
   });
 
   const [showCantMessageDialog, setShowCantMessageDialog] =

app/web/features/profile/hooks/useMessageUser.ts

@@ -0,0 +1,36 @@
+import { useMutation } from "@tanstack/react-query";
+import { useRouter } from "next/router";
+import { routeToGroupChat } from "routes";
+import { service } from "service";
+
+interface UseMessageUserParams {
+  userId: number;
+  setMutationError: (value: string) => void;
+  setIsMessaging: (value: boolean) => void;
+}
+
+export default function useMessageUser({
+  userId,
+  setMutationError,
+  setIsMessaging,
+}: UseMessageUserParams) {
+  const router = useRouter();
+  return useMutation<number | false, Error>({
+    mutationFn: () => service.conversations.getDirectMessage(userId),
+    onMutate() {
+      setMutationError("");
+    },
+    onError(e) {
+      setMutationError(e.message);
+    },
+    onSuccess(groupChatId) {
+      if (!groupChatId) {
+        // no existing thread — open inline form
+        setIsMessaging(true);
+      } else {
+        // has thread
+        router.push(routeToGroupChat(groupChatId));
+      }
+    },
+  });
+}

app/web/features/profile/view/NewMessage.tsx

@@ -28,15 +28,11 @@ const StyledSendActions = styled(CardActions)(() => ({
   marginTop: theme.spacing(2),
 }));
 
-interface NewMessageProps {
+export default function NewMessage({
+  setIsMessaging,
+}: {
   setIsMessaging: (value: boolean) => void;
-}
-
-interface MessageFormData {
-  text: string;
-}
-
-export default function NewMessage({ setIsMessaging }: NewMessageProps) {
+}) {
   const { t } = useTranslation([GLOBAL, PROFILE]);
   const user = useProfileUser();
   const router = useRouter();
@@ -46,12 +42,12 @@ export default function NewMessage({ setIsMessaging }: NewMessageProps) {
     register,
     reset,
     formState: { errors },
-  } = useForm<MessageFormData>();
+  } = useForm<{ text: string }>();
 
   const { error, mutate, isPending } = useMutation<
     number,
     Error,
-    MessageFormData
+    { text: string }
   >({
     mutationFn: (data) =>
       service.conversations.sendDirectMessage(user.userId, data.text),

app/web/features/profile/view/Overview.tsx

@@ -127,8 +127,8 @@ function DefaultActions({
 }
 
 interface OverviewProps {
-  setIsRequesting: (value: boolean) => void;
-  setIsMessaging: (value: boolean) => void;
+  setIsRequesting?: (value: boolean) => void;
+  setIsMessaging?: (value: boolean) => void;
   tab: UserTab;
 }
 
@@ -150,8 +150,8 @@ export default function Overview({
           <LoggedInUserActions tab={tab} />
         ) : (
           <DefaultActions
-            setIsRequesting={setIsRequesting}
-            setIsMessaging={setIsMessaging}
+            setIsRequesting={setIsRequesting ?? (() => {})}
+            setIsMessaging={setIsMessaging ?? (() => {})}
           />
         )
       }

app/web/features/profile/view/ProfilePage.tsx

@@ -45,15 +45,7 @@ export default function ProfilePage({ tab = "about" }: { tab?: UserTab }) {
       ) : user ? (
         <ProfileUserProvider user={user}>
           <StyledWrapper>
-            <Overview
-              setIsRequesting={() => {
-                /* TODO: not needed here*/
-              }}
-              setIsMessaging={() => {
-                /* TODO: not needed here*/
-              }}
-              tab={tab}
-            />
+            <Overview tab={tab} />
             <UserCard
               tab={tab}
               onTabChange={(newTab) => {