Spaces:

enzostvs
/

deepsite

Running

App Files Files Community

511

enzostvs HF Staff commited on 25 days ago

Commit

8bce833

1 Parent(s): 813f0e0

improve SEO

Browse files

Files changed (8) hide show

app/[namespace]/[repoId]/page.tsx +18 -0
app/layout.tsx +34 -22
app/new/page.tsx +9 -0
app/sitemap.ts +28 -0
components/iframe-detector/index.tsx +39 -0
lib/seo.ts +131 -0
middleware.ts +18 -1
public/robots.txt +17 -0

app/[namespace]/[repoId]/page.tsx CHANGED Viewed

@@ -1,4 +1,22 @@
 import { AppEditor } from "@/components/editor";
 export default async function ProjectNamespacePage({
   params,

 import { AppEditor } from "@/components/editor";
+import { generateSEO } from "@/lib/seo";
+import { Metadata } from "next";
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ namespace: string; repoId: string }>;
+}): Promise<Metadata> {
+  const { namespace, repoId } = await params;
+  return generateSEO({
+    title: `${namespace}/${repoId} - DeepSite Editor`,
+    description: `Edit and build ${namespace}/${repoId} with AI-powered tools on DeepSite. Create stunning websites with no code required.`,
+    path: `/${namespace}/${repoId}`,
+    // Prevent indexing of individual project editor pages if they contain sensitive content
+    noIndex: false, // Set to true if you want to keep project pages private
+  });
+}
 export default async function ProjectNamespacePage({
   params,

app/layout.tsx CHANGED Viewed

@@ -13,6 +13,7 @@ import AppContext from "@/components/contexts/app-context";
 import TanstackContext from "@/components/contexts/tanstack-query-context";
 import { LoginProvider } from "@/components/contexts/login-context";
 import { ProProvider } from "@/components/contexts/pro-context";
 const inter = Inter({
   variable: "--font-inter-sans",
@@ -26,31 +27,12 @@ const ptSans = PT_Sans({
 });
 export const metadata: Metadata = {
-  title: "DeepSite | Build with AI ✨",
-  description:
-    "DeepSite is a web development tool that helps you build websites with AI, no code required. Let's deploy your website with DeepSite and enjoy the magic of AI.",
-  openGraph: {
     title: "DeepSite | Build with AI ✨",
     description:
       "DeepSite is a web development tool that helps you build websites with AI, no code required. Let's deploy your website with DeepSite and enjoy the magic of AI.",
-    url: "https://deepsite.hf.co",
-    siteName: "DeepSite",
-    images: [
-      {
-        url: "https://deepsite.hf.co/banner.png",
-        width: 1200,
-        height: 630,
-        alt: "DeepSite Open Graph Image",
-      },
-    ],
-  },
-  twitter: {
-    card: "summary_large_image",
-    title: "DeepSite | Build with AI ✨",
-    description:
-      "DeepSite is a web development tool that helps you build websites with AI, no code required. Let's deploy your website with DeepSite and enjoy the magic of AI.",
-    images: ["https://deepsite.hf.co/banner.png"],
-  },
   appleWebApp: {
     capable: true,
     title: "DeepSite",
@@ -61,6 +43,9 @@ export const metadata: Metadata = {
     shortcut: "/logo.svg",
     apple: "/logo.svg",
   },
 };
 export const viewport: Viewport = {
@@ -91,8 +76,35 @@ export default async function RootLayout({
   children: React.ReactNode;
 }>) {
   const data = await getMe();
   return (
     <html lang="en">
       <Script
         defer
         data-domain="deepsite.hf.co"

 import TanstackContext from "@/components/contexts/tanstack-query-context";
 import { LoginProvider } from "@/components/contexts/login-context";
 import { ProProvider } from "@/components/contexts/pro-context";
+import { generateSEO, generateStructuredData } from "@/lib/seo";
 const inter = Inter({
   variable: "--font-inter-sans",
 });
 export const metadata: Metadata = {
+  ...generateSEO({
     title: "DeepSite | Build with AI ✨",
     description:
       "DeepSite is a web development tool that helps you build websites with AI, no code required. Let's deploy your website with DeepSite and enjoy the magic of AI.",
+    path: "/",
+  }),
   appleWebApp: {
     capable: true,
     title: "DeepSite",
     shortcut: "/logo.svg",
     apple: "/logo.svg",
   },
+  verification: {
+    google: process.env.GOOGLE_SITE_VERIFICATION,
+  },
 };
 export const viewport: Viewport = {
   children: React.ReactNode;
 }>) {
   const data = await getMe();
+  // Generate structured data
+  const structuredData = generateStructuredData("WebApplication", {
+    name: "DeepSite",
+    description: "Build websites with AI, no code required",
+    url: "https://deepsite.hf.co",
+  });
+  const organizationData = generateStructuredData("Organization", {
+    name: "DeepSite",
+    url: "https://deepsite.hf.co",
+  });
   return (
     <html lang="en">
+      <head>
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{
+            __html: JSON.stringify(structuredData),
+          }}
+        />
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{
+            __html: JSON.stringify(organizationData),
+          }}
+        />
+      </head>
       <Script
         defer
         data-domain="deepsite.hf.co"

app/new/page.tsx CHANGED Viewed

@@ -1,4 +1,13 @@
 import { AppEditor } from "@/components/editor";
 export default function NewProjectPage() {
   return <AppEditor isNew />;

 import { AppEditor } from "@/components/editor";
+import { Metadata } from "next";
+import { generateSEO } from "@/lib/seo";
+export const metadata: Metadata = generateSEO({
+  title: "Create New Project - DeepSite",
+  description:
+    "Start building your next website with AI. Create a new project on DeepSite and experience the power of AI-driven web development.",
+  path: "/new",
+});
 export default function NewProjectPage() {
   return <AppEditor isNew />;

app/sitemap.ts ADDED Viewed

	@@ -0,0 +1,28 @@

+import { MetadataRoute } from 'next';
+export default function sitemap(): MetadataRoute.Sitemap {
+  const baseUrl = 'https://deepsite.hf.co';
+  return [
+    {
+      url: baseUrl,
+      lastModified: new Date(),
+      changeFrequency: 'daily',
+      priority: 1,
+    },
+    {
+      url: `${baseUrl}/new`,
+      lastModified: new Date(),
+      changeFrequency: 'weekly',
+      priority: 0.8,
+    },
+    {
+      url: `${baseUrl}/auth`,
+      lastModified: new Date(),
+      changeFrequency: 'monthly',
+      priority: 0.5,
+    },
+    // Note: Dynamic project routes will be handled by Next.js automatically
+    // but you can add specific high-priority project pages here if needed
+  ];
+}

components/iframe-detector/index.tsx CHANGED Viewed

@@ -41,6 +41,42 @@ export default function IframeDetector() {
       }
     };
     // Check if we're in an iframe from a non-allowed domain
     const shouldShowWarning = () => {
       if (!isInIframe() && !isEmbedded()) {
@@ -65,6 +101,9 @@ export default function IframeDetector() {
       }
     };
     if (shouldShowWarning()) {
       // Show warning modal instead of redirecting immediately
       setShowWarning(true);

       }
     };
+    // SEO: Add canonical URL meta tag when in iframe
+    const addCanonicalUrl = () => {
+      // Remove existing canonical link if present
+      const existingCanonical = document.querySelector('link[rel="canonical"]');
+      if (existingCanonical) {
+        existingCanonical.remove();
+      }
+      // Add canonical URL pointing to the standalone version
+      const canonical = document.createElement("link");
+      canonical.rel = "canonical";
+      canonical.href = window.location.href;
+      document.head.appendChild(canonical);
+      // Add meta tag to indicate this page should not be indexed when in iframe from unauthorized domains
+      if (isInIframe() || isEmbedded()) {
+        try {
+          const parentHostname = document.referrer
+            ? new URL(document.referrer).hostname
+            : null;
+          if (parentHostname && !isAllowedDomain(parentHostname)) {
+            // Add noindex meta tag when embedded in unauthorized domains
+            const noIndexMeta = document.createElement("meta");
+            noIndexMeta.name = "robots";
+            noIndexMeta.content = "noindex, nofollow";
+            document.head.appendChild(noIndexMeta);
+          }
+        } catch (error) {
+          // Silently handle cross-origin errors
+          console.debug(
+            "SEO: Could not determine parent domain for iframe indexing rules"
+          );
+        }
+      }
+    };
     // Check if we're in an iframe from a non-allowed domain
     const shouldShowWarning = () => {
       if (!isInIframe() && !isEmbedded()) {
       }
     };
+    // Always add canonical URL for SEO, regardless of iframe status
+    addCanonicalUrl();
     if (shouldShowWarning()) {
       // Show warning modal instead of redirecting immediately
       setShowWarning(true);

lib/seo.ts ADDED Viewed

	@@ -0,0 +1,131 @@

+import { Metadata } from "next";
+interface SEOParams {
+  title?: string;
+  description?: string;
+  path?: string;
+  image?: string;
+  noIndex?: boolean;
+  canonical?: string;
+}
+export function generateSEO({
+  title = "DeepSite | Build with AI ✨",
+  description = "DeepSite is a web development tool that helps you build websites with AI, no code required. Let's deploy your website with DeepSite and enjoy the magic of AI.",
+  path = "",
+  image = "/banner.png",
+  noIndex = false,
+  canonical,
+}: SEOParams = {}): Metadata {
+  const baseUrl = "https://deepsite.hf.co";
+  const fullUrl = `${baseUrl}${path}`;
+  const canonicalUrl = canonical || fullUrl;
+  return {
+    title,
+    description,
+    alternates: {
+      canonical: canonicalUrl,
+    },
+    robots: noIndex
+      ? {
+          index: false,
+          follow: false,
+          googleBot: {
+            index: false,
+            follow: false,
+            'max-video-preview': -1,
+            'max-image-preview': 'large',
+            'max-snippet': -1,
+          }
+        }
+      : {
+          index: true,
+          follow: true,
+          googleBot: {
+            index: true,
+            follow: true,
+            'max-video-preview': -1,
+            'max-image-preview': 'large',
+            'max-snippet': -1,
+          }
+        },
+    openGraph: {
+      title,
+      description,
+      url: canonicalUrl,
+      siteName: "DeepSite",
+      images: [
+        {
+          url: `${baseUrl}${image}`,
+          width: 1200,
+          height: 630,
+          alt: `${title} - DeepSite`,
+        },
+      ],
+      locale: "en_US",
+      type: "website",
+    },
+    twitter: {
+      card: "summary_large_image",
+      title,
+      description,
+      images: [`${baseUrl}${image}`],
+      creator: "@deepsite",
+    },
+    other: {
+      // Prevent iframe embedding from unauthorized domains
+      'X-Frame-Options': 'SAMEORIGIN',
+      // Control how the page appears when shared
+      'og:image:secure_url': `${baseUrl}${image}`,
+      // Help search engines understand the primary URL
+      'rel': 'canonical',
+    },
+  };
+}
+export function generateStructuredData(type: 'WebApplication' | 'Organization' | 'Article', data: any) {
+  const baseStructuredData = {
+    '@context': 'https://schema.org',
+    '@type': type,
+  };
+  switch (type) {
+    case 'WebApplication':
+      return {
+        ...baseStructuredData,
+        name: 'DeepSite',
+        description: 'Build websites with AI, no code required',
+        url: 'https://deepsite.hf.co',
+        applicationCategory: 'DeveloperApplication',
+        operatingSystem: 'Web',
+        offers: {
+          '@type': 'Offer',
+          price: '0',
+          priceCurrency: 'USD',
+        },
+        creator: {
+          '@type': 'Organization',
+          name: 'DeepSite',
+          url: 'https://deepsite.hf.co',
+        },
+        ...data,
+      };
+    case 'Organization':
+      return {
+        ...baseStructuredData,
+        name: 'DeepSite',
+        url: 'https://deepsite.hf.co',
+        logo: 'https://deepsite.hf.co/logo.svg',
+        description: 'AI-powered web development platform',
+        sameAs: [
+          // Add social media links here if available
+        ],
+        ...data,
+      };
+    default:
+      return { ...baseStructuredData, ...data };
+  }
+}

middleware.ts CHANGED Viewed

@@ -4,7 +4,24 @@ import type { NextRequest } from "next/server";
 export function middleware(request: NextRequest) {
   const headers = new Headers(request.headers);
   headers.set("x-current-host", request.nextUrl.host);
-  return NextResponse.next({ headers });
 }
 export const config = {

 export function middleware(request: NextRequest) {
   const headers = new Headers(request.headers);
   headers.set("x-current-host", request.nextUrl.host);
+  // Create response with headers
+  const response = NextResponse.next({ headers });
+  // Add SEO and security headers
+  response.headers.set('X-Frame-Options', 'SAMEORIGIN');
+  response.headers.set('X-Content-Type-Options', 'nosniff');
+  response.headers.set('Referrer-Policy', 'strict-origin-when-cross-origin');
+  // Add cache control for better performance
+  if (request.nextUrl.pathname.startsWith('/_next/static')) {
+    response.headers.set('Cache-Control', 'public, max-age=31536000, immutable');
+  }
+  // Add canonical URL headers for programmatic access
+  response.headers.set('X-Canonical-URL', `https://deepsite.hf.co${request.nextUrl.pathname}`);
+  return response;
 }
 export const config = {

public/robots.txt ADDED Viewed

	@@ -0,0 +1,17 @@

+User-agent: *
+Allow: /
+# Block access to API routes and private areas
+Disallow: /api/
+Disallow: /auth/
+Disallow: /_next/
+Disallow: /assets/
+# Allow specific public API endpoints if needed
+Allow: /api/public/
+# Sitemap location
+Sitemap: https://deepsite.hf.co/sitemap.xml
+# Crawl-delay for respectful crawling
+Crawl-delay: 1