matthias/dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fixes

Browse Source
This commit is contained in:
Matthias Hochmeister
2026-03-03 13:27:27 +01:00
parent 02cf5138cf
commit 004b141cab
4 changed files with 42 additions and 233 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
frontend/src/pages/Dashboard.tsx
View File

@@ -2,8 +2,6 @@ import { useState, useEffect } from 'react';
import {
Container,
Box,
Typography,
Grid,
Fade,
} from '@mui/material';
import { useAuth } from '../contexts/AuthContext';
@@ -12,7 +10,6 @@ import SkeletonCard from '../components/shared/SkeletonCard';
import UserProfile from '../components/dashboard/UserProfile';
import NextcloudTalkWidget from '../components/dashboard/NextcloudTalkWidget';
import UpcomingEventsWidget from '../components/dashboard/UpcomingEventsWidget';
import ActivityFeed from '../components/dashboard/ActivityFeed';
import AtemschutzDashboardCard from '../components/atemschutz/AtemschutzDashboardCard';
import EquipmentDashboardCard from '../components/equipment/EquipmentDashboardCard';
import VehicleDashboardCard from '../components/vehicles/VehicleDashboardCard';
@@ -33,25 +30,22 @@ function Dashboard() {
return (
<DashboardLayout>
<Container maxWidth={false} disableGutters>
<Grid container spacing={3}>
{/* Welcome Message */}
<Grid item xs={12}>
{dataLoading ? (
<SkeletonCard variant="basic" />
) : (
<Fade in={true} timeout={600}>
<Box>
<Typography variant="h4" gutterBottom>
Willkommen zurück, {user?.given_name || user?.name.split(' ')[0]}!
</Typography>
</Box>
</Fade>
)}
</Grid>
{/* User Profile Card */}
<Box
sx={{
display: 'grid',
gridTemplateColumns: {
xs: '1fr',
sm: 'repeat(2, 1fr)',
lg: 'repeat(3, 1fr)',
xl: 'repeat(4, 1fr)',
},
gap: 2.5,
alignItems: 'start',
}}
>
{/* User Profile Card — full width, contains welcome greeting */}
{user && (
<Grid item xs={12}>
<Box sx={{ gridColumn: '1 / -1' }}>
{dataLoading ? (
<SkeletonCard variant="detailed" />
) : (
@@ -61,82 +55,69 @@ function Dashboard() {
</Box>
</Fade>
)}
</Grid>
</Box>
)}
{/* Personal Atemschutz Warnings — shown only when relevant */}
{/* Personal Warnings Banner — full width, conditionally rendered */}
{user && (
<Grid item xs={12}>
<Box sx={{ gridColumn: '1 / -1' }}>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '150ms' }}>
<Box>
<PersonalWarningsBanner user={user} />
</Box>
</Fade>
</Grid>
</Box>
)}
{/* Vehicle Status Card */}
<Grid item xs={12} md={6} sx={{ display: 'flex' }}>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '380ms' }}>
<Box sx={{ height: '100%' }}>
<Box>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '300ms' }}>
<Box>
<VehicleDashboardCard />
</Box>
</Fade>
</Grid>
</Box>
{/* Equipment Status Card */}
<Grid item xs={12} md={6} sx={{ display: 'flex' }}>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '450ms' }}>
<Box sx={{ height: '100%' }}>
<Box>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '350ms' }}>
<Box>
<EquipmentDashboardCard />
</Box>
</Fade>
</Grid>
</Box>
{/* Atemschutz Status Card */}
<Grid item xs={12} md={6} sx={{ display: 'flex' }}>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '420ms' }}>
<Box sx={{ height: '100%' }}>
<Box>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '400ms' }}>
<Box>
<AtemschutzDashboardCard />
</Box>
</Fade>
</Grid>
</Box>
{/* Upcoming Events Widget */}
<Grid item xs={12} md={6} sx={{ display: 'flex' }}>
<Box>
<Fade in={!dataLoading} timeout={600} style={{ transitionDelay: '440ms' }}>
<Box sx={{ height: '100%' }}>
<Box>
<UpcomingEventsWidget />
</Box>
</Fade>
</Grid>
</Box>
{/* Nextcloud Talk Widget */}
<Grid item xs={12} md={6} lg={5} sx={{ display: 'flex' }}>
<Box>
{dataLoading ? (
<SkeletonCard variant="basic" />
) : (
<Fade in={true} timeout={600} style={{ transitionDelay: '520ms' }}>
<Box sx={{ height: '100%' }}>
<Fade in={true} timeout={600} style={{ transitionDelay: '480ms' }}>
<Box>
<NextcloudTalkWidget />
</Box>
</Fade>
)}
</Grid>
{/* Activity Feed */}
<Grid item xs={12} md={6} lg={7} sx={{ display: 'flex' }}>
{dataLoading ? (
<SkeletonCard variant="detailed" />
) : (
<Fade in={true} timeout={600} style={{ transitionDelay: '550ms' }}>
<Box sx={{ height: '100%' }}>
<ActivityFeed />
</Box>
</Fade>
)}
</Grid>
</Grid>
</Box>
</Box>
</Container>
</DashboardLayout>
);