Handle external applications with app type distinction

Author: charlesvien

apps/array/src/main/services/externalApps.ts

@@ -24,21 +24,37 @@ async function getFileIcon() {
 let cachedApps: DetectedApplication[] | null = null;
 let detectionPromise: Promise<DetectedApplication[]> | null = null;
 
-const APP_PATHS: Record<string, string> = {
-  vscode: "/Applications/Visual Studio Code.app",
-  cursor: "/Applications/Cursor.app",
-  sublime: "/Applications/Sublime Text.app",
-  webstorm: "/Applications/WebStorm.app",
-  intellij: "/Applications/IntelliJ IDEA.app",
-  zed: "/Applications/Zed.app",
-  pycharm: "/Applications/PyCharm.app",
-  iterm: "/Applications/iTerm.app",
-  warp: "/Applications/Warp.app",
-  terminal: "/System/Applications/Utilities/Terminal.app",
-  alacritty: "/Applications/Alacritty.app",
-  kitty: "/Applications/kitty.app",
-  ghostty: "/Applications/Ghostty.app",
-  finder: "/System/Library/CoreServices/Finder.app",
+interface AppDefinition {
+  path: string;
+  type: ExternalAppType;
+}
+
+const APP_DEFINITIONS: Record<string, AppDefinition> = {
+  // Editors
+  vscode: { path: "/Applications/Visual Studio Code.app", type: "editor" },
+  cursor: { path: "/Applications/Cursor.app", type: "editor" },
+  sublime: { path: "/Applications/Sublime Text.app", type: "editor" },
+  webstorm: { path: "/Applications/WebStorm.app", type: "editor" },
+  intellij: { path: "/Applications/IntelliJ IDEA.app", type: "editor" },
+  zed: { path: "/Applications/Zed.app", type: "editor" },
+  pycharm: { path: "/Applications/PyCharm.app", type: "editor" },
+
+  // Terminals
+  iterm: { path: "/Applications/iTerm.app", type: "terminal" },
+  warp: { path: "/Applications/Warp.app", type: "terminal" },
+  terminal: {
+    path: "/System/Applications/Utilities/Terminal.app",
+    type: "terminal",
+  },
+  alacritty: { path: "/Applications/Alacritty.app", type: "terminal" },
+  kitty: { path: "/Applications/kitty.app", type: "terminal" },
+  ghostty: { path: "/Applications/Ghostty.app", type: "terminal" },
+
+  // File managers
+  finder: {
+    path: "/System/Library/CoreServices/Finder.app",
+    type: "file-manager",
+  },
 };
 
 const DISPLAY_NAMES: Record<string, string> = {
@@ -129,8 +145,12 @@ async function checkApplication(
 async function detectExternalApps(): Promise<DetectedApplication[]> {
   const apps: DetectedApplication[] = [];
 
-  for (const [id, appPath] of Object.entries(APP_PATHS)) {
-    const detected = await checkApplication(id, appPath, "editor");
+  for (const [id, definition] of Object.entries(APP_DEFINITIONS)) {
+    const detected = await checkApplication(
+      id,
+      definition.path,
+      definition.type,
+    );
     if (detected) {
       apps.push(detected);
     }
@@ -180,11 +200,21 @@ export function registerExternalAppsIpc(): void {
           return { success: false, error: "Application not found" };
         }
 
+        let isFile = false;
+        try {
+          const stat = await fs.stat(targetPath);
+          isFile = stat.isFile();
+        } catch {
+          // if stat fails, assume it is a path that does not exist yet
+          isFile = false;
+        }
+
         let command: string;
-        if (appToOpen.command.includes("open -a")) {
-          command = `${appToOpen.command} "${targetPath}"`;
+        if (appToOpen.id === "finder" && isFile) {
+          // for Finder with files, use -R to highlight the file in its parent folder
+          command = `open -R "${targetPath}"`;
         } else {
-          command = `${appToOpen.command} "${targetPath}"`;
+          command = `open -a "${appToOpen.path}" "${targetPath}"`;
         }
 
         await execAsync(command);

apps/array/src/renderer/features/task-detail/components/ChangesPanel.tsx

@@ -139,6 +139,11 @@ function ChangedFileItem({
       fullPath,
       fileName,
     );
+
+    // blur active element to dismiss any open tooltip
+    if (document.activeElement instanceof HTMLElement) {
+      document.activeElement.blur();
+    }
   };
 
   const handleCopyPath = async () => {
@@ -288,27 +293,29 @@ function ChangedFileItem({
               </DropdownMenu.Trigger>
             </Tooltip>
             <DropdownMenu.Content size="1" align="end">
-              {detectedApps.map((app) => (
-                <DropdownMenu.Item
-                  key={app.id}
-                  onSelect={() => handleOpenWith(app.id)}
-                >
-                  <Flex align="center" gap="2">
-                    {app.icon ? (
-                      <img
-                        src={app.icon}
-                        width={16}
-                        height={16}
-                        alt=""
-                        style={{ borderRadius: "2px" }}
-                      />
-                    ) : (
-                      <CodeIcon size={16} weight="regular" />
-                    )}
-                    <Text size="1">{app.name}</Text>
-                  </Flex>
-                </DropdownMenu.Item>
-              ))}
+              {detectedApps
+                .filter((app) => app.type !== "terminal")
+                .map((app) => (
+                  <DropdownMenu.Item
+                    key={app.id}
+                    onSelect={() => handleOpenWith(app.id)}
+                  >
+                    <Flex align="center" gap="2">
+                      {app.icon ? (
+                        <img
+                          src={app.icon}
+                          width={16}
+                          height={16}
+                          alt=""
+                          style={{ borderRadius: "2px" }}
+                        />
+                      ) : (
+                        <CodeIcon size={16} weight="regular" />
+                      )}
+                      <Text size="1">{app.name}</Text>
+                    </Flex>
+                  </DropdownMenu.Item>
+                ))}
               <DropdownMenu.Separator />
               <DropdownMenu.Item onSelect={handleCopyPath}>
                 <Flex align="center" gap="2">

apps/array/src/shared/types.ts

@@ -189,7 +189,7 @@ export interface ChangedFile {
 }
 
 // External apps detection types
-export type ExternalAppType = "editor" | "terminal";
+export type ExternalAppType = "editor" | "terminal" | "file-manager";
 
 export interface DetectedApplication {
   id: string; // "vscode", "cursor", "iterm"