import React, { useEffect, useState } from 'react';
import ProviderApp from '@/provider/app';
import { useNavigate } from 'react-router-dom';
import {useLoading} from '@/hooks';

export const AuthShow=(props)=>{
  const {name} = props;
  const app = ProviderApp.useContainer();
  if(app?.user?.auth?.includes(name)){
    return props.children;
  }
  return <></>
}

export const AuthLogin=(props)=>{
  const navigate = useNavigate();
  const [pass,setPass] = useState(false)
  const app = ProviderApp.useContainer();
  const loading = useLoading();

  const check=async ()=>{
    loading.setLoading(true);
    console.log(`[Auth]检查用户登录态`)
    const req =await app.isLogin();
    loading.setLoading(false);
    if(req){
      console.log(`[Auth]检查用户登录态成功`)
      setPass(true);
    }else{
      console.log(`[Auth]检查用户登录态失败`)
      setPass(false);
      navigate('/login');
    }
  }
  useEffect(check,[]);

  if(pass){
    return props.children;
  }
  return <>检查登录态中...</>
}


export default {AuthShow,AuthLogin};