From e5357fab3198c83d5bcc4c742463be6f39dc52af Mon Sep 17 00:00:00 2001
From: shinya <kobayashi_shinya@outlook.com>
Date: Sat, 16 Aug 2025 22:55:37 +0800
Subject: [PATCH] feat: add non filter status

---
 src/app/search/page.tsx               | 38 ++++++++++++++++++++++-----
 src/components/SearchResultFilter.tsx | 27 ++++++++++++++-----
 2 files changed, 52 insertions(+), 13 deletions(-)

diff --git a/src/app/search/page.tsx b/src/app/search/page.tsx
index 163b152..8eb2895 100644
--- a/src/app/search/page.tsx
+++ b/src/app/search/page.tsx
@@ -35,17 +35,17 @@ function SearchPageClient() {
   const [searchResults, setSearchResults] = useState<SearchResult[]>([]);
   const [showSuggestions, setShowSuggestions] = useState(false);
   // 过滤器：非聚合与聚合
-  const [filterAll, setFilterAll] = useState<{ source: string; title: string; year: string; yearOrder: 'asc' | 'desc' }>({
+  const [filterAll, setFilterAll] = useState<{ source: string; title: string; year: string; yearOrder: 'none' | 'asc' | 'desc' }>({
     source: 'all',
     title: 'all',
     year: 'all',
-    yearOrder: 'desc',
+    yearOrder: 'none',
   });
-  const [filterAgg, setFilterAgg] = useState<{ source: string; title: string; year: string; yearOrder: 'asc' | 'desc' }>({
+  const [filterAgg, setFilterAgg] = useState<{ source: string; title: string; year: string; yearOrder: 'none' | 'asc' | 'desc' }>({
     source: 'all',
     title: 'all',
     year: 'all',
-    yearOrder: 'desc',
+    yearOrder: 'none',
   });
 
   // 获取默认聚合设置：只读取用户本地设置，默认为 true
@@ -64,7 +64,10 @@ function SearchPageClient() {
   });
 
   // 简化的年份排序：unknown/空值始终在最后
-  const compareYear = (aYear: string, bYear: string, order: 'asc' | 'desc') => {
+  const compareYear = (aYear: string, bYear: string, order: 'none' | 'asc' | 'desc') => {
+    // 如果是无排序状态，返回0（保持原顺序）
+    if (order === 'none') return 0;
+
     // 处理空值和unknown
     const aIsEmpty = !aYear || aYear === 'unknown';
     const bIsEmpty = !bYear || bYear === 'unknown';
@@ -83,16 +86,25 @@ function SearchPageClient() {
   // 聚合后的结果（按标题和年份分组）
   const aggregatedResults = useMemo(() => {
     const map = new Map<string, SearchResult[]>();
+    const keyOrder: string[] = []; // 记录键出现的顺序
+
     searchResults.forEach((item) => {
       // 使用 title + year + type 作为键，year 必然存在，但依然兜底 'unknown'
       const key = `${item.title.replaceAll(' ', '')}-${item.year || 'unknown'
         }-${item.episodes.length === 1 ? 'movie' : 'tv'}`;
       const arr = map.get(key) || [];
+
+      // 如果是新的键，记录其顺序
+      if (arr.length === 0) {
+        keyOrder.push(key);
+      }
+
       arr.push(item);
       map.set(key, arr);
     });
-    // 只进行聚合，不进行排序。排序统一在 filteredAggResults 中完成
-    return Array.from(map.entries());
+
+    // 按出现顺序返回聚合结果
+    return keyOrder.map(key => [key, map.get(key)!] as [string, SearchResult[]]);
   }, [searchResults]);
 
   // 构建筛选选项
@@ -157,6 +169,12 @@ function SearchPageClient() {
       if (year !== 'all' && item.year !== year) return false;
       return true;
     });
+
+    // 如果是无排序状态，直接返回过滤后的原始顺序
+    if (yearOrder === 'none') {
+      return filtered;
+    }
+
     // 简化排序：1. 年份排序，2. 年份相同时精确匹配在前，3. 标题排序
     return filtered.sort((a, b) => {
       // 首先按年份排序
@@ -188,6 +206,12 @@ function SearchPageClient() {
       if (year !== 'all' && gYear !== year) return false;
       return true;
     });
+
+    // 如果是无排序状态，保持按关键字+年份+类型出现的原始顺序
+    if (yearOrder === 'none') {
+      return filtered;
+    }
+
     // 简化排序：1. 年份排序，2. 年份相同时精确匹配在前，3. 标题排序
     return filtered.sort((a, b) => {
       // 首先按年份排序
diff --git a/src/components/SearchResultFilter.tsx b/src/components/SearchResultFilter.tsx
index 56bcf8e..bb4d91a 100644
--- a/src/components/SearchResultFilter.tsx
+++ b/src/components/SearchResultFilter.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { ArrowDownWideNarrow, ArrowUpNarrowWide } from 'lucide-react';
+import { ArrowDownWideNarrow, ArrowUpNarrowWide, ArrowUpDown } from 'lucide-react';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 
@@ -27,7 +27,7 @@ const DEFAULTS: Record<SearchFilterKey, string> = {
   source: 'all',
   title: 'all',
   year: 'all',
-  yearOrder: 'desc',
+  yearOrder: 'none',
 };
 
 const SearchResultFilter: React.FC<SearchResultFilterProps> = ({ categories, values, onChange }) => {
@@ -171,17 +171,32 @@ const SearchResultFilter: React.FC<SearchResultFilterProps> = ({ categories, val
         <div className='relative'>
           <button
             onClick={() => {
-              const next = mergedValues.yearOrder === 'desc' ? 'asc' : 'desc';
+              let next;
+              switch (mergedValues.yearOrder) {
+                case 'none':
+                  next = 'desc';
+                  break;
+                case 'desc':
+                  next = 'asc';
+                  break;
+                case 'asc':
+                  next = 'none';
+                  break;
+                default:
+                  next = 'desc';
+              }
               onChange({ ...mergedValues, yearOrder: next });
             }}
-            className={`relative z-10 px-1.5 py-0.5 sm:px-2 sm:py-1 md:px-4 md:py-2 text-xs sm:text-sm font-medium rounded-full transition-all duration-200 whitespace-nowrap ${mergedValues.yearOrder === 'desc'
+            className={`relative z-10 px-1.5 py-0.5 sm:px-2 sm:py-1 md:px-4 md:py-2 text-xs sm:text-sm font-medium rounded-full transition-all duration-200 whitespace-nowrap ${mergedValues.yearOrder === 'none'
               ? 'text-gray-700 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-100 cursor-pointer'
               : 'text-green-600 hover:text-green-700 dark:text-green-400 dark:hover:text-green-300 cursor-pointer'
               }`}
-            aria-label={`按年份${mergedValues.yearOrder === 'desc' ? '降序' : '升序'}排序`}
+            aria-label={`按年份${mergedValues.yearOrder === 'none' ? '排序' : mergedValues.yearOrder === 'desc' ? '降序' : '升序'}排序`}
           >
             <span>年份</span>
-            {mergedValues.yearOrder === 'desc' ? (
+            {mergedValues.yearOrder === 'none' ? (
+              <ArrowUpDown className='inline-block ml-1 w-4 h-4 sm:w-4 sm:h-4' />
+            ) : mergedValues.yearOrder === 'desc' ? (
               <ArrowDownWideNarrow className='inline-block ml-1 w-4 h-4 sm:w-4 sm:h-4' />
             ) : (
               <ArrowUpNarrowWide className='inline-block ml-1 w-4 h-4 sm:w-4 sm:h-4' />