refactor(ui): replace HeroUI Spacer with Tailwind spacing utilities

ui/app/(prowler)/compliance/[compliancetitle]/page.tsx

@@ -1,4 +1,3 @@
-import { Spacer } from "@heroui/spacer";
 import { Suspense } from "react";
 
 import {
@@ -350,7 +349,7 @@ const SSRComplianceContent = async ({
         {/* <SectionsFailureRateCard categories={categoryHeatmapData} /> */}
       </div>
 
-      <Spacer className="bg-border-neutral-primary h-1 w-full rounded-full" />
+      <div className="bg-border-neutral-primary h-1 w-full rounded-full" />
       <ClientAccordionWrapper
         hideExpandButton={complianceId.includes("mitre_attack")}
         items={accordionItems}

ui/app/(prowler)/invitations/(send-invite)/layout.tsx

@@ -1,6 +1,5 @@
 import "@/styles/globals.css";
 
-import { Spacer } from "@heroui/spacer";
 import React from "react";
 
 import { WorkflowSendInvite } from "@/components/invitations/workflow";
@@ -18,7 +17,7 @@ export default function InvitationLayout({ children }: InvitationLayoutProps) {
         icon="icon-park-outline:close-small"
         href="/invitations"
       />
-      <Spacer y={16} />
+      <div className="h-16" />
       <div className="grid grid-cols-1 gap-8 px-4 lg:grid-cols-12 lg:px-0">
         <div className="order-1 my-auto h-full lg:col-span-4 lg:col-start-2">
           <WorkflowSendInvite />

ui/app/(prowler)/lighthouse/config/(connect-llm)/layout.tsx

@@ -2,7 +2,6 @@
 
 import "@/styles/globals.css";
 
-import { Spacer } from "@heroui/spacer";
 import { Icon } from "@iconify/react";
 import { useRouter, useSearchParams } from "next/navigation";
 import React, { useEffect, useState } from "react";
@@ -80,7 +79,7 @@ export default function ConnectLLMLayout({ children }: ConnectLLMLayoutProps) {
         icon="icon-park-outline:close-small"
         href="/lighthouse/config"
       />
-      <Spacer y={8} />
+      <div className="h-8" />
       <div className="grid grid-cols-1 gap-8 lg:grid-cols-12">
         <div className="order-1 my-auto hidden h-full lg:col-span-4 lg:col-start-2 lg:block">
           <WorkflowConnectLLM />
@@ -113,7 +112,7 @@ export default function ConnectLLMLayout({ children }: ConnectLLMLayoutProps) {
                   Delete Provider
                 </Button>
               </div>
-              <Spacer y={4} />
+              <div className="h-4" />
             </>
           )}
           {children}

ui/app/(prowler)/lighthouse/config/page.tsx

@@ -1,5 +1,3 @@
-import { Spacer } from "@heroui/spacer";
-
 import { LighthouseSettings, LLMProvidersTable } from "@/components/lighthouse";
 import { ContentLayout } from "@/components/ui";
 
@@ -9,7 +7,7 @@ export default async function ChatbotConfigPage() {
   return (
     <ContentLayout title="LLM Configuration">
       <LLMProvidersTable />
-      <Spacer y={8} />
+      <div className="h-8" />
       <LighthouseSettings />
     </ContentLayout>
   );

ui/app/(prowler)/roles/(add-role)/layout.tsx

@@ -1,6 +1,5 @@
 import "@/styles/globals.css";
 
-import { Spacer } from "@heroui/spacer";
 import React from "react";
 
 import { WorkflowAddEditRole } from "@/components/roles/workflow";
@@ -18,7 +17,7 @@ export default function RoleLayout({ children }: RoleLayoutProps) {
         icon="icon-park-outline:close-small"
         href="/roles"
       />
-      <Spacer y={16} />
+      <div className="h-16" />
       <div className="grid grid-cols-1 gap-8 px-4 sm:px-6 lg:grid-cols-12 lg:px-0">
         <div className="order-1 my-auto hidden h-full lg:col-span-4 lg:col-start-2 lg:block">
           <WorkflowAddEditRole />

ui/app/(prowler)/services/page.tsx

@@ -1,5 +1,3 @@
-import { Spacer } from "@heroui/spacer";
-
 import { FilterControls } from "@/components/filters";
 import { ContentLayout } from "@/components/ui";
 
@@ -10,9 +8,9 @@ export default async function Services() {
       title="Services"
       icon="material-symbols:linked-services-outline"
     >
-      <Spacer y={4} />
+      <div className="h-4" />
       <FilterControls />
-      <Spacer y={4} />
+      <div className="h-4" />
       {/* <Suspense key={searchParamsKey} fallback={<ServiceSkeletonGrid />}>
         <SSRServiceGrid />
       </Suspense> */}

ui/components/invitations/workflow/workflow-send-invite.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { Progress } from "@heroui/progress";
-import { Spacer } from "@heroui/spacer";
 import { usePathname } from "next/navigation";
 import React from "react";
 
@@ -77,7 +76,7 @@ export const WorkflowSendInvite = () => {
         </div>
       </div>
 
-      <Spacer y={2} />
+      <div className="h-2" />
     </section>
   );
 };

ui/components/lighthouse/workflow/workflow-connect-llm.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { Progress } from "@heroui/progress";
-import { Spacer } from "@heroui/spacer";
 import { usePathname, useSearchParams } from "next/navigation";
 import React from "react";
 
@@ -129,7 +128,7 @@ export const WorkflowConnectLLM = () => {
           })}
         </ol>
       </nav>
-      <Spacer y={4} />
+      <div className="h-4" />
     </section>
   );
 };

ui/components/roles/workflow/workflow-add-edit-role.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import { Progress } from "@heroui/progress";
-import { Spacer } from "@heroui/spacer";
 import { usePathname } from "next/navigation";
 import React from "react";
 
@@ -59,7 +58,7 @@ export const WorkflowAddEditRole = () => {
         stepClassName="border border-border-neutral-primary aria-[current]:border-button-primary aria-[current]:text-text-neutral-primary cursor-default"
         steps={steps}
       />
-      <Spacer y={4} />
+      <div className="h-4" />
     </section>
   );
 };