chore: rename getProviders action and add modal for editing provider info

actions/providers.ts

@@ -6,7 +6,7 @@ import { redirect } from "next/navigation";
 import { auth } from "@/auth.config";
 import { parseStringify } from "@/lib";
 
-export const getProvider = async ({
+export const getProviders = async ({
   page = 1,
   query = "",
   sort = "",
@@ -47,6 +47,28 @@ export const getProvider = async ({
   }
 };
 
+export const getProvider = async (formData: FormData) => {
+  const keyServer = process.env.API_BASE_URL;
+
+  const providerId = formData.get("id");
+
+  try {
+    const response = await fetch(`${keyServer}/providers/${providerId}`, {
+      method: "GET",
+      headers: {
+        "X-Tenant-ID": `${process.env.HEADER_TENANT_ID}`,
+      },
+    });
+    const data = await response.json();
+    revalidatePath("/providers");
+    return parseStringify(data);
+  } catch (error) {
+    return {
+      error: getErrorMessage(error),
+    };
+  }
+};
+
 export const addProvider = async (formData: FormData) => {
   const keyServer = process.env.API_BASE_URL;
 
@@ -81,8 +103,8 @@ export const addProvider = async (formData: FormData) => {
       error: getErrorMessage(error),
     };
   }
-  revalidatePath("/providers");
 };
+
 export const checkConnectionProvider = async (formData: FormData) => {
   const keyServer = process.env.API_BASE_URL;
 
@@ -107,6 +129,7 @@ export const checkConnectionProvider = async (formData: FormData) => {
     };
   }
 };
+
 export const deleteProvider = async (formData: FormData) => {
   const keyServer = process.env.API_BASE_URL;
 

app/(prowler)/providers/page.tsx

@@ -1,7 +1,7 @@
 import { Spacer } from "@nextui-org/react";
 import { Suspense } from "react";
 
-import { getProvider } from "@/actions";
+import { getProviders } from "@/actions";
 import { FilterControls } from "@/components/filters";
 import { AddProviderModal } from "@/components/providers";
 import {
@@ -54,7 +54,7 @@ const SSRDataTable = async ({
   // Extract query from filters
   const query = (filters["filter[search]"] as string) || "";
 
-  const providersData = await getProvider({ query, page, sort, filters });
+  const providersData = await getProviders({ query, page, sort, filters });
 
   return (
     <DataTableProvider

components/providers/table/data-table-row-actions.tsx

@@ -22,6 +22,7 @@ import { CustomAlertModal } from "@/components/ui/custom";
 
 import { CheckConnectionProvider } from "../CheckConnectionProvider";
 import { DeleteForm } from "../forms/DeleteForm";
+import EditForm from "../forms/EditForm";
 
 interface DataTableRowActionsProps<ProviderProps> {
   row: Row<ProviderProps>;
@@ -32,18 +33,19 @@ const iconClasses =
 export function DataTableRowActions<ProviderProps>({
   row,
 }: DataTableRowActionsProps<ProviderProps>) {
-  //   const [isEditOpen, setIsEditOpen] = useState(false);
+  const [isEditOpen, setIsEditOpen] = useState(false);
   const [isDeleteOpen, setIsDeleteOpen] = useState(false);
   const providerId = (row.original as { id: string }).id;
   return (
     <>
-      {/* <ResponsiveDialog
+      <CustomAlertModal
         isOpen={isEditOpen}
-        setIsOpen={setIsEditOpen}
-        title="Edit Person"
+        onOpenChange={setIsEditOpen}
+        title="Edit Provider"
+        description={"Edit the provider details"}
       >
         <EditForm providerId={providerId} setIsOpen={setIsEditOpen} />
-      </ResponsiveDialog> */}
+      </CustomAlertModal>
       <CustomAlertModal
         isOpen={isDeleteOpen}
         onOpenChange={setIsDeleteOpen}
@@ -82,6 +84,7 @@ export function DataTableRowActions<ProviderProps>({
                 shortcut="⌘⇧E"
                 textValue="Edit Provider"
                 startContent={<EditDocumentBulkIcon className={iconClasses} />}
+                onClick={() => setIsEditOpen(true)}
               >
                 Edit Provider
               </DropdownItem>