refactor account store + much smoother collection listing updates

components/LinkViews/LinkCard.tsx

@@ -15,12 +15,12 @@ import Link from "next/link";
 import LinkIcon from "./LinkComponents/LinkIcon";
 import useOnScreen from "@/hooks/useOnScreen";
 import { generateLinkHref } from "@/lib/client/generateLinkHref";
-import useAccountStore from "@/store/account";
 import usePermissions from "@/hooks/usePermissions";
 import toast from "react-hot-toast";
 import LinkTypeBadge from "./LinkComponents/LinkTypeBadge";
 import { useTranslation } from "next-i18next";
 import { useCollections } from "@/hooks/store/collections";
+import { useUser } from "@/hooks/store/users";
 
 type Props = {
   link: LinkIncludingShortenedCollectionAndTags;
@@ -34,10 +34,9 @@ export default function LinkCard({ link, flipDropdown, editMode }: Props) {
   const { t } = useTranslation();
 
   const viewMode = localStorage.getItem("viewMode") || "card";
-  const { data: { response: collections } = { response: [] } } =
-    useCollections();
+  const { data: collections = [] } = useCollections();
 
-  const { account } = useAccountStore();
+  const { data: user = [] } = useUser();
 
   const { links, getLink, setSelectedLinks, selectedLinks } = useLinkStore();
 
@@ -133,7 +132,7 @@ export default function LinkCard({ link, flipDropdown, editMode }: Props) {
       <div
         className="rounded-2xl cursor-pointer h-full flex flex-col justify-between"
         onClick={() =>
-          !editMode && window.open(generateLinkHref(link, account), "_blank")
+          !editMode && window.open(generateLinkHref(link, user), "_blank")
         }
       >
         <div>

components/LinkViews/LinkComponents/LinkActions.tsx

@@ -9,9 +9,9 @@ import DeleteLinkModal from "@/components/ModalContent/DeleteLinkModal";
 import PreservedFormatsModal from "@/components/ModalContent/PreservedFormatsModal";
 import useLinkStore from "@/store/links";
 import { toast } from "react-hot-toast";
-import useAccountStore from "@/store/account";
 import { dropdownTriggerer } from "@/lib/client/utils";
 import { useTranslation } from "next-i18next";
+import { useUser } from "@/hooks/store/users";
 
 type Props = {
   link: LinkIncludingShortenedCollectionAndTags;
@@ -39,7 +39,7 @@ export default function LinkActions({
   const [deleteLinkModal, setDeleteLinkModal] = useState(false);
   const [preservedFormatsModal, setPreservedFormatsModal] = useState(false);
 
-  const { account } = useAccountStore();
+  const { data: user = [] } = useUser();
 
   const { removeLink, updateLink } = useLinkStore();
 
@@ -50,7 +50,7 @@ export default function LinkActions({
 
     const response = await updateLink({
       ...link,
-      pinnedBy: isAlreadyPinned ? undefined : [{ id: account.id }],
+      pinnedBy: isAlreadyPinned ? undefined : [{ id: user.id }],
     });
 
     toast.dismiss(load);

components/LinkViews/LinkList.tsx

@@ -11,12 +11,12 @@ import LinkCollection from "@/components/LinkViews/LinkComponents/LinkCollection
 import LinkIcon from "@/components/LinkViews/LinkComponents/LinkIcon";
 import { isPWA } from "@/lib/client/utils";
 import { generateLinkHref } from "@/lib/client/generateLinkHref";
-import useAccountStore from "@/store/account";
 import usePermissions from "@/hooks/usePermissions";
 import toast from "react-hot-toast";
 import LinkTypeBadge from "./LinkComponents/LinkTypeBadge";
 import { useTranslation } from "next-i18next";
 import { useCollections } from "@/hooks/store/collections";
+import { useUser } from "@/hooks/store/users";
 
 type Props = {
   link: LinkIncludingShortenedCollectionAndTags;
@@ -33,10 +33,9 @@ export default function LinkCardCompact({
 }: Props) {
   const { t } = useTranslation();
 
-  const { data: { response: collections } = { response: [] } } =
-    useCollections();
+  const { data: collections = [] } = useCollections();
 
-  const { account } = useAccountStore();
+  const { data: user = [] } = useUser();
   const { links, setSelectedLinks, selectedLinks } = useLinkStore();
 
   useEffect(() => {
@@ -121,7 +120,7 @@ export default function LinkCardCompact({
         <div
           className="flex items-center cursor-pointer w-full"
           onClick={() =>
-            !editMode && window.open(generateLinkHref(link, account), "_blank")
+            !editMode && window.open(generateLinkHref(link, user), "_blank")
           }
         >
           <div className="shrink-0">

components/LinkViews/LinkMasonry.tsx

@@ -15,12 +15,12 @@ import Link from "next/link";
 import LinkIcon from "./LinkComponents/LinkIcon";
 import useOnScreen from "@/hooks/useOnScreen";
 import { generateLinkHref } from "@/lib/client/generateLinkHref";
-import useAccountStore from "@/store/account";
 import usePermissions from "@/hooks/usePermissions";
 import toast from "react-hot-toast";
 import LinkTypeBadge from "./LinkComponents/LinkTypeBadge";
 import { useTranslation } from "next-i18next";
 import { useCollections } from "@/hooks/store/collections";
+import { useUser } from "@/hooks/store/users";
 
 type Props = {
   link: LinkIncludingShortenedCollectionAndTags;
@@ -33,9 +33,8 @@ type Props = {
 export default function LinkMasonry({ link, flipDropdown, editMode }: Props) {
   const { t } = useTranslation();
 
-  const { data: { response: collections } = { response: [] } } =
-    useCollections();
-  const { account } = useAccountStore();
+  const { data: collections = [] } = useCollections();
+  const { data: user = [] } = useUser();
 
   const { links, getLink, setSelectedLinks, selectedLinks } = useLinkStore();
 
@@ -131,7 +130,7 @@ export default function LinkMasonry({ link, flipDropdown, editMode }: Props) {
       <div
         className="rounded-2xl cursor-pointer"
         onClick={() =>
-          !editMode && window.open(generateLinkHref(link, account), "_blank")
+          !editMode && window.open(generateLinkHref(link, user), "_blank")
         }
       >
         <div className="relative rounded-t-2xl overflow-hidden">