use Meta, Schema components

zsofiakm · zsofiakm · commit c3d2132b488b · 2025-04-07T20:42:47.000+02:00
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -3,10 +3,10 @@ import "@/once-ui/tokens/index.scss";
 
 import classNames from "classnames";
 import { headers } from "next/headers";
-import { Metadata } from "next";
 
-import { baseURL, style, meta, og, schema, social } from "@/app/resources/config";
-import { Background, Column, Flex, ToastProvider, ThemeProvider } from "@/once-ui/components";
+import { baseURL, meta, og, schema, style } from "@/app/resources/config";
+import { Background, Column, Flex, ThemeProvider, ToastProvider } from "@/once-ui/components";
+import { Meta, Schema } from "@/once-ui/modules";
 
 import { Geist } from "next/font/google";
 import { Geist_Mono } from "next/font/google";
@@ -36,58 +36,16 @@ const tertiary: FontConfig | undefined = undefined;
 /*
  */
 
-export async function generateMetadata(): Promise<Metadata> {
-  const host = (await headers()).get("host");
-  const metadataBase = host ? new URL(`https://${host}`) : undefined;
-
-  return {
+export async function generateMetadata() {
+  return Meta.generate({
     title: meta.title,
     description: meta.description,
-    openGraph: {
-      title: og.title,
-      description: og.description,
-      url: "https://" + baseURL,
-      images: [
-        {
-          url: og.image,
-          alt: og.title,
-        },
-      ],
-      type: og.type as
-        | "website"
-        | "article"
-        | "book"
-        | "profile"
-        | "music.song"
-        | "music.album"
-        | "music.playlist"
-        | "music.radio_station"
-        | "video.movie"
-        | "video.episode"
-        | "video.tv_show"
-        | "video.other",
-    },
-    twitter: {
-      card: "summary_large_image",
-      title: og.title,
-      description: og.description,
-      images: [og.image],
-    },
-    metadataBase,
-  };
+    baseURL,
+    path: "/",
+    image: og.image
+  });
 }
 
-const schemaData = {
-  "@context": "https://schema.org",
-  "@type": schema.type,
-  url: "https://" + baseURL,
-  logo: schema.logo,
-  name: schema.name,
-  description: schema.description,
-  email: schema.email,
-  sameAs: Object.values(social).filter(Boolean),
-};
-
 export default function RootLayout({
   children,
 }: Readonly<{
@@ -116,13 +74,15 @@ export default function RootLayout({
         tertiary ? tertiary.variable : "",
       )}
     >
+      <Schema
+        as="organization"
+        title={schema.name}
+        description={schema.description}
+        baseURL={baseURL}
+        path="/"
+        image={schema.logo}
+      />
       <head>
-        <script
-          type="application/ld+json"
-          dangerouslySetInnerHTML={{
-            __html: JSON.stringify(schemaData),
-          }}
-        />
         <script
           dangerouslySetInnerHTML={{
             __html: `
diff --git a/src/app/resources/config.js b/src/app/resources/config.js
@@ -63,7 +63,6 @@ const meta = {
 const og = {
   title: meta.title,
   description: meta.description,
-  type: "website",
   image: "/images/cover.jpg",
 };
 
diff --git a/src/once-ui/components/MegaMenu.tsx b/src/once-ui/components/MegaMenu.tsx
@@ -91,7 +91,7 @@ export const MegaMenu: React.FC<MegaMenuProps> = ({ menuGroups, className, ...re
 
   // Check if a menu item should be selected based on the current path
   const isSelected = (href?: string) => {
-    if (!href) return false;
+    if (!href || !pathname) return false;
     return pathname.startsWith(href);
   };
 
diff --git a/src/once-ui/modules/media/MediaUpload.tsx b/src/once-ui/modules/media/MediaUpload.tsx
@@ -1,3 +1,5 @@
+"use client";
+
 import React, { useRef, useState, forwardRef, useEffect } from "react";
 import Compressor from "compressorjs";
 import { Flex, Icon, SmartImage, Spinner, Text } from "@/once-ui/components";

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,5 @@`
	`1`	`+"use client";`
	`2`	`+`
`1`	`3`	`import React, { useRef, useState, forwardRef, useEffect } from "react";`
`2`	`4`	`import Compressor from "compressorjs";`
`3`	`5`	`import { Flex, Icon, SmartImage, Spinner, Text } from "@/once-ui/components";`