diff --git a/app/(prowler)/scans/page.tsx b/app/(prowler)/scans/page.tsx index 44e5881609..7f97d572d3 100644 --- a/app/(prowler)/scans/page.tsx +++ b/app/(prowler)/scans/page.tsx @@ -11,7 +11,7 @@ import { ColumnProviderScans } from "@/components/scans/table/provider-scans"; import { ColumnGetScans } from "@/components/scans/table/scans"; import { Header } from "@/components/ui"; import { DataTable } from "@/components/ui/table"; -import { SearchParamsProps } from "@/types"; +import { ProviderProps, SearchParamsProps } from "@/types"; export default async function Scans({ searchParams, @@ -19,15 +19,27 @@ export default async function Scans({ searchParams: SearchParamsProps; }) { const searchParamsKey = JSON.stringify(searchParams || {}); + // const providersData = await getProviders({ + // filters: { "filter[connected]": "true" }, + // }); + const providersData = await getProviders({}); + + const providerInfo = providersData?.data?.length + ? providersData.data.map((provider: ProviderProps) => ({ + providerId: provider.id, + alias: provider.attributes.alias, + providerType: provider.attributes.provider, + uid: provider.attributes.uid, + connected: provider.attributes.connection.connected, + })) + : []; return ( <>
- }> - - +
diff --git a/components/scans/launch-workflow/launch-scan-workflow.tsx b/components/scans/launch-workflow/launch-scan-workflow.tsx index 4fb3f4f16b..00423ef8e5 100644 --- a/components/scans/launch-workflow/launch-scan-workflow.tsx +++ b/components/scans/launch-workflow/launch-scan-workflow.tsx @@ -1,31 +1,131 @@ -import { getProviders } from "@/actions/providers/providers"; -import { ProviderProps } from "@/types"; +"use client"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { useForm } from "react-hook-form"; +import * as z from "zod"; + +import { scanOnDemand } from "@/actions/scans"; +import { RocketIcon } from "@/components/icons"; +import { CustomButton, CustomInput } from "@/components/ui/custom"; +import { Form } from "@/components/ui/form"; +import { toast } from "@/components/ui/toast"; +import { onDemandScanFormSchema } from "@/types"; import { SelectScanProvider } from "./select-scan-provider"; -export const LaunchScanWorkflow = async () => { - // const providersData = await getProviders({ - // filters: { "filter[connected]": "true" }, - // }); - const providersData = await getProviders({}); +type ProviderInfo = { + providerId: string; + alias: string; + providerType: string; + uid: string; + connected: boolean; +}; - const providerInfo = providersData?.data?.length - ? providersData.data.map((provider: ProviderProps) => ({ - alias: provider.attributes.alias, - providerType: provider.attributes.provider, - uid: provider.attributes.uid, - connected: provider.attributes.connection.connected, - })) - : []; +export const LaunchScanWorkflow = ({ + providers, +}: { + providers: ProviderInfo[]; +}) => { + const formSchema = onDemandScanFormSchema(); + const form = useForm>({ + resolver: zodResolver(formSchema), + defaultValues: { + providerId: "", + scanName: "", + scannerArgs: { checksToExecute: [] }, + }, + }); + + const isLoading = form.formState.isSubmitting; + + const onSubmitClient = async (values: z.infer) => { + const formData = new FormData(); + console.log(values); + + // Loop through form values and add to formData, converting objects to JSON strings + Object.entries(values).forEach( + ([key, value]) => + value !== undefined && + formData.append( + key, + typeof value === "object" ? JSON.stringify(value) : value, + ), + ); + + const data = await scanOnDemand(formData); + + if (data?.errors && data.errors.length > 0) { + const error = data.errors[0]; + const errorMessage = `${error.detail}`; + // show error + toast({ + variant: "destructive", + title: "Oops! Something went wrong", + description: errorMessage, + }); + } else { + toast({ + title: "Success!", + description: "The scan was launched successfully.", + }); + } + }; return ( -
-
-
- Launch Scan - +
+ +
+
+
+ Launch Scan + +
+ +
-
-
+
+ + Cancel + + + } + > + {isLoading ? <>Loading : Start now} + +
+ + ); }; diff --git a/components/scans/launch-workflow/select-scan-provider.tsx b/components/scans/launch-workflow/select-scan-provider.tsx index 9fcc2e70da..ff9d1d0917 100644 --- a/components/scans/launch-workflow/select-scan-provider.tsx +++ b/components/scans/launch-workflow/select-scan-provider.tsx @@ -1,25 +1,37 @@ "use client"; import { Select, SelectItem } from "@nextui-org/react"; -import { useState } from "react"; +import { Control, FieldPath, FieldValues } from "react-hook-form"; import { AWSProviderBadge } from "@/components/icons/providers-badge/AWSProviderBadge"; import { AzureProviderBadge } from "@/components/icons/providers-badge/AzureProviderBadge"; import { GCPProviderBadge } from "@/components/icons/providers-badge/GCPProviderBadge"; import { KS8ProviderBadge } from "@/components/icons/providers-badge/KS8ProviderBadge"; +import { FormControl, FormField, FormMessage } from "@/components/ui/form"; -interface SelectScanProviderProps { +interface SelectScanProviderProps< + TFieldValues extends FieldValues = FieldValues, + TName extends FieldPath = FieldPath, +> { providers: { + providerId: string; alias: string; providerType: string; uid: string; connected: boolean; }[]; + control: Control; + name: TName; } -export const SelectScanProvider = ({ providers }: SelectScanProviderProps) => { - const [selectedKeys, setSelectedKeys] = useState>(new Set()); - +export const SelectScanProvider = < + TFieldValues extends FieldValues = FieldValues, + TName extends FieldPath = FieldPath, +>({ + providers, + control, + name, +}: SelectScanProviderProps) => { const renderBadge = (providerType: string) => { switch (providerType) { case "aws": @@ -36,35 +48,53 @@ export const SelectScanProvider = ({ providers }: SelectScanProviderProps) => { }; return ( - + ( + <> + + + + + + )} + /> ); };