This commit is contained in:
@@ -1,148 +0,0 @@
|
||||
import type { Metadata } from "next";
|
||||
import { ArrowLeft, BadgeEuro, Boxes, Layers2 } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { getTranslations } from "next-intl/server";
|
||||
import { notFound } from "next/navigation";
|
||||
|
||||
import { Container } from "@/components/layout/container";
|
||||
import { PageHero } from "@/components/layout/page-hero";
|
||||
import { MotionFade } from "@/components/motion-fade";
|
||||
import { routing } from "@/i18n/routing";
|
||||
import { buildLocalizedMetadata } from "@/lib/metadata";
|
||||
import { getLocalizedPath, resolveLocale } from "@/lib/locale";
|
||||
import { getProductItem, pickText, productItems } from "@/lib/site-data";
|
||||
import { AppCard } from "@/components/ui/app-card";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { CardContent } from "@/components/ui/card";
|
||||
|
||||
type ProductPageProps = {
|
||||
params: {
|
||||
locale: string;
|
||||
slug: string;
|
||||
};
|
||||
};
|
||||
|
||||
export function generateStaticParams() {
|
||||
return routing.locales.flatMap((locale) =>
|
||||
productItems.map((item) => ({
|
||||
locale,
|
||||
slug: item.slug,
|
||||
})),
|
||||
);
|
||||
}
|
||||
|
||||
export async function generateMetadata({
|
||||
params: { locale, slug },
|
||||
}: ProductPageProps): Promise<Metadata> {
|
||||
const localeKey = resolveLocale(locale);
|
||||
const item = getProductItem(slug);
|
||||
|
||||
if (!item) {
|
||||
return await buildLocalizedMetadata({
|
||||
locale: localeKey,
|
||||
pathname: `/products/${slug}`,
|
||||
title: "Products",
|
||||
description: "Product page",
|
||||
});
|
||||
}
|
||||
|
||||
return await buildLocalizedMetadata({
|
||||
locale: localeKey,
|
||||
pathname: `/products/${slug}`,
|
||||
title: pickText(item.name, localeKey),
|
||||
description: pickText(item.summary, localeKey),
|
||||
});
|
||||
}
|
||||
|
||||
export default async function ProductPage({ params: { locale, slug } }: ProductPageProps) {
|
||||
const localeKey = resolveLocale(locale);
|
||||
const item = getProductItem(slug);
|
||||
|
||||
if (!item) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const t = await getTranslations({ locale: localeKey, namespace: "productDetail" });
|
||||
|
||||
return (
|
||||
<>
|
||||
<PageHero
|
||||
title={pickText(item.name, localeKey)}
|
||||
description={pickText(item.summary, localeKey)}
|
||||
/>
|
||||
|
||||
<Container size="wide" className="flex flex-col gap-section pb-12 lg:pb-16">
|
||||
<MotionFade>
|
||||
<AppCard level={3}>
|
||||
<CardContent className="p-6 lg:p-10">
|
||||
<Button asChild variant="ghost" className="h-auto px-0 py-0 text-sm">
|
||||
<Link href={getLocalizedPath(localeKey, "/products")}>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
{t("back")}
|
||||
</Link>
|
||||
</Button>
|
||||
|
||||
<h1 className="mt-5 text-3xl font-semibold text-foreground sm:text-4xl">
|
||||
{pickText(item.name, localeKey)}
|
||||
</h1>
|
||||
<p className="mt-4 text-base text-muted-foreground sm:text-lg">
|
||||
{pickText(item.summary, localeKey)}
|
||||
</p>
|
||||
|
||||
<div className="mt-6 flex flex-wrap gap-3 text-sm text-foreground/80">
|
||||
{[
|
||||
{
|
||||
icon: Layers2,
|
||||
label: pickText(item.segment, localeKey),
|
||||
},
|
||||
{
|
||||
icon: BadgeEuro,
|
||||
label: pickText(item.price, localeKey),
|
||||
},
|
||||
{
|
||||
icon: Boxes,
|
||||
label: item.slug,
|
||||
},
|
||||
].map((meta) => {
|
||||
const Icon = meta.icon;
|
||||
|
||||
return (
|
||||
<AppCard key={meta.label} level={2}>
|
||||
<CardContent className="flex items-center gap-2 p-3">
|
||||
<Icon className="h-4 w-4 text-brand-primary" />
|
||||
{meta.label}
|
||||
</CardContent>
|
||||
</AppCard>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</CardContent>
|
||||
</AppCard>
|
||||
</MotionFade>
|
||||
|
||||
<MotionFade delay={0.05}>
|
||||
<AppCard>
|
||||
<CardContent className="p-6 lg:p-8">
|
||||
<h2 className="text-xl font-semibold text-foreground">{t("included")}</h2>
|
||||
<ul className="mt-4 grid gap-3 sm:grid-cols-3">
|
||||
{[t("stepOne"), t("stepTwo"), t("stepThree")].map((step, index) => (
|
||||
<AppCard key={step} level={2}>
|
||||
<CardContent className="p-4">
|
||||
<span className="mb-2 inline-flex h-6 w-6 items-center justify-center rounded-full bg-muted text-xs font-semibold text-foreground/80">
|
||||
{index + 1}
|
||||
</span>
|
||||
<p className="text-sm text-foreground/80">{step}</p>
|
||||
</CardContent>
|
||||
</AppCard>
|
||||
))}
|
||||
</ul>
|
||||
<Button asChild className="mt-6">
|
||||
<Link href={getLocalizedPath(localeKey, "/contact")}>{t("action")}</Link>
|
||||
</Button>
|
||||
</CardContent>
|
||||
</AppCard>
|
||||
</MotionFade>
|
||||
</Container>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,84 +0,0 @@
|
||||
import type { Metadata } from "next";
|
||||
import { ArrowUpRight, CircleDollarSign } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { getTranslations } from "next-intl/server";
|
||||
|
||||
import { Container } from "@/components/layout/container";
|
||||
import { PageHero } from "@/components/layout/page-hero";
|
||||
import { MotionFade } from "@/components/motion-fade";
|
||||
import { buildLocalizedMetadata } from "@/lib/metadata";
|
||||
import { AppCard } from "@/components/ui/app-card";
|
||||
import { CardContent } from "@/components/ui/card";
|
||||
import { getLocalizedPath, resolveLocale } from "@/lib/locale";
|
||||
import { pickText, productItems } from "@/lib/site-data";
|
||||
|
||||
type ProductsPageProps = {
|
||||
params: {
|
||||
locale: string;
|
||||
};
|
||||
};
|
||||
|
||||
export async function generateMetadata({
|
||||
params: { locale },
|
||||
}: ProductsPageProps): Promise<Metadata> {
|
||||
const localeKey = resolveLocale(locale);
|
||||
const t = await getTranslations({ locale: localeKey, namespace: "productsPage" });
|
||||
|
||||
return await buildLocalizedMetadata({
|
||||
locale: localeKey,
|
||||
pathname: "/products",
|
||||
title: t("title"),
|
||||
description: t("intro"),
|
||||
});
|
||||
}
|
||||
|
||||
export default async function ProductsPage({ params: { locale } }: ProductsPageProps) {
|
||||
const localeKey = resolveLocale(locale);
|
||||
const t = await getTranslations({ locale: localeKey, namespace: "productsPage" });
|
||||
|
||||
return (
|
||||
<>
|
||||
<PageHero
|
||||
locale={localeKey}
|
||||
badge={t("heroBadge")}
|
||||
title={t("heroTitle")}
|
||||
description={t("intro")}
|
||||
/>
|
||||
|
||||
<Container className="flex flex-col gap-section pb-12 lg:pb-16">
|
||||
<section className="grid gap-4 md:grid-cols-3">
|
||||
{productItems.map((item, index) => (
|
||||
<MotionFade key={item.slug} delay={index * 0.05}>
|
||||
<AppCard interactive>
|
||||
<CardContent className="p-5">
|
||||
<Link
|
||||
href={getLocalizedPath(localeKey, `/products/${item.slug}`)}
|
||||
className="group block"
|
||||
>
|
||||
<p className="text-sm text-muted-foreground/80">
|
||||
{pickText(item.segment, localeKey)}
|
||||
</p>
|
||||
<h2 className="mt-3 text-xl font-semibold text-foreground">
|
||||
{pickText(item.name, localeKey)}
|
||||
</h2>
|
||||
<p className="mt-2 text-sm text-muted-foreground">
|
||||
{pickText(item.summary, localeKey)}
|
||||
</p>
|
||||
<p className="mt-4 inline-flex items-center gap-2 text-sm font-medium text-foreground/80">
|
||||
<CircleDollarSign className="h-4 w-4 text-brand-secondary" />
|
||||
{pickText(item.price, localeKey)}
|
||||
</p>
|
||||
<p className="mt-4 inline-flex items-center gap-2 text-sm font-medium text-foreground/80 group-hover:text-foreground">
|
||||
{t("open")}
|
||||
<ArrowUpRight className="h-4 w-4" />
|
||||
</p>
|
||||
</Link>
|
||||
</CardContent>
|
||||
</AppCard>
|
||||
</MotionFade>
|
||||
))}
|
||||
</section>
|
||||
</Container>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -78,7 +78,7 @@ async function revalidateSiteSettingsPages() {
|
||||
revalidatePath("/root/site-settings");
|
||||
revalidatePath("/coming-soon");
|
||||
|
||||
const publicPaths = ["/", "/about", "/portfolio", "/products", "/contact", "/success", "/coming-soon"];
|
||||
const publicPaths = ["/", "/about", "/portfolio", "/contact", "/success", "/coming-soon"];
|
||||
|
||||
for (const locale of routing.locales) {
|
||||
revalidatePath(getLocalizedPath(locale), "layout");
|
||||
|
||||
@@ -4,7 +4,6 @@ import { unstable_noStore as noStore } from "next/cache";
|
||||
import { routing } from "@/i18n/routing";
|
||||
import { getLocalizedPath } from "@/lib/locale";
|
||||
import { getPublishedPortfolioProjects } from "@/lib/portfolio";
|
||||
import { productItems } from "@/lib/site-data";
|
||||
|
||||
function getSiteUrl(): URL {
|
||||
return new URL(process.env.NEXT_PUBLIC_SITE_URL ?? "https://mohfarawati.de");
|
||||
@@ -60,20 +59,10 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
|
||||
priority: 0.8,
|
||||
}),
|
||||
),
|
||||
...buildLocalizedEntries("/products", {
|
||||
changeFrequency: "weekly",
|
||||
priority: 0.8,
|
||||
}),
|
||||
...buildLocalizedEntries("/contact", {
|
||||
changeFrequency: "monthly",
|
||||
priority: 0.7,
|
||||
}),
|
||||
...productItems.flatMap((item) =>
|
||||
buildLocalizedEntries(`/products/${item.slug}`, {
|
||||
changeFrequency: "monthly",
|
||||
priority: 0.7,
|
||||
}),
|
||||
),
|
||||
...projects.flatMap((project) =>
|
||||
buildLocalizedEntries(`/portfolio/${project.slug}`, {
|
||||
lastModified: project.publishedAt ?? undefined,
|
||||
|
||||
@@ -7,7 +7,6 @@ import { getLocalizedPath } from "@/lib/locale";
|
||||
const navItems = [
|
||||
{ key: "home", path: "" },
|
||||
{ key: "portfolio", path: "/portfolio" },
|
||||
{ key: "products", path: "/products" },
|
||||
{ key: "about", path: "/about" },
|
||||
{ key: "contact", path: "/contact" },
|
||||
];
|
||||
|
||||
@@ -1,91 +0,0 @@
|
||||
import type { AppLocale } from "@/lib/locale";
|
||||
|
||||
type LocalizedText = Record<AppLocale, string>;
|
||||
|
||||
export type ProductItem = {
|
||||
slug: string;
|
||||
name: LocalizedText;
|
||||
summary: LocalizedText;
|
||||
segment: LocalizedText;
|
||||
price: LocalizedText;
|
||||
};
|
||||
|
||||
export const productItems: ProductItem[] = [
|
||||
{
|
||||
slug: "starter-kit",
|
||||
name: {
|
||||
de: "Starter Kit",
|
||||
en: "Starter Kit",
|
||||
ar: "Starter Kit",
|
||||
},
|
||||
summary: {
|
||||
de: "Basis Paket fuer den schnellen Start von neuen Projekten.",
|
||||
en: "Base package for launching new projects quickly.",
|
||||
ar: "باقة أساسية لبدء المشاريع الجديدة بسرعة.",
|
||||
},
|
||||
segment: {
|
||||
de: "Small Teams",
|
||||
en: "Small Teams",
|
||||
ar: "الفرق الصغيرة",
|
||||
},
|
||||
price: {
|
||||
de: "ab 990 EUR",
|
||||
en: "from 990 EUR",
|
||||
ar: "ابتداءً من 990 EUR",
|
||||
},
|
||||
},
|
||||
{
|
||||
slug: "growth-kit",
|
||||
name: {
|
||||
de: "Growth Kit",
|
||||
en: "Growth Kit",
|
||||
ar: "Growth Kit",
|
||||
},
|
||||
summary: {
|
||||
de: "Skalierbares Paket fuer wachsende Produkte und Prozesse.",
|
||||
en: "Scalable package for growing products and processes.",
|
||||
ar: "باقة قابلة للتوسع للمنتجات والعمليات المتنامية.",
|
||||
},
|
||||
segment: {
|
||||
de: "Scaleups",
|
||||
en: "Scaleups",
|
||||
ar: "الشركات المتوسعة",
|
||||
},
|
||||
price: {
|
||||
de: "ab 2490 EUR",
|
||||
en: "from 2490 EUR",
|
||||
ar: "ابتداءً من 2490 EUR",
|
||||
},
|
||||
},
|
||||
{
|
||||
slug: "enterprise-kit",
|
||||
name: {
|
||||
de: "Enterprise Kit",
|
||||
en: "Enterprise Kit",
|
||||
ar: "Enterprise Kit",
|
||||
},
|
||||
summary: {
|
||||
de: "Massgeschneiderte Loesung fuer grosse Teams und komplexe Systeme.",
|
||||
en: "Tailored solution for large teams and complex systems.",
|
||||
ar: "حل مخصص للفرق الكبيرة والأنظمة المعقدة.",
|
||||
},
|
||||
segment: {
|
||||
de: "Enterprise",
|
||||
en: "Enterprise",
|
||||
ar: "المؤسسات",
|
||||
},
|
||||
price: {
|
||||
de: "auf Anfrage",
|
||||
en: "on request",
|
||||
ar: "عند الطلب",
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export function pickText(text: LocalizedText, locale: AppLocale): string {
|
||||
return text[locale];
|
||||
}
|
||||
|
||||
export function getProductItem(slug: string) {
|
||||
return productItems.find((item) => item.slug === slug);
|
||||
}
|
||||
@@ -52,7 +52,6 @@
|
||||
"serviceTracking": "تراكنغ واضح وفهم لحركة الزوار.",
|
||||
"serviceSystem": "سستم خاص لشركتك أو لفريقك.",
|
||||
"toPortfolio": "عرض الأعمال",
|
||||
"toProducts": "عرض المنتجات",
|
||||
"toContact": "تواصل معي"
|
||||
},
|
||||
"portfolioPage": {
|
||||
@@ -64,13 +63,6 @@
|
||||
"all": "كل التصنيفات",
|
||||
"empty": "لا توجد مشاريع منشورة ضمن هذا التصنيف حالياً."
|
||||
},
|
||||
"productsPage": {
|
||||
"title": "المنتجات",
|
||||
"heroBadge": "حلول جاهزة",
|
||||
"heroTitle": "منتجاتي",
|
||||
"intro": "باقات للفرق من البداية حتى التوسع.",
|
||||
"open": "فتح المنتج"
|
||||
},
|
||||
"aboutPage": {
|
||||
"title": "من أنا",
|
||||
"heroBadge": "خلّيني عرّفك عليّي",
|
||||
@@ -155,13 +147,5 @@
|
||||
"openLink": "فتح الرابط",
|
||||
"gallery": "معرض المشروع",
|
||||
"download": "فتح الملف"
|
||||
},
|
||||
"productDetail": {
|
||||
"back": "العودة إلى المنتجات",
|
||||
"included": "يشمل",
|
||||
"stepOne": "جلسة انطلاق وتوضيح النطاق",
|
||||
"stepTwo": "إعداد التصميم والمكونات",
|
||||
"stepThree": "تنفيذ وتسليم",
|
||||
"action": "تواصل لطلب عرض"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -52,7 +52,6 @@
|
||||
"serviceTracking": "Tracking und bessere Auswertung.",
|
||||
"serviceSystem": "Interne Systeme für Teams und Firmen.",
|
||||
"toPortfolio": "Portfolio ansehen",
|
||||
"toProducts": "Produkte ansehen",
|
||||
"toContact": "Kontakt aufnehmen"
|
||||
},
|
||||
"portfolioPage": {
|
||||
@@ -64,13 +63,6 @@
|
||||
"all": "Alle Kategorien",
|
||||
"empty": "Für diesen Filter sind noch keine veröffentlichten Projekte vorhanden."
|
||||
},
|
||||
"productsPage": {
|
||||
"title": "Produkte",
|
||||
"heroBadge": "Pakete und Lösungen",
|
||||
"heroTitle": "Klare Angebote",
|
||||
"intro": "Pakete für Teams von Start bis Skalierung.",
|
||||
"open": "Produkt öffnen"
|
||||
},
|
||||
"aboutPage": {
|
||||
"title": "Über mich",
|
||||
"heroBadge": "Mehr über mich",
|
||||
@@ -155,13 +147,5 @@
|
||||
"openLink": "Link öffnen",
|
||||
"gallery": "Projektgalerie",
|
||||
"download": "Dokument öffnen"
|
||||
},
|
||||
"productDetail": {
|
||||
"back": "Zurück zu Produkten",
|
||||
"included": "Inklusive",
|
||||
"stepOne": "Kickoff und Scope Klarheit",
|
||||
"stepTwo": "Setup von Design und Komponenten",
|
||||
"stepThree": "Implementierung und Übergabe",
|
||||
"action": "Kontakt für Angebot"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -52,7 +52,6 @@
|
||||
"serviceTracking": "Tracking setup and user insights.",
|
||||
"serviceSystem": "Custom internal systems for teams.",
|
||||
"toPortfolio": "View portfolio",
|
||||
"toProducts": "View products",
|
||||
"toContact": "Contact me"
|
||||
},
|
||||
"portfolioPage": {
|
||||
@@ -64,13 +63,6 @@
|
||||
"all": "All categories",
|
||||
"empty": "No published projects are available for this filter yet."
|
||||
},
|
||||
"productsPage": {
|
||||
"title": "Products",
|
||||
"heroBadge": "Packages and offers",
|
||||
"heroTitle": "Clear offers",
|
||||
"intro": "Packages for teams from early stage to scale.",
|
||||
"open": "Open product"
|
||||
},
|
||||
"aboutPage": {
|
||||
"title": "About",
|
||||
"heroBadge": "A bit more about me",
|
||||
@@ -155,13 +147,5 @@
|
||||
"openLink": "Open link",
|
||||
"gallery": "Project gallery",
|
||||
"download": "Open document"
|
||||
},
|
||||
"productDetail": {
|
||||
"back": "Back to products",
|
||||
"included": "Included",
|
||||
"stepOne": "Kickoff and scope clarity",
|
||||
"stepTwo": "Design and component setup",
|
||||
"stepThree": "Implementation and handover",
|
||||
"action": "Contact for proposal"
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user