step 1 and 2 tweaks

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

View File

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

View File

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