Cleanup mobile styling

This commit is contained in:
Nicolas Mowen 2025-10-22 15:45:29 -06:00
parent 4f83f6a021
commit f1164dba70
3 changed files with 25 additions and 10 deletions

View File

@ -292,11 +292,9 @@ class EmbeddingMaintainer(threading.Thread):
f"Received classification config update for model: {model_name}"
)
# Update config
self.config.classification.custom[model_name] = model_config
# Check if processor already exists for this model
existing_processor_index = None
for i, processor in enumerate(self.realtime_processors):
if isinstance(
processor,
@ -309,14 +307,12 @@ class EmbeddingMaintainer(threading.Thread):
existing_processor_index = i
break
# Remove existing processor if found
if existing_processor_index is not None:
logger.info(
f"Removing existing classification processor for model: {model_name}"
)
self.realtime_processors.pop(existing_processor_index)
# Add new processor
if model_config.state_config is not None:
processor = CustomStateClassificationProcessor(
self.config, model_config, self.requestor, self.metrics

View File

@ -16,6 +16,8 @@ import { useResizeObserver } from "@/hooks/resize-observer";
import { useApiHost } from "@/api";
import { resolveCameraName } from "@/hooks/use-camera-friendly-name";
import Heading from "@/components/ui/heading";
import { isMobile } from "react-device-detect";
import { cn } from "@/lib/utils";
export type CameraAreaConfig = {
camera: string;
@ -222,8 +224,18 @@ export default function Step2StateArea({
return (
<div className="flex flex-col gap-4">
<div className="flex gap-4 overflow-hidden">
<div className="flex w-64 flex-shrink-0 flex-col gap-2 overflow-y-auto rounded-lg bg-secondary p-4">
<div
className={cn(
"flex gap-4 overflow-hidden",
isMobile ? "flex-col" : "flex-row",
)}
>
<div
className={cn(
"flex flex-shrink-0 flex-col gap-2 overflow-y-auto rounded-lg bg-secondary p-4",
isMobile ? "w-full" : "w-64",
)}
>
<div className="flex items-center justify-between">
<h3 className="text-sm font-medium">{t("wizard.step2.cameras")}</h3>
{availableCameras.length > 0 ? (

View File

@ -15,6 +15,8 @@ import { Step1FormData } from "./Step1NameAndDefine";
import { Step2FormData } from "./Step2StateArea";
import useSWR from "swr";
import { baseUrl } from "@/api/baseUrl";
import { isMobile } from "react-device-detect";
import { cn } from "@/lib/utils";
export type Step3FormData = {
examplesGenerated: boolean;
@ -245,7 +247,12 @@ export default function Step3ChooseExamples({
<div className="text-sm text-muted-foreground">
{t("wizard.step3.description")}
</div>
<div className="rounded-lg bg-secondary/30 p-4">
<div
className={cn(
"rounded-lg bg-secondary/30 p-4",
isMobile && "max-h-[60vh] overflow-y-auto",
)}
>
{!unknownImages || unknownImages.length === 0 ? (
<div className="flex h-[40vh] items-center justify-center">
<p className="text-muted-foreground">
@ -253,11 +260,11 @@ export default function Step3ChooseExamples({
</p>
</div>
) : (
<div className="grid grid-cols-6 gap-3">
<div className="grid grid-cols-2 gap-3 sm:grid-cols-6">
{unknownImages.slice(0, 24).map((imageName, index) => (
<div
key={imageName}
className="group relative aspect-square cursor-pointer overflow-hidden rounded-lg border bg-background transition-all hover:ring-2 hover:ring-primary"
className="group relative aspect-square overflow-hidden rounded-lg border bg-background"
>
<img
src={`${baseUrl}clips/${step1Data.modelName}/train/${imageName}`}