import { action, makeAutoObservable } from 'mobx'
import { makePersistable, isHydrated } from 'mobx-persist-store'

export class useUserStore {
    user: object = {}
    constructor() {
        makeAutoObservable(
            this,
            {
                setUserInfo: action,
            },
            { autoBind: true },
        )
        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
        makePersistable(this, {
            // 在构造函数内使用 makePersistable
            name: 'userStore', // 保存的name，用于在storage中的名称标识，只要不和storage中其他名称重复就可以
            properties: ['user'], // 要保存的字段，这些字段会被保存在name对应的storage中，注意：不写在这里面的字段将不会被保存，刷新页面也将丢失：get字段例外。get数据会在数据返回后再自动计算
            storage: window.localStorage, // 保存的位置：看自己的业务情况选择，可以是localStorage，sessionstorage
            // 。。还有一些其他配置参数，例如数据过期时间等等，可以康康文档，像storage这种字段可以配置在全局配置里，详见文档
        }).then(
            action((persistStore) => {
                // persist 完成的回调，在这里可以执行一些拿到数据后需要执行的操作，如果在页面上要判断是否完成persist，使用 isHydrated
                // console.log(persistStore)
            }),
        )
    }
    get getUserInfo() {
        return this.user
    }
    get token() {
        return this.user ? this.user.token : ''
    }
    get isHydrated() {
        return isHydrated(this)
    }
    setUserInfo(user: object) {
        this.user = user
    }
}
