fix(ui): fix image provider filter icon and React import

ui/CHANGELOG.md

@@ -6,6 +6,7 @@ All notable changes to the **Prowler UI** are documented in this file.
 
 ### 🚀 Added
 
+- Image (Container Registry) provider support in UI: badge icon, credentials form, and provider-type filtering
 - OpenStack provider support in the UI [(#10046)](https://github.com/prowler-cloud/prowler/pull/10046)
 - PDF report available for the CSA CCM compliance framework [(#10088)](https://github.com/prowler-cloud/prowler/pull/10088)
 - CSV and PDF download buttons in compliance views [(#10093)](https://github.com/prowler-cloud/prowler/pull/10093)

ui/app/(prowler)/_overview/_components/provider-type-selector.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useSearchParams } from "next/navigation";
-import { lazy, Suspense } from "react";
+import { type ComponentType, lazy, Suspense } from "react";
 
 import {
   MultiSelect,
@@ -82,7 +82,7 @@ const IconPlaceholder = ({ width, height }: IconProps) => (
 
 const PROVIDER_DATA: Record<
   ProviderType,
-  { label: string; icon: React.ComponentType<IconProps> }
+  { label: string; icon: ComponentType<IconProps> }
 > = {
   aws: {
     label: "Amazon Web Services",

ui/components/filters/custom-provider-inputs.tsx

@@ -5,6 +5,7 @@ import {
   GCPProviderBadge,
   GitHubProviderBadge,
   IacProviderBadge,
+  ImageProviderBadge,
   KS8ProviderBadge,
   M365ProviderBadge,
   MongoDBAtlasProviderBadge,
@@ -84,6 +85,15 @@ export const CustomProviderInputIac = () => {
   );
 };
 
+export const CustomProviderInputImage = () => {
+  return (
+    <div className="flex items-center gap-x-2">
+      <ImageProviderBadge width={25} height={25} />
+      <p className="text-sm">Container Registry</p>
+    </div>
+  );
+};
+
 export const CustomProviderInputOracleCloud = () => {
   return (
     <div className="flex items-center gap-x-2">