Question about memoize selector for many components

Hello,

type AppStore = {
  settings: Partial<GlobalStoryblok>
  page: Partial<PageStoryblok>
  drawerVariant: DrawerProps['variant']
}

export const useAppStore = create<AppStore>(() => ({
  settings: {},
  page: {},
  drawerVariant: 'temporary'
}))

// memoize the selectors for component-reuse
export const settingsSelector = (state: AppStore) => state.settings
export const pageSelector = (state: AppStore) => state.page
export const pageSettingsSelector = (state: AppStore) => ({
  settings: state.settings,
  page: state.page
})

// sample component
function Component(){
  const settings = useAppStore(settingsSelector)
}

Is this the recommended way of using Zustand with TypeScript? I am migrating away from react-hooks-global-state and several React context approaches to keep the code more clean. The selectors are re-used over many files in the codebase. Thanks for feedback!

[dai-shi]

closing as resolved. see also #375.

[dohomi]

@dai-shi I was currently using the shallow function as second argument. But actually you are right its not necessary and probably with just 3 values in the Store kind of an overhead. Thanks for this lib !