Set max width on the problems area in status bar and use unique keys so they do not duplicate

This commit is contained in:
Nicolas Mowen 2024-05-18 06:40:54 -06:00
parent a70dd02788
commit 4c756beb0e
2 changed files with 6 additions and 6 deletions

View File

@ -116,7 +116,7 @@ export default function Statusbar() {
);
})}
</div>
<div className="flex h-full items-center gap-2">
<div className="flex h-full items-center gap-2 max-w-[50%] overflow-x-auto no-scrollbar">
{Object.entries(messages).length === 0 ? (
<div className="flex items-center gap-2 text-sm">
<FaCheck className="size-3 text-green-500" />
@ -125,11 +125,11 @@ export default function Statusbar() {
) : (
Object.entries(messages).map(([key, messageArray]) => (
<div key={key} className="flex h-full items-center gap-2">
{messageArray.map(({ id, text, color, link }: StatusMessage) => {
{messageArray.map(({ text, color, link }: StatusMessage) => {
const message = (
<div
key={id}
className={`flex items-center gap-2 text-sm ${link ? "cursor-pointer hover:underline" : ""}`}
key={text}
className={`flex items-center gap-2 text-sm whitespace-nowrap ${link ? "cursor-pointer hover:underline" : ""}`}
>
<IoIosWarning
className={`size-5 ${color || "text-danger"}`}
@ -140,7 +140,7 @@ export default function Statusbar() {
if (link) {
return (
<Link key={id} to={link}>
<Link key={text} to={link}>
{message}
</Link>
);

View File

@ -51,7 +51,7 @@ export default function useStats(stats: FrigateStats | undefined) {
return;
}
if (config.cameras[name].enabled && cam["camera_fps"] == 0) {
if (config.cameras[name].enabled && (cam["camera_fps"] == 0 || true)) {
problems.push({
text: `${capitalizeFirstLetter(name.replaceAll("_", " "))} is offline`,
color: "text-danger",