mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-30 02:23:47 +00:00
perf: add Zustand selectors to prevent cascading re-renders
Replace all bare useAuthStore(), useBlockingStore(), and useSuccessNotification() calls with individual field selectors. This prevents components from re-rendering when unrelated store fields change. - 21 useAuthStore usages across 20 files: individual selectors for 1-2 fields, useShallow for 3+ fields - 5 useBlockingStore usages: individual selectors - 2 useSuccessNotification usages: individual selectors
This commit is contained in:
@@ -5,6 +5,7 @@ import { useState, useEffect } from 'react';
|
||||
import { initDataUser } from '@telegram-apps/sdk-react';
|
||||
|
||||
import { useAuthStore } from '@/store/auth';
|
||||
import { useShallow } from 'zustand/shallow';
|
||||
import { useTheme } from '@/hooks/useTheme';
|
||||
import { usePlatform } from '@/platform';
|
||||
import {
|
||||
@@ -77,7 +78,9 @@ export function AppHeader({
|
||||
}: AppHeaderProps) {
|
||||
const { t } = useTranslation();
|
||||
const location = useLocation();
|
||||
const { user, logout, isAdmin } = useAuthStore();
|
||||
const { user, logout, isAdmin } = useAuthStore(
|
||||
useShallow((state) => ({ user: state.user, logout: state.logout, isAdmin: state.isAdmin })),
|
||||
);
|
||||
const { toggleTheme, isDark } = useTheme();
|
||||
const { haptic, platform } = usePlatform();
|
||||
const [userPhotoUrl, setUserPhotoUrl] = useState<string | null>(null);
|
||||
|
||||
@@ -193,7 +193,8 @@ interface AppShellProps {
|
||||
export function AppShell({ children }: AppShellProps) {
|
||||
const { t } = useTranslation();
|
||||
const location = useLocation();
|
||||
const { isAdmin, logout } = useAuthStore();
|
||||
const isAdmin = useAuthStore((state) => state.isAdmin);
|
||||
const logout = useAuthStore((state) => state.logout);
|
||||
const { isFullscreen, safeAreaInset, contentSafeAreaInset, platform, isMobile } =
|
||||
useTelegramSDK();
|
||||
const haptic = useHaptic();
|
||||
|
||||
@@ -49,7 +49,8 @@ export function DesktopSidebar({
|
||||
}: DesktopSidebarProps) {
|
||||
const { t } = useTranslation();
|
||||
const location = useLocation();
|
||||
const { user, logout } = useAuthStore();
|
||||
const user = useAuthStore((state) => state.user);
|
||||
const logout = useAuthStore((state) => state.logout);
|
||||
const { haptic } = usePlatform();
|
||||
|
||||
// Branding
|
||||
|
||||
Reference in New Issue
Block a user