Skip to content

Commit a0c67ea

Browse files
committed
Fixed the bug with the transparency of the version list, changed the overall page routing and API interface structure by adding namespaces to the routes. Implemented pagination for search results
1 parent 26b5aac commit a0c67ea

File tree

9 files changed

+111
-161
lines changed

9 files changed

+111
-161
lines changed

app/api/crates/[cratename]/[version]/dependencies/route.tsx renamed to app/api/crates/[nsfront]/[nsbehind]/[cratename]/[version]/dependencies/route.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
type Params = Promise<{ cratename: string, version: string }>
2-
import { NextRequest, NextResponse } from "next/server";
31

2+
import { NextRequest, NextResponse } from "next/server";
3+
type Params = Promise<{ nsfront: string, nsbehind: string, cratename: string, version: string }>
44
export async function GET(req: NextRequest, props: { params: Params }) {
55
try {
66
const params = await props.params
7-
const { cratename, version } = params;
7+
const { nsfront, nsbehind, cratename, version } = params;
88

9-
const externalApiUrl = `http://210.28.134.203:6888/api/crates/${cratename}/${version}/dependencies`; // 替换为你的外部 API URL
9+
const externalApiUrl = `http://210.28.134.203:6888/api/crates/${nsfront}/${nsbehind}/${cratename}/${version}/dependencies`; // 替换为你的外部 API URL
1010
const externalRes = await fetch(externalApiUrl);
1111
if (!externalRes.ok) {
1212
throw new Error('Failed to fetch external data');

app/api/crates/[cratename]/[version]/dependents/route.tsx renamed to app/api/crates/[nsfront]/[nsbehind]/[cratename]/[version]/dependents/route.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import { NextRequest, NextResponse } from "next/server";
2-
type Params = Promise<{ cratename: string, version: string }>
2+
type Params = Promise<{ nsfront: string, nsbehind: string, cratename: string, version: string }>
33
export async function GET(req: NextRequest, props: { params: Params }) {
44
try {
55
const params = await props.params
6-
const { cratename, version } = params;
7-
const externalApiUrl = `http://210.28.134.203:6888/api/crates/${cratename}/${version}/dependents`; // 替换为你的外部 API URL
6+
const { nsfront, nsbehind, cratename, version } = params;
7+
const externalApiUrl = `http://210.28.134.203:6888/api/crates/${nsfront}/${nsbehind}/${cratename}/${version}/dependents`; // 替换为你的外部 API URL
88
const externalRes = await fetch(externalApiUrl);
99
if (!externalRes.ok) {
1010
throw new Error('Failed to fetch external data');

app/api/crates/[cratename]/[version]/route.tsx renamed to app/api/crates/[nsfront]/[nsbehind]/[cratename]/[version]/route.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import { NextRequest, NextResponse } from "next/server";
2-
type Params = Promise<{ cratename: string, version: string }>
2+
type Params = Promise<{ nsfront: string, nsbehind: string, cratename: string, version: string }>
33

44
export async function GET(req: NextRequest, props: { params: Params }) {
55
try {
66
const params = await props.params
7-
const { cratename, version } = params;
7+
const { nsfront, nsbehind, cratename, version } = params;
88

9-
const externalApiUrl = `http://210.28.134.203:6888/api/crates/${cratename}/${version}`; // 替换为你的外部 API URL
9+
const externalApiUrl = `http://210.28.134.203:6888/api/crates/${nsfront}/${nsbehind}/${cratename}/${version}`; // 替换为你的外部 API URL
1010
const externalRes = await fetch(externalApiUrl);
1111
if (!externalRes.ok) {
1212
throw new Error('Failed to fetch external data');

app/homepage/[name]/[version]/dependencies/page.tsx renamed to app/homepage/[nsfront]/[nsbehind]/[name]/[version]/dependencies/page.tsx

Lines changed: 14 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,27 @@
11
"use client";
22
import React, { useEffect, useState } from 'react';
3-
3+
import { useParams } from 'next/navigation'
44
import Link from 'next/link';
5-
import DependencyTable from '../../../../../components/DependencyTable';
5+
import DependencyTable from '../../../../../../../components/DependencyTable';
66
import { dependenciesInfo } from '@/app/lib/all_interface';
7-
import { useSearchParams } from 'next/navigation';
8-
9-
// const defaultdata = {
10-
// "direct_count": 1,
11-
// "indirect_count": 2,
12-
// "data": [
13-
// {
14-
// "crate_name": 'unknown',
15-
// "version": 'unknown',
16-
// "relation": 'unknown',
17-
// "license": 'unknown',
18-
// "dependencies": 0,
19-
// },
20-
// ]
21-
// }
22-
23-
24-
// interface DependencyItem {
25-
// crate_name: string;
26-
// version: string;
27-
// relation: string;
28-
// license: string;
29-
// dependencies: number;
30-
// }
31-
32-
337

348
const CratePage = () => {
35-
9+
const params = useParams();
3610

3711
const [results, setResults] = useState<dependenciesInfo | null>(null);
3812
const [searchQuery, setSearchQuery] = useState('');
3913

4014
const [loading, setLoading] = useState(true);
4115
const [error, setError] = useState(null);
42-
const searchParams = useSearchParams();
4316

44-
const crateName = searchParams.get('crate_name'); // 从 URL 中获取 crate_name 参数
45-
const version = searchParams.get('version'); // 从 URL 中获取 version 参数
17+
const crateName = params.name; // 从 URL 中获取 crate_name 参数
18+
const version = params.version; // 从 URL 中获取 version 参数
4619

4720
useEffect(() => {
4821
const fetchCrateData = async () => {
4922
try {
5023
setError(null);
51-
const response = await fetch(`/api/crates/${crateName}/${version}/dependencies`);
24+
const response = await fetch(`/api/crates/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}/dependencies`);
5225

5326
if (!response.ok) {
5427
throw new Error(`HTTP error! status: ${response.status}`);
@@ -66,11 +39,11 @@ const CratePage = () => {
6639
}
6740
};
6841
fetchCrateData(); // 调用函数来获取数据
69-
}, [crateName, version]); // 依赖项数组,确保在 crateName 或 version 改变时重新获取数据
42+
}, [params.name, params.version, params.nsfront, params.nsbehind]); // 依赖项数组,确保在 crateName 或 version 改变时重新获取数据
7043

7144
if (loading) return <div>Loading...</div>;
7245
if (error) return <div className="text-red-500">Error: {error}</div>;
73-
console.log('dependencyyyyyyyyyyyyyyy', results?.data);
46+
// console.log('dependencyyyyyyyyyyyyyyy', results?.data);
7447
return (
7548
<div>
7649
{/* Existing header and search */}
@@ -130,39 +103,24 @@ const CratePage = () => {
130103
<nav className="mt-4">
131104
<ul className="flex space-x-4 text-gray-500 relative">
132105
<li className="cursor-pointer relative">
133-
<Link href={{
134-
pathname: `/homepage/${crateName}/${version}`,
135-
query: {
136-
crate_name: crateName,
137-
version: version,
138-
},
139-
}}>
106+
<Link
107+
href={`/homepage/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}`}
108+
>
140109
<div className="block py-2 relative z-10">Overview</div>
141110
</Link>
142111
</li>
143112
<li className="cursor-pointer relative">
144113
<Link
145-
href={{
146-
pathname: `/homepage/${crateName}/${version}/dependencies`,
147-
query: {
148-
crate_name: crateName,
149-
version: version,
150-
},
151-
}}
114+
href={
115+
`/homepage/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}/dependencies`}
152116
>
153117
<div className="block py-2 relative z-10">Dependencies</div>
154118
</Link>
155119
<div className="absolute bottom-0 left-0 w-full h-1 bg-blue-500"></div>
156120
</li>
157121

158122
<Link
159-
href={{
160-
pathname: `/homepage/${crateName}/${version}/dependents`,
161-
query: {
162-
crate_name: crateName,
163-
version: version,
164-
},
165-
}}
123+
href={`/homepage/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}/dependents`}
166124
>
167125
<li className="cursor-pointer relative">
168126
<div className="block py-2 relative z-10">Dependents</div>

app/homepage/[name]/[version]/dependents/page.tsx renamed to app/homepage/[nsfront]/[nsbehind]/[name]/[version]/dependents/page.tsx

Lines changed: 15 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
11
"use client";
22
import React, { useEffect, useState } from 'react';
33
import Link from 'next/link';
4-
import DependentTable from '../../../../../components/DependentTable';
5-
import { useSearchParams } from 'next/navigation';
4+
import DependentTable from '../../../../../../../components/DependentTable';
65
import { dependentsInfo } from '@/app/lib/all_interface';
7-
6+
import { useParams } from 'next/navigation';
87

98

109
const CratePage = () => {
1110
const [results, setResults] = useState<dependentsInfo | null>(null);
1211
const [loading, setLoading] = useState(true);
1312
const [error, setError] = useState(null);
1413

15-
const searchParams = useSearchParams();
16-
const crateName = searchParams.get('crate_name'); // 从 URL 中获取 crate_name 参数
17-
const version = searchParams.get('version'); // 从 URL 中获取 version 参数
14+
const params = useParams();
15+
16+
const crateName = params.name; // 从 URL 中获取 crate_name 参数
17+
const version = params.version; // 从 URL 中获取 version 参数
1818

1919
useEffect(() => {
2020
const fetchCrateData = async () => {
2121
try {
22-
const response = await fetch(`/api/crates/${crateName}/${version}/dependents`);
22+
const response = await fetch(`/api/crates/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}/dependents`);
2323

2424
if (!response.ok) {
2525
throw new Error(`HTTP error! status: ${response.status}`);
@@ -38,12 +38,12 @@ const CratePage = () => {
3838
}
3939
};
4040
fetchCrateData(); // 调用函数来获取数据
41-
}, [crateName, version]); // 依赖项数组,确保在 crateName 或 version 改变时重新获取数据
41+
}, [params.name, params.version, params.nsfront, params.nsbehind]); // 依赖项数组,确保在 crateName 或 version 改变时重新获取数据
4242

4343
if (loading) return <div>Loading...</div>;
4444
if (error) return <div className="text-red-500">Error: {error}</div>;
4545

46-
console.log('dependencyyyyyyyyyyyyyyy', results?.data);
46+
//console.log('dependencyyyyyyyyyyyyyyy', results?.data);
4747

4848
return (
4949
<div>
@@ -97,45 +97,29 @@ const CratePage = () => {
9797
<nav className="mt-4">
9898
<ul className="flex space-x-4 text-gray-500 relative">
9999
<li className="cursor-pointer relative">
100-
<Link href={{
101-
pathname: `/homepage/${crateName}/${version}`,
102-
query: {
103-
crate_name: crateName,
104-
version: version,
105-
},
106-
}}>
100+
<Link
101+
href={`/homepage/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}`}
102+
>
107103
<div className="block py-2 relative z-10">Overview</div>
108104
</Link>
109105

110106
</li>
111107
<li className="cursor-pointer relative">
112108
<Link
113-
href={{
114-
pathname: `/homepage/${crateName}/${version}/dependencies`,
115-
query: {
116-
crate_name: crateName,
117-
version: version,
118-
},
119-
}}
109+
href={
110+
`/homepage/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}/dependencies`}
120111
>
121112
<div className="block py-2 relative z-10">Dependencies</div>
122113
</Link>
123114
</li>
124115

125116
<Link
126-
href={{
127-
pathname: `/homepage/${crateName}/${version}/dependents`,
128-
query: {
129-
crate_name: crateName,
130-
version: version,
131-
},
132-
}}
117+
href={`/homepage/${params.nsfront}/${params.nsbehind}/${params.name}/${params.version}/dependents`}
133118
>
134119
<li className="cursor-pointer relative">
135120
<div className="block py-2 relative z-10">Dependents</div>
136121
<div className="absolute bottom-0 left-0 w-full h-1 bg-blue-500"></div>
137122
</li>
138-
139123
</Link>
140124
{/* <li className="cursor-pointer relative">
141125
<a href="#" className="block py-2 relative z-10">Compare</a>

0 commit comments

Comments
 (0)