Merge branch 'feat/menu' into 'main'

Feat/menu

See merge request onegeo-suite/libs/gatsby-theme-onegeo!11

src/components/core/Menu.tsx

@@ -5,14 +5,16 @@ import { ChevronRightIcon, ChevronDownIcon } from "@heroicons/react/solid"
 
 import { Link } from "@onegeo-suite/gatsby-theme-onegeo"
 import { UserMenu } from "@onegeo-suite/gatsby-plugin-auth"
+import { twMerge } from "tailwind-merge"
 
 interface Imenu {
     className?: string
     name: string
     userMenu?: boolean
+    options: object
 }
 const Menu = (props: Imenu) => {
-    const { className, name, userMenu = false } = props
+    const { className, name, userMenu = false, options } = props
 
     const data = useStaticQuery(graphql`
         fragment MenuItem on DirectusData_menus {
@@ -63,12 +65,17 @@ const Menu = (props: Imenu) => {
     `)
 
     const menuContent = data.directus.menus
+    const oClass = options || {}
 
     const menu =
         menuContent.find(
             (menu: any) => name?.toLowerCase() === menu.name?.toLowerCase()
         )?.children || []
 
+    // menuContent.map((m) =>{
+    //     console.log(m.children)
+    // })
+
     const goto = (item) => {
         if (!item) return "/"
         if (item?.type === "page") {
@@ -123,8 +130,16 @@ const Menu = (props: Imenu) => {
                 {menu?.map((item: any, key: number) => {
                     return (
                         <li key={"M_" + name + "_L0_" + key}>
-                            <Link to={goto(item)} target="_blank">
-                                <span>{item.name}</span>
+                            <Link
+                                to={goto(item)}
+                                target="_blank"
+                                className={twMerge("", item.options?.link)}
+                            >
+                                <span
+                                    className={twMerge("", item.options?.name)}
+                                >
+                                    {item.name}
+                                </span>
                                 {item?.children.length > 0 && (
                                     <ChevronDownIcon className="h-5 w-5" />
                                 )}