fix: detect script changes from remote repository

- Add refetchOnMount and staleTime: 0 to compareScriptContent query to bypass React Query cache
- Add visible refresh button in script detail modal to manually check for updates
- Improve comparison error handling and logging for better debugging
- Display error messages in UI when comparison fails
- Ensure comparison always checks remote repository when modal opens

src/app/_components/ScriptDetailModal.tsx

@@ -61,7 +61,11 @@ export function ScriptDetailModal({
     isLoading: comparisonLoading,
   } = api.scripts.compareScriptContent.useQuery(
     { slug: script?.slug ?? "" },
-    { enabled: !!script && isOpen },
+    { 
+      enabled: !!script && isOpen,
+      refetchOnMount: true,
+      staleTime: 0,
+    },
   );
 
   // Load script mutation
@@ -547,19 +551,60 @@ export function ScriptDetailModal({
                     </div>
                     {scriptFilesData?.success &&
                       (scriptFilesData.ctExists ||
-                        scriptFilesData.installExists) &&
+                        scriptFilesData.installExists) && (
-                      comparisonData?.success &&
-                      !comparisonLoading && (
                         <div className="flex items-center space-x-2">
-                          <div
+                          {comparisonData?.success ? (
-                            className={`h-2 w-2 rounded-full ${comparisonData.hasDifferences ? "bg-warning" : "bg-success"}`}
+                            <>
-                          ></div>
+                              <div
-                          <span>
+                                className={`h-2 w-2 rounded-full ${comparisonData.hasDifferences ? "bg-warning" : "bg-success"}`}
-                            Status:{" "}
+                              ></div>
-                            {comparisonData.hasDifferences
+                              <span>
-                              ? "Update available"
+                                Status:{" "}
-                              : "Up to date"}
+                                {comparisonData.hasDifferences
-                          </span>
+                                  ? "Update available"
+                                  : "Up to date"}
+                              </span>
+                            </>
+                          ) : comparisonLoading ? (
+                            <>
+                              <div className="h-2 w-2 rounded-full bg-muted animate-pulse"></div>
+                              <span>Checking for updates...</span>
+                            </>
+                          ) : comparisonData?.error ? (
+                            <>
+                              <div className="h-2 w-2 rounded-full bg-destructive"></div>
+                              <span className="text-destructive">Error: {comparisonData.error}</span>
+                            </>
+                          ) : (
+                            <>
+                              <div className="h-2 w-2 rounded-full bg-muted"></div>
+                              <span>Status: Unknown</span>
+                            </>
+                          )}
+                          <button
+                            onClick={() => void refetchComparison()}
+                            disabled={comparisonLoading}
+                            className="ml-2 p-1.5 rounded-md hover:bg-accent transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center"
+                            title="Refresh comparison"
+                          >
+                            {comparisonLoading ? (
+                              <div className="h-4 w-4 animate-spin rounded-full border-2 border-current border-t-transparent"></div>
+                            ) : (
+                              <svg
+                                className="h-4 w-4 text-muted-foreground hover:text-foreground"
+                                fill="none"
+                                stroke="currentColor"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  strokeLinecap="round"
+                                  strokeLinejoin="round"
+                                  strokeWidth={2}
+                                  d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"
+                                />
+                              </svg>
+                            )}
+                          </button>
                         </div>
                       )}
                   </div>

src/server/services/scriptDownloader.js

@@ -519,13 +519,16 @@ export class ScriptDownloaderService {
               comparisonPromises.push(
                 this.compareSingleFile(script, scriptPath, `${finalTargetDir}/${fileName}`)
                   .then(result => {
+                    if (result.error) {
+                      console.error(`[Comparison] Error comparing ${result.filePath}: ${result.error}`);
+                    }
                     if (result.hasDifferences) {
                       hasDifferences = true;
                       differences.push(result.filePath);
                     }
                   })
-                  .catch(() => {
+                  .catch((error) => {
-                    // Don't add to differences if there's an error reading files
+                    console.error(`[Comparison] Promise error for ${scriptPath}:`, error);
                   })
               );
             }
@@ -541,13 +544,16 @@ export class ScriptDownloaderService {
         comparisonPromises.push(
           this.compareSingleFile(script, installScriptPath, installScriptPath)
             .then(result => {
+              if (result.error) {
+                console.error(`[Comparison] Error comparing ${result.filePath}: ${result.error}`);
+              }
               if (result.hasDifferences) {
                 hasDifferences = true;
                 differences.push(result.filePath);
               }
             })
-            .catch(() => {
+            .catch((error) => {
-              // Don't add to differences if there's an error reading files
+              console.error(`[Comparison] Promise error for ${installScriptPath}:`, error);
             })
         );
       }
@@ -567,13 +573,16 @@ export class ScriptDownloaderService {
           comparisonPromises.push(
             this.compareSingleFile(script, alpineInstallScriptPath, alpineInstallScriptPath)
               .then(result => {
+                if (result.error) {
+                  console.error(`[Comparison] Error comparing ${result.filePath}: ${result.error}`);
+                }
                 if (result.hasDifferences) {
                   hasDifferences = true;
                   differences.push(result.filePath);
                 }
               })
-              .catch(() => {
+              .catch((error) => {
-                // Don't add to differences if there's an error reading files
+                console.error(`[Comparison] Promise error for ${alpineInstallScriptPath}:`, error);
               })
           );
         } catch {
@@ -584,10 +593,11 @@ export class ScriptDownloaderService {
       // Wait for all comparisons to complete
       await Promise.all(comparisonPromises);
 
+      console.log(`[Comparison] Completed comparison for ${script.slug}: hasDifferences=${hasDifferences}, differences=${differences.length}`);
       return { hasDifferences, differences };
     } catch (error) {
-      console.error('Error comparing script content:', error);
+      console.error(`[Comparison] Error comparing script content for ${script.slug}:`, error);
-      return { hasDifferences: false, differences: [] };
+      return { hasDifferences: false, differences: [], error: error.message };
     }
   }
 
@@ -597,16 +607,21 @@ export class ScriptDownloaderService {
       const repoUrl = this.getRepoUrlForScript(script);
       const branch = process.env.REPO_BRANCH || 'main';
       
+      console.log(`[Comparison] Comparing ${filePath} from ${repoUrl} (branch: ${branch})`);
+      
       // Read local content
       const localContent = await readFile(localPath, 'utf-8');
+      console.log(`[Comparison] Local file size: ${localContent.length} bytes`);
       
       // Download remote content from the script's repository
       const remoteContent = await this.downloadFileFromGitHub(repoUrl, remotePath, branch);
+      console.log(`[Comparison] Remote file size: ${remoteContent.length} bytes`);
       
       // Apply modification only for CT scripts, not for other script types
       let modifiedRemoteContent;
       if (remotePath.startsWith('ct/')) {
         modifiedRemoteContent = this.modifyScriptContent(remoteContent);
+        console.log(`[Comparison] Applied CT script modifications`);
       } else {
         modifiedRemoteContent = remoteContent; // Don't modify tools or vm scripts
       }
@@ -614,10 +629,17 @@ export class ScriptDownloaderService {
       // Compare content
       const hasDifferences = localContent !== modifiedRemoteContent;
       
+      if (hasDifferences) {
+        console.log(`[Comparison] Differences found in ${filePath}`);
+      } else {
+        console.log(`[Comparison] No differences in ${filePath}`);
+      }
+      
       return { hasDifferences, filePath };
     } catch (error) {
-      console.error(`Error comparing file ${filePath}:`, error);
+      console.error(`[Comparison] Error comparing file ${filePath}:`, error.message);
-      return { hasDifferences: false, filePath };
+      // Return error information so it can be handled upstream
+      return { hasDifferences: false, filePath, error: error.message };
     }
   }