refactor: update blog and auth components with localization and UI improvements

- Add new "Product" category for blog posts in English and Chinese
- Update blog page subtitle using localization messages
- Enhance reset password page and form with better error handling
- Modify auth card styling with subtle border and shadow
- Update mobile navbar background for improved visual clarity
- Refine authentication form labels and button text

content/en/category/company.mdx

@@ -1,5 +1,5 @@
 ---
 slug: company
 name: Company
-description: Company news about MkSaaS Boilerplate
+description: Company news and updates
 ---

content/en/category/guide.mdx

@@ -1,5 +0,0 @@
----
-slug: guide
-name: Guide
-description: Guides about MkSaaS Boilerplate
----

content/en/category/news.mdx

@@ -1,5 +1,5 @@
 ---
 slug: news
 name: News
-description: News about MkSaaS Boilerplate
+description: News and updates about MkSaaS
 ---

content/en/category/product.mdx

@@ -0,0 +1,5 @@
+---
+slug: product
+name: Product
+description: Products and services powered by MkSaaS
+---

content/zh/category/company.mdx

@@ -1,6 +1,6 @@
 ---
 slug: company
 name: 公司
-description: 公司新闻
+description: 公司新闻和更新
 locale: zh
 ---

content/zh/category/guide.mdx

@@ -1,6 +0,0 @@
----
-slug: guide
-name: 指南
-description: 使用指南
-locale: zh
----

content/zh/category/news.mdx

@@ -1,6 +1,6 @@
 ---
 slug: news
 name: 新闻
-description: 最新新闻
+description: 最新新闻和更新
 locale: zh
 ---

content/zh/category/product.mdx

@@ -0,0 +1,6 @@
+---
+slug: product
+name: 产品
+description: 产品和服务
+locale: zh
+---

messages/en.json

@@ -41,14 +41,14 @@
     "forgotPassword": {
       "title": "Forgot Password",
       "email": "Email",
-      "send": "Send",
+      "send": "Send reset link",
       "backToLogin": "Back to login",
       "checkEmail": "Please check your email inbox"
     },
     "resetPassword": {
       "title": "Reset Password",
       "password": "Password",
-      "reset": "Reset",
+      "reset": "Reset password",
       "backToLogin": "Back to login"
     },
     "error": {
@@ -60,6 +60,7 @@
   },
   "BlogPage": {
     "title": "Blog",
+    "subtitle": "Latest news and updates from our team",
     "categories": {
       "all": "All",
       "news": "News",

messages/zh.json

@@ -41,14 +41,14 @@
     "forgotPassword": {
       "title": "忘记密码",
       "email": "邮箱",
-      "send": "发送",
+      "send": "发送重置密码链接",
       "backToLogin": "返回登录",
       "checkEmail": "请检查您的邮箱"
     },
     "resetPassword": {
       "title": "重置密码",
       "password": "密码",
-      "reset": "重置",
+      "reset": "重置密码",
       "backToLogin": "返回登录"
     },
     "error": {
@@ -60,6 +60,7 @@
   },
   "BlogPage": {
     "title": "博客",
+    "subtitle": "来自我们的团队最新新闻和更新",
     "categories": {
       "all": "全部",
       "news": "新闻",

src/app/[locale]/(marketing)/blog/(blog)/layout.tsx

@@ -3,20 +3,21 @@ import Container from '@/components/container';
 import { HeaderSection } from '@/components/shared/header-section';
 import { PropsWithChildren } from 'react';
 import { allCategories } from 'content-collections';
+import { getTranslations } from 'next-intl/server';
+import { NextPageProps } from '@/types/next-page-props';
 
-interface BlogListLayoutProps extends PropsWithChildren {
-  params: {
-    locale: string;
-  };
-}
+interface BlogListLayoutProps extends PropsWithChildren, NextPageProps {}
 
 export default async function BlogListLayout({ 
   children,
   params 
 }: BlogListLayoutProps) {
-  const { locale } = params;
+  const resolvedParams = await params;
+  const { locale } = resolvedParams;
+  const t = await getTranslations("BlogPage");
   
   // Filter categories by locale
+  // console.log("allCategories", allCategories);
   const categoryList = allCategories.filter(
     category => category.locale === locale
   );
@@ -26,8 +27,8 @@ export default async function BlogListLayout({
       <div className="mt-8 w-full flex flex-col items-center justify-center gap-8">
         <HeaderSection
           titleAs="h2"
-          title="MkSaaS Blog"
-          subtitle="Read our latest blog posts about MkSaaS"
+          title={t("title")}
+          subtitle={t("subtitle")}
         />
 
         <BlogCategoryFilter categoryList={categoryList} />

src/app/[locale]/(marketing)/blog/[...slug]/page.tsx

@@ -83,7 +83,7 @@ export async function generateMetadata(
 export default async function BlogPostPage(props: NextPageProps) {
   const post = await getBlogPostFromParams(props);
   if (!post) {
-    return notFound();
+    notFound();
   }
 
   const publishDate = post.date;

src/components/auth/auth-card.tsx

@@ -31,7 +31,7 @@ export const AuthCard = ({
   className,
 }: AuthCardProps) => {
   return (
-    <Card className={cn("shadow-none", className)}>
+    <Card className={cn("shadow-sm border border-border", className)}>
       <CardHeader className="items-center">
         <Link href="/" prefetch={false}>
           <Logo className="mb-2" />

src/components/auth/reset-password-form.tsx

@@ -19,7 +19,7 @@ import { ResetPasswordSchema } from "@/lib/schemas";
 import { Routes } from "@/routes";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useTranslations } from "next-intl";
-import { useRouter, useSearchParams } from "next/navigation";
+import { notFound, useRouter, useSearchParams } from "next/navigation";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
 import type * as z from "zod";
@@ -28,8 +28,7 @@ export const ResetPasswordForm = () => {
   const searchParams = useSearchParams();
   const token = searchParams.get("token");
   if (!token) {
-    // TODO: Handle the error
-    return <div>Invalid token</div>;
+    notFound();
   }
 
   const router = useRouter();

src/components/marketing/navbar-mobile.tsx

@@ -108,7 +108,7 @@ interface MainMobileMenuProps {
 function MainMobileMenu({ onLinkClicked }: MainMobileMenuProps) {
   const [expanded, setExpanded] = React.useState<Record<string, boolean>>({});
   return (
-    <div className="fixed inset-0 z-50 mt-[72px] overflow-y-auto bg-background/80 backdrop-blur-md supports-[backdrop-filter]:bg-background/60 animate-in fade-in-0">
+    <div className="fixed inset-0 z-50 mt-[72px] overflow-y-auto bg-background backdrop-blur-md animate-in fade-in-0">
       <div className="flex size-full flex-col items-start space-y-4 p-4">
         {/* action buttons */}
         <div className="flex w-full flex-col gap-2">