fix: linter

ui/app/(prowler)/providers/(set-up-provider)/add-credentials/page.tsx

@@ -34,8 +34,11 @@ export default function AddCredentialsPage({ searchParams }: Props) {
       {((searchParams.type === "aws" && searchParams.via === "credentials") ||
         (searchParams.type === "gcp" && searchParams.via === "credentials") ||
         (searchParams.type === "m365" && searchParams.via === "credentials") ||
-        (searchParams.type === "m365" && searchParams.via === "service-principal-user") ||
-        (searchParams.type !== "aws" && searchParams.type !== "gcp" && searchParams.type !== "m365")) && (
+        (searchParams.type === "m365" &&
+          searchParams.via === "service-principal-user") ||
+        (searchParams.type !== "aws" &&
+          searchParams.type !== "gcp" &&
+          searchParams.type !== "m365")) && (
         <AddViaCredentialsForm searchParams={searchParams} />
       )}
 

ui/app/(prowler)/providers/(set-up-provider)/update-credentials/page.tsx

@@ -20,7 +20,9 @@ interface Props {
 export default function UpdateCredentialsPage({ searchParams }: Props) {
   return (
     <>
-      {(searchParams.type === "aws" || searchParams.type === "gcp" || searchParams.type === "m365") &&
+      {(searchParams.type === "aws" ||
+        searchParams.type === "gcp" ||
+        searchParams.type === "m365") &&
         !searchParams.via && (
           <CredentialsUpdateInfo
             providerType={searchParams.type}
@@ -31,8 +33,11 @@ export default function UpdateCredentialsPage({ searchParams }: Props) {
       {((searchParams.type === "aws" && searchParams.via === "credentials") ||
         (searchParams.type === "gcp" && searchParams.via === "credentials") ||
         (searchParams.type === "m365" && searchParams.via === "credentials") ||
-        (searchParams.type === "m365" && searchParams.via === "service-principal-user") ||
-        (searchParams.type !== "aws" && searchParams.type !== "gcp" && searchParams.type !== "m365")) && (
+        (searchParams.type === "m365" &&
+          searchParams.via === "service-principal-user") ||
+        (searchParams.type !== "aws" &&
+          searchParams.type !== "gcp" &&
+          searchParams.type !== "m365")) && (
         <UpdateViaCredentialsForm searchParams={searchParams} />
       )}
 

ui/components/providers/workflow/forms/base-credentials-form.tsx

@@ -24,10 +24,10 @@ import { AWSStaticCredentialsForm } from "./select-credentials-type/aws/credenti
 import { AWSRoleCredentialsForm } from "./select-credentials-type/aws/credentials-type/aws-role-credentials-form";
 import { GCPDefaultCredentialsForm } from "./select-credentials-type/gcp/credentials-type";
 import { GCPServiceAccountKeyForm } from "./select-credentials-type/gcp/credentials-type/gcp-service-account-key-form";
-import { AzureCredentialsForm } from "./via-credentials/azure-credentials-form";
-import { KubernetesCredentialsForm } from "./via-credentials/k8s-credentials-form";
 import { M365ServicePrincipalForm } from "./select-credentials-type/m365/credentials-type";
 import { M365ServicePrincipalUserForm } from "./select-credentials-type/m365/credentials-type/m365-service-principal-user-form";
+import { AzureCredentialsForm } from "./via-credentials/azure-credentials-form";
+import { KubernetesCredentialsForm } from "./via-credentials/k8s-credentials-form";
 
 type BaseCredentialsFormProps = {
   providerType: ProviderType;
@@ -98,16 +98,18 @@ export const BaseCredentialsForm = ({
             control={form.control as unknown as Control<AzureCredentials>}
           />
         )}
-        {providerType === "m365" && searchParamsObj.get("via") === "service-principal-user" && (
-          <M365ServicePrincipalUserForm
-            control={form.control as unknown as Control<M365Credentials>}
-          />
-        )}
-        {providerType === "m365" && searchParamsObj.get("via") !== "service-principal-user" && (
-          <M365ServicePrincipalForm
-            control={form.control as unknown as Control<M365Credentials>}
-          />
-        )}
+        {providerType === "m365" &&
+          searchParamsObj.get("via") === "service-principal-user" && (
+            <M365ServicePrincipalUserForm
+              control={form.control as unknown as Control<M365Credentials>}
+            />
+          )}
+        {providerType === "m365" &&
+          searchParamsObj.get("via") !== "service-principal-user" && (
+            <M365ServicePrincipalForm
+              control={form.control as unknown as Control<M365Credentials>}
+            />
+          )}
         {providerType === "gcp" &&
           searchParamsObj.get("via") === "service-account" && (
             <GCPServiceAccountKeyForm

ui/components/providers/workflow/forms/select-credentials-type/m365/credentials-type/m365-service-principal-form.tsx

@@ -1,5 +1,4 @@
-import Link from "next/link";
-import { Control, UseFormSetValue, useWatch } from "react-hook-form";
+import { Control } from "react-hook-form";
 
 import { CustomInput } from "@/components/ui/custom";
 import { ProviderCredentialFields } from "@/lib/provider-credentials/provider-credential-fields";
@@ -7,89 +6,21 @@ import { M365Credentials } from "@/types";
 
 export const M365ServicePrincipalForm = ({
   control,
-  setValue,
 }: {
   control: Control<M365Credentials>;
-  setValue: UseFormSetValue<M365Credentials>;
-  externalId: string;
 }) => {
-  const credentialsType = useWatch({
-    control,
-    name: ProviderCredentialFields.CREDENTIALS_TYPE,
-    defaultValue: "m365-service-principal",
-  });
-
   return (
     <>
       <div className="flex flex-col">
         <div className="text-md font-bold leading-9 text-default-foreground">
-          Connect using Application/Service Principal
+          Application/Service Principal
         </div>
         <div className="text-sm text-default-500">
-          Please provide the information for your Microsoft 365 Service Principal.
+          Please provide the Application/Service Principal information for your
+          Microsoft 365 tenant.
         </div>
       </div>
 
-      <span className="text-xs font-bold text-default-500">Authentication</span>
-
-      <Select
-        name={ProviderCredentialFields.CREDENTIALS_TYPE}
-        label="Authentication Method"
-        placeholder="Select credentials type"
-        defaultSelectedKeys={["m365-service-principal"]}
-        className="mb-4"
-        variant="bordered"
-        onSelectionChange={(keys) =>
-          setValue(
-            ProviderCredentialFields.CREDENTIALS_TYPE,
-            Array.from(keys)[0] as "m365-service-principal" | "m365-user-credentials",
-          )
-        }
-      >
-        <SelectItem key="m365-service-principal">Application/Service Principal</SelectItem>
-        <SelectItem key="m365-user-credentials">User credentials</SelectItem>
-      </Select>
-
-      {credentialsType === "m365-service-principal" && (
-        <>
-          <CustomInput
-            control={control}
-            name={ProviderCredentialFields.CLIENT_ID}
-            type="text"
-            label="Client ID"
-            labelPlacement="inside"
-            placeholder="Enter the Client ID"
-            variant="bordered"
-            isRequired
-            isInvalid={!!control._formState.errors[ProviderCredentialFields.CLIENT_ID]}
-          />
-          <CustomInput
-            control={control}
-            name={ProviderCredentialFields.CLIENT_SECRET}
-            type="password"
-            label="Client Secret"
-            labelPlacement="inside"
-            placeholder="Enter the Client Secret"
-            variant="bordered"
-            isRequired
-            isInvalid={!!control._formState.errors[ProviderCredentialFields.CLIENT_SECRET]}
-          />
-          <CustomInput
-            control={control}
-            name={ProviderCredentialFields.TENANT_ID}
-            type="text"
-            label="Tenant ID"
-            labelPlacement="inside"
-            placeholder="Enter the Tenant ID"
-            variant="bordered"
-            isRequired
-            isInvalid={!!control._formState.errors[ProviderCredentialFields.TENANT_ID]}
-          />
-        </>
-      )}
-
-      {credentialsType === "m365-user-credentials" && (
-        <>
       <CustomInput
         control={control}
         name={ProviderCredentialFields.CLIENT_ID}
@@ -99,7 +30,9 @@ export const M365ServicePrincipalForm = ({
         placeholder="Enter the Client ID"
         variant="bordered"
         isRequired
-        isInvalid={!!control._formState.errors[ProviderCredentialFields.CLIENT_ID]}
+        isInvalid={
+          !!control._formState.errors[ProviderCredentialFields.CLIENT_ID]
+        }
       />
 
       <CustomInput
@@ -111,7 +44,9 @@ export const M365ServicePrincipalForm = ({
         placeholder="Enter the Client Secret"
         variant="bordered"
         isRequired
-        isInvalid={!!control._formState.errors[ProviderCredentialFields.CLIENT_SECRET]}
+        isInvalid={
+          !!control._formState.errors[ProviderCredentialFields.CLIENT_SECRET]
+        }
       />
 
       <CustomInput
@@ -123,10 +58,10 @@ export const M365ServicePrincipalForm = ({
         placeholder="Enter the Tenant ID"
         variant="bordered"
         isRequired
-        isInvalid={!!control._formState.errors[ProviderCredentialFields.TENANT_ID]}
+        isInvalid={
+          !!control._formState.errors[ProviderCredentialFields.TENANT_ID]
+        }
       />
-      </>
-      )}
     </>
   );
 };

ui/components/providers/workflow/forms/select-credentials-type/m365/credentials-type/m365-service-principal-user-form.tsx

@@ -18,15 +18,16 @@ export const M365ServicePrincipalUserForm = ({
           Service Principal + User Credentials
         </div>
         <div className="text-sm text-default-500">
-          Connect using Service Principal credentials combined with user authentication for PowerShell modules.
+          Connect using Service Principal credentials combined with user
+          authentication for PowerShell modules.
         </div>
       </div>
 
       <div className="flex items-center rounded-lg border border-system-info bg-system-info-medium p-3 text-sm dark:text-default-300">
         <InfoIcon className="mr-2 inline h-4 w-4 flex-shrink-0" />
         <div className="text-xs">
-          <p className="font-extrabold mb-2">This method provides:</p>
-          <ul className="list-disc list-inside space-y-1">
+          <p className="mb-2 font-extrabold">This method provides:</p>
+          <ul className="list-inside list-disc space-y-1">
             <li>Service Principal authentication for Microsoft Graph APIs</li>
             <li>User credentials for PowerShell modules access</li>
             <li>Complete M365 service coverage</li>
@@ -34,7 +35,9 @@ export const M365ServicePrincipalUserForm = ({
         </div>
       </div>
 
-      <span className="text-xs font-bold text-default-500">Service Principal Information</span>
+      <span className="text-xs font-bold text-default-500">
+        Service Principal Information
+      </span>
 
       <CustomInput
         control={control}
@@ -45,7 +48,9 @@ export const M365ServicePrincipalUserForm = ({
         placeholder="Enter the Client ID"
         variant="bordered"
         isRequired
-        isInvalid={!!control._formState.errors[ProviderCredentialFields.CLIENT_ID]}
+        isInvalid={
+          !!control._formState.errors[ProviderCredentialFields.CLIENT_ID]
+        }
       />
 
       <CustomInput
@@ -57,7 +62,9 @@ export const M365ServicePrincipalUserForm = ({
         placeholder="Enter the Client Secret"
         variant="bordered"
         isRequired
-        isInvalid={!!control._formState.errors[ProviderCredentialFields.CLIENT_SECRET]}
+        isInvalid={
+          !!control._formState.errors[ProviderCredentialFields.CLIENT_SECRET]
+        }
       />
 
       <CustomInput
@@ -69,10 +76,14 @@ export const M365ServicePrincipalUserForm = ({
         placeholder="Enter the Tenant ID"
         variant="bordered"
         isRequired
-        isInvalid={!!control._formState.errors[ProviderCredentialFields.TENANT_ID]}
+        isInvalid={
+          !!control._formState.errors[ProviderCredentialFields.TENANT_ID]
+        }
       />
 
-      <span className="text-xs font-bold text-default-500">User Credentials for PowerShell</span>
+      <span className="text-xs font-bold text-default-500">
+        User Credentials for PowerShell
+      </span>
 
       <CustomInput
         control={control}
@@ -95,7 +106,9 @@ export const M365ServicePrincipalUserForm = ({
         placeholder="Enter the Password"
         variant="bordered"
         isRequired
-        isInvalid={!!control._formState.errors[ProviderCredentialFields.PASSWORD]}
+        isInvalid={
+          !!control._formState.errors[ProviderCredentialFields.PASSWORD]
+        }
       />
 
       <div className="flex items-center rounded-lg border border-system-warning bg-system-warning-medium p-2 text-sm dark:text-default-300">

ui/components/providers/workflow/forms/select-credentials-type/m365/index.ts

@@ -1,3 +1,3 @@
-export { SelectViaM365 } from "./select-via-m365";
-export { RadioGroupM365ViaCredentialsTypeForm } from "./radio-group-m365-via-credentials-type-form";
 export * from "./credentials-type";
+export { RadioGroupM365ViaCredentialsTypeForm } from "./radio-group-m365-via-credentials-type-form";
+export { SelectViaM365 } from "./select-via-m365";

ui/components/providers/workflow/forms/select-credentials-type/m365/radio-group-m365-via-credentials-type-form.tsx

@@ -36,7 +36,9 @@ export const RadioGroupM365ViaCredentialsTypeForm = ({
             }}
           >
             <div className="flex flex-col gap-4">
-              <span className="text-sm text-default-500">Application Authentication</span>
+              <span className="text-sm text-default-500">
+                Application Authentication
+              </span>
               <CustomRadio
                 description="Connect using Service Principal credentials only"
                 value="credentials"
@@ -53,7 +55,9 @@ export const RadioGroupM365ViaCredentialsTypeForm = ({
                 value="service-principal-user"
               >
                 <div className="flex items-center">
-                  <span className="ml-2">Service Principal + User Credentials</span>
+                  <span className="ml-2">
+                    Service Principal + User Credentials
+                  </span>
                 </div>
               </CustomRadio>
             </div>

ui/hooks/use-credentials-form.ts

@@ -9,9 +9,9 @@ import { PROVIDER_CREDENTIALS_ERROR_MAPPING } from "@/lib/error-mappings";
 import { ProviderCredentialFields } from "@/lib/provider-credentials/provider-credential-fields";
 import {
   addCredentialsFormSchema,
+  addCredentialsM365UserFormSchema,
   addCredentialsRoleFormSchema,
   addCredentialsServiceAccountFormSchema,
-  addCredentialsM365UserFormSchema,
   ProviderType,
 } from "@/types";