Improve files view behavior and Open In integration (#579)
* feat: open focused file in selected desktop app * fix: make file tree indicators match active open tabs * fix: limit preview functionality to markdown files only * feat: add Open In action to file editor toolbar. add antigravity to openin app list
This commit is contained in:
Iuliia Ivashko
@@ -10,57 +10,42 @@ import { toast } from '@/components/ui';
|
||||
import { updateDesktopSettings } from '@/lib/persistence';
|
||||
import { copyTextToClipboard } from '@/lib/clipboard';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { fetchDesktopInstalledApps, isDesktopLocalOriginActive, isTauriShell, openDesktopPath, type DesktopSettings, type InstalledDesktopAppInfo } from '@/lib/desktop';
|
||||
import { fetchDesktopInstalledApps, isDesktopLocalOriginActive, isTauriShell, openDesktopPath, openDesktopProjectInApp, type DesktopSettings, type InstalledDesktopAppInfo } from '@/lib/desktop';
|
||||
import { DEFAULT_OPEN_IN_APP_ID, OPEN_IN_APPS, getOpenInAppById, type OpenInApp } from '@/lib/openInApps';
|
||||
import { RiArrowDownSLine, RiCheckLine, RiFileCopyLine, RiRefreshLine } from '@remixicon/react';
|
||||
|
||||
const FINDER_DEFAULT_ICON_DATA_URL = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAeGVYSWZNTQAqAAAACAAEARoABQAAAAEAAAA+ARsABQAAAAEAAABGASgAAwAAAAEAAgAAh2kABAAAAAEAAABOAAAAAAAAAJAAAAABAAAAkAAAAAEAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAIKADAAQAAAABAAAAIAAAAAB+C9pSAAAACXBIWXMAABYlAAAWJQFJUiTwAAABnWlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNi4wLjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpleGlmPSJodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyI+CiAgICAgICAgIDxleGlmOlBpeGVsWERpbWVuc2lvbj4yNTY8L2V4aWY6UGl4ZWxYRGltZW5zaW9uPgogICAgICAgICA8ZXhpZjpQaXhlbFlEaW1lbnNpb24+MjU2PC9leGlmOlBpeGVsWURpbWVuc2lvbj4KICAgICAgPC9yZGY6RGVzY3JpcHRpb24+CiAgIDwvcmRmOlJERj4KPC94OnhtcG1ldGE+Cl6wHhsAAAXaSURBVFgJ7VddbBRVFP5mdme6dOnu2tZawOAPjfxU+bGQYCRAsvw8qNGEQPTRJ0I0amL0wfjgA/HBR8KLD8YgDxJEUkVFxSYYTSRii6DQQCMGIQqlW7p0u+zMzo/fuTuzO9Nt0Td94CRn7pl7z5zznZ977y5wh/7jDGiz+T979qD5Ujbfd90xlll+stOF1uI40B1+4HhkjnZk9CgLQ9iXp2/BdcbgVc/h0sAgduywudJEMwLY9Of4ugtW5p3CpL7W1jTN88VmjdQYvnDKF1mczkYuNZLeCVg3X8fa9u+nqzUB2HRpdN2pSseRQknPoUL1Jo2ICTrPGcCzdwPdHENcAnicKRqcAk7cpL5J1r0JlAtPYV1XDETM/FtH3m19r+f5by+XjNX/xnmCX3/cCzydi4CKiC7lw+PArhGgoPPFq/6E0+9vwM6d5VBNpuv03cLNfeNTRh9KnJIiV2/PvSngycC5RD+dE5zb3g7s6QESzAZc2l6wuY9SnWIAxv10r81uU85Vt1FvtpEtlc/SMFUkUofeZ2IBta0DWDmXgkfbyTRz1qAYAMczOz3p1elOxYPyEllj421hdELViPO6Kudk3ia3UGe5ABDbvtnJZ52SdYmCZ3stdeexBabFdeAbYopEowtagVUZqFapBrtAGqpiVaFrGgyjZlrmTD5yEqoEJj4iFMuA62i6L3WPZkAiuHgarZ/vbWSBkTzO2rfTR4XOJVJhjfX44MBn+OTocVWbcF5MalxXPeVL6zYonoGo44YOtDI7qHC1lkL5nHnOc+tJRi3K6iygLNGMjt1A1XVV6iUzOvVtAvMlS2I/yBYlRf8MgA6szmXQ1jDfKhSgjft6DRtrkgarAiAw5nI9v2WDSn+Zxfd9DawGxIlPPQUg0A2HGABfEIYlCDU4+q0d8O+jRzHCCFYy+nu4BaeYAoksBCDrPYsXQQ6iitgiSQaS1FHHtMzFil4DpxTl4UhORSn4WOaaiGsbu4iFRkMnYQlEV0oSJQGQ4FyYgSRDjpqPZcCR6EOOWonIEsBqArAIQOMLzw0VXRRERF2VoA6Atk1+MzsASekMJYgaFEeHR4Cr85lNGntYzgKCYd/NSNIDCXr0ZJ2jwTsjSvEMzFQCCVmKHBRahn2DNb4rDRx8pnbXOOIg0JELLMHOF1AUkaRj1V8c2TookkMS83WK9QCVpRwtf5wCykQWRKDyJ44Ytc452QUV6inmN9IDIv/6y2+YLDuqTywBEHxv8rsoxQC4Fpf4cZ2pbJ4/huxXr0EvFmoRCrAIVymLQ3Eid0GJYPsPfISBLwdwi79YQnCqBNS7LQDP5qYSAKEDypOrX4WVWYLsFy+i9cwh6CUmUKIJI2Gq5cSbnLLw849D2Ld3L4olC1u3P0c1ow5Ozgixa3puWChONG1D3eLZUQOglvng+Vp5dBfseesx5/yHyI4cBTL3wsssRGs2g6/ppHijiMLoNSSMNHofy6Nn6SPsAR02nUoTtrDTSrdoi8CTni55rlOsCf1ypaDxlFMNU1epCV5XL6Y6dmOq+BeS48NIlq7Anpjg5dOFbPdDWLQyj/aubnUKSkMKi3NhkUd4kieYtbRbYS0bFAOQKI8NO363z1RJHmamtnlwhGksxV2w/gl29WRtm8kWtWUnRShLnQvXgDOXmLg2HzlvbDiyHD8Y517YP2i4FtueFPbB9FFqKcyobk4A5y7zquUFa7IXojyHoeXmAFcY755vaI6A56Xsofm/7+cmblBTpOldQ5vs3PJDVS+RVSAaus2SpJTO80t4NTNSOQfCDrtFkBevA0ME6HGvPdDpFlekzm7rf3nFQNRQEwBZTL9warObWfx21Uv1+fx1ERqVNampGoOHpF1tsdp07RnoGMxK1vT97rbK4IP6+Tc+fWXVsahaYGL6VO09d//GXHXr7jVeqmuppqU6ff4x0RO6lqRxgxHJpWKSlcw5eWfjq5rq/CdhaL5l6JWxjDc6bP7w5sn+/uMs2B36H2bgb6v9raK0+o9IAAAAAElFTkSuQmCC';
|
||||
const TERMINAL_DEFAULT_ICON_DATA_URL = 'data:image/png;base64,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';
|
||||
|
||||
type OpenInAppOption = {
|
||||
id: string;
|
||||
label: string;
|
||||
appName: string;
|
||||
id: OpenInApp['id'];
|
||||
label: OpenInApp['label'];
|
||||
appName: OpenInApp['appName'];
|
||||
fallbackIconDataUrl?: string;
|
||||
iconDataUrl?: string;
|
||||
};
|
||||
|
||||
const OPEN_IN_APPS: OpenInAppOption[] = [
|
||||
{ id: 'finder', label: 'Finder', appName: 'Finder', fallbackIconDataUrl: FINDER_DEFAULT_ICON_DATA_URL },
|
||||
{ id: 'terminal', label: 'Terminal', appName: 'Terminal', fallbackIconDataUrl: TERMINAL_DEFAULT_ICON_DATA_URL },
|
||||
{ id: 'iterm2', label: 'iTerm2', appName: 'iTerm' },
|
||||
{ id: 'ghostty', label: 'Ghostty', appName: 'Ghostty' },
|
||||
{ id: 'vscode', label: 'VS Code', appName: 'Visual Studio Code' },
|
||||
{ id: 'intellij', label: 'IntelliJ', appName: 'IntelliJ IDEA' },
|
||||
{ id: 'visual-studio', label: 'Visual Studio', appName: 'Visual Studio' },
|
||||
{ id: 'cursor', label: 'Cursor', appName: 'Cursor' },
|
||||
{ id: 'android-studio', label: 'Android Studio', appName: 'Android Studio' },
|
||||
{ id: 'pycharm', label: 'PyCharm', appName: 'PyCharm' },
|
||||
{ id: 'xcode', label: 'Xcode', appName: 'Xcode' },
|
||||
{ id: 'sublime-text', label: 'Sublime', appName: 'Sublime Text' },
|
||||
{ id: 'webstorm', label: 'WebStorm', appName: 'WebStorm' },
|
||||
{ id: 'rider', label: 'Rider', appName: 'Rider' },
|
||||
{ id: 'zed', label: 'Zed', appName: 'Zed' },
|
||||
{ id: 'phpstorm', label: 'PhpStorm', appName: 'PhpStorm' },
|
||||
{ id: 'eclipse', label: 'Eclipse', appName: 'Eclipse' },
|
||||
{ id: 'windsurf', label: 'Windsurf', appName: 'Windsurf' },
|
||||
{ id: 'vscodium', label: 'VSCodium', appName: 'VSCodium' },
|
||||
{ id: 'rustrover', label: 'RustRover', appName: 'RustRover' },
|
||||
{ id: 'trae', label: 'Trae', appName: 'Trae' },
|
||||
];
|
||||
const OPEN_IN_APP_OPTIONS: OpenInAppOption[] = OPEN_IN_APPS.map((app) => ({
|
||||
...app,
|
||||
fallbackIconDataUrl: app.id === 'finder'
|
||||
? FINDER_DEFAULT_ICON_DATA_URL
|
||||
: app.id === 'terminal'
|
||||
? TERMINAL_DEFAULT_ICON_DATA_URL
|
||||
: undefined,
|
||||
}));
|
||||
|
||||
const DEFAULT_APP_ID = 'finder';
|
||||
const ALWAYS_AVAILABLE_APP_IDS = new Set(['finder', 'terminal']);
|
||||
const getAlwaysAvailableApps = () => OPEN_IN_APPS.filter((app) => ALWAYS_AVAILABLE_APP_IDS.has(app.id));
|
||||
const getAlwaysAvailableApps = () => OPEN_IN_APP_OPTIONS.filter((app) => ALWAYS_AVAILABLE_APP_IDS.has(app.id));
|
||||
|
||||
const getStoredAppId = (): string => {
|
||||
if (typeof window === 'undefined') {
|
||||
return DEFAULT_APP_ID;
|
||||
return DEFAULT_OPEN_IN_APP_ID;
|
||||
}
|
||||
const stored = window.localStorage.getItem('openInAppId');
|
||||
if (stored && OPEN_IN_APPS.some((app) => app.id === stored)) {
|
||||
if (stored && getOpenInAppById(stored)) {
|
||||
return stored;
|
||||
}
|
||||
return DEFAULT_APP_ID;
|
||||
return DEFAULT_OPEN_IN_APP_ID;
|
||||
};
|
||||
|
||||
const AppIcon = ({
|
||||
@@ -102,10 +87,11 @@ const AppIcon = ({
|
||||
|
||||
type OpenInAppButtonProps = {
|
||||
directory: string;
|
||||
activeFilePath?: string | null;
|
||||
className?: string;
|
||||
};
|
||||
|
||||
export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps) => {
|
||||
export const OpenInAppButton = ({ directory, activeFilePath, className }: OpenInAppButtonProps) => {
|
||||
const [selectedAppId, setSelectedAppId] = React.useState(getStoredAppId);
|
||||
const [availableApps, setAvailableApps] = React.useState<OpenInAppOption[]>(getAlwaysAvailableApps);
|
||||
const [hasLoadedApps, setHasLoadedApps] = React.useState(false);
|
||||
@@ -125,7 +111,7 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
const nextId = detail
|
||||
&& typeof detail.openInAppId === 'string'
|
||||
&& detail.openInAppId.length > 0
|
||||
&& OPEN_IN_APPS.some((app) => app.id === detail.openInAppId)
|
||||
&& getOpenInAppById(detail.openInAppId)
|
||||
? detail.openInAppId
|
||||
: null;
|
||||
if (!nextId) {
|
||||
@@ -163,7 +149,7 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
|
||||
const allowed = new Set(installed.map((app) => app.name));
|
||||
const iconMap = new Map(installed.map((app) => [app.name, app.iconDataUrl ?? undefined]));
|
||||
const filtered = OPEN_IN_APPS.filter(
|
||||
const filtered = OPEN_IN_APP_OPTIONS.filter(
|
||||
(app) => allowed.has(app.appName) || ALWAYS_AVAILABLE_APP_IDS.has(app.id)
|
||||
);
|
||||
const withIcons = filtered.map((app) => ({
|
||||
@@ -177,7 +163,7 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
const loadInstalledApps = React.useCallback(async (force?: boolean) => {
|
||||
if (isLoadingRef.current) return;
|
||||
if (hasLoadedApps && !force) return;
|
||||
const appNames = OPEN_IN_APPS.map((app) => app.appName);
|
||||
const appNames = OPEN_IN_APP_OPTIONS.map((app) => app.appName);
|
||||
if (retryTimeoutRef.current) {
|
||||
clearTimeout(retryTimeoutRef.current);
|
||||
retryTimeoutRef.current = null;
|
||||
@@ -271,9 +257,9 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
}, [isDesktopLocal, loadInstalledApps]);
|
||||
|
||||
const selectedApp = React.useMemo(() => {
|
||||
const known = OPEN_IN_APPS.find((app) => app.id === selectedAppId)
|
||||
?? OPEN_IN_APPS.find((app) => app.id === DEFAULT_APP_ID)
|
||||
?? OPEN_IN_APPS[0];
|
||||
const known = OPEN_IN_APP_OPTIONS.find((app) => app.id === selectedAppId)
|
||||
?? OPEN_IN_APP_OPTIONS.find((app) => app.id === DEFAULT_OPEN_IN_APP_ID)
|
||||
?? OPEN_IN_APP_OPTIONS[0];
|
||||
if (known) {
|
||||
const iconDataUrl = availableApps.find((app) => app.appName === known.appName)?.iconDataUrl;
|
||||
return iconDataUrl ? { ...known, iconDataUrl } : known;
|
||||
@@ -290,7 +276,10 @@ export const OpenInAppButton = ({ directory, className }: OpenInAppButtonProps)
|
||||
}
|
||||
|
||||
const handleOpen = async (app: OpenInAppOption) => {
|
||||
await openDesktopPath(directory, app.appName);
|
||||
const opened = await openDesktopProjectInApp(directory, app.id, app.appName, activeFilePath);
|
||||
if (!opened) {
|
||||
await openDesktopPath(directory, app.appName);
|
||||
}
|
||||
};
|
||||
|
||||
const handleSelect = async (app: OpenInAppOption) => {
|
||||
|
||||
Reference in New Issue
Block a user