1import { SymbolView } from "../../components/ui/AppSymbol";
2import { Platform, Pressable, View } from "react-native";
3
4import { AppText as Text } from "../../components/ui/AppText";
5import { NewThreadButton } from "../../components/NewThreadButton";
6import { FloatingActionButton } from "../../components/ui/FloatingActionButton";
7import { EmptyState } from "../../components/ui/EmptyState";
8import { ScreenContent } from "../../components/ui/ScreenContent";
9import type { WorkspaceTab } from "./workspace/workspace-tabs-state";
10
11export function WorkspaceEmptyDetail(props: {
12 readonly tab?: WorkspaceTab | "settings";
13 readonly onStartNewTask?: () => void;
14 readonly onAddConnection?: () => void;
15}) {
16 const pullRequests = props.tab === "pullRequests";
17 const settings = props.tab === "settings";
18 if (props.tab === "usage") return <View className="flex-1 bg-screen" />;
19 return (
20 <ScreenContent surface="screen">
21 <View
22 className={
23 Platform.OS === "android"
24 ? "flex-1 items-center justify-center px-10"
25 : "flex-1 items-center justify-center bg-screen px-10"
26 }
27 >
28 {props.onAddConnection ? (
29 <View className="w-full max-w-[430px]">
30 <EmptyState
31 title="No environments connected"
32 detail="Add an environment to load projects and start coding sessions."
33 variant="plain"
34 action={
35 <FloatingActionButton
36 label="Add environment"
37 icon="plus"
38 variant="extended"
39 tone="primary"
40 onPress={props.onAddConnection}
41 />
42 }
43 />
44 </View>
45 ) : (
46 <View className="max-w-[360px] items-center gap-3">
47 <SymbolView
48 name="sidebar.left"
49 size={34}
50 tintColorClassName="accent-icon-subtle"
51 type="hierarchical"
52 />
53 <Text className="text-center text-xl font-t3-bold">
54 {settings
55 ? "Select a setting"
56 : pullRequests
57 ? "Select a pull request"
58 : "Select a thread"}
59 </Text>
60 <Text className="text-center text-base text-foreground-muted">
61 {settings
62 ? "Choose a page from the sidebar."
63 : pullRequests
64 ? "Choose a pull request from the sidebar to review it."
65 : Platform.OS === "android"
66 ? "Choose a thread from the sidebar or start a new thread."
67 : "Choose a thread from the sidebar or start a new task."}
68 </Text>
69 {props.onStartNewTask && !pullRequests && !settings ? (
70 Platform.OS === "android" ? (
71 <NewThreadButton extended className="mt-2" onPress={props.onStartNewTask} />
72 ) : (
73 <Pressable
74 accessibilityRole="button"
75 className="mt-2 flex-row items-center gap-2 rounded-full bg-primary px-5 py-3 active:opacity-70"
76 onPress={props.onStartNewTask}
77 >
78 <Text className="text-base font-t3-bold text-primary-foreground">New thread</Text>
79 </Pressable>
80 )
81 ) : null}
82 </View>
83 )}
84 </View>
85 </ScreenContent>
86 );
87}