some changes

This commit is contained in:
Cypro Freelance 2024-07-23 23:32:57 +05:30
parent b22184af49
commit e7f1a86172
7 changed files with 243 additions and 6 deletions

View file

@ -65,6 +65,36 @@ const AdminLogPage = () => {
const [pageTitle, setPageTitle] = useState(""); const [pageTitle, setPageTitle] = useState("");
const [selectedPage, setSelectedPage] = useState<PageEntry | null>(null); const [selectedPage, setSelectedPage] = useState<PageEntry | null>(null);
useEffect(() => {
fetch("/api/mdx/pages")
.then((response) => response.json())
.then((data) => setPages(data))
.catch((error) => console.error("Failed to load pages", error));
}, []);
const createPage = async () => {
setLoading(true);
const slug = pageTitle.toLowerCase().replace(/\s+/g, "-");
const response = await fetch("/api/mdx/pages", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ title: pageTitle, slug, content: "" }),
});
if (response.ok) {
const newPage = await response.json();
setPages([...pages, newPage]);
setPageTitle("");
setOpen(false);
setLoading(false);
} else {
console.error("Failed to create page");
setLoading(false);
}
};
const form = useForm<LogsFormValues>({ const form = useForm<LogsFormValues>({
resolver: zodResolver(logsSchema), resolver: zodResolver(logsSchema),
defaultValues: { defaultValues: {
@ -228,6 +258,71 @@ const AdminLogPage = () => {
</form> </form>
</Form> </Form>
<section className="container mx-auto p-4">
{/* <h1 className="text-3xl font-bold">Changelog Management</h1> */}
<section id="create-page" className="py-16">
<h2 className="text-3xl md:text-4xl font-bold mb-2">
Multi Log Page
</h2>
<Button variant={"secondary"} onClick={() => setOpen(true)}>
Create New Page
</Button>
<Dialog open={open} onOpenChange={setOpen}>
<DialogContent>
<DialogHeader>
<DialogTitle>Enter Page Title</DialogTitle>
</DialogHeader>
<Input
value={pageTitle}
onChange={(e) => setPageTitle(e.target.value)}
placeholder="Page Title"
/>
<DialogFooter>
<Button disabled={loading} onClick={createPage}>
Continue
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
</section>
<section id="pages-list" className="pb-16">
<h2 className="text-3xl md:text-4xl font-bold">Existing Pages</h2>
<p className="mb-4">Total Pages: {pages.length}</p>
<Table className="w-full mt-4 border-muted">
<TableHeader>
<TableRow>
<TableHead className="border-b px-4 py-2">Slug</TableHead>
<TableHead className="border-b px-4 py-2">Actions</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{pages.map((page) => (
<TableRow key={page.slug}>
<TableCell className="border-b px-4 py-2">
<a
href={`/changelogs/${page.slug}`}
className="text-blue-500 underline"
>
{page.slug}
</a>
</TableCell>
<TableCell className="border-b px-4 py-2">
<Button
variant={"outline"}
onClick={() =>
router.push(`/admin/changelogs/${page.slug}`)
}
>
Edit
</Button>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</section>
</section>
{/* Section to list and delete logs */} {/* Section to list and delete logs */}
<section id="logs-list" className="py-16 md:py-24"> <section id="logs-list" className="py-16 md:py-24">
<h2 className="text-3xl md:text-4xl font-bold">Existing Logs</h2> <h2 className="text-3xl md:text-4xl font-bold">Existing Logs</h2>

View file

@ -0,0 +1,40 @@
"use client";
import React, { useEffect, useState } from "react";
import { useRouter } from "next/router";
import ReactMarkdown from "react-markdown";
const Page = ({ params }: { params: { slug: string } }) => {
const { slug } = params;
const [page, setPage] = useState<{ title: string; content: string } | null>(
null
);
useEffect(() => {
fetch(`/api/mdx/pages/${slug}`)
.then((response) => response.json())
.then((data) => setPage(data))
.catch((error) => console.error("Failed to load page", error));
}, [slug]);
if (!page) {
return (
<section id="404error" className="flex-center flex-col wrapper container">
<h1 className="text-3xl md:text-5xl text-center">
<span className="text-red-500">404</span> Page not Found
</h1>
<p className="text-lg mt-3 text-muted-foreground">
Please return back to Home
</p>
</section>
);
}
return (
<section className="container mx-auto p-4">
<h1 className="text-3xl font-bold py-6">{page.title}</h1>
<ReactMarkdown>{page.content}</ReactMarkdown>
</section>
);
};
export default Page;

View file

@ -0,0 +1,54 @@
import { NextApiRequest, NextApiResponse } from "next";
import clientPromise from "@/lib/db";
export async function GET(req: NextApiRequest, res: NextApiResponse) {
const { slug } = req.query;
try {
const client = await clientPromise;
const db = client.db();
const page = await db.collection("pages").findOne({ slug });
if (page) {
res.status(200).json(page);
} else {
res.status(404).json({ error: "Page not found" });
}
} catch (error) {
res.status(500).json({ error: "Failed to load page" });
}
}
export async function PUT(req: NextApiRequest, res: NextApiResponse) {
const { slug } = req.query;
const { title, content } = req.body;
try {
const client = await clientPromise;
const db = client.db();
const result = await db
.collection("pages")
.updateOne({ slug }, { $set: { title, content } });
if (result.matchedCount > 0) {
const updatedPage = await db.collection("pages").findOne({ slug });
res.status(200).json(updatedPage);
} else {
res.status(404).json({ error: "Page not found" });
}
} catch (error) {
res.status(500).json({ error: "Failed to update page" });
}
}
export async function DELETE(req: NextApiRequest, res: NextApiResponse) {
const { slug } = req.query;
try {
const client = await clientPromise;
const db = client.db();
const result = await db.collection("pages").deleteOne({ slug });
if (result.deletedCount > 0) {
res.status(200).json({ message: "Page successfully deleted" });
} else {
res.status(404).json({ error: "Page not found" });
}
} catch (error) {
res.status(500).json({ error: "Failed to delete page" });
}
}

View file

@ -0,0 +1,46 @@
import { NextResponse } from "next/server";
import clientPromise from "@/lib/db";
export async function GET() {
try {
const client = await clientPromise;
const db = client.db();
const pages = await db.collection("pages").find({}).toArray();
return NextResponse.json(pages, { status: 200 });
} catch (error) {
return NextResponse.json(
{ error: "Failed to load pages" },
{ status: 500 }
);
}
}
export async function POST(req: Request) {
try {
const body = await req.json();
const { title, slug, content } = body;
const client = await clientPromise;
const db = client.db();
const result = await db
.collection("pages")
.insertOne({ title, slug, content });
if (result.acknowledged) {
const newPage = await db
.collection("pages")
.findOne({ _id: result.insertedId });
return NextResponse.json(newPage, { status: 201 });
} else {
return NextResponse.json(
{ error: "Failed to create page" },
{ status: 500 }
);
}
} catch (error) {
return NextResponse.json(
{ error: "Failed to create page" },
{ status: 500 }
);
}
}

View file

@ -18,7 +18,7 @@ const TestimonialCard = ({
}: TestimonialCard) => { }: TestimonialCard) => {
return ( return (
<li className="inline-block w-full"> <li className="inline-block w-full">
<div className="bg-[#1c1c1c] mx-auto mb-5 flex w-full cursor-default flex-col gap-4 rounded-2xl px-[30px] py-6 shadow-md transition-all hover:scale-[103%]"> <div className="bg-primary/10 dark:bg-[#1c1c1c] mx-auto mb-5 flex w-full cursor-default flex-col gap-4 rounded-2xl px-[30px] py-6 shadow-md transition-all hover:scale-[103%]">
<div className="flex flex-row items-center gap-3"> <div className="flex flex-row items-center gap-3">
<div> <div>
<Image <Image
@ -31,12 +31,12 @@ const TestimonialCard = ({
</div> </div>
<div className="space-y-1"> <div className="space-y-1">
<div className="flex items-center gap-1"> <div className="flex items-center gap-1">
<div className="small-semibold text-white">{name}</div> <div className="small-semibold dark:text-white">{name}</div>
</div> </div>
<div className="small-regular text-white-800">{role}</div> <div className="text-sm text-muted-foreground">{role}</div>
</div> </div>
</div> </div>
<p className="body-regular text-white">{testimonial}</p> <p className="body-regular dark:text-white">{testimonial}</p>
<div className="hue-rotate-90 text-lg"> <div className="hue-rotate-90 text-lg">
{/* <Image {/* <Image
src="/testimonials/stars.svg" src="/testimonials/stars.svg"

View file

@ -57,7 +57,9 @@ const Footer = () => {
<div className="border-t mb-6 border-gray-300 dark:border-white/30"></div> <div className="border-t mb-6 border-gray-300 dark:border-white/30"></div>
<div className="flex flex-col lg:flex-row justify-between items-center space-y-4 lg:space-y-0 px-4"> <div className="flex flex-col lg:flex-row justify-between items-center space-y-4 lg:space-y-0 px-4">
<span className="text-sm font-light"> <span className="text-sm font-light">
Designed and Developed by{" "} {/* TODO: */}
{/* put tos and pp here instead */}
TOS and PP{" "}
<Link <Link
href={FOOTERLINKS.footerBottom.designedBy.href} href={FOOTERLINKS.footerBottom.designedBy.href}
className="text-primary font-semibold" className="text-primary font-semibold"

View file

@ -65,7 +65,7 @@ const Hero = () => {
</AnimatedGradientText> </AnimatedGradientText>
<main className="text-5xl md:text-6xl font-bold"> <main className="text-5xl md:text-6xl font-bold">
<h1 className="inline custom-title"> <h1 className="inline custom-title">
<span className="bg-gradient-to-r from-[#84F472] to-[#34a102] bg-clip-text text-transparent"> <span className="bg-primary bg-clip-text text-transparent">
Simplify Simplify
</span>{" "} </span>{" "}
your server logic performance your server logic performance