fix: fixe course links

client/public/json/course3/detail.json

@@ -1,36 +1,36 @@
 {
-  "id": "course3",
-  "name": "Curso de Integraciones Avanzadas",
-  "creatorId": "user1",
-  "creatorName": "Sebastián",
-  "creatorAvatar": "/images/mocks/avatar_mock1.png",
-  "creatorHeader": "Instructor desarrollador",
-  "courseIntro": "https://storage.googleapis.com/klowhub-mediafiles/courses/raw/course1/%F0%9F%93%BD%EF%B8%8F%20Creando%20una%20App%20Inteligente%20con%20AppSheet%20(No-Code)%2C%20Apps%20Script%20(Low-Code)%20y%20Gemini%20API%20%F0%9F%A4%96%20%EF%BD%9C%20AS130%20%5BZB3fJ_8ujA0%5D.mp4",
-  "coursePoster": "/images/mocks/course_mock2.png",
+  "id": "course4",
+  "name": "Automatización de flujos de trabajo con AppSheet",
+  "creatorId": "user2",
+  "creatorName": "María López",
+  "creatorAvatar": "/images/mocks/avatar_mock2.png",
+  "creatorHeader": "Especialista en AppSheet",
+  "courseIntro": "https://storage.googleapis.com/klowhub-mediafiles/courses/raw/course4/automatizacion-flujos.mp4",
+  "coursePoster": "/images/mocks/course_mock4.png",
   "price": "00.00",
   "rating": 3.7,
   "reviews": 128,
   "isBuyCourse": false,
   "platform": "Power Apps",
   "courseLearnings": [
-    "Implementar integraciones avanzadas entre Power Apps y servicios en la nube.",
-    "Diseñar soluciones conectadas que aprovechen datos en tiempo real.",
-    "Configurar APIs personalizadas para ampliar las funcionalidades de tus aplicaciones.",
-    "Automatizar procesos complejos utilizando integraciones y flujos de datos.",
-    "Optimizar tus aplicaciones para manejar grandes volúmenes de datos de manera eficiente."
+    "Configurar flujos de trabajo eficientes con AppSheet.",
+    "Automatizar procesos en aplicaciones empresariales.",
+    "Optimizar la gestión de inventarios y logística.",
+    "Aplicar mejores prácticas para la optimización de datos.",
+    "Desarrollar soluciones personalizadas para flujos de trabajo específicos."
   ],
-  "courseAbout": "En este curso te sumergirás en las integraciones avanzadas de Power Apps, aprendiendo a conectar tus aplicaciones con múltiples servicios y plataformas para maximizar su funcionalidad. Descubrirás cómo aprovechar datos en tiempo real, trabajar con APIs personalizadas y crear soluciones robustas que cumplan con los requerimientos más exigentes.",
-  "creatorDescription": "Sebastián Ríos es un instructor apasionado por la tecnología no-code, especializado en integraciones y optimización de procesos. Con más de 5 años de experiencia, Sebastián ha colaborado en proyectos internacionales donde las integraciones de Power Apps han sido clave para el éxito. Su enfoque práctico y dinámico hace que aprender con él sea una experiencia enriquecedora y efectiva.",
-  "courseObjective": "Proporcionarte los conocimientos y habilidades necesarios para implementar integraciones avanzadas en Power Apps, logrando aplicaciones conectadas y optimizadas que transformen tus procesos. A través de casos prácticos, aprenderás cómo sacar el máximo provecho de las capacidades integrativas de Power Apps.",
+  "courseAbout": "Este curso está diseñado para enseñarte cómo utilizar AppSheet para automatizar y optimizar flujos de trabajo en diversas áreas empresariales. Desde la logística hasta la gestión de inventarios, aprenderás cómo crear aplicaciones funcionales y eficaces para resolver problemas comunes en la industria.",
+  "creatorDescription": "María López es una experta en AppSheet y optimización de procesos. Con más de 7 años de experiencia en proyectos de logística y gestión de inventarios, María se especializa en crear soluciones automatizadas que transforman los procesos empresariales. Su estilo de enseñanza claro y enfocado garantiza que los estudiantes obtengan resultados tangibles.",
+  "courseObjective": "Capacitarte para diseñar y automatizar flujos de trabajo efectivos utilizando AppSheet, proporcionando herramientas y conocimientos prácticos para resolver problemas empresariales y optimizar procesos.",
   "courseRequirenments": [
-    "Experiencia previa en el desarrollo de aplicaciones con Power Apps.",
-    "Familiaridad con conceptos básicos de APIs y servicios en la nube."
+    "Conocimientos básicos de AppSheet.",
+    "Familiaridad con la gestión de datos en hojas de cálculo."
   ],
   "courseAdditions": [
-    "Ejemplos prácticos de integraciones con servicios populares como Microsoft Teams y SharePoint.",
-    "Acceso a tutoriales para configurar APIs personalizadas paso a paso.",
-    "Plantillas exclusivas para aplicaciones con flujos de datos avanzados.",
-    "Soporte técnico especializado durante todo el curso.",
-    "Actualizaciones frecuentes con nuevos casos de uso y lecciones avanzadas."
+    "Plantillas para flujos de trabajo automatizados.",
+    "Acceso a guías detalladas para la gestión de inventarios.",
+    "Ejercicios prácticos para resolver problemas de logística.",
+    "Soporte técnico personalizado durante el curso.",
+    "Actualizaciones regulares con nuevos ejemplos y lecciones."
   ]
 }

client/public/json/course4/details.json

@@ -0,0 +1,36 @@
+{
+  "id": "course3",
+  "name": "Curso de Integraciones Avanzadas",
+  "creatorId": "user1",
+  "creatorName": "Sebastián",
+  "creatorAvatar": "/images/mocks/avatar_mock1.png",
+  "creatorHeader": "Instructor desarrollador",
+  "courseIntro": "https://storage.googleapis.com/klowhub-mediafiles/courses/raw/course1/%F0%9F%93%BD%EF%B8%8F%20Creando%20una%20App%20Inteligente%20con%20AppSheet%20(No-Code)%2C%20Apps%20Script%20(Low-Code)%20y%20Gemini%20API%20%F0%9F%A4%96%20%EF%BD%9C%20AS130%20%5BZB3fJ_8ujA0%5D.mp4",
+  "coursePoster": "/images/mocks/course_mock2.png",
+  "price": "00.00",
+  "rating": 3.7,
+  "reviews": 128,
+  "isBuyCourse": false,
+  "platform": "Power Apps",
+  "courseLearnings": [
+    "Implementar integraciones avanzadas entre Power Apps y servicios en la nube.",
+    "Diseñar soluciones conectadas que aprovechen datos en tiempo real.",
+    "Configurar APIs personalizadas para ampliar las funcionalidades de tus aplicaciones.",
+    "Automatizar procesos complejos utilizando integraciones y flujos de datos.",
+    "Optimizar tus aplicaciones para manejar grandes volúmenes de datos de manera eficiente."
+  ],
+  "courseAbout": "En este curso te sumergirás en las integraciones avanzadas de Power Apps, aprendiendo a conectar tus aplicaciones con múltiples servicios y plataformas para maximizar su funcionalidad. Descubrirás cómo aprovechar datos en tiempo real, trabajar con APIs personalizadas y crear soluciones robustas que cumplan con los requerimientos más exigentes.",
+  "creatorDescription": "Sebastián Ríos es un instructor apasionado por la tecnología no-code, especializado en integraciones y optimización de procesos. Con más de 5 años de experiencia, Sebastián ha colaborado en proyectos internacionales donde las integraciones de Power Apps han sido clave para el éxito. Su enfoque práctico y dinámico hace que aprender con él sea una experiencia enriquecedora y efectiva.",
+  "courseObjective": "Proporcionarte los conocimientos y habilidades necesarios para implementar integraciones avanzadas en Power Apps, logrando aplicaciones conectadas y optimizadas que transformen tus procesos. A través de casos prácticos, aprenderás cómo sacar el máximo provecho de las capacidades integrativas de Power Apps.",
+  "courseRequirenments": [
+    "Experiencia previa en el desarrollo de aplicaciones con Power Apps.",
+    "Familiaridad con conceptos básicos de APIs y servicios en la nube."
+  ],
+  "courseAdditions": [
+    "Ejemplos prácticos de integraciones con servicios populares como Microsoft Teams y SharePoint.",
+    "Acceso a tutoriales para configurar APIs personalizadas paso a paso.",
+    "Plantillas exclusivas para aplicaciones con flujos de datos avanzados.",
+    "Soporte técnico especializado durante todo el curso.",
+    "Actualizaciones frecuentes con nuevos casos de uso y lecciones avanzadas."
+  ]
+}

client/public/json/course4/user.json

@@ -0,0 +1,13 @@
+{
+  "id": "user1",
+  "name": "Sebastián Ríos",
+  "avatar": "/images/mocks/avatar_mock2.png",
+  "header": "Instructor desarrollador",
+  "rating": 4.1,
+  "reviews": 74,
+  "courses": 3,
+  "students": 60,
+  "membership": "pro",
+  "description": "Experto en desarrollo de aplicaciones no-code con más de 5 años de experiencia en AppSheet y Power Apps, ayudando a empresas y emprendedores a optimizar sus procesos de manera eficiente y accesible.",
+  "whyLearning": "Sebastián Ríos es un apasionado del desarrollo no-code, con más de 5 años de experiencia en Power Apps y un enfoque práctico y accesible para la enseñanza. Ha ayudado a cientos de profesionales y emprendedores a transformar sus ideas en aplicaciones exitosas, simplificando procesos y mejorando la productividad. Su metodología se centra en ejemplos reales y soluciones prácticas, lo que te permitirá aplicar lo aprendido de inmediato en tus propios proyectos. Aprender con Sebastián significa adquirir habilidades valiosas de la mano de un experto comprometido con tu éxito."
+}

client/public/json/interest-courses.json

@@ -48,6 +48,6 @@
     "reviews": 128,
     "platform": "Power Apps",
     "tags": ["Logistica", "Optimización", "Inventarios"],
-    "img": "/images/mocks/course_mock2.png"
+    "imageUrl": "/images/mocks/course_mock4.png"
   }
 ]

client/src/app/[locale]/(auth)/creator/courses/page.tsx

@@ -8,7 +8,7 @@ export default async function CreatorCoursesPage({
   const { locale } = await params;
   setRequestLocale(locale);
   return (
-    <main className="mt-36 size-full px-10 sm:px-[51px] min-[1800px]:px-16">
+    <main className="mb-20 mt-36 size-full px-10 sm:px-[51px] min-[1800px]:px-16">
       <SectionCreateCourse />
     </main>
   );

client/src/app/[locale]/(auth)/creator/earnings/page.tsx

@@ -0,0 +1,50 @@
+import { getTranslations, setRequestLocale } from 'next-intl/server';
+import ComingSoon from '@core/components/ComingSoon';
+import { routing } from '@core/lib/i18nRouting';
+
+export default async function CreatorMentorsPage({
+  params,
+}: Readonly<{ params: Promise<{ locale: string }> }>) {
+  const { locale } = await params;
+  const ct = await getTranslations<'ComingSoon'>({
+    locale: locale,
+    namespace: 'ComingSoon',
+  });
+  setRequestLocale(locale);
+  return (
+    <main className="mb-20 mt-36 size-full px-10 sm:px-[51px] min-[1800px]:px-16">
+      <ComingSoon className="self-center" title={ct('title')} subTitle={ct('subTitle')} />
+    </main>
+  );
+}
+
+export async function generateStaticParams() {
+  const paths = routing.locales.map(locale => ({
+    locale,
+    slug: `${locale}/creator/earnings`,
+  }));
+
+  return paths.map(params => ({
+    params,
+  }));
+}
+
+export async function generateMetadata({
+  params,
+}: Readonly<{ params: Promise<{ locale: string }> }>) {
+  const { locale } = await params;
+  const t = await getTranslations<'CreatorEarnings'>({
+    locale: locale,
+    namespace: 'CreatorEarnings',
+  });
+  return {
+    title: t('metaTitle'),
+    description: t('metaDescription'),
+    openGraph: {
+      siteName: t('metaSiteName'),
+      title: t('metaSiteName'),
+      description: t('metaDescription'),
+      locale: locale,
+    },
+  };
+}

client/src/core/components/Navbar/UserModeToggle.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import { useSearchParams } from 'next/navigation';
-import { Link, usePathname } from '../../lib/i18nRouting';
-import { cn } from '../../lib/utils';
+import { useRouterQueryState } from '@core/hooks/useRouterQueryState';
+import { Link, usePathname } from '@core/lib/i18nRouting';
+import { cn } from '@core/lib/utils';
 
 interface UserModeToggleProps {
   explorerText: string;
@@ -12,8 +12,7 @@ interface UserModeToggleProps {
 
 const UserModeToggle = ({ creatorText, explorerText, className = '' }: UserModeToggleProps) => {
   const pathname = usePathname();
-  const searchParams = useSearchParams();
-  const mode = searchParams.get('mode');
+  const [mode, _] = useRouterQueryState('mode');
 
   return (
     <div className={cn('flex h-full max-h-full items-center justify-center gap-2', className)}>

client/src/features/creator/components/ContentExtraInfoCard/Index.tsx

@@ -1,4 +1,5 @@
 import Button from '@core/components/Button';
+import { Link } from '@core/lib/i18nRouting';
 import ExtraContentInfo from '../ExtraContentInfo/Index';
 
 interface ContentExtraInfoCardProps {
@@ -30,8 +31,8 @@ const ContentExtraInfoCard = ({
       <ExtraContentInfo title={publishedCoursesText} content={publishedCourses} />
       <ExtraContentInfo title={transferredAppsText} content={transferredApps} />
       <ExtraContentInfo title={mentoringHoursText} content={mentoringHours} />
-      <Button variant="ghost" size="fit" className="h-8">
-        {viewDetails}
+      <Button variant="ghost" asChild size="fit" className="h-8">
+        <Link href="/creator/earnings">{viewDetails}</Link>
       </Button>
     </div>
   );

client/src/features/creator/components/ContentItem/Index.tsx

@@ -1,4 +1,5 @@
 import Image from 'next/image';
+import { Link } from '@core/lib/i18nRouting';
 
 interface ContentItemProps {
   type: string;
@@ -7,9 +8,18 @@ interface ContentItemProps {
   state: string;
   details: string;
   profile: string;
+  projectType?: string;
 }
 
-const ContentItem = ({ profile, name, type, price, state, details }: ContentItemProps) => {
+const ContentItem = ({
+  profile,
+  name,
+  type,
+  price,
+  state,
+  details,
+  projectType = '',
+}: ContentItemProps) => {
   return (
     <div className="flex w-full flex-col gap-4 rounded-lg bg-white/10 px-6 py-3 text-sm font-semibold text-white shadow-md min-[820px]:grid min-[820px]:grid-cols-6 min-[820px]:gap-6">
       <div className="col-span-2 hidden items-center justify-center gap-4 min-[820px]:flex">
@@ -48,9 +58,9 @@ const ContentItem = ({ profile, name, type, price, state, details }: ContentItem
         />{' '}
         {name}
       </div>
-      <div className="flex items-center justify-center gap-4">
+      <Link href={`/creator/${projectType}`} className="flex items-center justify-center gap-4">
         <div className="cursor-pointer font-bold text-primary-B-300 hover:underline">{details}</div>
-      </div>
+      </Link>
     </div>
   );
 };

client/src/features/creator/components/ContentTabs/Index.tsx

@@ -56,6 +56,7 @@ const ContentTabs = ({
             type="Curso"
             state="Pendiente"
             details={viewDetails}
+            projectType="courses"
           />
         ))}
       </TabsContent>
@@ -69,6 +70,7 @@ const ContentTabs = ({
             type="Apps"
             state="Pendiente"
             details={viewDetails}
+            projectType="apps"
           />
         ))}
       </TabsContent>
@@ -82,6 +84,7 @@ const ContentTabs = ({
             type="Curso"
             state="Pendiente"
             details={viewDetails}
+            projectType="courses"
           />
         ))}
       </TabsContent>
@@ -95,6 +98,7 @@ const ContentTabs = ({
             type="Projects"
             state="Pendiente"
             details={viewDetails}
+            projectType="projects"
           />
         ))}
       </TabsContent>
@@ -108,6 +112,7 @@ const ContentTabs = ({
             type="Mentors"
             state="Pendiente"
             details={viewDetails}
+            projectType="mentors"
           />
         ))}
       </TabsContent>