user details page

This commit is contained in:
2025-05-14 16:48:52 +08:00
parent cbac071dd2
commit 3b7d52a7a8
20 changed files with 450 additions and 64 deletions

View File

@@ -5891,6 +5891,13 @@
"typescript": ">=4.8.4"
}
},
"node_modules/tslib": {
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
"license": "0BSD",
"optional": true
},
"node_modules/turbo-stream": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/turbo-stream/-/turbo-stream-2.4.0.tgz",

View File

@@ -6,9 +6,9 @@ import HomePage from "./pages/home_page.tsx";
import PublishPage from "./pages/publish_page.tsx";
import SearchPage from "./pages/search_page.tsx";
import ResourcePage from "./pages/resource_details_page.tsx";
import "./i18n.ts"
import ManagePage from "./pages/manage_page.tsx";
import TaggedResourcesPage from "./pages/tagged_resources_page.tsx";
import UserPage from "./pages/user_page.tsx";
export default function App() {
return (
@@ -23,6 +23,7 @@ export default function App() {
<Route path={"/resources/:id"} element={<ResourcePage/>}/>
<Route path={"/manage"} element={<ManagePage/>}/>
<Route path={"/tag/:tag"} element={<TaggedResourcesPage/>}/>
<Route path={"/user/:username"} element={<UserPage/>}/>
</Route>
</Routes>
</BrowserRouter>

View File

@@ -74,7 +74,11 @@ function UserButton() {
id={"navi_dropdown_menu"}
tabIndex={0}
className="menu dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow">
<li><a onClick={() => navigate(`/user/${app.user?.id}`)}>{t("My Profile")}</a></li>
<li><a onClick={() => {
navigate(`/user/${app.user?.username}`);
const menu = document.getElementById("navi_dropdown_menu") as HTMLUListElement;
menu.blur();
}}>{t("My Profile")}</a></li>
<li><a onClick={() => {
navigate(`/publish`);
const menu = document.getElementById("navi_dropdown_menu") as HTMLUListElement;

View File

@@ -2,60 +2,60 @@ import React from "react";
import { createRoot } from "react-dom/client";
export default function showPopup(content: React.ReactNode, element: HTMLElement) {
const eRect = element.getBoundingClientRect();
const eRect = element.getBoundingClientRect();
const div = document.createElement("div");
div.style.position = "fixed";
if (eRect.x > window.innerWidth / 2) {
div.style.right = `${window.innerWidth - eRect.x}px`;
} else {
div.style.left = `${eRect.x}px`;
}
if (eRect.y > window.innerHeight / 2) {
div.style.bottom = `${window.innerHeight - eRect.y}px`;
} else {
div.style.top = `${eRect.y}px`;
}
const div = document.createElement("div");
div.style.position = "fixed";
if (eRect.x > window.innerWidth / 2) {
div.style.right = `${window.innerWidth - eRect.x}px`;
} else {
div.style.left = `${eRect.x}px`;
}
if (eRect.y > window.innerHeight / 2) {
div.style.bottom = `${window.innerHeight - eRect.y}px`;
} else {
div.style.top = `${eRect.y}px`;
}
div.style.zIndex = "9999";
div.className = "animate-appearance-in";
div.style.zIndex = "9999";
div.className = "animate-appearance-in";
document.body.appendChild(div);
document.body.appendChild(div);
const mask = document.createElement("div");
const mask = document.createElement("div");
const close = () => {
console.log("close popup");
document.body.removeChild(div);
document.body.removeChild(mask);
};
const close = () => {
console.log("close popup");
document.body.removeChild(div);
document.body.removeChild(mask);
};
mask.style.position = "fixed";
mask.style.top = "0";
mask.style.left = "0";
mask.style.width = "100%";
mask.style.height = "100%";
mask.style.zIndex = "9998";
mask.onclick = close;
document.body.appendChild(mask);
mask.style.position = "fixed";
mask.style.top = "0";
mask.style.left = "0";
mask.style.width = "100%";
mask.style.height = "100%";
mask.style.zIndex = "9998";
mask.onclick = close;
document.body.appendChild(mask);
createRoot(div).render(<context.Provider value={close}>
{content}
</context.Provider>)
createRoot(div).render(<context.Provider value={close}>
{content}
</context.Provider>)
}
const context = React.createContext<() => void>(() => {});
const context = React.createContext<() => void>(() => { });
export function useClosePopup() {
return React.useContext(context);
return React.useContext(context);
}
export function PopupMenuItem({ children, onClick }: { children: React.ReactNode, onClick: () => void }) {
const close = useClosePopup();
return <li onClick={() => {
close();
onClick();
}}>
{children}
</li>
const close = useClosePopup();
return <li onClick={() => {
close();
onClick();
}}>
{children}
</li>
}

View File

@@ -100,3 +100,11 @@ export interface Comment {
created_at: string;
user: User;
}
export interface CommentWithResource {
id: number;
content: string;
created_at: string;
user: User;
resource: Resource;
}

View File

@@ -1,5 +1,5 @@
import axios from 'axios';
import {app} from "../app.ts";
import { app } from "../app.ts";
import {
CreateResourceParams,
RFile,
@@ -12,7 +12,8 @@ import {
UploadingFile,
User,
UserWithToken,
Comment
Comment,
CommentWithResource
} from "./models.ts";
class Network {
@@ -88,6 +89,23 @@ class Network {
}
}
async getUserInfo(username: string): Promise<Response<User>> {
try {
const response = await axios.get(`${this.apiBaseUrl}/user/info`, {
params: {
username
}
})
return response.data
} catch (e: any) {
console.error(e)
return {
success: false,
message: e.toString(),
}
}
}
async changePassword(oldPassword: string, newPassword: string): Promise<Response<UserWithToken>> {
try {
const response = await axios.postForm(`${this.apiBaseUrl}/user/password`, {
@@ -177,7 +195,7 @@ class Network {
async searchUsers(username: string, page: number): Promise<PageResponse<User>> {
try {
const response = await axios.get(`${this.apiBaseUrl}/user/search`, {
params: {
params: {
username,
page
}
@@ -325,6 +343,23 @@ class Network {
}
}
async getResourcesByUser(username: string, page: number): Promise<PageResponse<Resource>> {
try {
const response = await axios.get(`${this.apiBaseUrl}/resource/user/${username}`, {
params: {
page
}
})
return response.data
} catch (e: any) {
console.error(e)
return {
success: false,
message: e.toString(),
}
}
}
async searchResources(keyword: string, page: number): Promise<PageResponse<Resource>> {
try {
const response = await axios.get(`${this.apiBaseUrl}/resource/search`, {
@@ -357,7 +392,7 @@ class Network {
}
async createS3Storage(name: string, endPoint: string, accessKeyID: string,
secretAccessKey: string, bucketName: string, maxSizeInMB: number): Promise<Response<any>> {
secretAccessKey: string, bucketName: string, maxSizeInMB: number): Promise<Response<any>> {
try {
const response = await axios.post(`${this.apiBaseUrl}/storage/s3`, {
name,
@@ -420,8 +455,8 @@ class Network {
}
}
async initFileUpload(filename: string, description: string, fileSize: number,
resourceId: number, storageId: number): Promise<Response<UploadingFile>> {
async initFileUpload(filename: string, description: string, fileSize: number,
resourceId: number, storageId: number): Promise<Response<UploadingFile>> {
try {
const response = await axios.post(`${this.apiBaseUrl}/files/upload/init`, {
filename,
@@ -487,8 +522,8 @@ class Network {
}
}
async createRedirectFile(filename: string, description: string,
resourceId: number, redirectUrl: string): Promise<Response<RFile>> {
async createRedirectFile(filename: string, description: string,
resourceId: number, redirectUrl: string): Promise<Response<RFile>> {
try {
const response = await axios.post(`${this.apiBaseUrl}/files/redirect`, {
filename,
@@ -573,6 +608,18 @@ class Network {
return { success: false, message: e.toString() };
}
}
async listCommentsByUser(username: string, page: number = 1): Promise<PageResponse<CommentWithResource>> {
try {
const response = await axios.get(`${this.apiBaseUrl}/comments/user/${username}`, {
params: { page }
});
return response.data;
} catch (e: any) {
console.error(e);
return { success: false, message: e.toString() };
}
}
}
export const network = new Network();

View File

@@ -72,6 +72,9 @@ export default function ResourcePage() {
})
}
<button
onClick={() => {
navigate(`/user/${resource.author.username}`)
}}
className="border-b-2 mx-4 py-1 cursor-pointer border-transparent hover:border-primary transition-colors duration-200 ease-in-out">
<div className="flex items-center ">
<div className="avatar">

View File

@@ -13,8 +13,8 @@ export default function TaggedResourcesPage() {
}
return <div>
<h1 className={"text-2xl pt-4 pb-2 px-4"}>
{tag}
<h1 className={"text-2xl pt-6 pb-2 px-4 font-bold"}>
Tag: {tag}
</h1>
<ResourcesView loader={(page) => {
return network.getResourcesByTag(tag, page)

View File

@@ -0,0 +1,153 @@
import { useNavigate, useParams } from "react-router";
import { CommentWithResource, User } from "../network/models";
import { network } from "../network/network";
import showToast from "../components/toast";
import { useEffect, useState } from "react";
import ResourcesView from "../components/resources_view";
import Loading from "../components/loading";
import Pagination from "../components/pagination";
import { MdOutlineArrowForward, MdOutlineArrowRight } from "react-icons/md";
export default function UserPage() {
const [user, setUser] = useState<User | null>(null);
const { username } = useParams();
const [page, setPage] = useState(0);
useEffect(() => {
network.getUserInfo(username || "").then((res) => {
if (res.success) {
setUser(res.data!);
} else {
showToast({
message: res.message,
type: "error",
})
}
});
}, [username]);
if (!user) {
return <div className="w-full">
<Loading />
</div>;
}
return <div>
<UserCard user={user!} />
<div role="tablist" className="border-b border-base-300 mx-2 flex">
<div role="tab" className={`text-sm py-2 px-4 cursor-pointer border-b-2 border-base-100 ${page === 0 ? "border-primary text-primary" : "text-base-content/80"} transition-all`} onClick={() => setPage(0)}>Resources</div>
<div role="tab" className={`text-sm py-2 px-4 cursor-pointer border-b-2 border-base-100 ${page === 1 ? "border-primary text-primary" : "text-base-content/80"}`} onClick={() => setPage(1)}>Comments</div>
</div>
<div className="w-full">
{page === 0 && <UserResources user={user} />}
{page === 1 && <UserComments user={user} />}
</div>
<div className="h-16"></div>
</div>;
}
function UserCard({ user }: { user: User }) {
return <div className={"flex m-4 items-center"}>
<div className={"avatar py-2"}>
<div className="w-24 rounded-full ring-2 ring-offset-2 ring-primary ring-offset-base-100">
<img src={network.getUserAvatar(user)} />
</div>
</div>
<div className="w-6"></div>
<div>
<h1 className="text-2xl font-bold">{user.username}</h1>
<div className="h-4"></div>
<p>
<span className="text-sm font-bold mr-1"> {user.uploads_count}</span>
<span className="text-sm">Resources</span>
<span className="mx-2"></span>
<span className="text-sm font-bold mr-1"> {user.comments_count}</span>
<span className="text-base-content text-sm">Comments</span>
</p>
</div>
</div>
}
function UserResources({ user }: { user: User }) {
return <ResourcesView loader={(page) => {
return network.getResourcesByUser(user.username, page);
}}></ResourcesView>
}
function UserComments({ user }: { user: User }) {
const [page, setPage] = useState(1);
const [maxPage, setMaxPage] = useState(0);
return <div className="px-2">
<CommentsList username={user.username} page={page} maxPageCallback={setMaxPage} />
{maxPage && <div className={"w-full flex justify-center"}>
<Pagination page={page} setPage={setPage} totalPages={maxPage} />
</div>}
</div>
}
function CommentsList({ username, page, maxPageCallback }: {
username: string,
page: number,
maxPageCallback: (maxPage: number) => void
}) {
const [comments, setComments] = useState<CommentWithResource[] | null>(null);
useEffect(() => {
network.listCommentsByUser(username, page).then((res) => {
if (res.success) {
setComments(res.data!);
maxPageCallback(res.totalPages || 1);
} else {
showToast({
message: res.message,
type: "error",
});
}
});
}, [maxPageCallback, page, username]);
if (comments == null) {
return <div className={"w-full"}>
<Loading />
</div>
}
return <>
{
comments.map((comment) => {
return <CommentTile comment={comment} key={comment.id} />
})
}
</>
}
function CommentTile({ comment }: { comment: CommentWithResource }) {
const navigate = useNavigate();
return <div className={"card card-border border-base-300 p-2 my-3"}>
<div className={"flex flex-row items-center my-1 mx-1"}>
<div className="avatar">
<div className="w-8 rounded-full">
<img src={network.getUserAvatar(comment.user)} alt={"avatar"} />
</div>
</div>
<div className={"w-2"}></div>
<div className={"text-sm font-bold"}>{comment.user.username}</div>
<div className={"grow"}></div>
<div className={"text-sm text-gray-500"}>{new Date(comment.created_at).toLocaleString()}</div>
</div>
<div className={"p-2"}>
{comment.content}
</div>
<a className="text-sm text-base-content/80 p-1 hover:text-primary cursor-pointer transition-all" onClick={() => {
navigate("/resources/" + comment.resource.id);
}}>
<MdOutlineArrowRight className="inline-block mr-1 mb-0.5" size={18} />
{comment.resource.title}
</a>
</div>
}

2
go.mod
View File

@@ -19,7 +19,7 @@ require (
github.com/klauspost/cpuid/v2 v2.2.10 // indirect
github.com/minio/crc64nvme v1.0.1 // indirect
github.com/minio/md5-simd v1.1.2 // indirect
github.com/minio/minio-go/v7 v7.0.91 // indirect
github.com/minio/minio-go/v7 v7.0.91
github.com/rs/xid v1.6.0 // indirect
)

View File

@@ -1,16 +1,18 @@
package api
import (
"github.com/gofiber/fiber/v3"
"nysoure/server/model"
"nysoure/server/service"
"strconv"
"github.com/gofiber/fiber/v3"
)
func AddCommentRoutes(router fiber.Router) {
api := router.Group("/comments")
api.Post("/:resourceID", createComment)
api.Get("/:resourceID", listComments)
api.Get("/user/:username", listCommentsWithUser)
}
func createComment(c fiber.Ctx) error {
@@ -60,3 +62,22 @@ func listComments(c fiber.Ctx) error {
Message: "Comments retrieved successfully",
})
}
func listCommentsWithUser(c fiber.Ctx) error {
username := c.Params("username")
pageStr := c.Query("page", "1")
page, err := strconv.Atoi(pageStr)
if err != nil {
return model.NewRequestError("Invalid page number")
}
comments, totalPages, err := service.ListCommentsWithUser(username, page)
if err != nil {
return err
}
return c.JSON(model.PageResponse[model.CommentWithResourceView]{
Success: true,
Data: comments,
TotalPages: totalPages,
Message: "Comments retrieved successfully",
})
}

View File

@@ -155,6 +155,34 @@ func handleSearchResources(c fiber.Ctx) error {
})
}
func handleGetResourcesWithUser(c fiber.Ctx) error {
username := c.Params("username")
if username == "" {
return model.NewRequestError("Username is required")
}
pageStr := c.Query("page")
if pageStr == "" {
pageStr = "1"
}
page, err := strconv.Atoi(pageStr)
if err != nil {
return model.NewRequestError("Invalid page number")
}
resources, totalPages, err := service.GetResourcesWithUser(username, page)
if err != nil {
return err
}
if resources == nil {
resources = []model.ResourceView{}
}
return c.Status(fiber.StatusOK).JSON(model.PageResponse[model.ResourceView]{
Success: true,
Data: resources,
TotalPages: totalPages,
Message: "Resources retrieved successfully",
})
}
func AddResourceRoutes(api fiber.Router) {
resource := api.Group("/resource")
{
@@ -164,5 +192,6 @@ func AddResourceRoutes(api fiber.Router) {
resource.Get("/:id", handleGetResource)
resource.Delete("/:id", handleDeleteResource)
resource.Get("/tag/:tag", handleListResourcesWithTag)
resource.Get("/user/:username", handleGetResourcesWithUser)
}
}

View File

@@ -261,6 +261,22 @@ func handleDeleteUser(c fiber.Ctx) error {
})
}
func handleGetUserInfo(c fiber.Ctx) error {
username := c.Query("username", "")
if username == "" {
return model.NewRequestError("Username is required")
}
user, err := service.GetUserByUsername(username)
if err != nil {
return err
}
return c.Status(fiber.StatusOK).JSON(model.Response[model.UserView]{
Success: true,
Data: user,
Message: "User information retrieved successfully",
})
}
func AddUserRoutes(r fiber.Router) {
u := r.Group("user")
u.Post("/register", handleUserRegister)
@@ -273,4 +289,5 @@ func AddUserRoutes(r fiber.Router) {
u.Get("/list", handleListUsers)
u.Get("/search", handleSearchUsers)
u.Post("/delete", handleDeleteUser)
u.Get("/info", handleGetUserInfo)
}

View File

@@ -1,8 +1,9 @@
package dao
import (
"gorm.io/gorm"
"nysoure/server/model"
"gorm.io/gorm"
)
func CreateComment(content string, userID uint, resourceID uint) (model.Comment, error) {
@@ -43,3 +44,21 @@ func GetCommentByResourceID(resourceID uint, page, pageSize int) ([]model.Commen
return comments, totalPages, nil
}
func GetCommentsWithUser(username string, page, pageSize int) ([]model.Comment, int, error) {
var user model.User
if err := db.Where("username = ?", username).First(&user).Error; err != nil {
return nil, 0, err
}
var comments []model.Comment
var total int64
if err := db.Model(&model.Comment{}).Where("user_id = ?", user.ID).Count(&total).Error; err != nil {
return nil, 0, err
}
if err := db.Where("user_id = ?", user.ID).Offset((page - 1) * pageSize).Limit(pageSize).Preload("User").Preload("Resource").Order("created_at DESC").Find(&comments).Error; err != nil {
return nil, 0, err
}
totalPages := (int(total) + pageSize - 1) / pageSize
return comments, totalPages, nil
}

View File

@@ -171,9 +171,8 @@ func searchWithKeyword(keyword string) ([]model.Resource, error) {
func GetResourceByTag(tagID uint, page int, pageSize int) ([]model.Resource, int, error) {
var tag model.Tag
var total int64
total = db.Model(&model.Tag{}).Where("id = ?", tagID).Association("Resources").Count()
total := db.Model(&model.Tag{}).Where("id = ?", tagID).Association("Resources").Count()
if err := db.Model(&model.Tag{}).Where("id = ?", tagID).Preload("Resources", func(tx *gorm.DB) *gorm.DB {
return tx.Offset((page - 1) * pageSize).Limit(pageSize).Preload("Tags").Preload("User").Preload("Images").Order("created_at DESC")
@@ -210,3 +209,27 @@ func AddResourceDownloadCount(id uint) error {
}
return nil
}
func GetResourcesByUsername(username string, page, pageSize int) ([]model.Resource, int, error) {
var user model.User
if err := db.Where("username = ?", username).First(&user).Error; err != nil {
if errors.Is(err, gorm.ErrRecordNotFound) {
return nil, 0, model.NewNotFoundError("User not found")
}
return nil, 0, err
}
var resources []model.Resource
var total int64
if err := db.Model(&model.Resource{}).Where("user_id = ?", user.ID).Count(&total).Error; err != nil {
return nil, 0, err
}
if err := db.Model(&model.Resource{}).Where("user_id = ?", user.ID).Offset((page - 1) * pageSize).Limit(pageSize).Preload("User").Preload("Images").Preload("Tags").Order("created_at DESC").Find(&resources).Error; err != nil {
return nil, 0, err
}
totalPages := (total + int64(pageSize) - 1) / int64(pageSize)
return resources, int(totalPages), nil
}

View File

@@ -1,8 +1,9 @@
package model
import (
"gorm.io/gorm"
"time"
"gorm.io/gorm"
)
type Comment struct {
@@ -29,3 +30,21 @@ func (c *Comment) ToView() *CommentView {
User: c.User.ToView(),
}
}
type CommentWithResourceView struct {
ID uint `json:"id"`
Content string `json:"content"`
CreatedAt time.Time `json:"created_at"`
Resource ResourceView `json:"resource"`
User UserView `json:"user"`
}
func (c *Comment) ToViewWithResource() *CommentWithResourceView {
return &CommentWithResourceView{
ID: c.ID,
Content: c.Content,
CreatedAt: c.CreatedAt,
Resource: c.Resource.ToView(),
User: c.User.ToView(),
}
}

View File

@@ -1,9 +1,10 @@
package service
import (
"github.com/gofiber/fiber/v3/log"
"nysoure/server/dao"
"nysoure/server/model"
"github.com/gofiber/fiber/v3/log"
)
func CreateComment(content string, userID uint, resourceID uint) (*model.CommentView, error) {
@@ -51,3 +52,16 @@ func ListComments(resourceID uint, page int) ([]model.CommentView, int, error) {
}
return res, totalPages, nil
}
func ListCommentsWithUser(username string, page int) ([]model.CommentWithResourceView, int, error) {
comments, totalPages, err := dao.GetCommentsWithUser(username, page, pageSize)
if err != nil {
log.Error("Error getting comments:", err)
return nil, 0, model.NewInternalServerError("Error getting comments")
}
res := make([]model.CommentWithResourceView, 0, len(comments))
for _, c := range comments {
res = append(res, *c.ToViewWithResource())
}
return res, totalPages, nil
}

View File

@@ -3,8 +3,6 @@ package service
import (
"bytes"
"errors"
"github.com/gofiber/fiber/v3/log"
"github.com/google/uuid"
"image"
"net/http"
"nysoure/server/dao"
@@ -13,6 +11,9 @@ import (
"os"
"time"
"github.com/gofiber/fiber/v3/log"
"github.com/google/uuid"
_ "image/gif"
_ "image/jpeg"
_ "image/png"
@@ -116,7 +117,7 @@ func GetImage(id uint) ([]byte, error) {
}
data, err := os.ReadFile(imageDir + i.FileName)
if err != nil {
return nil, errors.New("Failed to read image file")
return nil, errors.New("failed to read image file")
}
return data, nil
}

View File

@@ -124,3 +124,15 @@ func GetResourcesWithTag(tag string, page int) ([]model.ResourceView, int, error
}
return views, totalPages, nil
}
func GetResourcesWithUser(username string, page int) ([]model.ResourceView, int, error) {
resources, totalPages, err := dao.GetResourcesByUsername(username, page, pageSize)
if err != nil {
return nil, 0, err
}
var views []model.ResourceView
for _, r := range resources {
views = append(views, r.ToView())
}
return views, totalPages, nil
}

View File

@@ -256,3 +256,11 @@ func DeleteUser(adminID uint, targetUserID uint) error {
return dao.DeleteUser(targetUserID)
}
func GetUserByUsername(username string) (model.UserView, error) {
user, err := dao.GetUserByUsername(username)
if err != nil {
return model.UserView{}, err
}
return user.ToView(), nil
}