administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-07-29 15:19:00 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

UI tweaks (#22405)
CI / AMD64 Build (push) Has been cancelled
Details
CI / ARM Build (push) Has been cancelled
Details
CI / Jetson Jetpack 6 (push) Has been cancelled
Details
CI / ARM Extra Build (push) Has been cancelled
Details
CI / Synaptics Build (push) Has been cancelled
Details
CI / AMD64 Extra Build (push) Has been cancelled
Details
CI / Assemble and push default build (push) Has been cancelled
Details

Browse Source 
* add shm frame lifetime calculation and update UI for shared memory metrics

* consistent sizing on activity indicator in save buttons

* fix offline overlay overflowing on mobile when in grid mode
This commit is contained in:
Josh Hawkins
2026-03-12 16:57:42 -06:00
committed by GitHub
parent 0c988da485
commit 324953d3a5
17 changed files with 147 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/views/settings/EnrichmentsSettingsView.tsx
+1 -1
View File
@@ -603,7 +603,7 @@ export default function EnrichmentsSettingsView({
>
{isLoading ? (
<div className="flex flex-row items-center gap-2">
<ActivityIndicator />
<ActivityIndicator className="size-4" />
<span>{t("button.saving", { ns: "common" })}</span>
</div>
) : (
web/src/views/settings/MotionTunerView.tsx
+1 -1
View File
@@ -299,7 +299,7 @@ export default function MotionTunerView({
>
{isLoading ? (
<div className="flex flex-row items-center gap-2">
<ActivityIndicator />
<ActivityIndicator className="size-4" />
<span>{t("button.saving", { ns: "common" })}</span>
</div>
) : (
web/src/views/system/StorageMetrics.tsx
+90 -36
View File
@@ -89,6 +89,35 @@ export default function StorageMetrics({
timezone,
);
const shmFrameLifetime = useMemo(() => {
if (!stats || !config) {
return undefined;
}
const shmFrameCount = stats.service.storage["/dev/shm"]?.shm_frame_count;
if (!shmFrameCount || shmFrameCount <= 0) {
return undefined;
}
let maxCameraFps = 0;
for (const [name, camStats] of Object.entries(stats.cameras)) {
if (config.cameras[name]?.enabled && camStats.camera_fps > 0) {
maxCameraFps = Math.max(maxCameraFps, camStats.camera_fps);
}
}
if (maxCameraFps === 0) {
return undefined;
}
return {
frames: shmFrameCount,
lifetime: Math.round((shmFrameCount / maxCameraFps) * 10) / 10,
};
}, [stats, config]);
if (!cameraStorage || !stats || !totalStorage || !config) {
return;
}
@@ -148,43 +177,68 @@ export default function StorageMetrics({
<div className="flex-col rounded-lg bg-background_alt p-2.5 md:rounded-2xl">
<div className="mb-5 flex flex-row items-center justify-between">
/dev/shm
{stats.service.storage["/dev/shm"]["total"] <
(stats.service.storage["/dev/shm"]["min_shm"] ?? 0) && (
<Popover>
<PopoverTrigger asChild>
<button
className="focus:outline-none"
aria-label={t("storage.shm.title")}
>
<FaExclamationTriangle
className="size-5 text-danger"
aria-label={t("storage.shm.title")}
/>
</button>
</PopoverTrigger>
<PopoverContent className="w-80">
<div className="space-y-2">
{t("storage.shm.warning", {
total: stats.service.storage["/dev/shm"]["total"],
min_shm: stats.service.storage["/dev/shm"]["min_shm"],
})}
<div className="mt-2 flex items-center text-primary">
<Link
to={getLocaleDocUrl(
"frigate/installation#calculating-required-shm-size",
)}
target="_blank"
rel="noopener noreferrer"
className="inline"
>
{t("readTheDocumentation", { ns: "common" })}
<LuExternalLink className="ml-2 inline-flex size-3" />
</Link>
<div className="flex flex-row items-center gap-2">
{shmFrameLifetime && (
<Popover>
<PopoverTrigger asChild>
<button
className="focus:outline-none"
aria-label={t("storage.shm.frameLifetime.title")}
>
<CiCircleAlert
className="size-5"
aria-label={t("storage.shm.frameLifetime.title")}
/>
</button>
</PopoverTrigger>
<PopoverContent className="w-80">
<div className="space-y-2">
{t("storage.shm.frameLifetime.description", {
frames: shmFrameLifetime.frames,
lifetime: shmFrameLifetime.lifetime,
})}
</div>
</div>
</PopoverContent>
</Popover>
)}
</PopoverContent>
</Popover>
)}
{stats.service.storage["/dev/shm"]["total"] <
(stats.service.storage["/dev/shm"]["min_shm"] ?? 0) && (
<Popover>
<PopoverTrigger asChild>
<button
className="focus:outline-none"
aria-label={t("storage.shm.title")}
>
<FaExclamationTriangle
className="size-5 text-danger"
aria-label={t("storage.shm.title")}
/>
</button>
</PopoverTrigger>
<PopoverContent className="w-80">
<div className="space-y-2">
{t("storage.shm.warning", {
total: stats.service.storage["/dev/shm"]["total"],
min_shm: stats.service.storage["/dev/shm"]["min_shm"],
})}
<div className="mt-2 flex items-center text-primary">
<Link
to={getLocaleDocUrl(
"frigate/installation#calculating-required-shm-size",
)}
target="_blank"
rel="noopener noreferrer"
className="inline"
>
{t("readTheDocumentation", { ns: "common" })}
<LuExternalLink className="ml-2 inline-flex size-3" />
</Link>
</div>
</div>
</PopoverContent>
</Popover>
)}
</div>
</div>
<StorageGraph
graphId="general-shared-memory"