TypeError: Cannot use 'in' operator to search for 'getStorage'

[MFdev-coder]

TypeError: Cannot use 'in' operator to search for 'getStorage' in undefined
at persistImpl (zustand_middleware.js?v=7d5e88db:571:20)
at Store.js:6:5

I got this error after adding persist to the store.js file ...

// -------------------Store.js-----------------------
import { create } from "zustand";
import { devtools, persist } from "zustand/middleware";

export const useBearStore = create(
  devtools(
    persist((set) => ({
      email: "",
      pass: "",
      setMail: (mail) => set((state) => ({ email: mail })),
      setPass: (pas) => set((state) => ({ pass: pas })),
    }))
  )
);

used here..

import React from 'react'
import { useBearStore } from '@/config/Store'
import pb from "@/config/PocketBaseClient";
import { useState } from 'react';
import { useEffect } from 'react';

export default function Dashboard() {
  const mail = useBearStore((state) => state.email) // <------------------------Brought state like this
  const password = useBearStore((state) => state.pass)// <------------------------Brought state like this
  const [currentUser,setCurrentUser] = useState(pb.authStore.model)

   async function login() {
      console.log(mail)// <------------------------Printed state like this
      console.log(password)// <------------------------Printed state like this
      await pb.collection('users').authWithPassword(mail,password);

  }

  useEffect(()=>{
    login()
  },[])
  
  pb.authStore.onChange((auth)=>{
    console.log(auth)
    setCurrentUser(pb.authStore.model)
  })
  
  return (
    <div>
      {currentUser?currentUser.verified?<Dashboard2/>:<p>Verify yourself</p>:<p>No User Loged IN</p>} 
    </div>
  )
}


function Dashboard2() {
  return (
    <div>Welcome to Dashboard</div>
  )
}

Please tell me why this is happening ???

[dbritto-dev]

@MFdev-coder here you go https://docs.pmnd.rs/zustand/integrations/persisting-store-data

[MFdev-coder]

@dbritto-dev Thank You For Your Help