fix: gm step

apps/edr-freight-web/portal/src/pages/accounts/CompanyProfileForm.tsx

@@ -11,7 +11,7 @@ import {
 } from "@mantine/core";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useQuery } from "@tanstack/react-query";
-import { AlertCircle, ArrowLeft, ArrowRight, UserCheck } from "lucide-react";
+import { AlertCircle, ArrowLeft, ArrowRight } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
 import { useForm } from "react-hook-form";
 
@@ -279,22 +279,39 @@ export default function CompanyProfileForm({
     });
   };
 
-  /** Fill the General Manager from the eTrade business owner. */
-  const useOwnerAsManager = () => {
-    if (!etradeOwner) return;
-    setValue("generalManagerName", etradeOwner.name);
-    setValue("generalManagerEmail", user.email);
-    setValue("generalManagerPhone", etradeOwner.phone ?? "", {
-      shouldValidate: true,
-    });
-  };
-
   // "Same as …" links. A checked card prefills the target step's fields from the
   // source step and disables them (kept mirrored while linked); unchecking clears
   // them and re-enables editing.
+  const [gmSameAsOwner, setGmSameAsOwner] = useState(false);
   const [contactSameAsGm, setContactSameAsGm] = useState(false);
   const [poaSameAsContact, setPoaSameAsContact] = useState(false);
 
+  // General Manager source: the eTrade-registered business owner when a TIN
+  // lookup found one, otherwise the registering user's own account details.
+  const gmSourceName = etradeOwner?.name ?? user.name?.en ?? "";
+  const gmSourcePhone = etradeOwner
+    ? etradeOwner.phone
+    : toEthiopianE164(user.phoneNumber);
+
+  useEffect(() => {
+    if (!gmSameAsOwner) return;
+    setValue("generalManagerName", gmSourceName, { shouldValidate: true });
+    setValue("generalManagerEmail", user.email ?? "", { shouldValidate: true });
+    setValue("generalManagerPhone", gmSourcePhone ?? "", {
+      shouldValidate: true,
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [gmSameAsOwner, gmSourceName, gmSourcePhone, user.email]);
+
+  const toggleGmSameAsOwner = (checked: boolean) => {
+    setGmSameAsOwner(checked);
+    if (!checked) {
+      setValue("generalManagerName", "");
+      setValue("generalManagerEmail", "");
+      setValue("generalManagerPhone", "");
+    }
+  };
+
   const gmName = watch("generalManagerName");
   const gmEmail = watch("generalManagerEmail");
   const gmPhone = watch("generalManagerPhone");
@@ -584,22 +601,19 @@ export default function CompanyProfileForm({
 
           {step === "personnel" && (
             <>
-              <Group justify="space-between" align="center">
-                <Text fw={600} size="sm" c="edr-text">
-                  General Manager
-                </Text>
-                {etradeOwner && (
-                  <Button
-                    variant="light"
-                    color="edr-green"
-                    size="xs"
-                    leftSection={<UserCheck size={14} />}
-                    onClick={useOwnerAsManager}
-                  >
-                    Use owner as manager
-                  </Button>
-                )}
-              </Group>
+              <Text fw={600} size="sm" c="edr-text">
+                General Manager
+              </Text>
+              <LinkCheckboxCard
+                checked={gmSameAsOwner}
+                onToggle={toggleGmSameAsOwner}
+                title="Same as business owner"
+                description={
+                  etradeOwner
+                    ? "Reuse the eTrade-registered owner's name and phone (email from your account). Uncheck to enter different details."
+                    : "Reuse your account's name, email and phone. Uncheck to enter different details."
+                }
+              />
               <TextInput
                 label="Name"
                 placeholder="Abebe Bikila"