Disabled the editing of the country manager of a corporate from the payment record

src/components/UserCard.tsx

@@ -40,6 +40,9 @@ interface Props {
   onViewTeachers?: () => void;
   onViewCorporate?: () => void;
   disabled?: boolean;
+  disabledFields?: {
+    countryManager?: boolean;
+  };
 }
 
 const USER_STATUS_OPTIONS = [
@@ -75,6 +78,7 @@ const UserCard = ({
   onViewTeachers,
   onViewCorporate,
   disabled = false,
+  disabledFields = {},
 }: Props) => {
   const [expiryDate, setExpiryDate] = useState<Date | null | undefined>(
     user.subscriptionExpirationDate,
@@ -359,7 +363,8 @@ const UserCard = ({
                 <Select
                   className={clsx(
                     "px-4 py-4 w-full text-sm font-normal placeholder:text-mti-gray-cool bg-white rounded-full border border-mti-gray-platinum focus:outline-none",
-                    !["developer", "admin"].includes(loggedInUser.type) &&
+                    (!["developer", "admin"].includes(loggedInUser.type) ||
+                      disabledFields.countryManager) &&
                       "!bg-mti-gray-platinum/40 !text-mti-gray-dim cursor-not-allowed",
                   )}
                   options={[
@@ -400,7 +405,8 @@ const UserCard = ({
                   }}
                   // editing country manager should only be available for dev/admin
                   isDisabled={
-                    !["developer", "admin"].includes(loggedInUser.type)
+                    !["developer", "admin"].includes(loggedInUser.type) ||
+                    disabledFields.countryManager
                   }
                 />
               )}