Show rendered md by default (#3594)

* Show rendered md by default

* Lint fix

* chore(file-viewer): remove dead PREVIEW_ONLY_EXTENSIONS export

Co-authored-by: Theodore Li <TheodoreSpeaks@users.noreply.github.com>

* Fix new file logic to default to text

---------

Co-authored-by: Theodore Li <theo@sim.ai>
Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: Theodore Li <TheodoreSpeaks@users.noreply.github.com>
This commit is contained in:
Theodore Li
2026-03-14 22:17:40 -04:00
committed by GitHub
co-authored by Theodore Li Theodore Li Cursor Agent
parent b7b575c4d2
commit 743742d058
6 changed files with 14 additions and 20 deletions
@@ -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}
@@ -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'
@@ -23,9 +23,6 @@ const PREVIEWABLE_EXTENSIONS: Record<string, PreviewType> = {
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))
@@ -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,
},
]
@@ -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<PreviewMode, (props: ComponentProps<typeof Eye>) => ReactNode>
/**
@@ -4,10 +4,7 @@ import { memo, 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 const MothershipView = memo(function MothershipView({
}: MothershipViewProps) {
const active = resources.find((r) => r.id === activeResourceId) ?? resources[0] ?? null
const [previewMode, setPreviewMode] = useState<PreviewMode>('split')
const [previewMode, setPreviewMode] = useState<PreviewMode>('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 =