diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/file-viewer.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/file-viewer.tsx index 2d974ea5c2e..5fe644d129c 100644 --- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/file-viewer.tsx +++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/file-viewer.tsx @@ -98,7 +98,7 @@ export function FileViewer({ file={file} workspaceId={workspaceId} canEdit={canEdit} - previewMode={previewMode ?? (showPreview ? 'split' : 'editor')} + previewMode={previewMode ?? (showPreview ? 'preview' : 'editor')} autoFocus={autoFocus} onDirtyChange={onDirtyChange} onSaveStatusChange={onSaveStatusChange} diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/index.ts b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/index.ts index 064fee5711f..f86f7e36358 100644 --- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/index.ts +++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/index.ts @@ -1,3 +1,3 @@ export type { PreviewMode } from './file-viewer' export { FileViewer, isPreviewable, isTextEditable } from './file-viewer' -export { PREVIEW_ONLY_EXTENSIONS, RICH_PREVIEWABLE_EXTENSIONS } from './preview-panel' +export { RICH_PREVIEWABLE_EXTENSIONS } from './preview-panel' diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx index 8091ad17c9e..771a342462b 100644 --- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx +++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/preview-panel.tsx @@ -23,9 +23,6 @@ const PREVIEWABLE_EXTENSIONS: Record = { svg: 'svg', } -/** Extensions that should default to rendered preview (no raw editor). */ -export const PREVIEW_ONLY_EXTENSIONS = new Set(['html', 'htm', 'svg']) - /** All extensions that have a rich preview renderer. */ export const RICH_PREVIEWABLE_EXTENSIONS = new Set(Object.keys(PREVIEWABLE_EXTENSIONS)) diff --git a/apps/sim/app/workspace/[workspaceId]/files/files.tsx b/apps/sim/app/workspace/[workspaceId]/files/files.tsx index 0af8421fe44..806d1586e71 100644 --- a/apps/sim/app/workspace/[workspaceId]/files/files.tsx +++ b/apps/sim/app/workspace/[workspaceId]/files/files.tsx @@ -476,10 +476,11 @@ export function Files() { }, [closeListContextMenu]) useEffect(() => { - if (justCreatedFileIdRef.current && selectedFileId !== justCreatedFileIdRef.current) { + const isJustCreated = selectedFileId != null && justCreatedFileIdRef.current === selectedFileId + if (justCreatedFileIdRef.current && !isJustCreated) { justCreatedFileIdRef.current = null } - setShowPreview(true) + setShowPreview(!isJustCreated) }, [selectedFileId]) useEffect(() => { @@ -521,8 +522,8 @@ export function Files() { ...(canPreview ? [ { - label: showPreview ? 'Hide Preview' : 'Preview', - icon: Eye, + label: showPreview ? 'Edit' : 'Preview', + icon: showPreview ? Pencil : Eye, onClick: handleTogglePreview, }, ] diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-tabs/resource-tabs.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-tabs/resource-tabs.tsx index 002e0a84d71..fc283c44f1a 100644 --- a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-tabs/resource-tabs.tsx +++ b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/components/resource-tabs/resource-tabs.tsx @@ -8,7 +8,7 @@ import { useState, } from 'react' import { Button, Tooltip } from '@/components/emcn' -import { Columns3, Eye, PanelLeft, Rows3 } from '@/components/emcn/icons' +import { Columns3, Eye, PanelLeft, Pencil } from '@/components/emcn/icons' import { cn } from '@/lib/core/utils/cn' import type { PreviewMode } from '@/app/workspace/[workspaceId]/files/components/file-viewer' import { AddResourceDropdown } from '@/app/workspace/[workspaceId]/home/components/mothership-view/components/add-resource-dropdown' @@ -36,9 +36,9 @@ const EDGE_ZONE = 40 const SCROLL_SPEED = 8 const PREVIEW_MODE_ICONS = { - editor: Rows3, - split: Columns3, - preview: Eye, + editor: Columns3, + split: Eye, + preview: Pencil, } satisfies Record) => ReactNode> /** diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx index 2df4c446026..397e2ac1fce 100644 --- a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx +++ b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-view/mothership-view.tsx @@ -4,10 +4,7 @@ import { useCallback, useEffect, useState } from 'react' import { cn } from '@/lib/core/utils/cn' import { getFileExtension } from '@/lib/uploads/utils/file-utils' import type { PreviewMode } from '@/app/workspace/[workspaceId]/files/components/file-viewer' -import { - PREVIEW_ONLY_EXTENSIONS, - RICH_PREVIEWABLE_EXTENSIONS, -} from '@/app/workspace/[workspaceId]/files/components/file-viewer' +import { RICH_PREVIEWABLE_EXTENSIONS } from '@/app/workspace/[workspaceId]/files/components/file-viewer' import type { MothershipResource, MothershipResourceType, @@ -49,12 +46,11 @@ export function MothershipView({ }: MothershipViewProps) { const active = resources.find((r) => r.id === activeResourceId) ?? resources[0] ?? null - const [previewMode, setPreviewMode] = useState('split') + const [previewMode, setPreviewMode] = useState('preview') const handleCyclePreview = useCallback(() => setPreviewMode((m) => PREVIEW_CYCLE[m]), []) useEffect(() => { - const ext = active?.type === 'file' ? getFileExtension(active.title) : '' - setPreviewMode(PREVIEW_ONLY_EXTENSIONS.has(ext) ? 'preview' : 'split') + setPreviewMode('preview') }, [active?.id]) const isActivePreviewable =