1import type { EnvironmentId } from "@t3tools/contracts";
2import { View } from "react-native";
3
4import { EmptyState } from "../../components/ui/EmptyState";
5import { environmentCatalog } from "../../connection/catalog";
6import type { AssetUrlFailureReason } from "../../state/asset-url-state";
7import { useAtomCommand } from "../../state/use-atom-command";
8import { useEnvironmentPresentation } from "../../state/presentation";
9import { EnvironmentConnectionNotice } from "../connection/EnvironmentConnectionNotice";
10
11export function WorkspaceFilePreviewError(props: {
12 readonly environmentId: EnvironmentId | null;
13 readonly reason: AssetUrlFailureReason;
14 readonly onRetry: () => void;
15}) {
16 const { environmentId, onRetry } = props;
17 const environment = useEnvironmentPresentation(environmentId);
18 const retryEnvironment = useAtomCommand(environmentCatalog.retryNow, "environment retry");
19 const retryConnection = () => {
20 if (environmentId !== null) void retryEnvironment(environmentId);
21 onRetry();
22 };
23
24 if (props.reason === "disconnected") {
25 return (
26 <View className="flex-1 bg-sheet">
27 <EnvironmentConnectionNotice
28 environmentLabel={environment.presentation?.entry.target.label ?? "Environment"}
29 connection={
30 environment.presentation?.connection ?? {
31 phase: "available",
32 error: null,
33 traceId: null,
34 }
35 }
36 resourceName="preview"
37 onRetry={retryConnection}
38 />
39 </View>
40 );
41 }
42
43 return (
44 <View className="flex-1 items-center justify-center bg-sheet px-6">
45 <EmptyState
46 title="Preview unavailable"
47 detail="This file may be missing, unsupported, or unavailable on this environment."
48 actionLabel="Try again"
49 onAction={props.onRetry}
50 />
51 </View>
52 );
53}