fix: remove unnecessary rerender link list

This commit is contained in:
Aslam H
2024-11-09 13:05:06 +07:00
parent f375515ccd
commit 87998d00f3
2 changed files with 16 additions and 30 deletions

View File

@@ -153,10 +153,8 @@ export const LinkForm: React.FC<LinkFormProps> = ({
}) })
const topicName = form.watch("topic") const topicName = form.watch("topic")
const findTopic = React.useMemo( const findTopic =
() => me && Topic.findUnique({ topicName }, JAZZ_GLOBAL_GROUP_ID, me), me && Topic.findUnique({ topicName }, JAZZ_GLOBAL_GROUP_ID, me)
[topicName, me],
)
const selectedTopic = useCoState(Topic, findTopic, {}) const selectedTopic = useCoState(Topic, findTopic, {})

View File

@@ -67,32 +67,20 @@ const LinkList: React.FC<LinkListProps> = () => {
const { deleteLink } = useLinkActions() const { deleteLink } = useLinkActions()
const confirm = useConfirm() const confirm = useConfirm()
const { me } = useAccount({ root: { personalLinks: [] } }) const { me } = useAccount({ root: { personalLinks: [{}] } })
const personalLinks = React.useMemo( const personalLinks = me?.root.personalLinks || []
() => me?.root?.personalLinks || [], const filteredLinks = personalLinks.filter((link) => {
[me?.root?.personalLinks],
)
const filteredLinks = React.useMemo(
() =>
personalLinks.filter((link) => {
if (state === "all") return true if (state === "all") return true
if (!link?.learningState) return false if (!link?.learningState) return false
return link.learningState === state return link.learningState === state
}), })
[personalLinks, state], const sortedLinks =
)
const sortedLinks = React.useMemo(
() =>
sort === "title" sort === "title"
? [...filteredLinks].sort((a, b) => ? [...filteredLinks].sort((a, b) =>
(a?.title || "").localeCompare(b?.title || ""), (a?.title || "").localeCompare(b?.title || ""),
) )
: filteredLinks, : filteredLinks
[filteredLinks, sort],
)
React.useEffect(() => { React.useEffect(() => {
if (editId) { if (editId) {
@@ -208,7 +196,7 @@ const LinkList: React.FC<LinkListProps> = () => {
const handleDragEnd = (event: DragEndEvent) => { const handleDragEnd = (event: DragEndEvent) => {
const { active, over } = event const { active, over } = event
if (!active || !over || !me?.root?.personalLinks) { if (!active || !over || !me?.root.personalLinks) {
console.error("Drag operation fail", { active, over }) console.error("Drag operation fail", { active, over })
return return
} }