web: use user profile from settings

apps/web/src/components/navigation-menu/index.tsx

@@ -47,6 +47,7 @@ import { showRenameColorDialog } from "../../common/dialog-controller";
 import { useStore as useAppStore } from "../../stores/app-store";
 import { useStore as useUserStore } from "../../stores/user-store";
 import { useStore as useThemeStore } from "../../stores/theme-store";
+import { useStore as useSettingStore } from "../../stores/setting-store";
 import useLocation from "../../hooks/use-location";
 import { FlexScrollContainer } from "../scroll-container";
 import { ScopedThemeProvider } from "../theme-provider";
@@ -135,7 +136,7 @@ function NavigationMenu(props: NavigationMenuProps) {
   const shortcuts = useAppStore((store) => store.shortcuts);
   const refreshNavItems = useAppStore((store) => store.refreshNavItems);
   const isLoggedIn = useUserStore((store) => store.isLoggedIn);
-  const profile = useUserStore((store) => store.profile);
+  const profile = useSettingStore((store) => store.profile);
   const isMobile = useMobile();
   const theme = useThemeStore((store) => store.colorScheme);
   const toggleNightMode = useThemeStore((store) => store.toggleColorScheme);

apps/web/src/dialogs/edit-profile-picture-dialog.tsx

@@ -26,8 +26,8 @@ import { User } from "../components/icons";
 import { useRef, useState } from "react";
 import { showFilePicker } from "../utils/file-picker";
 import { db } from "../common/db";
-import { useStore as useUserStore } from "../stores/user-store";
 import { showToast } from "../utils/toast";
+import { useStore as useSettingStore } from "../stores/setting-store";
 
 export type EditProfilePictureDialogProps = {
   onClose: Perform;
@@ -66,12 +66,10 @@ export default function EditProfilePictureDialog(
               : clearProfilePicture
               ? undefined
               : profile?.profilePicture;
-            await db.user.setProfile({
+            await db.settings.setProfile({
               profilePicture: pic
             });
-            useUserStore.setState({
-              profile: { ...profile, profilePicture: pic }
-            });
+            await useSettingStore.getState().refresh();
             showToast("success", "Profile updated!");
             props.onClose(true);
           } catch (e) {

apps/web/src/dialogs/settings/components/user-profile.tsx

@@ -20,6 +20,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import { Flex, Image, Text } from "@theme-ui/components";
 import { Edit, User } from "../../../components/icons";
 import { useStore as useUserStore } from "../../../stores/user-store";
+import { useStore as useSettingStore } from "../../../stores/setting-store";
 import { getObjectIdTimestamp } from "@notesnook/core/dist/utils/object-id";
 import { getFormattedDate } from "@notesnook/common";
 import { SUBSCRIPTION_STATUS } from "../../../common/constants";
@@ -34,7 +35,7 @@ import { showToast } from "../../../utils/toast";
 
 export function UserProfile() {
   const user = useUserStore((store) => store.user);
-  const profile = useUserStore((store) => store.profile);
+  const profile = useSettingStore((store) => store.profile);
 
   const {
     isTrial,
@@ -179,10 +180,10 @@ export function UserProfile() {
                   defaultValue: profile?.fullName
                 });
                 try {
-                  await db.user.setProfile({ fullName: fullName || undefined });
-                  useUserStore.setState({
-                    profile: { ...profile, fullName: fullName || undefined }
+                  await db.settings.setProfile({
+                    fullName: fullName || undefined
                   });
+                  await useSettingStore.getState().refresh();
                   showToast("success", "Full name updated!");
                 } catch (e) {
                   showToast("error", (e as Error).message);

apps/web/src/stores/setting-store.ts

@@ -27,7 +27,7 @@ import { useEditorStore } from "./editor-store";
 import { isTelemetryEnabled, setTelemetry } from "../utils/telemetry";
 import { setDocumentTitle } from "../utils/dom";
 import { TimeFormat } from "@notesnook/core/dist/utils/date";
-import { TrashCleanupInterval } from "@notesnook/core";
+import { Profile, TrashCleanupInterval } from "@notesnook/core";
 
 class SettingStore extends BaseStore<SettingStore> {
   encryptBackups = Config.get("encryptBackups", false);
@@ -47,6 +47,7 @@ class SettingStore extends BaseStore<SettingStore> {
   dateFormat = "DD-MM-YYYY";
   timeFormat: TimeFormat = "12-hour";
   titleFormat = "Note $date$ $time$";
+  profile?: Profile;
 
   trashCleanupInterval: TrashCleanupInterval = 7;
   homepage = Config.get("homepage", 0);
@@ -61,6 +62,7 @@ class SettingStore extends BaseStore<SettingStore> {
       timeFormat: db.settings.getTimeFormat(),
       titleFormat: db.settings.getTitleFormat(),
       trashCleanupInterval: db.settings.getTrashCleanupInterval(),
+      profile: db.settings.getProfile(),
       isFlatpak: await desktop?.integration.isFlatpak.query(),
       desktopIntegrationSettings:
         await desktop?.integration.desktopIntegration.query(),

apps/web/src/stores/user-store.ts

@@ -31,7 +31,7 @@ import { hashNavigate } from "../navigation";
 import { isUserPremium } from "../hooks/use-is-user-premium";
 import { SUBSCRIPTION_STATUS } from "../common/constants";
 import { ANALYTICS_EVENTS, trackEvent } from "../utils/analytics";
-import { AuthenticatorType, Profile, User } from "@notesnook/core";
+import { AuthenticatorType, User } from "@notesnook/core";
 
 class UserStore extends BaseStore<UserStore> {
   isLoggedIn?: boolean;
@@ -39,7 +39,6 @@ class UserStore extends BaseStore<UserStore> {
   isSigningIn = false;
 
   user?: User = undefined;
-  profile?: Profile;
   counter = 0;
 
   init = () => {
@@ -60,17 +59,12 @@ class UserStore extends BaseStore<UserStore> {
       if (Config.get("sessionExpired")) EV.publish(EVENTS.userSessionExpired);
     });
 
-    db.user.getProfile().then((profile) => this.set({ profile }));
-
     if (Config.get("sessionExpired")) return;
 
     return db.user.fetchUser().then(async (user) => {
       if (!user) return false;
 
-      const profile = await db.user.getProfile();
-
       this.set({
-        profile,
         user,
         isLoggedIn: true
       });
@@ -110,9 +104,8 @@ class UserStore extends BaseStore<UserStore> {
   };
 
   refreshUser = async () => {
-    return db.user.fetchUser().then(async (user) => {
-      const profile = await db.user.getProfile();
-      this.set({ user, profile });
+    return db.user.fetchUser().then((user) => {
+      this.set({ user });
     });
   };