mirror of
https://github.com/jhbruhn/respira.git
synced 2026-03-13 18:28:41 +00:00
Jan-Henrik Bruhn
681ce223c3
- Move FileUpload into dedicated folder with sub-components - Extract FileSelector, PyodideProgress, UploadButton, UploadProgress, BoundsValidator - Create useDisplayFilename hook for filename priority logic - Reduce FileUpload.tsx from 391 to 261 lines (33% reduction) Part of #33: Extract sub-components from large components 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
/**
|
|
* BoundsValidator Component
|
|
*
|
|
* Renders error/warning messages with smooth transitions
|
|
*/
|
|
|
|
import { Alert, AlertDescription } from "@/components/ui/alert";
|
|
import { MachineStatus } from "../../types/machine";
|
|
import {
|
|
canUploadPattern,
|
|
getMachineStateCategory,
|
|
} from "../../utils/machineStateHelpers";
|
|
import type { PesPatternData } from "../../formats/import/pesImporter";
|
|
|
|
interface BoundsValidatorProps {
|
|
pesData: PesPatternData | null;
|
|
machineStatus: MachineStatus;
|
|
boundsError: string | null;
|
|
}
|
|
|
|
export function BoundsValidator({
|
|
pesData,
|
|
machineStatus,
|
|
boundsError,
|
|
}: BoundsValidatorProps) {
|
|
const hasError = pesData && (boundsError || !canUploadPattern(machineStatus));
|
|
|
|
return (
|
|
<div
|
|
className="transition-all duration-200 ease-in-out overflow-hidden"
|
|
style={{
|
|
maxHeight: hasError ? "200px" : "0px",
|
|
marginTop: hasError ? "12px" : "0px",
|
|
}}
|
|
>
|
|
{pesData && !canUploadPattern(machineStatus) && (
|
|
<Alert className="bg-warning-100 dark:bg-warning-900/20 border-warning-200 dark:border-warning-800">
|
|
<AlertDescription className="text-warning-800 dark:text-warning-200 text-sm">
|
|
Cannot upload while {getMachineStateCategory(machineStatus)}
|
|
</AlertDescription>
|
|
</Alert>
|
|
)}
|
|
|
|
{pesData && boundsError && (
|
|
<Alert variant="destructive">
|
|
<AlertDescription>
|
|
<strong>Pattern too large:</strong> {boundsError}
|
|
</AlertDescription>
|
|
</Alert>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|