crca 1.4.0__py3-none-any.whl

tools/bolt.diy/app/components/chat/chatExportAndImport/ExportChatButton.tsx

@@ -0,0 +1,49 @@
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import { workbenchStore } from '~/lib/stores/workbench';
+import { classNames } from '~/utils/classNames';
+
+export const ExportChatButton = ({ exportChat }: { exportChat?: () => void }) => {
+  return (
+    <div className="flex border border-bolt-elements-borderColor rounded-md overflow-hidden">
+      <DropdownMenu.Root>
+        <DropdownMenu.Trigger className="rounded-md items-center justify-center [&:is(:disabled,.disabled)]:cursor-not-allowed [&:is(:disabled,.disabled)]:opacity-60 px-3 py-1.5 text-xs bg-accent-500 text-white hover:text-bolt-elements-item-contentAccent [&:not(:disabled,.disabled)]:hover:bg-bolt-elements-button-primary-backgroundHover outline-accent-500 flex gap-1.7">
+          Export
+          <span className={classNames('i-ph:caret-down transition-transform')} />
+        </DropdownMenu.Trigger>
+        <DropdownMenu.Content
+          className={classNames(
+            'z-[250]',
+            'bg-bolt-elements-background-depth-2',
+            'rounded-lg shadow-lg',
+            'border border-bolt-elements-borderColor',
+            'animate-in fade-in-0 zoom-in-95',
+            'py-1',
+          )}
+          sideOffset={5}
+          align="end"
+        >
+          <DropdownMenu.Item
+            className={classNames(
+              'cursor-pointer flex items-center w-auto px-4 py-2 text-sm text-bolt-elements-textPrimary hover:bg-bolt-elements-item-backgroundActive gap-2 rounded-md group relative',
+            )}
+            onClick={() => {
+              workbenchStore.downloadZip();
+            }}
+          >
+            <div className="i-ph:code size-4.5"></div>
+            <span>Download Code</span>
+          </DropdownMenu.Item>
+          <DropdownMenu.Item
+            className={classNames(
+              'cursor-pointer flex items-center w-full px-4 py-2 text-sm text-bolt-elements-textPrimary hover:bg-bolt-elements-item-backgroundActive gap-2 rounded-md group relative',
+            )}
+            onClick={() => exportChat?.()}
+          >
+            <div className="i-ph:chat size-4.5"></div>
+            <span>Export Chat</span>
+          </DropdownMenu.Item>
+        </DropdownMenu.Content>
+      </DropdownMenu.Root>
+    </div>
+  );
+};

tools/bolt.diy/app/components/chat/chatExportAndImport/ImportButtons.tsx

@@ -0,0 +1,96 @@
+import type { Message } from 'ai';
+import { toast } from 'react-toastify';
+import { ImportFolderButton } from '~/components/chat/ImportFolderButton';
+import { Button } from '~/components/ui/Button';
+import { classNames } from '~/utils/classNames';
+
+type ChatData = {
+  messages?: Message[]; // Standard Bolt format
+  description?: string; // Optional description
+};
+
+export function ImportButtons(importChat: ((description: string, messages: Message[]) => Promise<void>) | undefined) {
+  return (
+    <div className="flex flex-col items-center justify-center w-auto">
+      <input
+        type="file"
+        id="chat-import"
+        className="hidden"
+        accept=".json"
+        onChange={async (e) => {
+          const file = e.target.files?.[0];
+
+          if (file && importChat) {
+            try {
+              const reader = new FileReader();
+
+              reader.onload = async (e) => {
+                try {
+                  const content = e.target?.result as string;
+                  const data = JSON.parse(content) as ChatData;
+
+                  // Standard format
+                  if (Array.isArray(data.messages)) {
+                    await importChat(data.description || 'Imported Chat', data.messages);
+                    toast.success('Chat imported successfully');
+
+                    return;
+                  }
+
+                  toast.error('Invalid chat file format');
+                } catch (error: unknown) {
+                  if (error instanceof Error) {
+                    toast.error('Failed to parse chat file: ' + error.message);
+                  } else {
+                    toast.error('Failed to parse chat file');
+                  }
+                }
+              };
+              reader.onerror = () => toast.error('Failed to read chat file');
+              reader.readAsText(file);
+            } catch (error) {
+              toast.error(error instanceof Error ? error.message : 'Failed to import chat');
+            }
+            e.target.value = ''; // Reset file input
+          } else {
+            toast.error('Something went wrong');
+          }
+        }}
+      />
+      <div className="flex flex-col items-center gap-4 max-w-2xl text-center">
+        <div className="flex gap-2">
+          <Button
+            onClick={() => {
+              const input = document.getElementById('chat-import');
+              input?.click();
+            }}
+            variant="default"
+            size="lg"
+            className={classNames(
+              'gap-2 bg-bolt-elements-background-depth-1',
+              'text-bolt-elements-textPrimary',
+              'hover:bg-bolt-elements-background-depth-2',
+              'border border-bolt-elements-borderColor',
+              'h-10 px-4 py-2 min-w-[120px] justify-center',
+              'transition-all duration-200 ease-in-out',
+            )}
+          >
+            <span className="i-ph:upload-simple w-4 h-4" />
+            Import Chat
+          </Button>
+          <ImportFolderButton
+            importChat={importChat}
+            className={classNames(
+              'gap-2 bg-bolt-elements-background-depth-1',
+              'text-bolt-elements-textPrimary',
+              'hover:bg-bolt-elements-background-depth-2',
+              'border border-[rgba(0,0,0,0.08)] dark:border-[rgba(255,255,255,0.08)]',
+              'h-10 px-4 py-2 min-w-[120px] justify-center',
+              'transition-all duration-200 ease-in-out rounded-lg',
+            )}
+          />
+        </div>
+      </div>
+    </div>
+  );
+}

tools/bolt.diy/app/components/deploy/DeployAlert.tsx

@@ -0,0 +1,197 @@
+import { AnimatePresence, motion } from 'framer-motion';
+import { classNames } from '~/utils/classNames';
+import type { DeployAlert } from '~/types/actions';
+
+interface DeployAlertProps {
+  alert: DeployAlert;
+  clearAlert: () => void;
+  postMessage: (message: string) => void;
+}
+
+export default function DeployChatAlert({ alert, clearAlert, postMessage }: DeployAlertProps) {
+  const { type, title, description, content, url, stage, buildStatus, deployStatus } = alert;
+
+  // Determine if we should show the deployment progress
+  const showProgress = stage && (buildStatus || deployStatus);
+
+  return (
+    <AnimatePresence>
+      <motion.div
+        initial={{ opacity: 0, y: -20 }}
+        animate={{ opacity: 1, y: 0 }}
+        exit={{ opacity: 0, y: -20 }}
+        transition={{ duration: 0.3 }}
+        className={`rounded-lg border border-bolt-elements-borderColor bg-bolt-elements-background-depth-2 p-4 mb-2`}
+      >
+        <div className="flex items-start">
+          {/* Icon */}
+          <motion.div
+            className="flex-shrink-0"
+            initial={{ scale: 0 }}
+            animate={{ scale: 1 }}
+            transition={{ delay: 0.2 }}
+          >
+            <div
+              className={classNames(
+                'text-xl',
+                type === 'success'
+                  ? 'i-ph:check-circle-duotone text-bolt-elements-icon-success'
+                  : type === 'error'
+                    ? 'i-ph:warning-duotone text-bolt-elements-button-danger-text'
+                    : 'i-ph:info-duotone text-bolt-elements-loader-progress',
+              )}
+            ></div>
+          </motion.div>
+          {/* Content */}
+          <div className="ml-3 flex-1">
+            <motion.h3
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              transition={{ delay: 0.1 }}
+              className={`text-sm font-medium text-bolt-elements-textPrimary`}
+            >
+              {title}
+            </motion.h3>
+            <motion.div
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              transition={{ delay: 0.2 }}
+              className={`mt-2 text-sm text-bolt-elements-textSecondary`}
+            >
+              <p>{description}</p>
+
+              {/* Deployment Progress Visualization */}
+              {showProgress && (
+                <div className="mt-4 mb-2">
+                  <div className="flex items-center space-x-2 mb-3">
+                    {/* Build Step */}
+                    <div className="flex items-center">
+                      <div
+                        className={classNames(
+                          'w-6 h-6 rounded-full flex items-center justify-center',
+                          buildStatus === 'running'
+                            ? 'bg-bolt-elements-loader-progress'
+                            : buildStatus === 'complete'
+                              ? 'bg-bolt-elements-icon-success'
+                              : buildStatus === 'failed'
+                                ? 'bg-bolt-elements-button-danger-background'
+                                : 'bg-bolt-elements-textTertiary',
+                        )}
+                      >
+                        {buildStatus === 'running' ? (
+                          <div className="i-svg-spinners:90-ring-with-bg text-white text-xs"></div>
+                        ) : buildStatus === 'complete' ? (
+                          <div className="i-ph:check text-white text-xs"></div>
+                        ) : buildStatus === 'failed' ? (
+                          <div className="i-ph:x text-white text-xs"></div>
+                        ) : (
+                          <span className="text-white text-xs">1</span>
+                        )}
+                      </div>
+                      <span className="ml-2">Build</span>
+                    </div>
+
+                    {/* Connector Line */}
+                    <div
+                      className={classNames(
+                        'h-0.5 w-8',
+                        buildStatus === 'complete' ? 'bg-bolt-elements-icon-success' : 'bg-bolt-elements-textTertiary',
+                      )}
+                    ></div>
+
+                    {/* Deploy Step */}
+                    <div className="flex items-center">
+                      <div
+                        className={classNames(
+                          'w-6 h-6 rounded-full flex items-center justify-center',
+                          deployStatus === 'running'
+                            ? 'bg-bolt-elements-loader-progress'
+                            : deployStatus === 'complete'
+                              ? 'bg-bolt-elements-icon-success'
+                              : deployStatus === 'failed'
+                                ? 'bg-bolt-elements-button-danger-background'
+                                : 'bg-bolt-elements-textTertiary',
+                        )}
+                      >
+                        {deployStatus === 'running' ? (
+                          <div className="i-svg-spinners:90-ring-with-bg text-white text-xs"></div>
+                        ) : deployStatus === 'complete' ? (
+                          <div className="i-ph:check text-white text-xs"></div>
+                        ) : deployStatus === 'failed' ? (
+                          <div className="i-ph:x text-white text-xs"></div>
+                        ) : (
+                          <span className="text-white text-xs">2</span>
+                        )}
+                      </div>
+                      <span className="ml-2">Deploy</span>
+                    </div>
+                  </div>
+                </div>
+              )}
+
+              {content && (
+                <div className="text-xs text-bolt-elements-textSecondary p-2 bg-bolt-elements-background-depth-3 rounded mt-4 mb-4">
+                  {content}
+                </div>
+              )}
+              {url && type === 'success' && (
+                <div className="mt-2">
+                  <a
+                    href={url}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="text-bolt-elements-item-contentAccent hover:underline flex items-center"
+                  >
+                    <span className="mr-1">View deployed site</span>
+                    <div className="i-ph:arrow-square-out"></div>
+                  </a>
+                </div>
+              )}
+            </motion.div>
+
+            {/* Actions */}
+            <motion.div
+              className="mt-4"
+              initial={{ opacity: 0, y: 10 }}
+              animate={{ opacity: 1, y: 0 }}
+              transition={{ delay: 0.3 }}
+            >
+              <div className={classNames('flex gap-2')}>
+                {type === 'error' && (
+                  <button
+                    onClick={() =>
+                      postMessage(`*Fix this deployment error*\n\`\`\`\n${content || description}\n\`\`\`\n`)
+                    }
+                    className={classNames(
+                      `px-2 py-1.5 rounded-md text-sm font-medium`,
+                      'bg-bolt-elements-button-primary-background',
+                      'hover:bg-bolt-elements-button-primary-backgroundHover',
+                      'focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-bolt-elements-button-danger-background',
+                      'text-bolt-elements-button-primary-text',
+                      'flex items-center gap-1.5',
+                    )}
+                  >
+                    <div className="i-ph:chat-circle-duotone"></div>
+                    Ask Bolt
+                  </button>
+                )}
+                <button
+                  onClick={clearAlert}
+                  className={classNames(
+                    `px-2 py-1.5 rounded-md text-sm font-medium`,
+                    'bg-bolt-elements-button-secondary-background',
+                    'hover:bg-bolt-elements-button-secondary-backgroundHover',
+                    'focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-bolt-elements-button-secondary-background',
+                    'text-bolt-elements-button-secondary-text',
+                  )}
+                >
+                  Dismiss
+                </button>
+              </div>
+            </motion.div>
+          </div>
+        </div>
+      </motion.div>
+    </AnimatePresence>
+  );
+}

tools/bolt.diy/app/components/deploy/DeployButton.tsx

@@ -0,0 +1,277 @@
+import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
+import { useStore } from '@nanostores/react';
+import { netlifyConnection } from '~/lib/stores/netlify';
+import { vercelConnection } from '~/lib/stores/vercel';
+import { isGitLabConnected } from '~/lib/stores/gitlabConnection';
+import { workbenchStore } from '~/lib/stores/workbench';
+import { streamingState } from '~/lib/stores/streaming';
+import { classNames } from '~/utils/classNames';
+import { useState } from 'react';
+import { NetlifyDeploymentLink } from '~/components/chat/NetlifyDeploymentLink.client';
+import { VercelDeploymentLink } from '~/components/chat/VercelDeploymentLink.client';
+import { useVercelDeploy } from '~/components/deploy/VercelDeploy.client';
+import { useNetlifyDeploy } from '~/components/deploy/NetlifyDeploy.client';
+import { useGitHubDeploy } from '~/components/deploy/GitHubDeploy.client';
+import { useGitLabDeploy } from '~/components/deploy/GitLabDeploy.client';
+import { GitHubDeploymentDialog } from '~/components/deploy/GitHubDeploymentDialog';
+import { GitLabDeploymentDialog } from '~/components/deploy/GitLabDeploymentDialog';
+
+interface DeployButtonProps {
+  onVercelDeploy?: () => Promise<void>;
+  onNetlifyDeploy?: () => Promise<void>;
+  onGitHubDeploy?: () => Promise<void>;
+  onGitLabDeploy?: () => Promise<void>;
+}
+
+export const DeployButton = ({
+  onVercelDeploy,
+  onNetlifyDeploy,
+  onGitHubDeploy,
+  onGitLabDeploy,
+}: DeployButtonProps) => {
+  const netlifyConn = useStore(netlifyConnection);
+  const vercelConn = useStore(vercelConnection);
+  const gitlabIsConnected = useStore(isGitLabConnected);
+  const [activePreviewIndex] = useState(0);
+  const previews = useStore(workbenchStore.previews);
+  const activePreview = previews[activePreviewIndex];
+  const [isDeploying, setIsDeploying] = useState(false);
+  const [deployingTo, setDeployingTo] = useState<'netlify' | 'vercel' | 'github' | 'gitlab' | null>(null);
+  const isStreaming = useStore(streamingState);
+  const { handleVercelDeploy } = useVercelDeploy();
+  const { handleNetlifyDeploy } = useNetlifyDeploy();
+  const { handleGitHubDeploy } = useGitHubDeploy();
+  const { handleGitLabDeploy } = useGitLabDeploy();
+  const [showGitHubDeploymentDialog, setShowGitHubDeploymentDialog] = useState(false);
+  const [showGitLabDeploymentDialog, setShowGitLabDeploymentDialog] = useState(false);
+  const [githubDeploymentFiles, setGithubDeploymentFiles] = useState<Record<string, string> | null>(null);
+  const [gitlabDeploymentFiles, setGitlabDeploymentFiles] = useState<Record<string, string> | null>(null);
+  const [githubProjectName, setGithubProjectName] = useState('');
+  const [gitlabProjectName, setGitlabProjectName] = useState('');
+
+  const handleVercelDeployClick = async () => {
+    setIsDeploying(true);
+    setDeployingTo('vercel');
+
+    try {
+      if (onVercelDeploy) {
+        await onVercelDeploy();
+      } else {
+        await handleVercelDeploy();
+      }
+    } finally {
+      setIsDeploying(false);
+      setDeployingTo(null);
+    }
+  };
+
+  const handleNetlifyDeployClick = async () => {
+    setIsDeploying(true);
+    setDeployingTo('netlify');
+
+    try {
+      if (onNetlifyDeploy) {
+        await onNetlifyDeploy();
+      } else {
+        await handleNetlifyDeploy();
+      }
+    } finally {
+      setIsDeploying(false);
+      setDeployingTo(null);
+    }
+  };
+
+  const handleGitHubDeployClick = async () => {
+    setIsDeploying(true);
+    setDeployingTo('github');
+
+    try {
+      if (onGitHubDeploy) {
+        await onGitHubDeploy();
+      } else {
+        const result = await handleGitHubDeploy();
+
+        if (result && result.success && result.files) {
+          setGithubDeploymentFiles(result.files);
+          setGithubProjectName(result.projectName);
+          setShowGitHubDeploymentDialog(true);
+        }
+      }
+    } finally {
+      setIsDeploying(false);
+      setDeployingTo(null);
+    }
+  };
+
+  const handleGitLabDeployClick = async () => {
+    setIsDeploying(true);
+    setDeployingTo('gitlab');
+
+    try {
+      if (onGitLabDeploy) {
+        await onGitLabDeploy();
+      } else {
+        const result = await handleGitLabDeploy();
+
+        if (result && result.success && result.files) {
+          setGitlabDeploymentFiles(result.files);
+          setGitlabProjectName(result.projectName);
+          setShowGitLabDeploymentDialog(true);
+        }
+      }
+    } finally {
+      setIsDeploying(false);
+      setDeployingTo(null);
+    }
+  };
+
+  return (
+    <>
+      <div className="flex border border-bolt-elements-borderColor rounded-md overflow-hidden text-sm">
+        <DropdownMenu.Root>
+          <DropdownMenu.Trigger
+            disabled={isDeploying || !activePreview || isStreaming}
+            className="rounded-md items-center justify-center [&:is(:disabled,.disabled)]:cursor-not-allowed [&:is(:disabled,.disabled)]:opacity-60 px-3 py-1.5 text-xs bg-accent-500 text-white hover:text-bolt-elements-item-contentAccent [&:not(:disabled,.disabled)]:hover:bg-bolt-elements-button-primary-backgroundHover outline-accent-500 flex gap-1.7"
+          >
+            {isDeploying ? `Deploying to ${deployingTo}...` : 'Deploy'}
+            <span className={classNames('i-ph:caret-down transition-transform')} />
+          </DropdownMenu.Trigger>
+          <DropdownMenu.Content
+            className={classNames(
+              'z-[250]',
+              'bg-bolt-elements-background-depth-2',
+              'rounded-lg shadow-lg',
+              'border border-bolt-elements-borderColor',
+              'animate-in fade-in-0 zoom-in-95',
+              'py-1',
+            )}
+            sideOffset={5}
+            align="end"
+          >
+            <DropdownMenu.Item
+              className={classNames(
+                'cursor-pointer flex items-center w-full px-4 py-2 text-sm text-bolt-elements-textPrimary hover:bg-bolt-elements-item-backgroundActive gap-2 rounded-md group relative',
+                {
+                  'opacity-60 cursor-not-allowed': isDeploying || !activePreview || !netlifyConn.user,
+                },
+              )}
+              disabled={isDeploying || !activePreview || !netlifyConn.user}
+              onClick={handleNetlifyDeployClick}
+            >
+              <img
+                className="w-5 h-5"
+                height="24"
+                width="24"
+                crossOrigin="anonymous"
+                src="https://cdn.simpleicons.org/netlify"
+              />
+              <span className="mx-auto">
+                {!netlifyConn.user ? 'No Netlify Account Connected' : 'Deploy to Netlify'}
+              </span>
+              {netlifyConn.user && <NetlifyDeploymentLink />}
+            </DropdownMenu.Item>
+
+            <DropdownMenu.Item
+              className={classNames(
+                'cursor-pointer flex items-center w-full px-4 py-2 text-sm text-bolt-elements-textPrimary hover:bg-bolt-elements-item-backgroundActive gap-2 rounded-md group relative',
+                {
+                  'opacity-60 cursor-not-allowed': isDeploying || !activePreview || !vercelConn.user,
+                },
+              )}
+              disabled={isDeploying || !activePreview || !vercelConn.user}
+              onClick={handleVercelDeployClick}
+            >
+              <img
+                className="w-5 h-5 bg-black p-1 rounded"
+                height="24"
+                width="24"
+                crossOrigin="anonymous"
+                src="https://cdn.simpleicons.org/vercel/white"
+                alt="vercel"
+              />
+              <span className="mx-auto">{!vercelConn.user ? 'No Vercel Account Connected' : 'Deploy to Vercel'}</span>
+              {vercelConn.user && <VercelDeploymentLink />}
+            </DropdownMenu.Item>
+
+            <DropdownMenu.Item
+              className={classNames(
+                'cursor-pointer flex items-center w-full px-4 py-2 text-sm text-bolt-elements-textPrimary hover:bg-bolt-elements-item-backgroundActive gap-2 rounded-md group relative',
+                {
+                  'opacity-60 cursor-not-allowed': isDeploying || !activePreview,
+                },
+              )}
+              disabled={isDeploying || !activePreview}
+              onClick={handleGitHubDeployClick}
+            >
+              <img
+                className="w-5 h-5"
+                height="24"
+                width="24"
+                crossOrigin="anonymous"
+                src="https://cdn.simpleicons.org/github"
+                alt="github"
+              />
+              <span className="mx-auto">Deploy to GitHub</span>
+            </DropdownMenu.Item>
+
+            <DropdownMenu.Item
+              className={classNames(
+                'cursor-pointer flex items-center w-full px-4 py-2 text-sm text-bolt-elements-textPrimary hover:bg-bolt-elements-item-backgroundActive gap-2 rounded-md group relative',
+                {
+                  'opacity-60 cursor-not-allowed': isDeploying || !activePreview || !gitlabIsConnected,
+                },
+              )}
+              disabled={isDeploying || !activePreview || !gitlabIsConnected}
+              onClick={handleGitLabDeployClick}
+            >
+              <img
+                className="w-5 h-5"
+                height="24"
+                width="24"
+                crossOrigin="anonymous"
+                src="https://cdn.simpleicons.org/gitlab"
+                alt="gitlab"
+              />
+              <span className="mx-auto">{!gitlabIsConnected ? 'No GitLab Account Connected' : 'Deploy to GitLab'}</span>
+            </DropdownMenu.Item>
+
+            <DropdownMenu.Item
+              disabled
+              className="flex items-center w-full rounded-md px-4 py-2 text-sm text-bolt-elements-textTertiary gap-2 opacity-60 cursor-not-allowed"
+            >
+              <img
+                className="w-5 h-5"
+                height="24"
+                width="24"
+                crossOrigin="anonymous"
+                src="https://cdn.simpleicons.org/cloudflare"
+                alt="cloudflare"
+              />
+              <span className="mx-auto">Deploy to Cloudflare (Coming Soon)</span>
+            </DropdownMenu.Item>
+          </DropdownMenu.Content>
+        </DropdownMenu.Root>
+      </div>
+
+      {/* GitHub Deployment Dialog */}
+      {showGitHubDeploymentDialog && githubDeploymentFiles && (
+        <GitHubDeploymentDialog
+          isOpen={showGitHubDeploymentDialog}
+          onClose={() => setShowGitHubDeploymentDialog(false)}
+          projectName={githubProjectName}
+          files={githubDeploymentFiles}
+        />
+      )}
+
+      {/* GitLab Deployment Dialog */}
+      {showGitLabDeploymentDialog && gitlabDeploymentFiles && (
+        <GitLabDeploymentDialog
+          isOpen={showGitLabDeploymentDialog}
+          onClose={() => setShowGitLabDeploymentDialog(false)}
+          projectName={gitlabProjectName}
+          files={gitlabDeploymentFiles}
+        />
+      )}
+    </>
+  );
+};