fix: update opengraph gen

src/shared/lib/clickOutside/useClickOutside.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { RefObject, useEffect } from 'react';
 
 export function useClickOutside(

src/shared/lib/index.ts

@@ -1,2 +1,4 @@
 export { useClickOutside } from './clickOutside';
 export { detectIOS } from './detectIOS';
+export * from './metaInfo';
+export * from './phoneBeautify';

src/shared/lib/metaInfo/index.ts

@@ -0,0 +1 @@
+export * from './metaInfo';

src/shared/lib/metaInfo/metaInfo.ts

@@ -0,0 +1,69 @@
+import { Metadata } from 'next';
+
+type TMetaInfo = {
+  title: string;
+  description: string;
+  companyName: string;
+  phone: string;
+  url: string;
+  ogImageTitle: string;
+  ogImageDescription: string;
+  width?: number;
+  height?: number;
+  locale?: string;
+  creator?: string;
+};
+
+function metaInfo({ ...props }: TMetaInfo): Metadata {
+  const {
+    title,
+    description,
+    companyName,
+    phone,
+    url,
+    ogImageTitle,
+    ogImageDescription,
+    width = 600,
+    height = 315,
+    locale = 'ru_RU',
+    creator = '@ditraso',
+  } = props;
+
+  return {
+    title: `${title} | ${companyName}`,
+    description: `${description} ${phone}`,
+    openGraph: {
+      title: title,
+      description: description,
+      url: url,
+      images: [
+        {
+          url: `${url}/api/og/?title=${ogImageTitle}&description=${ogImageDescription}`,
+          secureUrl: `${url}/api/og/?title=${ogImageTitle}&description=${ogImageDescription}`,
+          width: width,
+          height: height,
+          alt: `${title} - ${companyName}`,
+        },
+      ],
+      locale: locale,
+      type: 'website',
+      siteName: `${title} - ${companyName}`,
+    },
+    twitter: {
+      card: 'summary_large_image',
+      title: `${title} - ${companyName}`,
+      description: `${description} ${phone}`,
+      creator: creator,
+      images: [
+        {
+          url: `${url}/api/og/?title=${ogImageTitle}&description=${ogImageDescription}`,
+          width: width,
+          height: height,
+          alt: `${title} - ${companyName}`,
+        },
+      ],
+    },
+  };
+}
+
+export { metaInfo };

src/shared/lib/phoneBeautify/index.ts

@@ -0,0 +1 @@
+export * from './phoneBeautify';

src/shared/lib/phoneBeautify/phoneBeautify.ts

@@ -1,4 +1,4 @@
-export function phoneBeautify(phone: string): string {
+function phoneBeautify(phone: string): string {
   const cleaned = phone.replace(/[^\d+]/g, '');
 
   const match = cleaned.match(/^\+?7(\d{3})(\d{3})(\d{2})(\d{2})$/);
@@ -8,3 +8,5 @@ export function phoneBeautify(phone: string): string {
 
   return `+7 (${code}) ${part1}-${part2}-${part3}`;
 }
+
+export { phoneBeautify };