How to persist Recoil in React native?

Question

Below is my atom and i have used the recoil-persist library, though the atoms are getting reset everytime i reopen the app.

import { atom } from "recoil";
import AsyncStorage from '@react-native-async-storage/async-storage';
import { recoilPersist } from 'recoil-persist';

const { persistAtom } = recoilPersist({
  key: 'recoil-persist', // this key is used to store data in local storage
  storage: AsyncStorage, // configure AsyncStorage to store the data
  converter: JSON, // configure how values will be serialized/deserialized in storage
});

export const userAuthTokenRecoil = atom({
  key: "userAuthToken",
  default: "",
  effects_UNSTABLE: \[persistAtom\],

});

export const userNameRecoil = atom({
 key: "userName",
 default: "User_Name",
 effects_UNSTABLE: \[persistAtom\],

});