starred/linsa-linsa-io
1
0
Fork 0
mirror of https://github.com/linsa-io/linsa.git synced 2026-04-22 16:28:36 +02:00
Code Issues 2 Packages Projects Releases Wiki Activity

fix: eager load all deps for link

Browse Source
This commit is contained in:
Aslam H
2024-11-09 13:12:36 +07:00
parent 87998d00f3
commit 08bcf3037a
3 changed files with 43 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/app/routes/_layout/_pages/_protected/links/-bottom-bar.tsx
View File

@@ -65,7 +65,7 @@ export const LinkBottomBar: React.FC = () => {
const [, setGlobalLinkFormExceptionRefsAtom] = useAtom( const [, setGlobalLinkFormExceptionRefsAtom] = useAtom(
globalLinkFormExceptionRefsAtom, globalLinkFormExceptionRefsAtom,
) )
const { me } = useAccount({ root: { personalLinks: [] } }) const { me } = useAccount({ root: { personalLinks: [{}] } })
const personalLink = useCoState(PersonalLink, editId as ID<PersonalLink>) const personalLink = useCoState(PersonalLink, editId as ID<PersonalLink>)
const cancelBtnRef = React.useRef<HTMLButtonElement>(null) const cancelBtnRef = React.useRef<HTMLButtonElement>(null)

6
web/app/routes/_layout/_pages/_protected/links/-link-form.tsx
View File

@@ -153,8 +153,10 @@ export const LinkForm: React.FC<LinkFormProps> = ({
}) })
const topicName = form.watch("topic") const topicName = form.watch("topic")
const findTopic = const findTopic = React.useMemo(
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, {})

71
web/app/routes/_layout/_pages/_protected/links/-list.tsx
View File

@@ -67,7 +67,15 @@ 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: [
{
topic: [],
},
],
},
})
const personalLinks = me?.root.personalLinks || [] const personalLinks = me?.root.personalLinks || []
const filteredLinks = personalLinks.filter((link) => { const filteredLinks = personalLinks.filter((link) => {
@@ -268,39 +276,36 @@ const LinkList: React.FC<LinkListProps> = () => {
<div className="relative flex h-full grow flex-col items-stretch overflow-hidden"> <div className="relative flex h-full grow flex-col items-stretch overflow-hidden">
<div className="flex h-full w-[calc(100%+0px)] flex-col overflow-hidden pr-0"> <div className="flex h-full w-[calc(100%+0px)] flex-col overflow-hidden pr-0">
<div className="relative overflow-y-auto overflow-x-hidden [scrollbar-gutter:auto]"> <div className="relative overflow-y-auto overflow-x-hidden [scrollbar-gutter:auto]">
{sortedLinks.map( {sortedLinks.map((linkItem, index) => (
(linkItem, index) => <LinkItem
linkItem && ( key={linkItem.id}
<LinkItem isActive={activeItemIndex === index}
key={linkItem.id} personalLink={linkItem}
isActive={activeItemIndex === index} editId={editId}
personalLink={linkItem} disabled={sort !== "manual" || !!editId}
editId={editId} onPointerMove={() => {
disabled={sort !== "manual" || !!editId} if (editId || draggingId || createMode) {
onPointerMove={() => { return undefined
if (editId || draggingId || createMode) { }
return undefined
}
setKeyboardActiveIndex(null) setKeyboardActiveIndex(null)
setActiveItemIndex(index) setActiveItemIndex(index)
}} }}
onFormClose={async () => { onFormClose={async () => {
navigate({ to: "/links" }) navigate({ to: "/links" })
setActiveItemIndex(lastActiveIndexRef.current) setActiveItemIndex(lastActiveIndexRef.current)
setKeyboardActiveIndex(lastActiveIndexRef.current) setKeyboardActiveIndex(lastActiveIndexRef.current)
}} }}
onItemSelected={(link) => onItemSelected={(link) =>
navigate({ navigate({
to: "/links", to: "/links",
search: { editId: link.id }, search: { editId: link.id },
}) })
} }
data-keyboard-active={keyboardActiveIndex === index} data-keyboard-active={keyboardActiveIndex === index}
ref={(el) => setElementRef(el, index)} ref={(el) => setElementRef(el, index)}
/> />
), ))}
)}
</div> </div>
</div> </div>
</div> </div>