diff --git a/src/slugs/trends/index.tsx b/src/slugs/trends/index.tsx
index b9c8601..33c59c2 100644
--- a/src/slugs/trends/index.tsx
+++ b/src/slugs/trends/index.tsx
@@ -6,12 +6,15 @@ import { PageProps } from '@/pages/package/[...slug]';
 import { TotalDownloads } from '@/components/RecentDownloads';
 import { useCachedSearch } from '@/hooks/useSearch';
 import { DownOutlined } from '@ant-design/icons';
+import useQueryState from '@/hooks/useQueryState';
 
 const MAX_COUNT = 5;
 
-export default function Trends({ manifest: pkg, additionalInfo: needSync, version }: PageProps) {
+export default function Trends({ manifest: pkg }: PageProps) {
   const [search, setSearch] = useState('');
-  const [pkgs, setPkgs] = useState([pkg.name]);
+  const [vs, setVS] = useQueryState<string>('vs', '');
+  const [pkgs, setPkgs] = useState<string[]>(vs ? vs.split(',').slice(0, MAX_COUNT) : [pkg.name]);
+
   const { data: searchResult, isLoading } = useCachedSearch({
     keyword: search,
     page: 1,
@@ -37,8 +40,12 @@ export default function Trends({ manifest: pkg, additionalInfo: needSync, versio
           onSearch={setSearch}
           suffixIcon={suffix}
           placeholder="Please select"
-          defaultValue={pkgs}
-          onChange={setPkgs}
+          loading={isLoading}
+          defaultValue={[pkg.name]}
+          onChange={(v) => {
+            setPkgs(v);
+            setVS(v.join(','));
+          }}
           options={searchResult?.objects.map((object) => ({
             label: (
               <>