endery/voxblog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: remove AdminLayout wrapper and improve editor shell layout responsiveness

Browse Source
This commit is contained in:
Ender 2025-10-24 21:35:56 +02:00
parent a035d19a5a
commit d63f450be0
2 changed files with 6 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
apps/admin/src/components/EditorShell.tsx
View File

@ -1,5 +1,4 @@
import { Box, Button, Stack, Typography, TextField, MenuItem, Snackbar, Alert, Stepper, Step, StepLabel, StepButton } from '@mui/material';
import AdminLayout from '../layout/AdminLayout';
import type { RichEditorHandle } from './RichEditor';
import StepAssets from './steps/StepAssets';
import StepAiPrompt from './steps/StepAiPrompt';
@ -47,7 +46,7 @@ export default function EditorShell({ onLogout, initialPostId, onBack }: { onLog
// No inline post switching here; selection happens on Posts page
return (
<AdminLayout title="VoxBlog Admin" onLogout={onLogout}>
<Box sx={{ minHeight: '100dvh', display: 'flex', flexDirection: 'column', p: { xs: 2, md: 3 }, overflow: 'hidden' }}>
<Snackbar
open={!!toast?.open}
autoHideDuration={2500}
@ -58,9 +57,9 @@ export default function EditorShell({ onLogout, initialPostId, onBack }: { onLog
{toast?.message || ''}
</Alert>
</Snackbar>
<Box sx={{ display: { md: 'grid' }, gridTemplateColumns: { md: '300px 1fr' }, gap: 2 }}>
<Box sx={{ display: { md: 'grid' }, gridTemplateColumns: { md: '300px 1fr' }, gap: 2, height: '100%', minHeight: 0, overflow: 'hidden' }}>
{/* Left sticky sidebar: Post controls */}
<Box sx={{ position: 'sticky', top: 12, alignSelf: 'start', border: '1px solid', borderColor: 'divider', borderRadius: 1, p: 2 }}>
<Box sx={{ position: 'sticky', top: 12, alignSelf: 'start', border: '1px solid', borderColor: 'divider', borderRadius: 1, p: 2, maxHeight: '100%', overflowY: 'auto' }}>
<Typography variant="subtitle1" sx={{ mb: 1 }}>Post</Typography>
<Stack spacing={1}>
<TextField
@ -97,7 +96,7 @@ export default function EditorShell({ onLogout, initialPostId, onBack }: { onLog
</Box>
{/* Right content: Stepper and step panels */}
<Box sx={{ display: 'grid', gridTemplateRows: 'auto 1fr auto', height: '85vh', minHeight: 500, overflow: 'hidden' }}>
<Box sx={{ display: 'grid', gridTemplateRows: 'auto 1fr auto', height: '100%', minHeight: 0, overflow: 'hidden' }}>
<Stepper nonLinear activeStep={activeStep} sx={{ mb: 2 }}>
{[ 'Assets', 'AI Prompt', 'Generate', 'Edit', 'Metadata', 'Publish' ].map((label, idx) => (
<Step key={label} completed={false}>
@ -187,6 +186,6 @@ export default function EditorShell({ onLogout, initialPostId, onBack }: { onLog
</Box>
</Box>
</Box>
</AdminLayout>
</Box>
);
}

2
apps/admin/src/layout/AdminLayout.tsx
View File

@ -18,7 +18,7 @@ export default function AdminLayout({ title, onLogout, children }: { title?: str
)}
</Toolbar>
</AppBar>
<Container maxWidth="lg" sx={{ py: 3, flex: 1 }}>
<Container maxWidth="lg" sx={{ py: 3, flex: 1, display: 'flex', flexDirection: 'column', minHeight: 0, overflow: 'hidden' }}>
{children}
</Container>
</Box>