@craftercms/studio-ui
Version:
Services, components, models & utils to build CrafterCMS authoring extensions.
119 lines (117 loc) • 4.89 kB
JavaScript
/*
* Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License version 3 as published by
* the Free Software Foundation.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
/*
* Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License version 3 as published by
* the Free Software Foundation.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import Box from '@mui/material/Box';
import React from 'react';
// import { useEffect, Suspense } from 'react';
// import useSiteUIConfig from '../../hooks/useSiteUIConfig';
// import useDashboardState from '../../hooks/useDashboardState';
// import useActiveUser from '../../hooks/useActiveUser';
// import useActiveSiteId from '../../hooks/useActiveSiteId';
// import { useDispatch } from 'react-redux';
// import { initDashboardConfig } from '../../state/actions/dashboard';
// import { renderWidgets } from '../Widget';
// import EmptyState from '../EmptyState';
// import { FormattedMessage } from 'react-intl';
// import Skeleton from '@mui/material/Skeleton';
import { useTheme } from '@mui/material/styles';
import Grid from '@mui/material/Grid';
import ActivityDashlet from '../ActivityDashlet/ActivityDashlet';
import PendingApprovalDashlet from '../PendingApprovalDashlet/PendingApprovalDashlet';
import ExpiringDashlet from '../ExpiringDashlet/ExpiringDashlet';
import UnpublishedDashlet from '../UnpublishedDashlet/UnpublishedDashlet';
import ScheduledDashlet from '../ScheduledDashlet/ScheduledDashlet';
import RecentlyPublishedDashlet from '../RecentlyPublishedDashlet/RecentlyPublishedDashlet';
import DevContentOpsDashlet from '../DevContentOpsDashlet/DevContentOpsDashlet';
// TODO: Uncomment below when dashboard apis are ready and we can go back to making these the primary dashboards.
export function Dashboard(props) {
const {
palette: { mode }
} = useTheme();
// const site = useActiveSiteId();
// const user = useActiveUser();
// const userRoles = user.rolesBySite[site];
// const uiConfig = useSiteUIConfig();
// const dashboard = useDashboardState();
// const dispatch = useDispatch();
// useEffect(() => {
// if (uiConfig.xml && !dashboard) {
// dispatch(initDashboardConfig({ configXml: uiConfig.xml }));
// }
// }, [uiConfig.xml, dashboard, dispatch]);
const height = 300;
return React.createElement(
Box,
{ sx: { p: 2, bgcolor: `grey.${mode === 'light' ? 100 : 800}`, minHeight: '100vh' } },
React.createElement(
Grid,
{ container: true, spacing: 2 },
React.createElement(Grid, { item: true, md: 4 }, React.createElement(ActivityDashlet, { contentHeight: height })),
React.createElement(
Grid,
{ item: true, md: 4 },
React.createElement(PendingApprovalDashlet, { contentHeight: height })
),
React.createElement(Grid, { item: true, md: 4 }, React.createElement(ExpiringDashlet, { contentHeight: height })),
React.createElement(
Grid,
{ item: true, md: 4 },
React.createElement(UnpublishedDashlet, { contentHeight: height })
),
React.createElement(
Grid,
{ item: true, md: 4 },
React.createElement(ScheduledDashlet, { contentHeight: height })
),
React.createElement(
Grid,
{ item: true, md: 4 },
React.createElement(RecentlyPublishedDashlet, { contentHeight: height })
),
React.createElement(
Grid,
{ item: true, md: 4 },
React.createElement(DevContentOpsDashlet, { contentHeight: height })
)
)
);
}
// function DashboardSkeleton() {
// return (
// <Grid container spacing={2}>
// {new Array(3).fill(null).map((nothing, index) => (
// <Grid item md={4} key={index}>
// <Skeleton variant="rectangular" sx={{ height: 350 }} />
// </Grid>
// ))}
// </Grid>
// );
// }
export default Dashboard;