Merge branch 'main' into terminal-error-detection

.github/workflows/commit.yaml

@@ -17,20 +17,18 @@ jobs:
     - name: Checkout the code
       uses: actions/checkout@v3
 
-    - name: Get the latest commit hash
-      run: echo "COMMIT_HASH=$(git rev-parse HEAD)" >> $GITHUB_ENV
-
-
     - name: Setup Node.js
       uses: actions/setup-node@v4
       with:
         node-version: '20'
-
-
-    - name: Update commit file
+    - name: Get the latest commit hash
       run: |
+        echo "COMMIT_HASH=$(git rev-parse HEAD)" >> $GITHUB_ENV
         echo "CURRENT_VERSION=$(node -p "require('./package.json').version")" >> $GITHUB_ENV
-        echo "{ \"commit\": \"$COMMIT_HASH\" , \"version\": \"$CURRENT_VERSION\" }" > app/commit.json
+      
+    - name: Update commit file
+      run: |
+        echo "{ \"commit\": \"$COMMIT_HASH\", \"version\": \"$CURRENT_VERSION\" }" > app/commit.json
 
     - name: Commit and push the update
       run: |

.github/workflows/semantic-pr.yaml

@@ -0,0 +1,32 @@
+name: Semantic Pull Request
+on:
+  pull_request_target:
+    types: [opened, reopened, edited, synchronize]
+permissions:
+  pull-requests: read
+jobs:
+  main:
+    name: Validate PR Title
+    runs-on: ubuntu-latest
+    steps:
+      # https://github.com/amannn/action-semantic-pull-request/releases/tag/v5.5.3
+      - uses: amannn/action-semantic-pull-request@0723387faaf9b38adef4775cd42cfd5155ed6017
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          subjectPattern: ^(?![A-Z]).+$
+          subjectPatternError: |
+            The subject "{subject}" found in the pull request title "{title}"
+            didn't match the configured pattern. Please ensure that the subject
+            doesn't start with an uppercase character.
+          types: |
+            fix
+            feat
+            chore
+            build
+            ci
+            perf
+            docs
+            refactor
+            revert
+            test

.github/workflows/update-stable.yml

@@ -158,12 +158,15 @@ jobs:
           echo "$CHANGELOG_CONTENT" >> $GITHUB_OUTPUT
           echo "EOF" >> $GITHUB_OUTPUT
 
-      - name: Commit and Tag Release
+      - name: Get the latest commit hash and version tag
         run: |
           echo "COMMIT_HASH=$(git rev-parse HEAD)" >> $GITHUB_ENV
-          echo "CURRENT_VERSION=$(node -p "require('./package.json').version")" >> $GITHUB_ENV
+          echo "NEW_VERSION=${{ steps.bump_version.outputs.new_version }}" >> $GITHUB_ENV
+          
+      - name: Commit and Tag Release
+        run: |
           git pull
-          echo "{ \"commit\": \"$COMMIT_HASH\" , \"version\": \"$CURRENT_VERSION\" }" > app/commit.json
+          echo "{ \"commit\": \"$COMMIT_HASH\", \"version\": \"$NEW_VERSION\" }" > app/commit.json
           git add package.json pnpm-lock.yaml changelog.md app/commit.json
           git commit -m "chore: release version ${{ steps.bump_version.outputs.new_version }}"
           git tag "v${{ steps.bump_version.outputs.new_version }}"

README.md

@@ -43,6 +43,9 @@ https://thinktank.ottomator.ai
 - ✅ Mobile friendly (@qwikode)
 - ✅ Better prompt enhancing (@SujalXplores)
 - ✅ Attach images to prompts (@atrokhym)
+- ✅ Added Git Clone button (@thecodacus)
+- ✅ Git Import from url (@thecodacus)
+- ✅ PromptLibrary to have different variations of prompts for different use cases (@thecodacus)
 - ✅ Detect package.json and commands to auto install & run preview for folder and git import (@wonderwhy-er)
 - ✅ Selection tool to target changes visually (@emcconnell)
 - ⬜ **HIGH PRIORITY** - Prevent bolt from rewriting files as often (file locking and diffs)

app/commit.json

@@ -1 +1 @@
-{ "commit": "eb1d5417e77e699e0489f09814e87fb5afed9dd5" , "version": "" }
+{ "commit": "1e72d52278730f7d22448be9d5cf2daf12559486", "version": "0.0.2" }

app/components/chat/BaseChat.tsx

@@ -77,6 +77,8 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
       input = '',
       enhancingPrompt,
       handleInputChange,
+
+      // promptEnhanced,
       enhancePrompt,
       sendMessage,
       handleStop,

app/components/chat/Chat.client.tsx

@@ -20,6 +20,7 @@ import Cookies from 'js-cookie';
 import { debounce } from '~/utils/debounce';
 import { useSettings } from '~/lib/hooks/useSettings';
 import type { ProviderInfo } from '~/types/model';
+import { useSearchParams } from '@remix-run/react';
 
 const toastAnimation = cssTransition({
   enter: 'animated fadeInRight',
@@ -92,8 +93,9 @@ export const ChatImpl = memo(
     const [chatStarted, setChatStarted] = useState(initialMessages.length > 0);
     const [uploadedFiles, setUploadedFiles] = useState<File[]>([]); // Move here
     const [imageDataList, setImageDataList] = useState<string[]>([]); // Move here
+    const [searchParams, setSearchParams] = useSearchParams();
     const files = useStore(workbenchStore.files);
-    const { activeProviders } = useSettings();
+    const { activeProviders, promptId } = useSettings();
 
     const [model, setModel] = useState(() => {
       const savedModel = Cookies.get('selectedModel');
@@ -115,6 +117,7 @@ export const ChatImpl = memo(
       body: {
         apiKeys,
         files,
+        promptId,
       },
       sendExtraMessageFields: true,
       onError: (error) => {
@@ -137,6 +140,24 @@ export const ChatImpl = memo(
       initialMessages,
       initialInput: Cookies.get(PROMPT_COOKIE_KEY) || '',
     });
+    useEffect(() => {
+      const prompt = searchParams.get('prompt');
+      console.log(prompt, searchParams, model, provider);
+
+      if (prompt) {
+        setSearchParams({});
+        runAnimation();
+        append({
+          role: 'user',
+          content: [
+            {
+              type: 'text',
+              text: `[Model: ${model}]\n\n[Provider: ${provider.name}]\n\n${prompt}`,
+            },
+          ] as any, // Type assertion to bypass compiler check
+        });
+      }
+    }, [model, provider, searchParams]);
 
     const { enhancingPrompt, promptEnhanced, enhancePrompt, resetEnhancer } = usePromptEnhancer();
     const { parsedMessages, parseMessages } = useMessageParser();

app/components/chat/CodeBlock.tsx

@@ -53,7 +53,7 @@ export const CodeBlock = memo(
         <div
           className={classNames(
             styles.CopyButtonContainer,
-            'bg-white absolute top-[10px] right-[10px] rounded-md z-10 text-lg flex items-center justify-center opacity-0 group-hover:opacity-100',
+            'bg-transparant absolute top-[10px] right-[10px] rounded-md z-10 text-lg flex items-center justify-center opacity-0 group-hover:opacity-100',
             {
               'rounded-l-0 opacity-100': copied,
             },
@@ -62,7 +62,7 @@ export const CodeBlock = memo(
           {!disableCopy && (
             <button
               className={classNames(
-                'flex items-center bg-transparent p-[6px] justify-center before:bg-white before:rounded-l-md before:text-gray-500 before:border-r before:border-gray-300',
+                'flex items-center bg-accent-500 p-[6px] justify-center before:bg-white before:rounded-l-md before:text-gray-500 before:border-r before:border-gray-300 rounded-md transition-theme',
                 {
                   'before:opacity-0': !copied,
                   'before:opacity-100': copied,

app/components/git/GitUrlImport.client.tsx

@@ -8,6 +8,8 @@ import { Chat } from '~/components/chat/Chat.client';
 import { useGit } from '~/lib/hooks/useGit';
 import { useChatHistory } from '~/lib/persistence';
 import { createCommandsMessage, detectProjectCommands } from '~/utils/projectCommands';
+import { LoadingOverlay } from '~/components/ui/LoadingOverlay';
+import { toast } from 'react-toastify';
 
 const IGNORE_PATTERNS = [
   'node_modules/**',
@@ -38,6 +40,7 @@ export function GitUrlImport() {
   const { ready: historyReady, importChat } = useChatHistory();
   const { ready: gitReady, gitClone } = useGit();
   const [imported, setImported] = useState(false);
+  const [loading, setLoading] = useState(true);
 
   const importRepo = async (repoUrl?: string) => {
     if (!gitReady && !historyReady) {
@@ -109,9 +112,23 @@ ${file.content}
       return;
     }
 
-    importRepo(url);
+    importRepo(url).catch((error) => {
+      console.error('Error importing repo:', error);
+      toast.error('Failed to import repository');
+      setLoading(false);
+      window.location.href = '/';
+    });
     setImported(true);
   }, [searchParams, historyReady, gitReady, imported]);
 
-  return <ClientOnly fallback={<BaseChat />}>{() => <Chat />}</ClientOnly>;
+  return (
+    <ClientOnly fallback={<BaseChat />}>
+      {() => (
+        <>
+          <Chat />
+          {loading && <LoadingOverlay message="Please wait while we clone the repository..." />}
+        </>
+      )}
+    </ClientOnly>
+  );
 }

app/components/settings/connections/ConnectionsTab.tsx

@@ -1,21 +1,93 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import { toast } from 'react-toastify';
 import Cookies from 'js-cookie';
 import { logStore } from '~/lib/stores/logs';
 
+interface GitHubUserResponse {
+  login: string;
+  id: number;
+  [key: string]: any; // for other properties we don't explicitly need
+}
+
 export default function ConnectionsTab() {
   const [githubUsername, setGithubUsername] = useState(Cookies.get('githubUsername') || '');
   const [githubToken, setGithubToken] = useState(Cookies.get('githubToken') || '');
+  const [isConnected, setIsConnected] = useState(false);
+  const [isVerifying, setIsVerifying] = useState(false);
+
+  useEffect(() => {
+    // Check if credentials exist and verify them
+    if (githubUsername && githubToken) {
+      verifyGitHubCredentials();
+    }
+  }, []);
+
+  const verifyGitHubCredentials = async () => {
+    setIsVerifying(true);
+
+    try {
+      const response = await fetch('https://api.github.com/user', {
+        headers: {
+          Authorization: `Bearer ${githubToken}`,
+        },
+      });
+
+      if (response.ok) {
+        const data = (await response.json()) as GitHubUserResponse;
+
+        if (data.login === githubUsername) {
+          setIsConnected(true);
+          return true;
+        }
+      }
+
+      setIsConnected(false);
+
+      return false;
+    } catch (error) {
+      console.error('Error verifying GitHub credentials:', error);
+      setIsConnected(false);
 
-  const handleSaveConnection = () => {
-    Cookies.set('githubUsername', githubUsername);
-    Cookies.set('githubToken', githubToken);
-    logStore.logSystem('GitHub connection settings updated', {
-      username: githubUsername,
-      hasToken: !!githubToken,
-    });
-    toast.success('GitHub credentials saved successfully!');
-    Cookies.set('git:github.com', JSON.stringify({ username: githubToken, password: 'x-oauth-basic' }));
+      return false;
+    } finally {
+      setIsVerifying(false);
+    }
+  };
+
+  const handleSaveConnection = async () => {
+    if (!githubUsername || !githubToken) {
+      toast.error('Please provide both GitHub username and token');
+      return;
+    }
+
+    setIsVerifying(true);
+
+    const isValid = await verifyGitHubCredentials();
+
+    if (isValid) {
+      Cookies.set('githubUsername', githubUsername);
+      Cookies.set('githubToken', githubToken);
+      logStore.logSystem('GitHub connection settings updated', {
+        username: githubUsername,
+        hasToken: !!githubToken,
+      });
+      toast.success('GitHub credentials verified and saved successfully!');
+      Cookies.set('git:github.com', JSON.stringify({ username: githubToken, password: 'x-oauth-basic' }));
+      setIsConnected(true);
+    } else {
+      toast.error('Invalid GitHub credentials. Please check your username and token.');
+    }
+  };
+
+  const handleDisconnect = () => {
+    Cookies.remove('githubUsername');
+    Cookies.remove('githubToken');
+    Cookies.remove('git:github.com');
+    setGithubUsername('');
+    setGithubToken('');
+    setIsConnected(false);
+    logStore.logSystem('GitHub connection removed');
+    toast.success('GitHub connection removed successfully!');
   };
 
   return (
@@ -28,7 +100,8 @@ export default function ConnectionsTab() {
             type="text"
             value={githubUsername}
             onChange={(e) => setGithubUsername(e.target.value)}
-            className="w-full bg-white dark:bg-bolt-elements-background-depth-4 relative px-2 py-1.5 rounded-md focus:outline-none placeholder-bolt-elements-textTertiary text-bolt-elements-textPrimary dark:text-bolt-elements-textPrimary border border-bolt-elements-borderColor"
+            disabled={isVerifying}
+            className="w-full bg-white dark:bg-bolt-elements-background-depth-4 relative px-2 py-1.5 rounded-md focus:outline-none placeholder-bolt-elements-textTertiary text-bolt-elements-textPrimary dark:text-bolt-elements-textPrimary border border-bolt-elements-borderColor disabled:opacity-50"
           />
         </div>
         <div className="flex-1">
@@ -37,17 +110,41 @@ export default function ConnectionsTab() {
             type="password"
             value={githubToken}
             onChange={(e) => setGithubToken(e.target.value)}
-            className="w-full bg-white dark:bg-bolt-elements-background-depth-4 relative px-2 py-1.5 rounded-md focus:outline-none placeholder-bolt-elements-textTertiary text-bolt-elements-textPrimary dark:text-bolt-elements-textPrimary border border-bolt-elements-borderColor"
+            disabled={isVerifying}
+            className="w-full bg-white dark:bg-bolt-elements-background-depth-4 relative px-2 py-1.5 rounded-md focus:outline-none placeholder-bolt-elements-textTertiary text-bolt-elements-textPrimary dark:text-bolt-elements-textPrimary border border-bolt-elements-borderColor disabled:opacity-50"
           />
         </div>
       </div>
-      <div className="flex mb-4">
-        <button
-          onClick={handleSaveConnection}
-          className="bg-bolt-elements-button-primary-background rounded-lg px-4 py-2 mr-2 transition-colors duration-200 hover:bg-bolt-elements-button-primary-backgroundHover text-bolt-elements-button-primary-text"
-        >
-          Save Connection
-        </button>
+      <div className="flex mb-4 items-center">
+        {!isConnected ? (
+          <button
+            onClick={handleSaveConnection}
+            disabled={isVerifying || !githubUsername || !githubToken}
+            className="bg-bolt-elements-button-primary-background rounded-lg px-4 py-2 mr-2 transition-colors duration-200 hover:bg-bolt-elements-button-primary-backgroundHover text-bolt-elements-button-primary-text disabled:opacity-50 disabled:cursor-not-allowed flex items-center"
+          >
+            {isVerifying ? (
+              <>
+                <div className="i-ph:spinner animate-spin mr-2" />
+                Verifying...
+              </>
+            ) : (
+              'Connect'
+            )}
+          </button>
+        ) : (
+          <button
+            onClick={handleDisconnect}
+            className="bg-bolt-elements-button-danger-background rounded-lg px-4 py-2 mr-2 transition-colors duration-200 hover:bg-bolt-elements-button-danger-backgroundHover text-bolt-elements-button-danger-text"
+          >
+            Disconnect
+          </button>
+        )}
+        {isConnected && (
+          <span className="text-sm text-green-600 flex items-center">
+            <div className="i-ph:check-circle mr-1" />
+            Connected to GitHub
+          </span>
+        )}
       </div>
     </div>
   );