77 lines
2.4 KiB
JavaScript

import React, { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
// import {
// useDashboardProjectsCardData,
// useDashboardTeamsCardData,
// useDashboardTasksCardData,
// useAttendanceOverviewData
// } from "../../hooks/useDashboard_Data";
// import Projects from "./Projects";
// import Teams from "./Teams";
// import TasksCard from "./Tasks";
// import ProjectCompletionChart from "./ProjectCompletionChart";
// import ProjectProgressChart from "./ProjectProgressChart";
// import ProjectOverview from "../Project/ProjectOverview";
import AttendanceOverview from "./AttendanceOverview";
import { useSelectedProject } from "../../slices/apiDataManager";
import { useProjectName } from "../../hooks/useProjects";
import ExpenseAnalysis from "./ExpenseAnalysis";
import ExpenseStatus from "./ExpenseStatus";
import ExpenseByProject from "./ExpenseByProject";
import { useHasUserPermission } from "../../hooks/useHasUserPermission";
import {
APPROVE_EXPENSE,
EXPENSE_MANAGE,
VIEW_ALL_EXPNESE,
} from "../../utils/constants";
import { useHasAnyPermission } from "../../hooks/useExpense";
const Dashboard = () => {
// const { projectsCardData } = useDashboardProjectsCardData();
// const { teamsCardData } = useDashboardTeamsCardData();
// const { tasksCardData } = useDashboardTasksCardData();
// Get the selected project ID from Redux store
const projectId = useSelector((store) => store.localVariables.projectId);
const isAllProjectsSelected = projectId === null;
const isViewExpense = useHasAnyPermission(
VIEW_ALL_EXPNESE,
APPROVE_EXPENSE,
EXPENSE_MANAGE
);
return (
<div className="container-fluid py-5">
{isViewExpense && (
<div className="row mb-6 g-6">
<div className="col-12 col-xl-8">
<div className="card h-100">
<ExpenseAnalysis />
</div>
</div>
<div className="col-12 col-xl-4 col-md-6">
<div className="card h-100">
<ExpenseStatus />
</div>
</div>
</div>
)}
<div className="row vh-100">
{!isAllProjectsSelected && (
<div className="col-12 col-md-6 mb-sm-0 mb-4 ">
<AttendanceOverview />
</div>
)}
<div className="col-12 col-md-6">
<ExpenseByProject />
</div>
</div>
</div>
);
};
export default Dashboard;