Add comment functionality.

This commit is contained in:
2025-05-13 17:11:48 +08:00
parent 545432b4f1
commit 0dd2143664
16 changed files with 406 additions and 53 deletions

View File

@@ -4,7 +4,7 @@ export default function Loading() {
const {t} = useTranslation();
return <div className={"flex justify-center py-4"}>
<span className="loading loading-spinner loading-lg mr-2"></span>
<span className="loading loading-spinner progress-primary loading-lg mr-2"></span>
<span>{t("Loading")}</span>
</div>;
}

View File

@@ -5,6 +5,7 @@ import {useEffect, useState} from "react";
import {MdOutlinePerson, MdSearch, MdSettings} from "react-icons/md";
import { useTranslation } from "react-i18next";
import UploadingSideBar from "./uploading_side_bar.tsx";
import {IoLogoGithub} from "react-icons/io";
export default function Navigator() {
const outlet = useOutlet()
@@ -29,6 +30,11 @@ export default function Navigator() {
<MdSettings size={24}/>
</button>
}
<button className={"btn btn-circle btn-ghost"} onClick={() => {
window.open("https://github.com/wgh136/nysoure", "_blank");
}}>
<IoLogoGithub size={24}/>
</button>
{
app.isLoggedIn() ? <UserButton/> : <button className={"btn btn-primary btn-square btn-soft"} onClick={() => {
navigate("/login");

View File

@@ -1,36 +1,48 @@
import { ReactNode } from "react";
import { MdChevronLeft, MdChevronRight } from "react-icons/md";
import {ReactNode} from "react";
import {MdChevronLeft, MdChevronRight} from "react-icons/md";
export default function Pagination({ page, setPage, totalPages }: { page: number, setPage: (page: number) => void, totalPages: number }) {
const items: ReactNode[] = [];
export default function Pagination({page, setPage, totalPages}: {
page: number,
setPage: (page: number) => void,
totalPages: number
}) {
const items: ReactNode[] = [];
if (page > 1) {
items.push(<button className="join-item btn" onClick={() => setPage(1)}>1</button>);
}
if (page - 2 > 1) {
items.push(<button className="join-item btn">...</button>);
}
if (page-1 > 1) {
items.push(<button className="join-item btn" onClick={() => setPage(page-1)}>{page-1}</button>);
}
items.push(<button className="join-item btn btn-active">{page}</button>);
if (page+1 < totalPages) {
items.push(<button className="join-item btn" onClick={() => setPage(page+1)}>{page+1}</button>);
}
if (page+2 < totalPages) {
items.push(<button className="join-item btn">...</button>);
}
if (page < totalPages) {
items.push(<button className="join-item btn" onClick={() => setPage(totalPages)}>{totalPages}</button>);
}
if (page > 1) {
items.push(<button className="join-item btn" onClick={() => setPage(1)}>1</button>);
}
if (page - 2 > 1) {
items.push(<button className="join-item btn">...</button>);
}
if (page - 1 > 1) {
items.push(<button className="join-item btn" onClick={() => setPage(page - 1)}>{page - 1}</button>);
}
items.push(<button className="join-item btn btn-active">{page}</button>);
if (page + 1 < totalPages) {
items.push(<button className="join-item btn" onClick={() => setPage(page + 1)}>{page + 1}</button>);
}
if (page + 2 < totalPages) {
items.push(<button className="join-item btn">...</button>);
}
if (page < totalPages) {
items.push(<button className="join-item btn" onClick={() => setPage(totalPages)}>{totalPages}</button>);
}
return <div className="join">
<button className={`join-item btn ${page === 1 && "btn-disabled"}`} onClick={() => setPage(page-1)}>
<MdChevronLeft size={20} className="opacity-50"/>
</button>
{items}
<button className={`join-item btn ${page === totalPages && "btn-disabled"}`} onClick={() => setPage(page+1)}>
<MdChevronRight size={20} className="opacity-50"/>
</button>
</div>
return <div className="join shadow rounded-field">
<button className={`join-item btn`} onClick={() => {
if (page > 1) {
setPage(page - 1);
}
}}>
<MdChevronLeft size={20} className="opacity-50"/>
</button>
{items}
<button className={`join-item btn`} onClick={() => {
if (page < totalPages) {
setPage(page + 1);
}
}}>
<MdChevronRight size={20} className="opacity-50"/>
</button>
</div>
}