Skip to content

Commit cd11831

Browse files
abhitrueprogrammerabhitrueprogrammer
committed
Added loading.
1 parent 09891d8 commit cd11831

File tree

8 files changed

+72
-35
lines changed

8 files changed

+72
-35
lines changed

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@
5151
"react-dom": "^18.3.0",
5252
"react-dropzone": "^14.2.3",
5353
"react-hot-toast": "^2.4.1",
54+
"react-icons": "^5.3.0",
5455
"tailwind-merge": "^2.5.3",
5556
"tailwindcss-animate": "^1.0.7",
5657
"use-debounce": "^10.0.3",

‎pnpm-lock.yaml

Lines changed: 21 additions & 9 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/app/adminupload/page.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -402,7 +402,7 @@ function Upload() {
402402
}
403403

404404
if (!tag) {
405-
return <div>Loading...</div>;
405+
return <div>.</div>;
406406
}
407407

408408
return (

‎src/app/catalogue/page.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,17 @@
33
import CatalogueContent from "@/components/CatalogueContent";
44
import { Suspense } from "react";
55
import Navbar from "@/components/Navbar";
6-
6+
import { RiLoader2Fill } from "react-icons/ri";
7+
import Loader from "@/components/ui/loader";
78
const Catalogue = () => {
89
return (
910
<>
1011
<Navbar />
11-
<Suspense fallback={<div>Loading catalogue...</div>}>
12+
<Suspense
13+
fallback={
14+
<Loader />
15+
}
16+
>
1217
<CatalogueContent />
1318
</Suspense>
1419
</>

‎src/components/CatalogueContent.tsx

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@ import Card from "./Card";
99
import { extractBracketContent } from "@/util/utils";
1010
import { useRouter } from "next/navigation";
1111
import SearchBar from "./searchbar";
12+
import { RiLoader2Fill } from "react-icons/ri";
13+
import Loader from "./ui/loader";
1214

1315
const cryptr = new Cryptr(
1416
process.env.NEXT_PUBLIC_CRYPTO_SECRET ?? "default_crypto_secret",
@@ -168,7 +170,7 @@ const CatalogueContent = () => {
168170

169171
return (
170172
<div className="min-h-screen px-2 md:p-8">
171-
<div className="mb-4 flex flex-row w-full items-center md:justify-center md:gap-10">
173+
<div className="mb-4 flex w-full flex-row items-center md:justify-center md:gap-10">
172174
<div className="w-[120%] md:w-[576px]">
173175
<SearchBar />
174176
</div>
@@ -187,10 +189,11 @@ const CatalogueContent = () => {
187189

188190
{error && <p className="text-red-500">{error}</p>}
189191
{loading ? (
190-
<p>Loading papers...</p>
192+
<Loader />
193+
191194
) : papers.length > 0 ? (
192195
<>
193-
<div className="mb-4 2xl:mr-4 flex justify-center md:justify-end gap-2">
196+
<div className="mb-4 flex justify-center gap-2 md:justify-end 2xl:mr-4">
194197
<Button variant="outline" onClick={handleSelectAll}>
195198
Select All
196199
</Button>
@@ -205,7 +208,7 @@ const CatalogueContent = () => {
205208
Download All ({selectedPapers.length})
206209
</Button>
207210
</div>
208-
<div className="flex flex-col items-center justify-center md:justify-normal md:flex-row flex-wrap mx-auto gap-10">
211+
<div className="mx-auto flex flex-col flex-wrap items-center justify-center gap-10 md:flex-row md:justify-normal">
209212
{papers.map((paper) => (
210213
<Card
211214
key={paper._id}

‎src/components/Footer.tsx

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,9 @@ import Link from "next/link";
1010

1111
export default function Footer() {
1212
return (
13-
<div className="mx-auto flex flex-col items-center justify-between gap-y-12 pt-12 md:w-full md:flex-row md:px-12">
13+
<div className="mx-auto flex flex-col items-center justify-between gap-y-12 pt-12 lg:w-full lg:flex-row lg:px-12">
1414
<div className="flex items-center">
15-
<h1 className="jost bg-gradient-to-r from-[#562EE7] to-[#FFC6E8] bg-clip-text text-center text-3xl font-bold text-transparent md:text-5xl">
15+
<h1 className="jost bg-gradient-to-r from-[#562EE7] to-[#FFC6E8] bg-clip-text text-center text-3xl font-bold text-transparent lg:text-5xl">
1616
Papers
1717
</h1>
1818
<Separator orientation="vertical" className="mx-3 h-full min-h-20" />
@@ -23,40 +23,40 @@ export default function Footer() {
2323
height={70}
2424
width={70}
2525
/>
26-
<p className="jost text-2xl font-bold md:text-4xl">CodeChef-VIT</p>
26+
<p className="jost text-2xl font-bold lg:text-4xl">CodeChef-VIT</p>
2727
</div>
2828
</div>
2929

30-
<p className="hidden text-xl md:block">Made with Love By Codechef-VIT</p>
30+
<p className="hidden text-xl lg:block">Made with Love By Codechef-VIT</p>
3131
<div className="flex items-center gap-x-8">
32-
<a href="https://www.instagram.com/codechefvit/">
32+
<Link href="https://www.instagram.com/codechefvit/">
3333
<Instagram />
34-
</a>
35-
<a href="https://www.linkedin.com/company/codechefvit/">
34+
</Link>
35+
<Link href="https://www.linkedin.com/company/codechefvit/">
3636
<Linkedin />
37-
</a>
38-
<a href="https://www.youtube.com/@CodeChefVIT">
37+
</Link>
38+
<Link href="https://www.youtube.com/@CodeChefVIT">
3939
<Youtube />
40-
</a>
41-
<a href="https://www.facebook.com/codechefvit/">
40+
</Link>
41+
<Link href="https://www.facebook.com/codechefvit/">
4242
<Image
4343
src={meta_icon}
4444
alt="meta-icon"
4545
height={24}
4646
width={24}
4747
className="dark:hidden"
4848
/>
49-
</a>
49+
</Link>
5050

51-
<a href="https://www.facebook.com/codechefvit/">
51+
<Link href="https://www.facebook.com/codechefvit/">
5252
<Image
5353
src={meta_icon_dark}
5454
alt="meta-icon"
5555
className="hidden dark:block"
5656
height={24}
5757
width={24}
5858
/>
59-
</a>
59+
</Link>
6060
<Link href="https://x.com/codechefvit">
6161
<Image
6262
src={x_twitter_icon}
@@ -77,7 +77,7 @@ export default function Footer() {
7777
/>
7878
</Link>
7979
</div>
80-
<p className="block text-xl md:hidden">Made with Love By Codechef-VIT</p>
80+
<p className="block text-xl lg:hidden">Made with Love By Codechef-VIT</p>
8181
</div>
8282
);
8383
}

‎src/components/Navbar.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ function Navbar() {
99
return (
1010
<div className="flex items-center justify-between px-4 py-6 md:px-12">
1111
<div className="hiddaen w-[20%] md:block">
12-
<a href="https://www.codechefvit.com/">
12+
<a href="https://www.codechefvit.com/" className="inline-block">
1313
<Image
1414
src={ccLogo as HTMLImageElement}
1515
alt="codechef-logo"
@@ -18,9 +18,11 @@ function Navbar() {
1818
/>
1919
</a>
2020
</div>
21-
<Link href="/" className="jost bg-gradient-to-r from-[#562EE7] to-[#FFC6E8] bg-clip-text text-center text-5xl font-bold text-transparent md:w-[60%] md:text-6xl">
22-
Papers
23-
</Link>
21+
<div>
22+
<Link href="/" className="jost bg-gradient-to-r from-[#562EE7] to-[#FFC6E8] bg-clip-text text-center text-5xl font-bold text-transparent md:w-[60%] md:text-6xl">
23+
Papers
24+
</Link>
25+
</div>
2426
<div className="flex items-center justify-end gap-x-2 md:w-[20%]">
2527
<div className="hidden md:block">
2628
<ModeToggle />

‎src/components/ui/loader.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
const Loader = () => {
2+
return (
3+
<div className="m-52 flex justify-center items-center bg-gradient-to-br ">
4+
<div className="relative">
5+
<div className="absolute inset-0 rounded-full bg-gradient-to-r from-white to-transparent opacity-30 animate-ping"></div>
6+
<div className="animate-spin rounded-full h-20 w-20 border-t-4 border-b-4 border-transparent border-t-white border-b-gray-800 shadow-lg"></div>
7+
<div className="absolute inset-4 rounded-full bg-gradient-to-br from-[#262626] to-[#333333] shadow-inner"></div>
8+
<div className="absolute inset-7 rounded-full bg-white shadow-lg animate-pulse"></div>
9+
</div>
10+
</div>
11+
);
12+
};
13+
14+
export default Loader;

0 commit comments

Comments
 (0)