Skip to content

Commit 39c7081

Browse files
abhitrueprogrammerabhitrueprogrammer
committed
added ssr and metadata
1 parent b144de4 commit 39c7081

File tree

2 files changed

+172
-163
lines changed

2 files changed

+172
-163
lines changed

‎src/app/paper/[id]/backup.tsx

Lines changed: 145 additions & 146 deletions
Original file line numberDiff line numberDiff line change
@@ -1,157 +1,156 @@
1-
"use client";
2-
import { useState, useEffect } from "react";
3-
import axios, { type AxiosResponse } from "axios";
4-
import Footer from "@/components/Footer";
5-
import Navbar from "@/components/Navbar";
6-
import { Download, Eye, Maximize } from "lucide-react";
7-
import { useRouter } from "next/navigation";
8-
import { Worker } from "@react-pdf-viewer/core";
9-
import { Viewer } from "@react-pdf-viewer/core";
10-
import {
11-
zoomPlugin,
12-
ZoomInIcon,
13-
ZoomOutIcon,
14-
type RenderZoomOutProps,
15-
type RenderZoomInProps,
16-
type RenderCurrentScaleProps,
17-
} from "@react-pdf-viewer/zoom";
18-
import { getFilePlugin } from "@react-pdf-viewer/get-file";
1+
// "use client";
2+
// import { useState, useEffect } from "react";
3+
// import axios, { type AxiosResponse } from "axios";
4+
// import Footer from "@/components/Footer";
5+
// import Navbar from "@/components/Navbar";
6+
// import { Download, Eye, Maximize } from "lucide-react";
7+
// import { useRouter } from "next/navigation";
8+
// import { Worker } from "@react-pdf-viewer/core";
9+
// import { Viewer } from "@react-pdf-viewer/core";
10+
// import {
11+
// zoomPlugin,
12+
// ZoomInIcon,
13+
// ZoomOutIcon,
14+
// type RenderZoomOutProps,
15+
// type RenderZoomInProps,
16+
// type RenderCurrentScaleProps,
17+
// } from "@react-pdf-viewer/zoom";
18+
// import { getFilePlugin } from "@react-pdf-viewer/get-file";
1919

20-
import {
21-
fullScreenPlugin,
22-
type RenderEnterFullScreenProps,
23-
} from "@react-pdf-viewer/full-screen";
20+
// import {
21+
// fullScreenPlugin,
22+
// type RenderEnterFullScreenProps,
23+
// } from "@react-pdf-viewer/full-screen";
2424

25-
import "@react-pdf-viewer/full-screen/lib/styles/index.css";
26-
import "@react-pdf-viewer/core/lib/styles/index.css";
27-
import "@react-pdf-viewer/zoom/lib/styles/index.css";
28-
import Loader from "@/components/ui/loader";
29-
import Link from "next/link";
30-
import { PaperResponse } from "@/interface";
31-
import { fetchPaperID } from "@/app/actions/get-papers-by-id";
25+
// import "@react-pdf-viewer/full-screen/lib/styles/index.css";
26+
// import "@react-pdf-viewer/core/lib/styles/index.css";
27+
// import "@react-pdf-viewer/zoom/lib/styles/index.css";
28+
// import Loader from "@/components/ui/loader";
29+
// import Link from "next/link";
30+
// import { PaperResponse } from "@/interface";
31+
// import { fetchPaperID } from "@/app/actions/get-papers-by-id";
3232

33-
interface ErrorResponse {
34-
message: string;
35-
}
33+
// interface ErrorResponse {
34+
// message: string;
35+
// }
3636

37-
interface Params {
38-
params: { id: string };
39-
}
37+
// interface Params {
38+
// params: { id: string };
39+
// }
4040

41-
export default function PaperPage({ params }: Params) {
42-
const [paper, setPaper] = useState<PaperResponse | null>(null);
43-
const [error, setError] = useState<string | null>(null);
44-
const router = useRouter();
45-
const getFilePluginInstance = getFilePlugin();
46-
const zoomPluginInstance = zoomPlugin();
47-
const { CurrentScale, ZoomIn, ZoomOut } = zoomPluginInstance;
48-
const fullScreenPluginInstance = fullScreenPlugin();
49-
const EnterFullScreen = fullScreenPluginInstance.EnterFullScreen.bind(
50-
fullScreenPluginInstance,
51-
);
41+
// export default function PaperPage({ params }: Params) {
42+
// const [paper, setPaper] = useState<PaperResponse | null>(null);
43+
// const [error, setError] = useState<string | null>(null);
44+
// const router = useRouter();
45+
// const getFilePluginInstance = getFilePlugin();
46+
// const zoomPluginInstance = zoomPlugin();
47+
// const { CurrentScale, ZoomIn, ZoomOut } = zoomPluginInstance;
48+
// const fullScreenPluginInstance = fullScreenPlugin();
49+
// const EnterFullScreen = fullScreenPluginInstance.EnterFullScreen.bind(
50+
// fullScreenPluginInstance,
51+
// );
5252

53-
useEffect(() => {pag
54-
try {
55-
const response = await fetchPaperID(params.id)
56-
// const response: AxiosResponse<PaperResponse> = await axios.get(
57-
// `/api/paper-by-id/${params.id}`,
58-
// );
59-
if(response)
60-
{
61-
setPaper(response);
62-
}
63-
} catch (err: unknown) {
64-
if (axios.isAxiosError(err)) {
65-
const errorResponse = err.response as AxiosResponse<ErrorResponse>;
66-
if (errorResponse?.status === 400 || errorResponse?.status === 404) {
67-
router.push("/");
68-
} else {
69-
setError(errorResponse?.data?.message ?? "Failed to fetch paper");
70-
}
71-
} else {
72-
throw(err)
73-
// setError("An unknown error occurred");
74-
}
75-
}
76-
};
53+
// useEffect(() => {pag
54+
// try {
55+
// const response = await fetchPaperID(params.id)
56+
// // const response: AxiosResponse<PaperResponse> = await axios.get(
57+
// // `/api/paper-by-id/${params.id}`,
58+
// // );
59+
// if(response)
60+
// {
61+
// setPaper(response);
62+
// }
63+
// } catch (err: unknown) {
64+
// if (axios.isAxiosError(err)) {
65+
// const errorResponse = err.response as AxiosResponse<ErrorResponse>;
66+
// if (errorResponse?.status === 400 || errorResponse?.status === 404) {
67+
// router.push("/");
68+
// } else {
69+
// setError(errorResponse?.data?.message ?? "Failed to fetch paper");
70+
// }
71+
// } else {
72+
// throw(err)
73+
// // setError("An unknown error occurred");
74+
// }
75+
// }
76+
// };
7777

78-
if (params.id) {
79-
void fetchPaper();
80-
}
81-
}, [params.id, router]);
78+
// if (params.id) {
79+
// void fetchPaper();
80+
// }
81+
// }, [params.id, router]);
8282

83-
if (error) {
84-
return <div>Error: {error}</div>;
85-
}
83+
// if (error) {
84+
// return <div>Error: {error}</div>;
85+
// }
8686

87-
if (!paper) {
88-
return <Loader prop="h-screen w-screen" />;
89-
}
87+
// if (!paper) {
88+
// return <Loader prop="h-screen w-screen" />;
89+
// }
9090

91-
return (
92-
<div>
93-
<Navbar />
94-
<div className="flex flex-col items-center justify-center">
95-
<h1 className="jost mb-4 text-center text-2xl font-semibold md:mb-10 md:text-3xl">
96-
{paper.subject} {paper.exam} {paper.slot} {paper.year}
97-
</h1>
98-
<div className="flex w-[95%] items-center justify-between bg-gray-900 px-4 py-4 md:w-[80%]">
99-
<div className="flex gap-x-4">
100-
<ZoomOut>
101-
{(props: RenderZoomOutProps) => (
102-
<button onClick={props.onClick}>
103-
<ZoomOutIcon />
104-
</button>
105-
)}
106-
</ZoomOut>
107-
<CurrentScale>
108-
{(props: RenderCurrentScaleProps) => (
109-
<>{`${Math.round(props.scale * 100)}%`}</>
110-
)}
111-
</CurrentScale>
112-
<ZoomIn>
113-
{(props: RenderZoomInProps) => (
114-
<button onClick={props.onClick}>
115-
<ZoomInIcon />
116-
</button>
117-
)}
118-
</ZoomIn>
119-
</div>
120-
<div className="hidden gap-x-4 md:flex md:items-center">
121-
<getFilePluginInstance.Download>
122-
{(props) => (
123-
<button className="" onClick={props.onClick}>
124-
<Download />
125-
</button>
126-
)}
127-
</getFilePluginInstance.Download>
128-
<EnterFullScreen>
129-
{(props: RenderEnterFullScreenProps) => (
130-
<button onClick={() => props.onClick()}>
131-
<Maximize />
132-
</button>
133-
)}
134-
</EnterFullScreen>
135-
</div>
136-
<Link className="flex md:hidden" href={paper.finalUrl}>
137-
<Download />
138-
</Link>
139-
</div>
91+
// return (
92+
// <div>
93+
// <Navbar />
94+
// <div className="flex flex-col items-center justify-center">
95+
// <h1 className="jost mb-4 text-center text-2xl font-semibold md:mb-10 md:text-3xl">
96+
// {paper.subject} {paper.exam} {paper.slot} {paper.year}
97+
// </h1>
98+
// <div className="flex w-[95%] items-center justify-between bg-gray-900 px-4 py-4 md:w-[80%]">
99+
// <div className="flex gap-x-4">
100+
// <ZoomOut>
101+
// {(props: RenderZoomOutProps) => (
102+
// <button onClick={props.onClick}>
103+
// <ZoomOutIcon />
104+
// </button>
105+
// )}
106+
// </ZoomOut>
107+
// <CurrentScale>
108+
// {(props: RenderCurrentScaleProps) => (
109+
// <>{`${Math.round(props.scale * 100)}%`}</>
110+
// )}
111+
// </CurrentScale>
112+
// <ZoomIn>
113+
// {(props: RenderZoomInProps) => (
114+
// <button onClick={props.onClick}>
115+
// <ZoomInIcon />
116+
// </button>
117+
// )}
118+
// </ZoomIn>
119+
// </div>
120+
// <div className="hidden gap-x-4 md:flex md:items-center">
121+
// <getFilePluginInstance.Download>
122+
// {(props) => (
123+
// <button className="" onClick={props.onClick}>
124+
// <Download />
125+
// </button>
126+
// )}
127+
// </getFilePluginInstance.Download>
128+
// <EnterFullScreen>
129+
// {(props: RenderEnterFullScreenProps) => (
130+
// <button onClick={() => props.onClick()}>
131+
// <Maximize />
132+
// </button>
133+
// )}
134+
// </EnterFullScreen>
135+
// </div>
136+
// <Link className="flex md:hidden" href={paper.finalUrl}>
137+
// <Download />
138+
// </Link>
139+
// </div>
140140

141-
<Worker workerUrl="https://unpkg.com/[email protected]/build/pdf.worker.min.js">
142-
<div className="border-1 w-[95%] overflow-x-hidden md:w-[80%]">
143-
<Viewer
144-
fileUrl={paper.finalUrl}
145-
plugins={[
146-
zoomPluginInstance,
147-
getFilePluginInstance,
148-
fullScreenPluginInstance,
149-
]}
150-
/>
151-
</div>
152-
</Worker>
153-
</div>
154-
<Footer />
155-
</div>
156-
);
157-
}
141+
// <Worker workerUrl="https://unpkg.com/[email protected]/build/pdf.worker.min.js">
142+
// <div className="border-1 w-[95%] overflow-x-hidden md:w-[80%]">
143+
// <Viewer
144+
// fileUrl={paper.finalUrl}
145+
// plugins={[
146+
// zoomPluginInstance,
147+
// getFilePluginInstance,
148+
// fullScreenPluginInstance,
149+
// ]}
150+
// />
151+
// </div>
152+
// </Worker>
153+
// </div>
154+
// <Footer />
155+
// </div>
156+
// );

‎src/app/paper/[id]/page.tsx

Lines changed: 27 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -3,35 +3,45 @@ import Footer from "@/components/Footer";
33
import Navbar from "@/components/Navbar";
44
import PdfViewer from "@/components/pdfViewer";
55
import Loader from "@/components/ui/loader";
6+
import { PaperResponse } from "@/interface";
7+
import { Metadata } from "next";
8+
export async function generateMetadata({ params }: { params: { id: string } }): Promise<Metadata> {
9+
const paper: PaperResponse | null = await fetchPaperID(params.id);
610

11+
if (paper) {
12+
const subject = paper.subject;
13+
return {
14+
title: `Papers | ${subject}`,
15+
openGraph: {
16+
title: `Papers | ${subject}`,
17+
},
18+
twitter: {
19+
title: `Papers | ${subject}`,
20+
},
21+
};
22+
}
23+
24+
return {
25+
title: "Paper not found",
26+
};
27+
}
728
const PaperPage = async ({ params }: { params: { id: string } }) => {
829
const paper = await fetchPaperID(params.id);
9-
console.log("HIII");
1030

1131
if (!paper) {
1232
return <Loader prop="h-screen w-screen" />;
1333
}
1434
return (
1535
<div>
1636
<Navbar />
17-
<h1 className="jost mb-4 text-center text-2xl font-semibold md:mb-10 md:text-3xl">
18-
{paper.subject} {paper.exam} {paper.slot} {paper.year}
19-
</h1>
20-
<center>
21-
<PdfViewer url={paper.finalUrl}></PdfViewer>
22-
</center>
37+
<h1 className="jost mb-4 text-center text-2xl font-semibold md:mb-10 md:text-3xl">
38+
{paper.subject} {paper.exam} {paper.slot} {paper.year}
39+
</h1>
40+
<center>
41+
<PdfViewer url={paper.finalUrl}></PdfViewer>
42+
</center>
2343
<Footer />
2444
</div>
2545
);
2646
};
2747
export default PaperPage;
28-
{/* <div>
29-
<Navbar />
30-
<div className="flex flex-col items-center justify-center">
31-
<h1 className="jost mb-4 text-center text-2xl font-semibold md:mb-10 md:text-3xl">
32-
{paper.subject} {paper.exam} {paper.slot} {paper.year}
33-
</h1>
34-
<PdfViewer url={paper.finalUrl}></PdfViewer>
35-
</div>
36-
<Footer />
37-
</div> */}

0 commit comments

Comments
 (0)