alex/manage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

redesign

Browse Source
This commit is contained in:
Alex
2026-05-04 17:24:41 +02:00
parent f1694ac99b
commit 7950bc9f64
10 changed files with 255 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/src/media_library_viewer_api/services/mailer.py
+116 -41
View File
@@ -328,6 +328,7 @@ def send_email_message(
attempts: list[dict[str, Any]] = []
last_error = ""
fallback_from_address = smtp_username if smtp_username and smtp_username != from_address else None
for mode in _smtp_mode_candidates(settings):
meta = _smtp_attempt_metadata(mode)
logger.info(
@@ -341,40 +342,6 @@ def send_email_message(
)
try:
_send_email_via_mode(mode, message, recipients, from_address)
attempts.append(
{
"label": meta["label"],
"smtp_host": meta["smtp_host"],
"smtp_port": meta["smtp_port"],
"use_tls": meta["use_tls"],
"use_ssl": meta["use_ssl"],
"status": "ok",
}
)
logger.info(
"SMTP send succeeded label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s",
meta["label"],
meta["smtp_host"],
meta["smtp_port"],
meta["transport"],
meta["auth_user"],
from_address,
)
return {
"from_address": from_address,
"recipient_count": len(recipients),
"attachment_count": len(attachment_list),
"subject": subject,
"authenticated_as": smtp_username or None,
"selected_mode": {
"label": meta["label"],
"smtp_host": meta["smtp_host"],
"smtp_port": meta["smtp_port"],
"use_tls": meta["use_tls"],
"use_ssl": meta["use_ssl"],
},
"attempts": attempts,
}
except Exception as exc:
last_error = describe_smtp_error(exc)
attempts.append(
@@ -388,9 +355,9 @@ def send_email_message(
"error": last_error,
}
)
if _smtp_sender_not_authorized(exc):
if _smtp_sender_not_authorized(exc) and fallback_from_address:
logger.warning(
"SMTP send sender rejected label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s error=%s",
"SMTP send sender rejected label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s error=%s; retrying with smtp_username",
meta["label"],
meta["smtp_host"],
meta["smtp_port"],
@@ -399,16 +366,124 @@ def send_email_message(
from_address,
last_error,
)
else:
logger.warning(
"SMTP send failed label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s error=%s",
fallback_message, fallback_from = build_email_message(
settings,
recipients,
subject,
html_body,
text_body,
attachment_list,
sender_address=fallback_from_address,
reply_to_address=from_address,
)
try:
_send_email_via_mode(mode, fallback_message, recipients, fallback_from)
except Exception as fallback_exc:
last_error = describe_smtp_error(fallback_exc)
attempts.append(
{
"label": meta["label"],
"smtp_host": meta["smtp_host"],
"smtp_port": meta["smtp_port"],
"use_tls": meta["use_tls"],
"use_ssl": meta["use_ssl"],
"status": "failed",
"error": last_error,
"sender_fallback": True,
}
)
logger.warning(
"SMTP send fallback failed label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s error=%s",
meta["label"],
meta["smtp_host"],
meta["smtp_port"],
meta["transport"],
meta["auth_user"],
fallback_from,
last_error,
)
continue
attempts.append(
{
"label": meta["label"],
"smtp_host": meta["smtp_host"],
"smtp_port": meta["smtp_port"],
"use_tls": meta["use_tls"],
"use_ssl": meta["use_ssl"],
"status": "ok",
"sender_fallback": True,
}
)
logger.info(
"SMTP send succeeded via smtp_username label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s",
meta["label"],
meta["smtp_host"],
meta["smtp_port"],
meta["transport"],
meta["auth_user"],
from_address,
last_error,
fallback_from,
)
return {
"from_address": fallback_from,
"recipient_count": len(recipients),
"attachment_count": len(attachment_list),
"subject": subject,
"authenticated_as": smtp_username or None,
"selected_mode": {
"label": meta["label"],
"smtp_host": meta["smtp_host"],
"smtp_port": meta["smtp_port"],
"use_tls": meta["use_tls"],
"use_ssl": meta["use_ssl"],
},
"attempts": attempts,
}
logger.warning(
"SMTP send failed label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s error=%s",
meta["label"],
meta["smtp_host"],
meta["smtp_port"],
meta["transport"],
meta["auth_user"],
from_address,
last_error,
)
continue
attempts.append(
{
"label": meta["label"],
"smtp_host": meta["smtp_host"],
"smtp_port": meta["smtp_port"],
"use_tls": meta["use_tls"],
"use_ssl": meta["use_ssl"],
"status": "ok",
}
)
logger.info(
"SMTP send succeeded label=%s host=%s port=%s transport=%s auth_user=%s from_address=%s",
meta["label"],
meta["smtp_host"],
meta["smtp_port"],
meta["transport"],
meta["auth_user"],
from_address,
)
return {
"from_address": from_address,
"recipient_count": len(recipients),
"attachment_count": len(attachment_list),
"subject": subject,
"authenticated_as": smtp_username or None,
"selected_mode": {
"label": meta["label"],
"smtp_host": meta["smtp_host"],
"smtp_port": meta["smtp_port"],
"use_tls": meta["use_tls"],
"use_ssl": meta["use_ssl"],
},
"attempts": attempts,
}
raise RuntimeError(last_error or "SMTP delivery failed")
backend/tests/test_mailer.py
+18 -13
View File
@@ -103,7 +103,7 @@ class MailerTests(unittest.TestCase):
self.assertEqual(result["attempts"][1]["status"], "ok")
fallback_smtp.send_message.assert_called_once()
def test_send_email_message_rejects_unauthorized_from_address(self) -> None:
def test_send_email_message_retries_with_smtp_username_when_from_is_rejected(self) -> None:
settings = SimpleNamespace(
smtp_host="smtp.example.com",
smtp_port=587,
@@ -116,25 +116,30 @@ class MailerTests(unittest.TestCase):
smtp_timeout=15,
)
smtp = MagicMock()
smtp.send_message.side_effect = smtplib.SMTPDataError(
551, b"5.7.1 Not authorised to send from this header address"
)
smtp.send_message.side_effect = [
smtplib.SMTPDataError(551, b"5.7.1 Not authorised to send from this header address"),
{},
]
smtp_factory = MagicMock(return_value=_SMTPContext(smtp))
with patch("media_library_viewer_api.services.mailer.smtplib.SMTP", smtp_factory), patch(
"media_library_viewer_api.services.mailer.smtplib.SMTP_SSL"
) as smtp_ssl:
with self.assertRaises(RuntimeError) as ctx:
send_email_message(
settings,
recipients=["alex@example.com"],
subject="Hello",
html_body="<p>Hello</p>",
)
result = send_email_message(
settings,
recipients=["alex@example.com"],
subject="Hello",
html_body="<p>Hello</p>",
)
smtp_ssl.assert_not_called()
self.assertIn("authorized alias", str(ctx.exception).lower())
self.assertEqual(smtp.send_message.call_count, 1)
self.assertEqual(result["from_address"], "mailer@example.com")
self.assertEqual(smtp.send_message.call_count, 2)
first_message = smtp.send_message.call_args_list[0].args[0]
second_message = smtp.send_message.call_args_list[1].args[0]
self.assertEqual(first_message["From"], "Manage <alias@example.com>")
self.assertEqual(second_message["From"], "Manage <mailer@example.com>")
self.assertEqual(second_message["Reply-To"], "alias@example.com")
def test_describe_smtp_error_handles_timeout(self) -> None:
detail = describe_smtp_error(TimeoutError("timed out"))
docs/REQUIREMENTS.md
+2
View File
@@ -61,6 +61,7 @@ Phase 1: Jellyfin media index, SSH-based remote filesystem inspection, server mo
- The shared session table should keep a compact overall status summary line above the rows that reports total sessions plus playing, paused, and idle counts.
- The shared session table should keep the session identifier under the user name in a caption instead of giving it a full column, to keep the table tighter.
- The Users tab may open a read-only detail drawer for a selected user, but any communication actions in that drawer should remain clearly disabled/placeholders until the workflow is implemented.
- The frontend shell and primary pages should remain responsive and mobile-safe, with compact navigation, stacked controls on narrow screens, and reduced table column density where needed.
- Backend startup should log a secret-safe configuration summary and request/activity diagnostics so configuration issues can be debugged without exposing API keys.
### Remote Filesystem over SSH
@@ -173,3 +174,4 @@ Phase 1: Jellyfin media index, SSH-based remote filesystem inspection, server mo
- 2026-05-03: Updated the dashboard monitoring cards to show 10-minute averages with high/low subtext instead of only the latest sample.
- 2026-05-03: Added OIDC/JWT auth support plus root-level Docker Compose deployment files for production and dev workflows.
- 2026-05-04: Backend Docker Compose now mounts a host SSH directory into `/root/.ssh` so Paramiko can use a private key and strict host-key checking without baking secrets into the image.
- 2026-05-04: The frontend was adjusted to be more mobile-safe by making the app shell tabs scrollable, stacking header controls on narrow screens, and hiding low-priority table columns on smaller displays.
frontend/src/App.tsx
+65 -27
View File
@@ -49,20 +49,75 @@ function Shell({
}) {
const location = useLocation();
const current = location.pathname;
const isMobile = useMediaQuery("(max-width: 900px)");
return (
<>
<CssBaseline />
<AppBar position="sticky" color="inherit" elevation={0}>
<Toolbar sx={{ display: "flex", gap: 2, minHeight: 68 }}>
<Typography variant="h6" sx={{ mr: 2, fontWeight: 700 }}>
Manage
</Typography>
<Toolbar
sx={{
display: "flex",
flexDirection: { xs: "column", md: "row" },
alignItems: { xs: "stretch", md: "center" },
gap: 1,
py: { xs: 1, md: 0 },
minHeight: { xs: "auto", md: 68 },
}}
>
<Box
sx={{
display: "flex",
alignItems: "center",
justifyContent: "space-between",
width: "100%",
gap: 1.5,
}}
>
<Typography variant="h6" sx={{ fontWeight: 700, lineHeight: 1 }}>
Manage
</Typography>
<Stack
direction="row"
spacing={0.75}
sx={{
alignItems: "center",
flexWrap: "wrap",
justifyContent: "flex-end",
}}
>
{authLabel && (
<Chip size="small" variant="outlined" label={authLabel} />
)}
<Chip
size="small"
variant="outlined"
label={darkMode ? "Dark" : "Light"}
/>
{onSignOut && (
<Button size="small" variant="text" onClick={onSignOut}>
Sign out
</Button>
)}
</Stack>
</Box>
<Tabs
value={current}
textColor="primary"
indicatorColor="primary"
sx={{ flex: 1 }}
variant={isMobile ? "scrollable" : "standard"}
scrollButtons="auto"
allowScrollButtonsMobile
sx={{
width: "100%",
minHeight: 40,
"& .MuiTab-root": {
minHeight: 40,
py: 1,
px: 1.25,
minWidth: { xs: 96, md: 120 },
},
}}
>
<Tab value="/" label="Dashboard" component={NavLink} to="/" />
<Tab
@@ -73,31 +128,14 @@ function Shell({
/>
<Tab value="/media" label="Media" component={NavLink} to="/media" />
<Tab value="/users" label="Users" component={NavLink} to="/users" />
<Tab
value="/files"
label="File Browser"
component={NavLink}
to="/files"
/>
<Tab value="/files" label="Files" component={NavLink} to="/files" />
</Tabs>
<Stack direction="row" spacing={1} sx={{ alignItems: "center" }}>
{authLabel && (
<Chip size="small" variant="outlined" label={authLabel} />
)}
<Chip
size="small"
variant="outlined"
label={darkMode ? "Dark" : "Light"}
/>
{onSignOut && (
<Button size="small" variant="text" onClick={onSignOut}>
Sign out
</Button>
)}
</Stack>
</Toolbar>
</AppBar>
<Container maxWidth={false} sx={{ py: 3 }}>
<Container
maxWidth={false}
sx={{ py: { xs: 2, md: 3 }, px: { xs: 1.5, sm: 2.5, md: 3 } }}
>
<Routes>
<Route path="/" element={<Dashboard />} />
<Route path="/monitoring" element={<Monitoring />} />
frontend/src/components/MetricCard.tsx
+12 -4
View File
@@ -8,8 +8,8 @@ interface Props {
export function MetricCard({ label, value, subtext }: Props) {
return (
<Card variant="outlined">
<CardContent>
<Card variant="outlined" sx={{ height: "100%" }}>
<CardContent sx={{ p: { xs: 1.5, sm: 2 } }}>
<Typography
variant="caption"
color="text.secondary"
@@ -17,14 +17,22 @@ export function MetricCard({ label, value, subtext }: Props) {
>
{label}
</Typography>
<Typography variant="h5" sx={{ mt: 0.5, fontWeight: 700 }}>
<Typography
variant="h5"
sx={{
mt: 0.5,
fontWeight: 700,
fontSize: { xs: "1.05rem", sm: "1.5rem" },
lineHeight: 1.15,
}}
>
{value}
</Typography>
{subtext && (
<Typography
variant="caption"
color="text.secondary"
sx={{ whiteSpace: "pre-line" }}
sx={{ whiteSpace: "pre-line", display: "block", mt: 0.25 }}
>
{subtext}
</Typography>
frontend/src/components/SessionActivityPanel.tsx
+4 -4
View File
@@ -79,7 +79,7 @@ export function SessionActivityPanel({
<TableContainer
component={Paper}
variant="outlined"
sx={{ maxHeight: 280, borderColor: "divider", borderRadius: 1 }}
sx={{ maxHeight: 280, borderColor: "divider", borderRadius: 1, overflowX: "auto" }}
>
<Table size="small" stickyHeader aria-label="Session activity details">
<TableHead>
@@ -198,7 +198,7 @@ export function SessionActivityPanel({
}
/>
</TableCell>
<TableCell sx={{ py: 0.75, minWidth: 140 }}>
<TableCell sx={{ py: 0.75, minWidth: 140, display: { xs: "none", md: "table-cell" } }}>
<Typography
variant="body2"
noWrap
@@ -210,12 +210,12 @@ export function SessionActivityPanel({
{session.type || "—"}
</Typography>
</TableCell>
<TableCell sx={{ py: 0.75, minWidth: 140 }}>
<TableCell sx={{ py: 0.75, minWidth: 140, display: { xs: "none", md: "table-cell" } }}>
<Typography variant="body2" noWrap>
{session.device || "Unknown device"}
</Typography>
</TableCell>
<TableCell sx={{ py: 0.75, whiteSpace: "nowrap" }}>
<TableCell sx={{ py: 0.75, whiteSpace: "nowrap", display: { xs: "none", md: "table-cell" } }}>
<Typography variant="body2" noWrap>
{session.transcoding === "yes"
? session.transcoding_type
frontend/src/index.css
+5
View File
@@ -4,4 +4,9 @@ body,
margin: 0;
width: 100%;
min-height: 100%;
overflow-x: hidden;
}
* {
box-sizing: border-box;
}
frontend/src/pages/FileBrowser.tsx
+7 -4
View File
@@ -17,6 +17,7 @@ import {
Stack,
TextField,
Typography,
useMediaQuery,
} from "@mui/material";
import {
useDirectoryListing,
@@ -538,6 +539,7 @@ function FfprobeDetails({ path, data }: { path: string; data: FfprobeData }) {
export function FileBrowser() {
const [searchParams] = useSearchParams();
const isMobile = useMediaQuery("(max-width: 900px)");
const initialRequestedPath = searchParams.get("path") ?? "/";
const initialSelectedPath =
initialRequestedPath !== "/" &&
@@ -628,7 +630,7 @@ export function FileBrowser() {
<Stack spacing={2}>
<Typography variant="h5">File Browser</Typography>
<Stack direction="row" spacing={1}>
<Stack direction={isMobile ? "column" : "row"} spacing={1}>
<TextField
fullWidth
size="small"
@@ -637,10 +639,10 @@ export function FileBrowser() {
onChange={(e) => setPathInput(e.target.value)}
onKeyDown={handlePathSubmit}
/>
<Button variant="outlined" onClick={() => navigate(pathInput || "/")}>
<Button fullWidth={isMobile} variant="outlined" onClick={() => navigate(pathInput || "/")}>
Open
</Button>
<Button variant="outlined" onClick={() => refetch()}>
<Button fullWidth={isMobile} variant="outlined" onClick={() => refetch()}>
Refresh
</Button>
</Stack>
@@ -667,6 +669,7 @@ export function FileBrowser() {
columns={columns}
loading={isLoading}
rowSelectionModel={rowSelectionModel}
columnVisibilityModel={isMobile ? { ext: false, modified: false } : undefined}
hideFooter
sx={{
"& .MuiDataGrid-columnHeaders": {
@@ -731,7 +734,7 @@ export function FileBrowser() {
</FormControl>
</Grid>
<Grid size={{ xs: 12, md: 8 }}>
<Stack direction="row" spacing={1}>
<Stack direction={isMobile ? "column" : "row"} spacing={1}>
<Button
variant="contained"
disabled={!selectedJob || runJob.isPending}
frontend/src/pages/Media.tsx
+19 -2
View File
@@ -17,10 +17,11 @@ import {
Stack,
TextField,
Typography,
useMediaQuery,
} from "@mui/material";
import {
useMediaStatus,
useMediaQuery,
useMediaQuery as useMediaDataQuery,
useBuildIndex,
useStopBuildIndex,
useForceStopBuildIndex,
@@ -40,6 +41,7 @@ function formatDuration(seconds: number | null | undefined): string {
export function Media() {
const navigate = useNavigate();
const isMobile = useMediaQuery("(max-width: 900px)");
const { data: status } = useMediaStatus();
const buildIndex = useBuildIndex();
const stopBuildIndex = useStopBuildIndex();
@@ -53,7 +55,7 @@ export function Media() {
const [limit] = useState(100);
const [offset, setOffset] = useState(0);
const { data: queryResult, isLoading } = useMediaQuery({
const { data: queryResult, isLoading } = useMediaDataQuery({
types,
search,
hdr_filter: hdrFilter,
@@ -365,6 +367,21 @@ export function Media() {
navigate(`/files?path=${encodeURIComponent(row.path)}`);
}}
pageSizeOptions={[100]}
columnVisibilityModel={
isMobile
? {
series: false,
season: false,
episode: false,
bitrate: false,
video: false,
resolution: false,
date_added: false,
library: false,
path: false,
}
: undefined
}
hideFooter
sx={{
"& .MuiDataGrid-columnHeaders": {
frontend/src/pages/Users.tsx
+7 -1
View File
@@ -36,6 +36,7 @@ import {
TextField,
Tooltip,
Typography,
useMediaQuery,
} from "@mui/material";
import { MetricCard } from "../components/MetricCard";
import { SessionActivityPanel } from "../components/SessionActivityPanel";
@@ -62,6 +63,7 @@ export function UsersPage() {
const { data: activity } = useActivity();
const queueStatusQuery = useUserMessageQueueStatus();
const sendUserMessage = useSendUserMessage();
const isMobile = useMediaQuery("(max-width: 900px)");
const [search, setSearch] = useState("");
const [searchParams, setSearchParams] = useSearchParams();
const [selectedUserIds, setSelectedUserIds] = useState<string[]>([]);
@@ -684,6 +686,7 @@ export function UsersPage() {
py: 1.25,
verticalAlign: "middle",
textAlign: "center",
display: { xs: "none", md: "table-cell" },
}}
>
<Chip
@@ -715,6 +718,7 @@ export function UsersPage() {
py: 1.25,
verticalAlign: "middle",
textAlign: "center",
display: { xs: "none", md: "table-cell" },
}}
>
<Chip
@@ -736,6 +740,7 @@ export function UsersPage() {
py: 1.25,
verticalAlign: "middle",
textAlign: "center",
display: { xs: "none", md: "table-cell" },
}}
>
<Typography variant="body2" sx={{ fontWeight: 600 }}>
@@ -747,6 +752,7 @@ export function UsersPage() {
py: 1.25,
verticalAlign: "middle",
textAlign: "center",
display: { xs: "none", md: "table-cell" },
}}
>
<Chip
@@ -911,7 +917,7 @@ export function UsersPage() {
) : null}
</Drawer>
<Dialog open={composeOpen} onClose={closeCompose} fullWidth maxWidth="md">
<Dialog open={composeOpen} onClose={closeCompose} fullWidth maxWidth="md" fullScreen={isMobile}>
<DialogTitle sx={{ pr: 6 }}>
Message selected users
<IconButton