@adminide-stack/yantra-mobile 12.0.142 → 12.0.145-alpha.0

package/lib/features/webbuilder/WebBuilderExperience.js

@@ -1,4 +1,4 @@
-import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {useMemo,useState,useCallback,useRef,useEffect}from'react';import {StyleSheet,Keyboard,BackHandler,View,Text,Share,Platform,ActionSheetIOS,Linking,Alert}from'react-native';import {MaterialCommunityIcons}from'@expo/vector-icons';import {GestureHandlerRootView}from'react-native-gesture-handler';import {useSafeInsets}from'../canvas/withRemoteSafeArea.js';import {useAppTheme}from'../../theme/AppThemeProvider.js';import {Tap,DIM}from'../inbox/components/Tap.js';import {isBareSeed,studioTurnText,brandBriefBlock,siteScoreTurn}from'./studioCatalog.js';import {titleFromPrompt}from'./buildFragments.js';import {useBrandKit}from'./brandKitStorage.js';import {parseToolActivity}from'../chat/toolActivity.js';import {wakePreviewPrompt}from'./webbuilderPrompts.js';import {webbuilderTheme}from'./webbuilderTheme.js';import {BrandKitSheet}from'./components/BrandKitSheet.js';import {CodeView}from'./components/CodeView.js';import {ProjectChat}from'./components/ProjectChat.js';import {PreviewScreen,ViewPicker}from'./components/PreviewScreen.js';import {PublishSheet}from'./components/PublishSheet.js';import {BOTTOM_TABS_SPACE,BottomTabs}from'./components/BottomTabs.js';import {SiteScoreSheet}from'./components/SiteScoreSheet.js';import {ProjectsScreen}from'./components/ProjectsScreen.js';import {TemplatesSheet}from'./components/TemplatesSheet.js';import {StudioHome}from'./components/StudioHome.js';import {VersionsSheet}from'./components/VersionsSheet.js';import {IconButton,Sheet,Toast}from'./components/ui.js';import {exportMessage,EXPORT_TARGETS,exportTurn}from'./exportCode.js';import {demoVideoSource,webbuilderDemoHandoff,encodeCodezenHandoff}from'./codezenHandoff.js';var __defProp = Object.defineProperty;
+import {jsxs,jsx,Fragment}from'react/jsx-runtime';import {useMemo,useState,useCallback,useRef,useEffect}from'react';import {StyleSheet,Keyboard,BackHandler,View,Text,Share,Linking,Alert}from'react-native';import {MaterialCommunityIcons}from'@expo/vector-icons';import {GestureHandlerRootView}from'react-native-gesture-handler';import {useSafeInsets}from'../canvas/withRemoteSafeArea.js';import {useAppTheme}from'../../theme/AppThemeProvider.js';import {Tap,DIM}from'../inbox/components/Tap.js';import {isBareSeed,studioTurnText,brandKitNote,siteScoreTurn}from'./studioCatalog.js';import {titleFromPrompt}from'./buildFragments.js';import {useBrandKit}from'./brandKitStorage.js';import {parseToolActivity}from'../chat/toolActivity.js';import {friendlySteps,firstContentLanded}from'./stepLabels.js';import {restoreTurnNote}from'./webbuilderPrompts.js';import {webbuilderTheme}from'./webbuilderTheme.js';import {BrandKitSheet}from'./components/BrandKitSheet.js';import {CodeView}from'./components/CodeView.js';import {ProjectChat}from'./components/ProjectChat.js';import {ViewportToggle,PreviewScreen,ViewPicker}from'./components/PreviewScreen.js';import {PublishSheet}from'./components/PublishSheet.js';import {BOTTOM_TABS_SPACE,BottomTabs}from'./components/BottomTabs.js';import {SiteScoreSheet}from'./components/SiteScoreSheet.js';import {ProjectsScreen}from'./components/ProjectsScreen.js';import {TemplatesSheet}from'./components/TemplatesSheet.js';import {StudioHome}from'./components/StudioHome.js';import {VersionsSheet}from'./components/VersionsSheet.js';import {IconButton,Sheet,Toast}from'./components/ui.js';import {exportTurn,exportMessage}from'./exportCode.js';import {ownCloudflareTurn}from'./publishTools.js';import {ProjectMenuSheet,ProjectSettingsSheet,GithubPushSheet,IntegrationsSheet,ImportProjectSheet}from'./components/ProjectSheets.js';import {demoVideoSource,webbuilderDemoHandoff,encodeCodezenHandoff}from'./codezenHandoff.js';var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -43,14 +43,18 @@ function WebBuilderExperience({
   hostChat,
   onPublish,
   onResumePreview,
+  onRestorePreview,
+  goneSandboxIds,
   onOpenCodezen,
   onUndo,
   onRedo,
   onDownloadCode,
+  publishTools,
+  projectTools,
   code,
   initialAgentSeed = null
 }) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
   const appTheme = useAppTheme();
   const isDark = hostIsDark != null ? hostIsDark : appTheme.isDark;
   const theme = useMemo(() => webbuilderTheme(isDark), [isDark]);
@@ -81,7 +85,7 @@ function WebBuilderExperience({
     onStartProject(__spreadValues(__spreadValues({
       text: studioTurnText({
         brief,
-        brandBlock: brandBriefBlock(brand),
+        brandBlock: brandKitNote(brand),
         referenceUrl: start.referenceUrl
       }),
       template: start.template
@@ -156,21 +160,88 @@ function WebBuilderExperience({
     setMode("chat");
   }, []);
   const [waking, setWaking] = useState(false);
+  const [trouble, setTrouble] = useState(null);
   const wokenFor = useRef(null);
   useEffect(() => {
     wokenFor.current = null;
   }, [build == null ? void 0 : build.key]);
-  const wakePreview = useCallback(() => {
-    if (!build || waking || wokenFor.current === build.key) return;
+  const goneNow = Boolean((build == null ? void 0 : build.sandboxId) && (goneSandboxIds == null ? void 0 : goneSandboxIds.has(build.sandboxId)));
+  let previewTrouble = null;
+  if (trouble && build && trouble.key === build.key) previewTrouble = trouble;
+  else if (goneNow && build) previewTrouble = {
+    key: build.key,
+    kind: "gone"
+  };
+  const wakePreview = useCallback((asked = false) => {
+    if (!build || waking) return;
+    if (!asked && wokenFor.current === build.key) return;
     if (building || (hostChat == null ? void 0 : hostChat.busy)) return;
     wokenFor.current = build.key;
+    if (!onResumePreview) {
+      setTrouble({
+        key: build.key,
+        kind: "failed"
+      });
+      return;
+    }
+    const target = build;
     setWaking(true);
-    const resume = onResumePreview ? onResumePreview(build) : Promise.resolve("failed");
-    resume.catch(() => "failed").then((outcome) => {
-      if (outcome === "ok") setPreviewNonce((n) => n + 1);
-      else if (hostChat && !hostChat.busy) hostChat.send(wakePreviewPrompt(), void 0, build);
+    setTrouble(null);
+    onResumePreview(target, {
+      asked
+    }).catch(() => "failed").then((outcome) => {
+      if (outcome === "ok") {
+        setPreviewNonce((n) => n + 1);
+        return;
+      }
+      setTrouble({
+        key: target.key,
+        kind: outcome === "gone" ? "gone" : "failed"
+      });
     }).finally(() => setWaking(false));
   }, [build, waking, building, onResumePreview, hostChat]);
+  const askAiToRestore = useCallback((reason, snapshotId) => {
+    if (!build || !hostChat || hostChat.busy) return;
+    const name = siteTitle || build.title || "my site";
+    hostChat.send(`Restore "${name}" from its saved copy in a new sandbox and send me the preview link.
+
+${restoreTurnNote({
+      snapshotId: snapshotId != null ? snapshotId : build.snapshotId,
+      templateId: build.templateId,
+      restoreError: reason
+    })}`, void 0, build);
+    setTrouble(null);
+    setMode("chat");
+  }, [build, hostChat, siteTitle]);
+  const restoreFromSavedCopy = useCallback(() => {
+    if (!build || (previewTrouble == null ? void 0 : previewTrouble.kind) === "restoring") return;
+    if (!onRestorePreview) {
+      askAiToRestore();
+      return;
+    }
+    const target = build;
+    setTrouble({
+      key: target.key,
+      kind: "restoring"
+    });
+    onRestorePreview(target).catch(() => ({
+      ok: false,
+      reason: "The saved copy could not be opened."
+    })).then((result) => {
+      if (result.ok) {
+        setTrouble(null);
+        setPreviewNonce((n) => n + 1);
+        showToast("Your site is back");
+        return;
+      }
+      setTrouble({
+        key: target.key,
+        kind: "restoreFailed",
+        reason: result.reason,
+        snapshotId: result.snapshotId
+      });
+    });
+  }, [build, previewTrouble == null ? void 0 : previewTrouble.kind, onRestorePreview, askAiToRestore, showToast]);
   const [publishOpen, setPublishOpen] = useState(false);
   const [versionsOpen, setVersionsOpen] = useState(false);
   const [publishStarted, setPublishStarted] = useState(null);
@@ -184,12 +255,12 @@ function WebBuilderExperience({
     }
   }, [builds, publishStarted, showToast]);
   const publishing = publishingOnChat || Boolean(publishStarted && Date.now() - publishStarted.at < PUBLISH_WATCH_MS);
-  const publish = useCallback(async (target, projectName) => {
+  const publish = useCallback(async (target, projectName, customDomain) => {
     if (!onPublish) return {
       ok: false,
       message: "Publishing is not available here."
     };
-    const result = await onPublish(target, projectName);
+    const result = await onPublish(target, projectName, customDomain);
     if (result.ok) {
       setPublishStarted({
         key: target.key,
@@ -241,6 +312,18 @@ function WebBuilderExperience({
     shadowColor: theme.isDark ? "#000" : "#1c1917"
   };
   const liveSteps = (hostChat == null ? void 0 : hostChat.busy) && hostChat.streaming ? parseToolActivity(hostChat.streaming, true).steps : [];
+  const turnBusy = Boolean(hostChat == null ? void 0 : hostChat.busy);
+  const hadBuildsAtTurnStart = useRef(true);
+  const wasTurnBusy = useRef(false);
+  if (turnBusy !== wasTurnBusy.current) {
+    wasTurnBusy.current = turnBusy;
+    if (turnBusy) hadBuildsAtTurnStart.current = builds.length > 0;
+  }
+  const coverSteps = friendlySteps(liveSteps);
+  const buildingCover = turnBusy && build && !hadBuildsAtTurnStart.current && !firstContentLanded(liveSteps) ? {
+    title: siteTitle || build.title,
+    step: (_f = (_e = coverSteps[coverSteps.length - 1]) == null ? void 0 : _e.label) != null ? _f : null
+  } : null;
   let publishLabel = "Publish";
   if (publishing) publishLabel = "Publishing\u2026";
   const shareUrl = live || (build == null ? void 0 : build.previewUrl) || null;
@@ -279,25 +362,6 @@ function WebBuilderExperience({
     }).catch(() => showToast("Couldn't undo that change.")).finally(() => setUndoing(false));
   };
   const [menu, setMenu] = useState(null);
-  const showMenu = (title, actions) => {
-    if (!actions.length) return;
-    if (Platform.OS === "ios") {
-      ActionSheetIOS.showActionSheetWithOptions({
-        title,
-        options: [...actions.map((a) => a.label), "Cancel"],
-        cancelButtonIndex: actions.length,
-        destructiveButtonIndex: actions.findIndex((a) => a.destructive)
-      }, (index) => {
-        var _a2;
-        return (_a2 = actions[index]) == null ? void 0 : _a2.run();
-      });
-      return;
-    }
-    setMenu({
-      title,
-      actions
-    });
-  };
   const chooseMenu = (action) => {
     setMenu(null);
     setTimeout(action.run, 250);
@@ -324,91 +388,135 @@ function WebBuilderExperience({
     }).catch(() => askAgent(exportMessage(title, "zip")));
   };
   const exportTo = (target) => askAgent(exportTurn(siteTitle || (build == null ? void 0 : build.title) || "", target));
-  const pickExport = () => showMenu("Export or deploy", EXPORT_TARGETS.map((t) => ({
-    label: t.label,
-    run: () => exportTo(t.target)
-  })));
   const canShowCode = Boolean((build == null ? void 0 : build.files) || code && ((build == null ? void 0 : build.sandboxId) || (build == null ? void 0 : build.liveUrl)));
-  const openMore = () => {
-    const actions = [];
-    if (mode !== "chat") actions.push({
+  const [projectMenuOpen, setProjectMenuOpen] = useState(false);
+  const [settingsMode, setSettingsMode] = useState(null);
+  const [githubOpen, setGithubOpen] = useState(false);
+  const [integrationsOpen, setIntegrationsOpen] = useState(false);
+  const [importOpen, setImportOpen] = useState(false);
+  const filmDemo = () => {
+    const demo = build && !building ? demoVideoSource(live, build.previewUrl) : null;
+    if (!demo || !onOpenCodezen) return;
+    const film = () => {
+      try {
+        const handoff = webbuilderDemoHandoff(siteTitle || (build == null ? void 0 : build.title) || "", demo);
+        onOpenCodezen(encodeCodezenHandoff(handoff), handoff);
+      } catch (err) {
+        showToast(err instanceof Error ? err.message : "Couldn't open Codezen.");
+      }
+    };
+    if (demo.stable) {
+      film();
+      return;
+    }
+    Alert.alert("Publish first for a link that stays up", "Codezen will film the live preview, which sleeps about an hour after the last change.", [{
+      text: "Cancel",
+      style: "cancel"
+    }, {
+      text: "Film the preview",
+      onPress: film
+    }]);
+  };
+  const projectMenu = () => {
+    const view = [];
+    if (mode !== "chat") view.push({
+      key: "chat",
+      icon: "message-outline",
       label: "Back to the chat",
       run: () => setMode("chat")
     });
     if ((build == null ? void 0 : build.previewUrl) && mode !== "preview") {
-      actions.push({
+      view.push({
+        key: "preview",
+        icon: "television-play",
         label: "Open preview",
         run: () => setMode("preview")
       });
     }
-    if (canShowCode && mode !== "code") {
-      actions.push({
-        label: "View code",
-        run: () => setMode("code")
-      });
-    }
-    if ((build == null ? void 0 : build.sandboxId) && onUndo && !building && !undoing) {
-      actions.push({
-        label: "Undo last change",
-        run: undoLast
-      });
-    }
-    if (builds.length > 1) actions.push({
-      label: "Versions",
-      run: () => setVersionsOpen(true)
-    });
-    if (build == null ? void 0 : build.sandboxId) {
-      actions.push({
-        label: live ? "Publish an update" : "Publish",
-        run: () => setPublishOpen(true)
+    if (builds.length > 1) {
+      view.push({
+        key: "versions",
+        icon: "history",
+        label: "Versions",
+        run: () => setVersionsOpen(true)
       });
     }
     if (build == null ? void 0 : build.previewUrl) {
       const url = live || build.previewUrl;
-      actions.push({
+      view.push({
+        key: "browser",
+        icon: "open-in-new",
         label: "Open in browser",
-        run: () => Linking.openURL(url).catch(() => void 0)
+        run: () => {
+          Linking.openURL(url).catch(() => void 0);
+        }
       });
     }
-    if ((build == null ? void 0 : build.sandboxId) && !building) {
-      actions.push({
-        label: "Download code",
-        run: downloadCode
+    const project2 = projectTools ? [{
+      key: "settings",
+      icon: "tune-variant",
+      label: "Project settings",
+      hint: "Name, instructions for the AI, delete",
+      run: () => setSettingsMode("settings")
+    }, {
+      key: "rename",
+      icon: "pencil-outline",
+      label: "Rename",
+      run: () => setSettingsMode("rename")
+    }] : [];
+    const tools = [];
+    if (projectTools && hostChat) {
+      tools.push({
+        key: "integrations",
+        icon: "power-plug-outline",
+        label: "Integrations",
+        hint: "Stripe, email, Slack, AI\u2026",
+        run: () => setIntegrationsOpen(true)
       });
-      if (hostChat) actions.push({
-        label: "Export or deploy\u2026",
-        run: pickExport
+    }
+    if (projectTools && (build == null ? void 0 : build.sandboxId)) {
+      tools.push({
+        key: "github",
+        icon: "github",
+        label: "GitHub",
+        run: () => void 0,
+        children: [{
+          key: "github-push",
+          icon: "github",
+          label: "Push to my GitHub",
+          hint: "Create or update a repo with this code",
+          run: () => setGithubOpen(true)
+        }]
       });
     }
     const demo = build && !building ? demoVideoSource(live, build.previewUrl) : null;
     if (demo && onOpenCodezen) {
-      actions.push({
+      tools.push({
+        key: "demo",
+        icon: "movie-open-outline",
         label: "Demo video",
-        run: () => {
-          const film = () => {
-            try {
-              const handoff = webbuilderDemoHandoff(siteTitle || (build == null ? void 0 : build.title) || "", demo);
-              onOpenCodezen(encodeCodezenHandoff(handoff), handoff);
-            } catch (err) {
-              showToast(err instanceof Error ? err.message : "Couldn't open Codezen.");
-            }
-          };
-          if (demo.stable) {
-            film();
-            return;
-          }
-          Alert.alert("Publish first for a link that stays up", "Codezen will film the live preview, which sleeps about an hour after the last change.", [{
-            text: "Cancel",
-            style: "cancel"
-          }, {
-            text: "Film the preview",
-            onPress: film
-          }]);
-        }
+        hint: demo.stable ? "Film the published site" : "Publish first for a link that stays up",
+        run: filmDemo
       });
     }
-    showMenu(siteTitle || "Project", actions);
+    const more = [{
+      key: "import",
+      icon: "github",
+      label: "Import a project",
+      hint: "GitHub",
+      run: () => setImportOpen(true)
+    }];
+    return [{
+      items: [...project2, ...view]
+    }, {
+      title: "TOOLS",
+      items: tools
+    }, {
+      items: more
+    }];
   };
+  const openMore = () => setProjectMenuOpen(true);
+  const canUndo = Boolean((build == null ? void 0 : build.sandboxId) && onUndo && !building);
   return /* @__PURE__ */ jsxs(GestureHandlerRootView, { style: [styles.fill, {
     backgroundColor: theme.screen
   }], children: [
@@ -428,6 +536,7 @@ function WebBuilderExperience({
           ] }),
           /* @__PURE__ */ jsx(View, { style: styles.headSpacer }),
           /* @__PURE__ */ jsxs(View, { style: [styles.actionPill, floating], children: [
+            canUndo ? /* @__PURE__ */ jsx(Tap, { onPress: undoLast, disabled: undoing, accessibilityRole: "button", accessibilityLabel: "Undo the last change", style: [styles.pillBtn, undoing && styles.disabled], pressedStyle: DIM, testID: "webbuilder-undo", children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "undo-variant", size: 24, color: theme.ink }) }) : null,
             /* @__PURE__ */ jsx(Tap, { onPress: shareSite, disabled: !shareUrl, accessibilityRole: "button", accessibilityLabel: "Share", style: [styles.pillBtn, !shareUrl && styles.disabled], pressedStyle: DIM, children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "share-outline", size: 24, color: theme.ink }) }),
             /* @__PURE__ */ jsx(Tap, { onPress: openMore, accessibilityRole: "button", accessibilityLabel: "More", style: styles.pillBtn, pressedStyle: DIM, testID: "webbuilder-more", children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "dots-horizontal", size: 24, color: theme.ink }) })
           ] })
@@ -436,13 +545,15 @@ function WebBuilderExperience({
             color: theme.ink
           }], numberOfLines: 1, children: mode === "code" ? "Code" : siteTitle || "Preview" }),
           /* @__PURE__ */ jsxs(View, { style: [styles.actionPill, floating], children: [
+            mode === "preview" ? /* @__PURE__ */ jsx(ViewportToggle, { viewport, onViewport: setViewport, disabled: !(build == null ? void 0 : build.previewUrl), theme, style: styles.pillBtn }) : null,
+            canUndo ? /* @__PURE__ */ jsx(Tap, { onPress: undoLast, disabled: undoing, accessibilityRole: "button", accessibilityLabel: "Undo the last change", style: [styles.pillBtn, undoing && styles.disabled], pressedStyle: DIM, testID: "webbuilder-undo", children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "undo-variant", size: 24, color: theme.ink }) }) : null,
             /* @__PURE__ */ jsx(Tap, { onPress: shareSite, disabled: !shareUrl, accessibilityRole: "button", accessibilityLabel: "Share", style: [styles.pillBtn, !shareUrl && styles.disabled], pressedStyle: DIM, children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "share-outline", size: 24, color: theme.ink }) }),
             /* @__PURE__ */ jsx(Tap, { onPress: openMore, accessibilityRole: "button", accessibilityLabel: "More", style: styles.pillBtn, pressedStyle: DIM, children: /* @__PURE__ */ jsx(MaterialCommunityIcons, { name: "dots-horizontal", size: 24, color: theme.ink }) })
           ] })
         ] })
       ] }),
-      mode === "chat" ? /* @__PURE__ */ jsx(ProjectChat, { messages: (_e = hostChat == null ? void 0 : hostChat.messages) != null ? _e : [], streaming: (_f = hostChat == null ? void 0 : hostChat.streaming) != null ? _f : null, busy: Boolean(hostChat == null ? void 0 : hostChat.busy), error: (_g = hostChat == null ? void 0 : hostChat.error) != null ? _g : null, connected: Boolean(hostChat == null ? void 0 : hostChat.connected), building, build, siteTitle: siteTitle || "Your site", onSend: (text) => sendToAgent(text), onOpenPreview: () => setMode("preview"), onPublish: () => setPublishOpen(true), onPreviewAsleep: wakePreview, ask: (_h = hostChat == null ? void 0 : hostChat.ask) != null ? _h : null, onAnswerAsk: (formatted) => hostChat == null ? void 0 : hostChat.send(formatted), theme, bottomInset: insets.bottom }) : null,
-      mode === "preview" ? /* @__PURE__ */ jsx(PreviewScreen, { build, building, loading: buildsLoading, previewNonce, onReload: () => setPreviewNonce((n) => n + 1), onHome: () => setPreviewNonce((n) => n + 1), onWake: wakePreview, waking, steps: liveSteps, onPublish: () => setPublishOpen(true), publishLabel, error: (_i = hostChat == null ? void 0 : hostChat.error) != null ? _i : null, theme, bottomInset: insets.bottom, viewport, onViewport: setViewport, onShowCode: canShowCode ? () => setMode("code") : void 0 }) : null,
+      mode === "chat" ? /* @__PURE__ */ jsx(ProjectChat, { messages: (_g = hostChat == null ? void 0 : hostChat.messages) != null ? _g : [], streaming: (_h = hostChat == null ? void 0 : hostChat.streaming) != null ? _h : null, busy: Boolean(hostChat == null ? void 0 : hostChat.busy), error: (_i = hostChat == null ? void 0 : hostChat.error) != null ? _i : null, connected: Boolean(hostChat == null ? void 0 : hostChat.connected), building, build, siteTitle: siteTitle || "Your site", onSend: (text) => sendToAgent(text), onOpenPreview: () => setMode("preview"), onPublish: () => setPublishOpen(true), onPreviewAsleep: () => wakePreview(), previewDown: Boolean(previewTrouble && previewTrouble.kind !== "restoring"), ask: (_j = hostChat == null ? void 0 : hostChat.ask) != null ? _j : null, onAnswerAsk: (formatted) => hostChat == null ? void 0 : hostChat.send(formatted), theme, bottomInset: insets.bottom }) : null,
+      mode === "preview" ? /* @__PURE__ */ jsx(PreviewScreen, { build, building, loading: buildsLoading, previewNonce, onReload: () => setPreviewNonce((n) => n + 1), onWake: () => wakePreview(), waking, trouble: previewTrouble, onRetry: () => wakePreview(true), onRestore: restoreFromSavedCopy, onAskAiRestore: hostChat ? askAiToRestore : void 0, agentBusy: Boolean(building) || Boolean(hostChat == null ? void 0 : hostChat.busy), steps: liveSteps, onPublish: () => setPublishOpen(true), publishLabel, error: (_k = hostChat == null ? void 0 : hostChat.error) != null ? _k : null, theme, bottomInset: insets.bottom, viewport, unpublished: Boolean(build == null ? void 0 : build.sandboxId) && !(build == null ? void 0 : build.liveUrl), onShowCode: canShowCode ? () => setMode("code") : void 0, buildingCover }) : null,
       mode === "code" ? /* @__PURE__ */ jsxs(View, { style: [styles.fill, {
         backgroundColor: theme.card,
         paddingBottom: insets.bottom
@@ -457,7 +568,7 @@ function WebBuilderExperience({
             color: theme.ink
           }], numberOfLines: 1, children: "Code" })
         ] }),
-        /* @__PURE__ */ jsx(CodeView, { files: (_j = build == null ? void 0 : build.files) != null ? _j : null, build, code, busy: Boolean(building) || Boolean(hostChat == null ? void 0 : hostChat.busy), onWake: build && onResumePreview ? () => onResumePreview(build).then((outcome) => {
+        /* @__PURE__ */ jsx(CodeView, { files: (_l = build == null ? void 0 : build.files) != null ? _l : null, build, code, busy: Boolean(building) || Boolean(hostChat == null ? void 0 : hostChat.busy), onWake: build && onResumePreview ? () => onResumePreview(build).then((outcome) => {
           if (outcome === "ok") setPreviewNonce((n) => n + 1);
           return outcome;
         }) : void 0, theme, onAsk: openChat })
@@ -470,7 +581,7 @@ function WebBuilderExperience({
       /* @__PURE__ */ jsx(View, { style: styles.fill, children: homeTab === "create" ? /* @__PURE__ */ jsx(StudioHome, { draft, onDraft: setDraft, template, onClearTemplate: () => setTemplate(null), onBrowseTemplates: () => setTemplatesOpen(true), brand, onBrand: () => setBrandOpen(true), onSiteScore: () => setScoreOpen(true), onStart: startSite, connecting: startBlocked, startNotice, theme, bottomInset: BOTTOM_TABS_SPACE + insets.bottom }) : /* @__PURE__ */ jsx(ProjectsScreen, { projects, loading: projectsLoading, error: projectsError, hasMore: projectsHasMore, onRefresh: onRefreshProjects, onLoadMore: onLoadMoreProjects, onOpen: (p) => onOpenProject(p.channelId), onNewProject: () => setHomeTab("create"), topInset: insets.top + 12, bottomInset: BOTTOM_TABS_SPACE + insets.bottom, theme }) }),
       /* @__PURE__ */ jsx(BottomTabs, { tab: homeTab, onTab: setHomeTab, theme, bottomInset: insets.bottom })
     ] }),
-    /* @__PURE__ */ jsx(TemplatesSheet, { visible: templatesOpen, onClose: () => setTemplatesOpen(false), templates, loading: templatesLoading, error: templatesError, onReload: onReloadTemplates, selectedId: (_k = template == null ? void 0 : template.id) != null ? _k : null, onPick: pickTemplate, theme }),
+    /* @__PURE__ */ jsx(TemplatesSheet, { visible: templatesOpen, onClose: () => setTemplatesOpen(false), templates, loading: templatesLoading, error: templatesError, onReload: onReloadTemplates, selectedId: (_m = template == null ? void 0 : template.id) != null ? _m : null, onPick: pickTemplate, theme }),
     /* @__PURE__ */ jsx(SiteScoreSheet, { visible: scoreOpen, onClose: () => setScoreOpen(false), blocked: startBlocked, onCheck: (url) => {
       setScoreOpen(false);
       onStartProject({
@@ -480,14 +591,35 @@ function WebBuilderExperience({
       });
     }, theme }),
     /* @__PURE__ */ jsx(BrandKitSheet, { visible: brandOpen, brand, onSave: saveBrand, onClose: () => setBrandOpen(false), theme }),
-    /* @__PURE__ */ jsx(PublishSheet, { visible: publishOpen, build, publishing, onPublish: onPublish ? publish : void 0, onClose: () => setPublishOpen(false), theme }),
+    /* @__PURE__ */ jsx(ProjectMenuSheet, { visible: projectMenuOpen, title: siteTitle || "Project", sections: projectMenuOpen ? projectMenu() : [], onClose: () => setProjectMenuOpen(false), theme }),
+    projectTools ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(ProjectSettingsSheet, { visible: settingsMode !== null, mode: settingsMode != null ? settingsMode : "settings", channelId: activeChannelId, title: siteTitle || "New app", tools: projectTools, aiBusy: Boolean(building) || Boolean(hostChat == null ? void 0 : hostChat.busy), onSaved: () => showToast("Saved"), onDeleted: () => {
+        showToast("Project deleted");
+        onCloseProject();
+        setHomeTab("projects");
+        onRefreshProjects == null ? void 0 : onRefreshProjects();
+      }, onClose: () => setSettingsMode(null), theme }),
+      /* @__PURE__ */ jsx(GithubPushSheet, { visible: githubOpen, build, channelId: activeChannelId, title: siteTitle || (build == null ? void 0 : build.title) || "", tools: projectTools, onStarted: (message) => {
+        showToast(message);
+        setMode("chat");
+      }, onClose: () => setGithubOpen(false), theme }),
+      /* @__PURE__ */ jsx(IntegrationsSheet, { visible: integrationsOpen, channelId: activeChannelId, tools: projectTools, aiBusy: Boolean(building) || Boolean(hostChat == null ? void 0 : hostChat.busy), onRequest: (text) => askAgent(text), onClose: () => setIntegrationsOpen(false), theme })
+    ] }) : null,
+    /* @__PURE__ */ jsx(ImportProjectSheet, { visible: importOpen, onImport: (turn) => {
+      onStartProject({
+        text: turn,
+        template: null,
+        agent: true
+      });
+    }, onClose: () => setImportOpen(false), theme }),
+    /* @__PURE__ */ jsx(PublishSheet, { visible: publishOpen, build, publishing, onPublish: onPublish ? publish : void 0, onClose: () => setPublishOpen(false), theme, liveUrl: live, aiBusy: Boolean(building) || Boolean(hostChat == null ? void 0 : hostChat.busy), tools: publishTools, onDownloadCode: (build == null ? void 0 : build.sandboxId) && !building ? downloadCode : void 0, onExport: hostChat && !building ? exportTo : void 0, onOwnCloudflare: hostChat && !building ? () => askAgent(ownCloudflareTurn(siteTitle || (build == null ? void 0 : build.title) || "")) : void 0, onFixWithAi: hostChat ? (text) => askAgent(text) : void 0, onUnpublished: () => showToast("The site is offline now.") }),
     /* @__PURE__ */ jsx(VersionsSheet, { visible: versionsOpen, builds, selectedKey, onSelect: (picked) => {
       setSelectedKey(picked.key === (latest == null ? void 0 : latest.key) ? null : picked.key);
       setVersionsOpen(false);
     }, onClose: () => setVersionsOpen(false), theme }),
-    /* @__PURE__ */ jsx(Sheet, { visible: menu !== null, title: (_l = menu == null ? void 0 : menu.title) != null ? _l : "", onClose: () => setMenu(null), theme, children: /* @__PURE__ */ jsx(View, { style: [styles.menuList, {
+    /* @__PURE__ */ jsx(Sheet, { visible: menu !== null, title: (_n = menu == null ? void 0 : menu.title) != null ? _n : "", onClose: () => setMenu(null), theme, children: /* @__PURE__ */ jsx(View, { style: [styles.menuList, {
       paddingBottom: insets.bottom + 8
-    }], children: ((_m = menu == null ? void 0 : menu.actions) != null ? _m : []).map((action) => /* @__PURE__ */ jsx(Tap, { onPress: () => chooseMenu(action), accessibilityRole: "button", style: [styles.menuRow, {
+    }], children: ((_o = menu == null ? void 0 : menu.actions) != null ? _o : []).map((action) => /* @__PURE__ */ jsx(Tap, { onPress: () => chooseMenu(action), accessibilityRole: "button", style: [styles.menuRow, {
       borderBottomColor: theme.border
     }], pressedStyle: DIM, children: /* @__PURE__ */ jsx(Text, { style: [styles.menuLabel, {
       color: action.destructive ? theme.crit : theme.ink