Update: Update product list page (#123)

* Update: Update product list page

* Fix: rename our-products to products

Author: sintaherena

app/[lang]/(hyperjump)/components/nav.tsx

@@ -30,6 +30,7 @@ const SOLID_NAV_PATHS = [
   "/case-studies",
   "/jobs",
   "/services",
+  "/products",
   ...data.jobs.map(({ id }) => `/jobs/${id}`)
 ];
 const SOLID_NAV_PATHS_WITH_LOCALE = supportedLanguages.reduce(
@@ -46,7 +47,7 @@ function menu(lang: SupportedLanguage) {
       label: mainNavItems0Label(lang),
       href: `/${lang}/services`
     },
-    { label: mainNavItems2Label(lang), href: `/${lang}/our-products` },
+    { label: mainNavItems2Label(lang), href: `/${lang}/products` },
     { label: mainNavItems1Label(lang), href: `/${lang}/case-studies` },
     { label: mainNavItems3Label(lang), href: `/${lang}/#faqs` }
   ];

…/[lang]/(hyperjump)/our-products/data.ts app/[lang]/(hyperjump)/products/data.tsapp/[lang]/(hyperjump)/our-products/data.ts renamed to app/[lang]/(hyperjump)/products/data.ts app/[lang]/(hyperjump)/our-products/data.ts renamed to app/[lang]/(hyperjump)/products/data.ts

@@ -19,35 +19,24 @@ export function getCommercialProduct(lang: SupportedLanguage) {
     {
       title: ourProductsCommercialData1Title(lang),
       description: ourProductsCommercialData1Text(lang),
-      image: "/images/our-products/startGPT.svg",
-      urlLearnMore: `/${lang}/inferenceai/startgpt`
+      image: "/images/products/startGPT.svg"
     },
     {
       title: ourProductsCommercialData2Title(lang),
       description: ourProductsCommercialData2Text(lang),
-      image: "/images/our-products/media-pulse.svg",
-      urlLearnMore: `/${lang}/inferenceai/media-pulse`
+      image: "/images/products/media-pulse.svg"
     },
     {
       title: ourProductsCommercialData3Title(lang),
       description: ourProductsCommercialData3Text(lang),
       image: "/images/open-source/monika.svg",
-      urlLearnMore: "https://monika.hyperjump.tech/"
+      url: "https://monika.hyperjump.tech/"
     }
   ];
 }
 
 export function getOpenSource(lang: SupportedLanguage) {
   return [
-    {
-      title: mainProject1Title(lang),
-      description: mainProject1Text(lang),
-      image: "/images/open-source/monika.svg",
-      url: "https://monika.hyperjump.tech/",
-      repoUrl: "https://github.com/hyperjumptech/monika",
-      button: true,
-      repo: "monika"
-    },
     {
       title: mainProject0Title(lang),
       description: mainProject0Text(lang),

…[lang]/(hyperjump)/our-products/page.tsx app/[lang]/(hyperjump)/products/page.tsxapp/[lang]/(hyperjump)/our-products/page.tsx renamed to app/[lang]/(hyperjump)/products/page.tsx app/[lang]/(hyperjump)/our-products/page.tsx renamed to app/[lang]/(hyperjump)/products/page.tsx

@@ -4,19 +4,14 @@ import {
 } from "@/locales/.generated/types";
 import {
   mainViewMore,
-  ourProductsCommercialDescription,
-  ourProductsCommercialHeading,
   ourProductsHeroDesc,
-  ourProductsHeroHeading,
-  ourProductsOpenSourceDescription,
-  ourProductsOpenSourceHeading
+  ourProductsHeroHeading
 } from "@/locales/.generated/server";
 import { Metadata } from "next";
 import { dynamicOpengraph } from "@/lib/default-metadata";
 import GridItemsContainer, {
   GridItems,
-  GridItemsMoreButton,
-  GridItemsTitle
+  GridItemsMoreButton
 } from "@/app/components/grid-items";
 import { getCommercialProduct, getOpenSource } from "./data";
 import data from "@/data.json";
@@ -38,10 +33,10 @@ export async function generateMetadata({
     title: `Our Products - ${ourProductsHeroHeading(lang)}`,
     description: ourProductsHeroDesc(lang),
     alternates: {
-      canonical: `https://hyperjump.tech/${lang}/our-products`,
+      canonical: `https://hyperjump.tech/${lang}/products`,
       languages: supportedLanguages.reduce(
         (acc, l) => {
-          acc[l] = `https://hyperjump.tech/${l}/our-products`;
+          acc[l] = `https://hyperjump.tech/${l}/products`;
           return acc;
         },
         {} as Record<string, string>
@@ -91,11 +86,6 @@ function ProductCommercial({ lang }: { lang: SupportedLanguage }) {
 
   return (
     <GridItemsContainer id="commercial-product">
-      <GridItemsTitle
-        layout="vertical"
-        title={ourProductsCommercialHeading(lang)}
-        description={ourProductsCommercialDescription(lang)}
-      />
       <GridItems
         items={projects}
         columns={{ base: 1, sm: 2, lg: 3 }}
@@ -111,22 +101,12 @@ function OpenSourceProducts({ lang }: { lang: SupportedLanguage }) {
 
   return (
     <GridItemsContainer id="open-source">
-      <GridItemsTitle
-        layout="vertical"
-        title={ourProductsOpenSourceHeading(lang)}
-        description={ourProductsOpenSourceDescription(lang)}
-      />
       <GridItems
         items={projects}
         columns={{ base: 1, sm: 2, lg: 3 }}
         cardClassName="rounded"
         lang={lang}
       />
-      <GridItemsMoreButton
-        text={mainViewMore(lang)}
-        variant="outline"
-        href={data.github}
-      />
     </GridItemsContainer>
   );
 }

e2e/case-studies.spec.ts

@@ -69,7 +69,7 @@ async function gotoAndWait(page: import("@playwright/test").Page, url: string) {
 // Shared assertions for header nav links based on code in app/[lang]/(hyperjump)/components/nav.tsx
 const expectedMenuPaths = (locale: string) => [
   `/${locale}/services`,
-  `/${locale}/our-products`,
+  `/${locale}/products`,
   `/${locale}/case-studies`,
   `/${locale}#faqs`
 ];

e2e/navigation.spec.ts

@@ -2,7 +2,7 @@ import { test, expect, Page, Locator } from "@playwright/test";
 
 const navLinks: { name: string; expected: RegExp }[] = [
   { name: "Our Services", expected: /\/(en|id)\/services(\/|$)/ },
-  { name: "Our Products", expected: /\/(en|id)\/our-products(\/|$)/ },
+  { name: "Our Products", expected: /\/(en|id)\/products(\/|$)/ },
   { name: "Case Studies", expected: /\/(en|id)\/case-studies(\/|$)/ },
   { name: "FAQ", expected: /#faqs/ }
 ];

locales/en/our-products.json

@@ -1,7 +1,7 @@
 {
   "hero": {
-    "heading": "The Hyperjump Product Stack",
-    "desc": "Private AI assistants, real-time media insights, and monitoring tools. Everything your engineering team needs to ship with confidence."
+    "heading": "Smart Tech. Real Impact.",
+    "desc": "Explore the products that power tomorrow’s digital solutions."
   },
   "commercial": {
     "heading": "Commercial Products",

locales/id/our-products.json

@@ -1,7 +1,7 @@
 {
   "hero": {
-    "heading": "Rangkaian Produk Hyperjump",
-    "desc": "Asisten AI pribadi, wawasan media secara real-time, dan alat pemantauan. Semua yang dibutuhkan tim engineering Anda untuk mengirimkan produk dengan percaya diri."
+    "heading": "Inovasi Cerdas. Dampak Nyata.",
+    "desc": "Temukan berbagai produk yang menjadi penggerak solusi digital masa depan."
   },
   "commercial": {
     "heading": "Produk Komersial",