feat(ui): Add Prowler Hub menu item with tooltip (#8692)

Co-authored-by: alejandrobailo <alejandrobailo94@gmail.com>

ui/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 All notable changes to the **Prowler UI** are documented in this file.
 
+## [1.12.1] (Prowler v5.12.1)
+
+### 🚀 Added
+
+- `Prowler Hub` menu item with tooltip [(#8692)] (https://github.com/prowler-cloud/prowler/pull/8692)
+
 ## [1.12.0] (Prowler v5.12.0)
 
 ### 🚀 Added

ui/components/ui/sidebar/menu.tsx

@@ -105,7 +105,7 @@ export const Menu = ({ isOpen }: { isOpen: boolean }) => {
                 className={cn(
                   "w-full",
                   groupLabel ? "pt-2" : "",
-                  "last:!mt-auto",
+                  index === filteredMenuList.length - 2 && "!mt-auto",
                 )}
                 key={index}
               >
@@ -138,8 +138,9 @@ export const Menu = ({ isOpen }: { isOpen: boolean }) => {
                     active,
                     submenus,
                     defaultOpen,
+                    target,
+                    tooltip,
                   } = menu;
-
                   return !submenus || submenus.length === 0 ? (
                     <div className="w-full" key={index}>
                       <TooltipProvider disableHoverableContent>
@@ -156,7 +157,7 @@ export const Menu = ({ isOpen }: { isOpen: boolean }) => {
                               className="mb-1 h-8 w-full justify-start"
                               asChild
                             >
-                              <Link href={href}>
+                              <Link href={href} target={target}>
                                 <span
                                   className={cn(isOpen === false ? "" : "mr-4")}
                                 >
@@ -175,9 +176,9 @@ export const Menu = ({ isOpen }: { isOpen: boolean }) => {
                               </Link>
                             </Button>
                           </TooltipTrigger>
-                          {isOpen === false && (
+                          {tooltip && (
                             <TooltipContent side="right">
-                              {label}
+                              {tooltip}
                             </TooltipContent>
                           )}
                         </Tooltip>

ui/lib/menu-list.ts

@@ -21,6 +21,7 @@ import {
   Warehouse,
 } from "lucide-react";
 
+import { ProwlerShort } from "@/components/icons";
 import {
   APIdocIcon,
   AWSIcon,
@@ -197,6 +198,18 @@ export const getMenuList = ({
         },
       ],
     },
+    {
+      groupLabel: "",
+      menus: [
+        {
+          href: "https://hub.prowler.com/",
+          label: "Prowler Hub",
+          icon: ProwlerShort,
+          target: "_blank",
+          tooltip: "Looking for all available checks? learn more.",
+        },
+      ],
+    },
     {
       groupLabel: "",
       menus: [

ui/types/components.ts

@@ -31,6 +31,8 @@ export type MenuProps = {
   icon: IconComponent;
   submenus?: SubmenuProps[];
   defaultOpen?: boolean;
+  target?: string;
+  tooltip?: string;
 };
 
 export type GroupProps = {