LocalForage.clear() is not clear my web database

Question

I'm making counter using react-redux, redux-presist and localForage.

and trying to clear my storage to set cnt = 0; when user come in so it will begin to count from 0 to n when user come in my website, but clear() is not working any ideas?

store.js

import { createStore } from "redux";
import { persistStore, persistReducer } from "redux-persist";
import storage from "localforage";
import { rootReducer } from "./rootReducer";

export const localStorageEngine = storage.createInstance({
  name: "aqua",
  version: 1,
  description: "States DB for AQUA",
  driver: [storage.LOCALSTORAGE]
});
// localStorageEngine.clear();

const persisConfig = {
  key: "root",
  storage
};

const persistedReducer = persistReducer(persisConfig, rootReducer);

const store = createStore(persistedReducer);
export default store;
export const persistor = persistStore(store);

App.js

import React, { useEffect } from "react";
import store, { localStorageEngine } from "./store";
import "./styles.css";
import { setCounter } from "./rootReducer";

export default function App() {
  useEffect(() => {
    localStorageEngine.clear().then(() => console.log("cleared"));

    setInterval(() => {
      store.dispatch(setCounter(store.getState().counterReducer.cnt+1));
      console.log(store.getState().counterReducer.cnt);
    }, 1000)

    // ComponentWillUnmount
    return () => {
      localStorageEngine.clear().then(() => console.log("cleared at componentWiilUnmount"));
    }

  }, []);

  return <div className="App" />;
}

Please let me know if you need more info.