import * as icon from '@mdi/js';
import Head from 'next/head'
import React from 'react'
import axios from 'axios';
import type { ReactElement } from 'react'
import LayoutAuthenticated from '../layouts/Authenticated'
import SectionMain from '../components/SectionMain'
import SectionTitleLineWithButton from '../components/SectionTitleLineWithButton'
import BaseIcon from "../components/BaseIcon";
import Link from "next/link";
import { useAppSelector } from '../stores/hooks';
const Dashboard = () => {
const iconsColor = useAppSelector((state) => state.style.iconsColor);
const corners = useAppSelector((state) => state.style.corners);
const cardsStyle = useAppSelector((state) => state.style.cardsStyle);
const loadingMessage = 'Loading...'
const [users, setUsers] = React.useState(loadingMessage);
const [events, setEvents] = React.useState(loadingMessage);
const [memories, setMemories] = React.useState(loadingMessage);
async function loadData() {
const entities = ['users','events','memories',];
const fns = [setUsers,setEvents,setMemories,];
const requests = entities.map((entity, index) => {
return axios.get(`/${entity.toLowerCase()}/count`);
});
Promise.allSettled(requests).then((results) => {
results.forEach((result, i) => {
if (result.status === 'fulfilled') {
fns[i](result.value.data.count);
} else {
fns[i](result.reason.message);
}
});
});
}
React.useEffect(() => {
loadData().then();
}, []);
return (
<>
{'Overview'}
{''}
)
}
Dashboard.getLayout = function getLayout(page: ReactElement) {
return {page}
}
export default Dashboard