administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-03-17 21:58:22 +03:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

step 1 and 2 tweaks

Browse Source
This commit is contained in:
Josh Hawkins 2025-10-11 06:34:33 -05:00
parent 78f126b78f
commit c80ecc7fd0
2 changed files with 53 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
web/src/components/settings/Step1NameCamera.tsx
View File

@ -38,6 +38,7 @@ import {
StreamConfig, StreamConfig,
} from "@/types/cameraWizard"; } from "@/types/cameraWizard";
import { FaCircleCheck } from "react-icons/fa6"; import { FaCircleCheck } from "react-icons/fa6";
import { Card, CardContent, CardTitle } from "../ui/card";
type Step1NameCameraProps = { type Step1NameCameraProps = {
wizardData: Partial<WizardFormData>; wizardData: Partial<WizardFormData>;
@ -109,7 +110,7 @@ export default function Step1NameCamera({
wizardData.brandTemplate && wizardData.brandTemplate &&
CAMERA_BRAND_VALUES.includes(wizardData.brandTemplate as CameraBrand) CAMERA_BRAND_VALUES.includes(wizardData.brandTemplate as CameraBrand)
? (wizardData.brandTemplate as CameraBrand) ? (wizardData.brandTemplate as CameraBrand)
: "hikvision", : "dahua",
customUrl: wizardData.customUrl || "", customUrl: wizardData.customUrl || "",
}, },
mode: "onChange", mode: "onChange",
@ -357,10 +358,8 @@ export default function Step1NameCamera({
(brand) => brand.value === field.value, (brand) => brand.value === field.value,
); );
return selectedBrand ? ( return selectedBrand ? (
<FormDescription className="pt-0.5"> <FormDescription className="mt-1 pt-0.5 text-xs text-muted-foreground">
<div className="mt-1 text-xs text-muted-foreground"> {selectedBrand.exampleUrl}
{selectedBrand.exampleUrl}
</div>
</FormDescription> </FormDescription>
) : null; ) : null;
})()} })()}
@ -492,43 +491,51 @@ export default function Step1NameCamera({
</div> </div>
)} )}
<div className="text-sm font-semibold text-primary-variant"> <Card className="p-4">
{t("cameraWizard.step1.streamDetails")} <CardTitle className="mb-2 text-sm">
</div> {t("cameraWizard.step1.streamDetails")}
<div className="text-sm"> </CardTitle>
{testResult.resolution && ( <CardContent className="p-0 text-sm">
<div> {testResult.resolution && (
<span className="text-secondary-foreground"> <div>
{t("cameraWizard.testResultLabels.resolution")}: <span className="text-secondary-foreground">
</span>{" "} {t("cameraWizard.testResultLabels.resolution")}:
<span className="text-primary">{testResult.resolution}</span> </span>{" "}
</div> <span className="text-primary">
)} {testResult.resolution}
{testResult.videoCodec && ( </span>
<div> </div>
<span className="text-secondary-foreground"> )}
{t("cameraWizard.testResultLabels.video")}: {testResult.videoCodec && (
</span>{" "} <div>
<span className="text-primary">{testResult.videoCodec}</span> <span className="text-secondary-foreground">
</div> {t("cameraWizard.testResultLabels.video")}:
)} </span>{" "}
{testResult.audioCodec && ( <span className="text-primary">
<div> {testResult.videoCodec}
<span className="text-secondary-foreground"> </span>
{t("cameraWizard.testResultLabels.audio")}: </div>
</span>{" "} )}
<span className="text-primary">{testResult.audioCodec}</span> {testResult.audioCodec && (
</div> <div>
)} <span className="text-secondary-foreground">
{testResult.fps && ( {t("cameraWizard.testResultLabels.audio")}:
<div> </span>{" "}
<span className="text-secondary-foreground"> <span className="text-primary">
{t("cameraWizard.testResultLabels.fps")}: {testResult.audioCodec}
</span>{" "} </span>
<span className="text-primary">{testResult.fps}</span> </div>
</div> )}
)} {testResult.fps && (
</div> <div>
<span className="text-secondary-foreground">
{t("cameraWizard.testResultLabels.fps")}:
</span>{" "}
<span className="text-primary">{testResult.fps}</span>
</div>
)}
</CardContent>
</Card>
</div> </div>
</div> </div>
)} )}

8
web/src/components/settings/Step2StreamConfig.tsx
View File

@ -247,8 +247,8 @@ export default function Step2StreamConfig({
)} )}
{stream.testResult && !stream.testResult.success && ( {stream.testResult && !stream.testResult.success && (
<div className="flex items-center gap-2 text-sm"> <div className="flex items-center gap-2 text-sm">
<LuX className="size-4 text-destructive" /> <LuX className="size-4 text-danger" />
<span className="text-destructive"> <span className="text-danger">
{t("cameraWizard.step2.notConnected")} {t("cameraWizard.step2.notConnected")}
</span> </span>
</div> </div>
@ -301,7 +301,7 @@ export default function Step2StreamConfig({
{stream.testResult && {stream.testResult &&
!stream.testResult.success && !stream.testResult.success &&
stream.userTested && ( stream.userTested && (
<div className="rounded-md border border-destructive/20 bg-destructive/10 p-3 text-sm text-destructive"> <div className="rounded-md border border-danger/20 bg-danger/10 p-3 text-sm text-danger">
<div className="font-medium"> <div className="font-medium">
{t("cameraWizard.step2.testFailedTitle")} {t("cameraWizard.step2.testFailedTitle")}
</div> </div>
@ -340,7 +340,7 @@ export default function Step2StreamConfig({
<div className="space-y-2"> <div className="space-y-2">
<Label className="text-sm font-medium"> <Label className="text-sm font-medium">
{t("cameraWizard.step2.liveViewTitle")} {t("cameraWizard.step2.featuresTitle")}
</Label> </Label>
<div className="rounded-lg bg-background p-3"> <div className="rounded-lg bg-background p-3">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">