Migrate to PNPM and update deps (#52)

Author: nakrovati

.cursor/rules/guidelines.mdc

@@ -6,7 +6,7 @@ alwaysApply: true
 
 ### TypeScript Standards
 - **Strict Mode**: Enable `"strict": true` configuration
-- **Syntax Version**: Prioritize ES2017+ syntax features
+- **Syntax Version**: Prioritize ES2022+ syntax features
 - **Component Definition**: Use arrow functions or `export default function`
 - **Type Import**: Use `import type { }` syntax
 

.github/workflows/deploy.yml

@@ -31,15 +31,24 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@v6
         with:
           fetch-depth: 0
-      - name: Install dependencies
-        run: npm install -g pnpm && pnpm install
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 24
+          cache: "pnpm"
+
       - name: Install dependencies and build
         run: |
           pnpm install --no-frozen-lockfile
           pnpm run build
+
       - name: Install Aliyun OSS CLI
         if: startsWith(github.ref, 'refs/tags/') || github.ref == 'refs/heads/main'
         shell: bash

AGENTS.md

@@ -5,9 +5,9 @@ This document provides development guidelines and rules for AI Agents to ensure
 ## 📋 Project Overview
 
 - **Project Name**: RustFS.com - Official Website
-- **Framework**: Next.js 15.3.4 (App Router, Static Export)
-- **Language**: TypeScript (ES2017+, Strict Mode)
-- **Package Manager**: pnpm (recommended) or npm
+- **Framework**: Next.js 16.1.6 (App Router, Static Export)
+- **Language**: TypeScript (ES2022+, Strict Mode)
+- **Package Manager**: pnpm
 - **Styling**: Tailwind CSS 4 + shadcn/ui
 - **CI/CD**: GitHub Actions → Aliyun OSS
 
@@ -28,8 +28,6 @@ This document provides development guidelines and rules for AI Agents to ensure
 
    ```bash
    pnpm run lint
-   # or
-   npm run lint
    ```
 
 3. **✅ Local Build Test**
@@ -40,25 +38,14 @@ This document provides development guidelines and rules for AI Agents to ensure
 
    # Execute build
    pnpm run build
-   # or
-   npm run build
 
    # Ensure build succeeds without errors
    ```
 
 4. **✅ Dependency Lock File Synchronization**
-
-   - If using `npm install` to update dependencies, must synchronize `pnpm-lock.yaml`:
-
-     ```bash
-     pnpm install
-     ```
-
    - If using `pnpm install` to update dependencies, ensure `pnpm-lock.yaml` is updated
-   - **Important**: CI uses pnpm. If dependencies are updated locally with npm but `pnpm-lock.yaml` is not updated, CI will fail
 
 5. **✅ Build Artifact Verification**
-
    - Ensure `out/` directory is generated
    - Ensure `out/sitemap.xml` is generated (automatically by postbuild script)
    - Check build artifacts are complete
@@ -71,20 +58,18 @@ According to `.github/workflows/deploy.yml`, the CI process includes:
 
 1. **Checkout**: Check out code
 
-2. **Install dependencies**:
+2. **Install pnpm**:
 
-   ```bash
-   npm install -g pnpm && pnpm install
-   ```
+3. **Use Node.js**:
 
-3. **Install dependencies and build**:
+4. **Install dependencies and build**:
 
    ```bash
    pnpm install --no-frozen-lockfile
    pnpm run build
    ```
 
-4. **Deploy**: Deploy to Aliyun OSS
+5. **Deploy**: Deploy to Aliyun OSS
 
 ### Local CI Simulation
 
@@ -95,7 +80,6 @@ Before committing, it's recommended to simulate the complete CI process locally:
 rm -rf node_modules .next out
 
 # 2. Install dependencies (using pnpm, consistent with CI)
-npm install -g pnpm
 pnpm install
 
 # 3. Build project
@@ -147,7 +131,7 @@ Examples:
 
 ```bash
 feat: add contact form with hCaptcha
-fix: update pnpm-lock.yaml after npm dependency changes
+fix: correct button alignment on mobile
 docs: update README with new features
 ```
 
@@ -159,7 +143,6 @@ docs: update README with new features
 
 **Causes**:
 
-- Dependencies updated locally with npm but `pnpm-lock.yaml` not updated
 - `pnpm-lock.yaml` out of sync with `package.json`
 
 **Solution**:

README.md

@@ -8,8 +8,8 @@ RustFS is a high-performance distributed object storage system developed in Rust
 
 ## 🛠️ Tech Stack
 
-- **Framework**: Next.js 15.3.4 (App Router)
-- **Language**: TypeScript (ES2017+, Strict Mode)
+- **Framework**: Next.js 16.1.6 (App Router)
+- **Language**: TypeScript (ES2022+, Strict Mode)
 - **Styling**: Tailwind CSS 4 + shadcn/ui
 - **Icons**: Lucide React
 - **Theme**: next-themes (Dark Mode Support)
@@ -47,26 +47,20 @@ rustfs.com/
 ### Requirements
 
 - Node.js 18+
-- pnpm (recommended) or npm
+- pnpm
 
 ### Install Dependencies
 
 ```bash
-# Using pnpm (recommended)
+# Using
 pnpm install
-
-# Or using npm
-npm install
 ```
 
 ### Development Server
 
 ```bash
 # Start development server
 pnpm dev
-
-# Or using npm
-npm run dev
 ```
 
 Open [http://localhost:3000](http://localhost:3000) to view the result.

components/business/fixed-language-banner.tsx

@@ -2,28 +2,18 @@
 
 import { SITE_CONFIG } from '@/app.config'
 import { X } from 'lucide-react'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 const STORAGE_KEY = 'rustfs-language-banner-dismissed'
 
 export default function FixedLanguageBanner() {
-  const [showBanner, setShowBanner] = useState(false)
-
-  useEffect(() => {
-    // Check if banner was dismissed
-    const dismissed = localStorage.getItem(STORAGE_KEY)
-    if (dismissed) {
-      return
-    }
-
-    // Detect browser language
-    const browserLang = navigator.language.toLowerCase()
-    const isChinese = browserLang.startsWith('zh')
-
-    if (isChinese) {
-      setShowBanner(true)
-    }
-  }, [])
+  const [showBanner, setShowBanner] = useState(() => {
+    if (typeof window === 'undefined') return false
+    
+    const isDismissed = localStorage.getItem(STORAGE_KEY) === 'true'
+    const isChinese = navigator.language.toLowerCase().startsWith('zh')
+    return isChinese && !isDismissed
+  })
 
   const handleDismiss = () => {
     setShowBanner(false)

components/business/home-hero.tsx

@@ -1,9 +1,10 @@
 'use client'
+
 import { WordRotate } from "@/components/magicui/word-rotate";
 import { Globe } from "@/components/ui/globe";
 import type { GitHubMetrics } from "@/lib/github";
 import { useTheme } from "next-themes";
-import { useEffect, useMemo, useState } from "react";
+import { useMemo } from "react";
 import ContactUsButton from "./buttons/contact-us";
 import DownloadLink from "./buttons/download-link";
 import StatsStrip from "./stats-strip";
@@ -17,14 +18,9 @@ interface HomeHeroProps {
 }
 
 export default function HomeHero({ dockerPulls, metrics }: HomeHeroProps) {
-  const { resolvedTheme } = useTheme();
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
+  const { theme } = useTheme();
 
-  const isDark = mounted && resolvedTheme === "dark";
+  const isDark = theme === "dark";
 
   const globeConfig = useMemo(
     () => ({

eslint.config.js

@@ -0,0 +1,22 @@
+import next from "eslint-config-next";
+import nextCoreWebVitals from "eslint-config-next/core-web-vitals";
+import nextTypescript from "eslint-config-next/typescript";
+import nextVitals from "eslint-config-next/core-web-vitals";
+import { defineConfig, globalIgnores } from "eslint/config";
+
+const eslintConfig = defineConfig([
+  ...next,
+  ...nextCoreWebVitals,
+  ...nextTypescript,
+  ...nextVitals,
+  globalIgnores([
+    "node_modules/**",
+    ".next/**",
+    "out/**",
+    "build/**",
+    "next-env.d.ts",
+    "components/ui/**", // shadcn/ui components
+  ]),
+]);
+
+export default eslintConfig;