From 664216ca8735fea6a75e5bf2290c8ff53fe2f0ad Mon Sep 17 00:00:00 2001 From: sunface Date: Tue, 9 Mar 2021 09:13:13 +0800 Subject: [PATCH] add sorter for comments --- pages/[username]/[post_id].tsx | 9 +------- server/internal/api/comment.go | 10 +++++++-- server/internal/story/comment.go | 10 ++++++--- server/pkg/models/comment.go | 8 +++++++ src/components/comments/comments.tsx | 32 +++++++++++++++++++++------- 5 files changed, 48 insertions(+), 21 deletions(-) diff --git a/pages/[username]/[post_id].tsx b/pages/[username]/[post_id].tsx index 199f8176..62a6f2f9 100644 --- a/pages/[username]/[post_id].tsx +++ b/pages/[username]/[post_id].tsx @@ -30,7 +30,6 @@ const PostPage = () => { const router = useRouter() const id = router.query.post_id const [post, setPost]: [Post, any] = useState(null) - const [comments, setComments]: [Comment[], any] = useState([]) useEffect(() => { if (id) { getData() @@ -49,14 +48,8 @@ const PostPage = () => { const getData = async () => { const res = await requestApi.get(`/story/post/${id}`) setPost(res.data) - - getComments(res.data.id) } - const getComments = async (id) => { - const res = await requestApi.get(`/story/comments/${id}`) - setComments(res.data) - } return ( <> @@ -80,7 +73,7 @@ const PostPage = () => { {post.rawTags.map(tag => )} - getComments(post.id)} /> + diff --git a/server/internal/api/comment.go b/server/internal/api/comment.go index 35e0297d..02e27e6f 100644 --- a/server/internal/api/comment.go +++ b/server/internal/api/comment.go @@ -51,7 +51,13 @@ func SubmitComment(c *gin.Context) { func GetStoryComments(c *gin.Context) { storyID := c.Param("id") - comments, err := story.GetComments(storyID) + sorter := c.Query("sorter") + + if !models.ValidSearchFilter(sorter) { + c.JSON(http.StatusBadRequest, e.ParamInvalid) + return + } + comments, err := story.GetComments(storyID, sorter) if err != nil { c.JSON(err.Status, common.RespError(err.Message)) return @@ -63,7 +69,7 @@ func GetStoryComments(c *gin.Context) { comment.Liked = interaction.GetLiked(comment.ID, user.ID) } - replies, err := story.GetComments(comment.ID) + replies, err := story.GetComments(comment.ID, sorter) if err != nil { continue } diff --git a/server/internal/story/comment.go b/server/internal/story/comment.go index 4f36a8f7..8ea0721e 100644 --- a/server/internal/story/comment.go +++ b/server/internal/story/comment.go @@ -72,8 +72,8 @@ func EditComment(c *models.Comment) *e.Error { return nil } -func GetComments(storyID string) (models.Comments, *e.Error) { - comments := make(models.Comments, 0) +func GetComments(storyID string, sorter string) ([]*models.Comment, *e.Error) { + comments := make([]*models.Comment, 0) rows, err := db.Conn.Query("SELECT id,target_id,creator,md,created,updated FROM comments WHERE target_id=?", storyID) if err != nil && err != sql.ErrNoRows { logger.Warn("get comments error", "error", err) @@ -100,7 +100,11 @@ func GetComments(storyID string) (models.Comments, *e.Error) { comments = append(comments, c) } - sort.Sort(comments) + if sorter == models.FilterFavorites { + sort.Sort(models.FavorComments(comments)) + } else { + sort.Sort(models.Comments(comments)) + } return comments, nil } diff --git a/server/pkg/models/comment.go b/server/pkg/models/comment.go index 623b858b..1ae0d9d2 100644 --- a/server/pkg/models/comment.go +++ b/server/pkg/models/comment.go @@ -22,3 +22,11 @@ func (ar Comments) Swap(i, j int) { ar[i], ar[j] = ar[j], ar[i] } func (ar Comments) Less(i, j int) bool { return ar[i].Created.Unix() > ar[j].Created.Unix() } + +type FavorComments []*Comment + +func (ar FavorComments) Len() int { return len(ar) } +func (ar FavorComments) Swap(i, j int) { ar[i], ar[j] = ar[j], ar[i] } +func (ar FavorComments) Less(i, j int) bool { + return ar[i].Likes > ar[j].Likes +} diff --git a/src/components/comments/comments.tsx b/src/components/comments/comments.tsx index a24d38c5..15cff5dc 100644 --- a/src/components/comments/comments.tsx +++ b/src/components/comments/comments.tsx @@ -1,26 +1,38 @@ -import React, { useState } from "react" -import {Text, Flex, HStack, Button, VStack } from "@chakra-ui/react" +import React, { useEffect, useState } from "react" +import {Text, Flex, HStack, Button, VStack, Select } from "@chakra-ui/react" import Card from "components/card" import useSession from "hooks/use-session" import { requestApi } from "utils/axios/request" import CommentCard from "./comment" import CommentEditor from "./editor" import { Comment } from "src/types/comments" +import { SearchFilter } from "src/types/search" +import { upperFirst } from "lodash" interface Props { storyID: string - comments: Comment[] - onChange: any } -export const Comments = ({storyID, comments,onChange }: Props) => { +export const Comments = ({storyID}: Props) => { + const [comments, setComments]: [Comment[], any] = useState([]) + const [editorVisible,setEditorVisible] = useState(false) + const [sorter,setSorter] = useState(SearchFilter.Favorites) const session = useSession() + + useEffect(() => { + getComments() + },[]) const submitComment = async (md) => { await requestApi.post('/story/comment',{targetID: storyID, md: md}) setEditorVisible(false) - onChange() + getComments() } + const getComments = async (s?) => { + const res = await requestApi.get(`/story/comments/${storyID}?sorter=${s??sorter}`) + setComments(res.data) + } + const countComments = () => { let n = comments.length for (const c of comments) { @@ -34,8 +46,12 @@ export const Comments = ({storyID, comments,onChange }: Props) => { - + Comments ({countComments()}) + @@ -44,7 +60,7 @@ export const Comments = ({storyID, comments,onChange }: Props) => { {editorVisible && session && submitComment(md)} onCancel={() => setEditorVisible(false)}/>} - {comments.map(comment => )} + {comments.map(comment => )} ) }