import React, { Suspense, useState, useEffect } from 'react'
import axios from 'axios';
//import Cookies from 'js-cookie';
import Cookies from 'universal-cookie';
import {
  Redirect,
  Route,
  Switch
} from 'react-router-dom'
import { CContainer, CFade } from '@coreui/react'

// routes config
import routes from '../routes'

const loading = (
  <div className="pt-3 text-center">
    <div className="sk-spinner sk-spinner-pulse"></div>
  </div>
)

const TheContent = () => {

  const [SsoSession, setSsoSession] = useState('');

  useEffect(() => {
    async function fetchData() {
      // You can await here
      const result = await axios('https://fsbsso.sumasen.net/Shibboleth.sso/Session');
      setSsoSession(result.data);
    }
    fetchData();
  }, []);

  function get_token_from_storage_or_cookie() {
    const cookies = new Cookies();
    const shib = cookies.get('_shibsession_64656661756c7468747470733a2f2f66736273736f2e73756d6173656e2e6e65742f73686962626f6c657468')
    console.log(shib);
    console.log(SsoSession);
    console.log(SsoSession.includes('Session Summary'));
    if(shib !== undefined && SsoSession.includes('Session Summary')) {
      return true;
    }
    else{
      return null;
    }
  }

  return (
    <main className="c-main">
      <CContainer fluid>
        <Suspense fallback={loading}>
          <Switch>
            {routes.map((route, idx) => {
              return route.component && (
                <Route
                  key={idx}
                  path={route.path}
                  exact={route.exact}
                  name={route.name}

                  render={props =>
                    get_token_from_storage_or_cookie() !== null
                   ? (
                      <route.component {...props} />
                    ) : (
                      <Redirect to={{ pathname: "/sso" }} />
                    )
                  }


                  // render={props => (
                  //   <CFade>
                  //     <route.component {...props} />
                  //   </CFade>
                  // )}
                  />
              )
            })}
            <Redirect from="/" to="/dashboard" />
          </Switch>
        </Suspense>
      </CContainer>
    </main>
  )
}

export default React.memo(TheContent)