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

fix: render ChatContent as DashboardLayout child so useChat has ChatProvider in scope

Browse Source
This commit is contained in:
Matthias Hochmeister
2026-03-27 18:03:54 +01:00
parent c1b4a92a12
commit 60e1329815
1 changed files with 53 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
frontend/src/pages/Chat.tsx
View File

@@ -10,7 +10,7 @@ import { notificationsApi } from '../services/notifications';
import ChatRoomList from '../components/chat/ChatRoomList';
import ChatMessageView from '../components/chat/ChatMessageView';
const ChatPage: React.FC = () => {
const ChatContent: React.FC = () => {
const { rooms, selectedRoomToken, connected } = useChat();
const queryClient = useQueryClient();
const markedRoomsRef = React.useRef(new Set<string>());
@@ -44,53 +44,59 @@ const ChatPage: React.FC = () => {
}, [selectedRoomToken, queryClient]);
return (
<DashboardLayout>
<Box
sx={{
height: 'calc(100vh - 112px)',
display: 'flex',
border: 1,
borderColor: 'divider',
borderRadius: 1,
overflow: 'hidden',
}}
>
{!connected ? (
<Box sx={{ p: 3, display: 'flex', alignItems: 'center' }}>
<Typography variant="body1" color="text.secondary">
Nextcloud nicht verbunden. Bitte verbinden Sie sich in den{' '}
<Link to="/settings" style={{ color: 'inherit' }}>Einstellungen</Link>.
</Typography>
<Box
sx={{
height: 'calc(100vh - 112px)',
display: 'flex',
border: 1,
borderColor: 'divider',
borderRadius: 1,
overflow: 'hidden',
}}
>
{!connected ? (
<Box sx={{ p: 3, display: 'flex', alignItems: 'center' }}>
<Typography variant="body1" color="text.secondary">
Nextcloud nicht verbunden. Bitte verbinden Sie sich in den{' '}
<Link to="/settings" style={{ color: 'inherit' }}>Einstellungen</Link>.
</Typography>
</Box>
) : (
<>
<Box
sx={{
width: 280,
flexShrink: 0,
borderRight: 1,
borderColor: 'divider',
display: 'flex',
flexDirection: 'column',
overflow: 'hidden',
}}
>
<ChatRoomList />
</Box>
) : (
<>
<Box
sx={{
width: 280,
flexShrink: 0,
borderRight: 1,
borderColor: 'divider',
display: 'flex',
flexDirection: 'column',
overflow: 'hidden',
}}
>
<ChatRoomList />
</Box>
<Box sx={{ flex: 1, minWidth: 0, display: 'flex', flexDirection: 'column', overflow: 'hidden' }}>
{selectedRoomToken ? (
<ChatMessageView />
) : (
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' }}>
<Typography variant="body1" color="text.secondary">
Wähle ein Gespräch aus, um zu beginnen.
</Typography>
</Box>
)}
</Box>
</>
)}
</Box>
<Box sx={{ flex: 1, minWidth: 0, display: 'flex', flexDirection: 'column', overflow: 'hidden' }}>
{selectedRoomToken ? (
<ChatMessageView />
) : (
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' }}>
<Typography variant="body1" color="text.secondary">
Wähle ein Gespräch aus, um zu beginnen.
</Typography>
</Box>
)}
</Box>
</>
)}
</Box>
);
};
const ChatPage: React.FC = () => {
return (
<DashboardLayout>
<ChatContent />
</DashboardLayout>
);
};