merge master with main

app/(dashboard)/cloud-accounts/components/CloudAccountForm.tsx

@@ -305,9 +305,7 @@ const CloudAccountForm = ({
                   byoaServiceOfferingsObj,
                   byoaSubscriptions,
                   allInstances,
-                  serviceId,
-                  "",
-                  true
+                  serviceId
                 );
 
                 const servicePlanId = subscription?.productTierId || "";
@@ -358,8 +356,7 @@ const CloudAccountForm = ({
                       byoaSubscriptions,
                       allInstances,
                       serviceId,
-                      servicePlanId,
-                      true
+                      servicePlanId
                     );
 
                     setFieldValue("subscriptionId", subscriptionId || subscription?.id || "");
@@ -370,7 +367,7 @@ const CloudAccountForm = ({
                   }}
                   serviceSubscriptions={subscriptions.filter((subscription) => subscription.serviceId === serviceId)}
                   instances={allInstances}
-                  isCloudAccountForm={true}
+                  subscriptionInstancesNumHash={subscriptionInstanceCountHash}
                 />
               ),
               previewValue: serviceOfferingsObj[values.serviceId]?.[values.servicePlanId]?.productTierName,
@@ -381,7 +378,7 @@ const CloudAccountForm = ({
               subLabel: "Select the subscription",
               name: "subscriptionId",
               required: true,
-              isHidden: subscriptionMenuItems.length <= 1,
+              isHidden: subscriptionMenuItems.length === 0,
               customComponent: (
                 <SubscriptionMenu
                   field={{
@@ -398,7 +395,6 @@ const CloudAccountForm = ({
                   formData={formData}
                   subscriptions={subscriptionMenuItems}
                   subscriptionInstanceCountHash={subscriptionInstanceCountHash}
-                  isCloudAccountForm={true}
                 />
               ),
               previewValue: subscriptionsObj[values.subscriptionId]?.id,

app/(dashboard)/cloud-accounts/components/CloudAccountsTableHeader.tsx

@@ -1,15 +1,37 @@
+import { FC } from "react";
 import AddIcon from "@mui/icons-material/Add";
 import { CircularProgress } from "@mui/material";
 
 import ConnectIcon from "src/components/Icons/Connect/Connect";
 import DisconnectIcon from "src/components/Icons/Disconnect/Disconnect";
+import OffboardIcon from "src/components/Icons/Offboard/Offboard";
+import { AccountConfig } from "src/types/account-config";
+import { ResourceInstance } from "src/types/resourceInstance";
 import Button from "components/Button/Button";
 import SearchInput from "components/DataGrid/SearchInput";
 import DataGridHeaderTitle from "components/Headers/DataGridHeaderTitle";
 import DeleteIcon from "components/Icons/Delete/Delete";
 import RefreshWithToolTip from "components/RefreshWithTooltip/RefreshWithToolTip";
 
-const CloudAccountsTableHeader = ({
+type CloudAccountTableHeaderProps = {
+  count: number;
+  searchText: string;
+  setSearchText: (text: string) => void;
+  onCreateClick: () => void;
+  onDeleteClick: () => void;
+  selectedInstance: ResourceInstance;
+  refetchInstances: () => void;
+  isFetchingInstances: boolean;
+  onConnectClick: () => void;
+  onDisconnectClick: () => void;
+  onOffboardClick?: () => void;
+  serviceModelType: string;
+  accountConfig: AccountConfig;
+  isSelectedInstanceReadyToOffboard: boolean;
+  isFetchingAccountConfigs: boolean;
+};
+
+const CloudAccountsTableHeader: FC<CloudAccountTableHeaderProps> = ({
   count,
   searchText,
   setSearchText,
@@ -18,9 +40,12 @@ const CloudAccountsTableHeader = ({
   selectedInstance,
   refetchInstances,
   isFetchingInstances,
+  isFetchingAccountConfigs,
   onConnectClick,
   onDisconnectClick,
   serviceModelType,
+  onOffboardClick,
+  isSelectedInstanceReadyToOffboard,
 }) => {
   const isDeploying = selectedInstance?.status === "DEPLOYING";
   const isAttaching = selectedInstance?.status === "ATTACHING";
@@ -49,6 +74,8 @@ const CloudAccountsTableHeader = ({
 
   const isDeleteDisabled = !selectedInstance || isDeleting || isDisconnected;
 
+  const isOffboardDisabled = !isSelectedInstanceReadyToOffboard;
+
   const isDisconnectDisabledMessage = !selectedInstance
     ? "Please select a cloud account"
     : isAttaching || isConnecting
@@ -80,6 +107,12 @@ const CloudAccountsTableHeader = ({
         ? "Cloud account is disconnected"
         : "";
 
+  const offboardingDisabledMessage = !selectedInstance
+    ? "Please select a cloud account"
+    : isOffboardDisabled
+      ? "Cloud account is not ready to offboard"
+      : "";
+
   return (
     <div className="py-5 px-6 flex items justify-between gap-4">
       <DataGridHeaderTitle
@@ -96,7 +129,7 @@ const CloudAccountsTableHeader = ({
         <div className="flex items-center mr-6">{isFetchingInstances && <CircularProgress size={20} />}</div>
 
         <SearchInput placeholder="Search by ID" searchText={searchText} setSearchText={setSearchText} />
-        <RefreshWithToolTip refetch={refetchInstances} disabled={isFetchingInstances} />
+        <RefreshWithToolTip refetch={refetchInstances} disabled={isFetchingInstances || isFetchingAccountConfigs} />
 
         <Button
           data-testid="delete-button"
@@ -108,6 +141,16 @@ const CloudAccountsTableHeader = ({
         >
           Delete
         </Button>
+        <Button
+          data-testid="offboard-button"
+          variant="outlined"
+          disabled={isOffboardDisabled}
+          onClick={onOffboardClick}
+          disabledMessage={offboardingDisabledMessage}
+          startIcon={<OffboardIcon disabled={isOffboardDisabled} />}
+        >
+          Offboard
+        </Button>
         <Button
           data-testid="disconnect-button"
           variant="outlined"