add pages and update links

autogpt_platform/frontend/src/app/[lang]/store/agent/[creator]/[slug]/page.tsx

@@ -0,0 +1,8 @@
+export default async function Page({
+    params,
+  }: {
+    params: Promise<{ lang: string, creator: string, slug: string }>
+  }) {
+    const { lang, creator, slug } = await params
+    return <div>My Post: {slug}</div>
+  }

autogpt_platform/frontend/src/app/[lang]/store/creator/[creator]/page.tsx

@@ -0,0 +1,37 @@
+import AutoGPTServerAPI from "@/lib/autogpt-server-api";
+import { CreatorDetails } from "@/components/agptui/composite/CreatorDetails";
+import { AgentsSection } from "@/components/agptui/composite/AgentsSection";
+
+
+export async function generateStaticParams() {
+  const api = new AutoGPTServerAPI();
+  const creators = await api.getStoreCreators({ featured: true });
+  return creators.creators.map((creator) => ({
+    creator: creator.username,
+  }));
+}
+
+export default async function Page({
+  params,
+}: {
+  params: { lang: string; creator: string };
+}) {
+  const { creator } = params;
+  const api = new AutoGPTServerAPI();
+  const creatorDetails = await api.getStoreCreator(creator);
+
+  return (
+    <div className="flex w-full flex-col items-center justify-center px-4">
+      <CreatorDetails
+        name={creatorDetails.name}
+        username={creatorDetails.username}
+        description={creatorDetails.description}
+        avgRating={creatorDetails.agent_rating}
+        agentCount={creatorDetails.agent_runs}
+        topCategories={creatorDetails.top_categories}
+        otherLinks={creatorDetails.links}
+        avatarSrc={creatorDetails.avatar_url}
+      />
+    </div>
+  );
+}

autogpt_platform/frontend/src/app/[lang]/store/page.tsx

@@ -15,9 +15,7 @@ import {
 } from "@/components/agptui/composite/FeaturedCreators";
 import { Separator } from "@/components/ui/separator";
 import AutoGPTServerAPI from "@/lib/autogpt-server-api";
-
-// Remove client-side hook since we're doing server-side data fetching
-// import { useSupabase } from "@/components/providers/SupabaseProvider";
+import { Metadata } from "next";
 
 async function getStoreData() {
   const api = new AutoGPTServerAPI();
@@ -34,6 +32,45 @@ async function getStoreData() {
   };
 }
 
+// FIX: Correct metadata
+export const metadata: Metadata = {
+  title: "Agent Store - NextGen AutoGPT",
+  description: "Find and use AI Agents created by our community",
+  applicationName: "NextGen AutoGPT Store",
+  authors: [{ name: "AutoGPT Team" }],
+  keywords: ["AI agents", "automation", "artificial intelligence", "AutoGPT", "marketplace"],
+  robots: {
+    index: true,
+    follow: true,
+  },
+  openGraph: {
+    title: "Agent Store - NextGen AutoGPT", 
+    description: "Find and use AI Agents created by our community",
+    type: "website",
+    siteName: "NextGen AutoGPT Store",
+    images: [
+      {
+        url: "/images/store-og.png",
+        width: 1200,
+        height: 630,
+        alt: "NextGen AutoGPT Store"
+      }
+    ]
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: "Agent Store - NextGen AutoGPT",
+    description: "Find and use AI Agents created by our community",
+    images: ["/images/store-twitter.png"]
+  },
+  icons: {
+    icon: "/favicon.ico",
+    shortcut: "/favicon-16x16.png",
+    apple: "/apple-touch-icon.png"
+  }
+};
+
+
 export default async function Page({
   params: { lang },
 }: {

autogpt_platform/frontend/src/app/[lang]/store/search/page.tsx

@@ -0,0 +1,10 @@
+export default async function Page({
+    params,
+    searchParams,
+  }: {
+    params: { lang: string },
+    searchParams: { term?: string }
+  }) {
+    const searchTerm = searchParams.term || ''
+    return <div>Search Results for: {searchTerm}</div>
+  }

autogpt_platform/frontend/src/components/agptui/SearchBar.tsx

@@ -32,7 +32,7 @@ export const SearchBar: React.FC<SearchBarProps> = ({
     if (searchQuery.trim()) {
       // Encode the search term and navigate to the desired path
       const encodedTerm = encodeURIComponent(searchQuery);
-      router.push(`/search?searchTerm=${encodedTerm}`);
+      router.push(`/store/search?searchTerm=${encodedTerm}`);
     }
   };
 

autogpt_platform/frontend/src/components/agptui/composite/AgentsSection.tsx

@@ -34,7 +34,7 @@ export const AgentsSection: React.FC<AgentsSectionProps> = ({
   const router = useRouter();
 
   const handleCardClick = (creator: string, slug: string) => {
-    router.push(`/store/${creator}/${slug}`);
+    router.push(`/store/agent/${creator}/${slug}`);
   };
 
   return (

autogpt_platform/frontend/src/components/agptui/composite/FeaturedCreators.tsx

@@ -26,7 +26,7 @@ export const FeaturedCreators: React.FC<FeaturedCreatorsProps> = ({
   const router = useRouter();
 
   const handleCardClick = (creator: string) => {
-    router.push(`/store/${creator}`);
+    router.push(`/store/creator/${creator}`);
   };
 
   return (

autogpt_platform/frontend/src/components/agptui/composite/FeaturedSection.tsx

@@ -33,7 +33,7 @@ export const FeaturedSection: React.FC<FeaturedSectionProps> = ({
   const router = useRouter();
 
   const handleCardClick = (creator: string, slug: string) => {
-    router.push(`/store/${creator}/${slug}`);
+    router.push(`/store/agent/${creator}/${slug}`);
   };
 
   const handlePrevSlide = useCallback(() => {
@@ -68,7 +68,7 @@ export const FeaturedSection: React.FC<FeaturedSectionProps> = ({
             {featuredAgents.map((agent, index) => (
               <CarouselItem
                 key={index}
-                className="ml-0 min-w-64 max-w-68 basis-2/3 basis-auto"
+                className="ml-0 min-w-64 max-w-68 basis-auto"
               >
                 <FeaturedStoreCard
                   agentName={agent.agent_name}