From 6fc7ab42635293ded749e1af3b28713ec00adce8 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 19:15:55 -0700
Subject: [PATCH 01/11] feat(files): expand file editor to support more
 formats, add docx/xlsx preview

---
 .../components/file-viewer/file-viewer.tsx    | 363 ++++++++++++++++--
 1 file changed, 338 insertions(+), 25 deletions(-)

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 fe8660aa464..5ff0991487f 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
@@ -29,11 +29,22 @@ const TEXT_EDITABLE_MIME_TYPES = new Set([
   'application/x-yaml',
   'text/csv',
   'text/html',
+  'text/xml',
+  'application/xml',
+  'text/css',
+  'text/javascript',
+  'application/javascript',
+  'application/typescript',
+  'application/toml',
+  'text/x-python',
+  'text/x-sh',
+  'text/x-sql',
   'image/svg+xml',
 ])
 
 const TEXT_EDITABLE_EXTENSIONS = new Set([
   'md',
+  'mdx',
   'txt',
   'json',
   'yaml',
@@ -42,6 +53,48 @@ const TEXT_EDITABLE_EXTENSIONS = new Set([
   'html',
   'htm',
   'svg',
+  'xml',
+  'css',
+  'scss',
+  'less',
+  'js',
+  'jsx',
+  'ts',
+  'tsx',
+  'py',
+  'rb',
+  'go',
+  'rs',
+  'java',
+  'kt',
+  'swift',
+  'c',
+  'cpp',
+  'h',
+  'hpp',
+  'cs',
+  'php',
+  'sh',
+  'bash',
+  'zsh',
+  'fish',
+  'sql',
+  'graphql',
+  'gql',
+  'toml',
+  'ini',
+  'conf',
+  'cfg',
+  'env',
+  'log',
+  'diff',
+  'patch',
+  'dockerfile',
+  'makefile',
+  'gitignore',
+  'editorconfig',
+  'prettierrc',
+  'eslintrc',
 ])
 
 const IFRAME_PREVIEWABLE_MIME_TYPES = new Set(['application/pdf'])
@@ -55,11 +108,23 @@ const PPTX_PREVIEWABLE_MIME_TYPES = new Set([
 ])
 const PPTX_PREVIEWABLE_EXTENSIONS = new Set(['pptx'])
 
+const DOCX_PREVIEWABLE_MIME_TYPES = new Set([
+  'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+])
+const DOCX_PREVIEWABLE_EXTENSIONS = new Set(['docx'])
+
+const XLSX_PREVIEWABLE_MIME_TYPES = new Set([
+  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+])
+const XLSX_PREVIEWABLE_EXTENSIONS = new Set(['xlsx'])
+
 type FileCategory =
   | 'text-editable'
   | 'iframe-previewable'
   | 'image-previewable'
   | 'pptx-previewable'
+  | 'docx-previewable'
+  | 'xlsx-previewable'
   | 'unsupported'
 
 function resolveFileCategory(mimeType: string | null, filename: string): FileCategory {
@@ -67,12 +132,16 @@ function resolveFileCategory(mimeType: string | null, filename: string): FileCat
   if (mimeType && IFRAME_PREVIEWABLE_MIME_TYPES.has(mimeType)) return 'iframe-previewable'
   if (mimeType && IMAGE_PREVIEWABLE_MIME_TYPES.has(mimeType)) return 'image-previewable'
   if (mimeType && PPTX_PREVIEWABLE_MIME_TYPES.has(mimeType)) return 'pptx-previewable'
+  if (mimeType && DOCX_PREVIEWABLE_MIME_TYPES.has(mimeType)) return 'docx-previewable'
+  if (mimeType && XLSX_PREVIEWABLE_MIME_TYPES.has(mimeType)) return 'xlsx-previewable'
 
   const ext = getFileExtension(filename)
   if (TEXT_EDITABLE_EXTENSIONS.has(ext)) return 'text-editable'
   if (IFRAME_PREVIEWABLE_EXTENSIONS.has(ext)) return 'iframe-previewable'
   if (IMAGE_PREVIEWABLE_EXTENSIONS.has(ext)) return 'image-previewable'
   if (PPTX_PREVIEWABLE_EXTENSIONS.has(ext)) return 'pptx-previewable'
+  if (DOCX_PREVIEWABLE_EXTENSIONS.has(ext)) return 'docx-previewable'
+  if (XLSX_PREVIEWABLE_EXTENSIONS.has(ext)) return 'xlsx-previewable'
 
   return 'unsupported'
 }
@@ -142,6 +211,14 @@ export function FileViewer({
     return <PptxPreview file={file} workspaceId={workspaceId} streamingContent={streamingContent} />
   }
 
+  if (category === 'docx-previewable') {
+    return <DocxPreview file={file} workspaceId={workspaceId} />
+  }
+
+  if (category === 'xlsx-previewable') {
+    return <XlsxPreview file={file} workspaceId={workspaceId} />
+  }
+
   return <UnsupportedPreview file={file} />
 }
 
@@ -339,16 +416,7 @@ function TextEditor({
   }, [isStreaming, revealedContent])
 
   if (streamingContent === undefined) {
-    if (isLoading) {
-      return (
-        <div className='flex flex-1 flex-col gap-[8px] p-[24px]'>
-          <Skeleton className='h-[16px] w-[60%]' />
-          <Skeleton className='h-[16px] w-[80%]' />
-          <Skeleton className='h-[16px] w-[40%]' />
-          <Skeleton className='h-[16px] w-[70%]' />
-        </div>
-      )
-    }
+    if (isLoading) return DOCUMENT_SKELETON
 
     if (error) {
       return (
@@ -551,6 +619,32 @@ const ImagePreview = memo(function ImagePreview({ file }: { file: WorkspaceFileR
   )
 })
 
+function resolvePreviewError(
+  fetchError: Error | null,
+  renderError: string | null
+): string | null {
+  if (fetchError) return fetchError instanceof Error ? fetchError.message : 'Failed to load file'
+  return renderError
+}
+
+function PreviewError({ label, error }: { label: string; error: string }) {
+  return (
+    <div className='flex flex-1 flex-col items-center justify-center gap-[8px]'>
+      <p className='font-medium text-[14px] text-[var(--text-body)]'>Failed to preview {label}</p>
+      <p className='text-[13px] text-[var(--text-muted)]'>{error}</p>
+    </div>
+  )
+}
+
+const DOCUMENT_SKELETON = (
+  <div className='flex flex-1 flex-col gap-[8px] p-[24px]'>
+    <Skeleton className='h-[16px] w-[60%]' />
+    <Skeleton className='h-[16px] w-[80%]' />
+    <Skeleton className='h-[16px] w-[40%]' />
+    <Skeleton className='h-[16px] w-[70%]' />
+  </div>
+)
+
 const pptxSlideCache = new Map<string, string[]>()
 
 function pptxCacheKey(fileId: string, dataUpdatedAt: number, byteLength: number): string {
@@ -769,23 +863,10 @@ function PptxPreview({
     }
   }, [fileData, dataUpdatedAt, streamingContent, cacheKey, workspaceId])
 
-  const error = fetchError
-    ? fetchError instanceof Error
-      ? fetchError.message
-      : 'Failed to load file'
-    : renderError
+  const error = resolvePreviewError(fetchError, renderError)
   const loading = isFetching || rendering
 
-  if (error) {
-    return (
-      <div className='flex flex-1 flex-col items-center justify-center gap-[8px]'>
-        <p className='font-medium text-[14px] text-[var(--text-body)]'>
-          Failed to preview presentation
-        </p>
-        <p className='text-[13px] text-[var(--text-muted)]'>{error}</p>
-      </div>
-    )
-  }
+  if (error) return <PreviewError label='presentation' error={error} />
 
   if (loading && slides.length === 0) {
     return (
@@ -826,6 +907,238 @@ function toggleMarkdownCheckbox(markdown: string, targetIndex: number, checked:
   })
 }
 
+const DocxPreview = memo(function DocxPreview({
+  file,
+  workspaceId,
+}: {
+  file: WorkspaceFileRecord
+  workspaceId: string
+}) {
+  const {
+    data: fileData,
+    isLoading,
+    error: fetchError,
+  } = useWorkspaceFileBinary(workspaceId, file.id, file.key)
+
+  const [html, setHtml] = useState<string | null>(null)
+  const [renderError, setRenderError] = useState<string | null>(null)
+
+  useEffect(() => {
+    if (!fileData) return
+
+    let cancelled = false
+
+    async function convert() {
+      try {
+        setRenderError(null)
+        const mammoth = await import('mammoth')
+        const result = await mammoth.convertToHtml({ arrayBuffer: fileData })
+        if (!cancelled) setHtml(result.value)
+      } catch (err) {
+        if (!cancelled) {
+          const msg = err instanceof Error ? err.message : 'Failed to render document'
+          logger.error('DOCX render failed', { error: msg })
+          setRenderError(msg)
+        }
+      }
+    }
+
+    convert()
+    return () => {
+      cancelled = true
+    }
+  }, [fileData])
+
+  const error = resolvePreviewError(fetchError, renderError)
+  if (error) return <PreviewError label='document' error={error} />
+  if (isLoading || html === null) return DOCUMENT_SKELETON
+
+  return (
+    <div className='flex flex-1 overflow-hidden'>
+      <iframe
+        srcDoc={buildDocxPreviewHtml(html)}
+        sandbox='allow-same-origin'
+        title={file.name}
+        className='h-full w-full border-0'
+      />
+    </div>
+  )
+})
+
+/** Wraps mammoth HTML output with base styles. Uses raw hex colors because iframes cannot inherit CSS variables from the parent document. */
+function buildDocxPreviewHtml(html: string): string {
+  return `<!DOCTYPE html><html><head><style>
+body { margin: 0; padding: 24px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size: 14px; line-height: 1.6; color: #e4e4e7; background: transparent; }
+table { border-collapse: collapse; width: 100%; margin: 12px 0; }
+td, th { border: 1px solid #3f3f46; padding: 6px 10px; }
+img { max-width: 100%; height: auto; }
+p { margin: 0 0 8px; }
+h1, h2, h3, h4, h5, h6 { margin: 16px 0 8px; }
+</style></head><body>${html}</body></html>`
+}
+
+const XLSX_MAX_ROWS = 10_000
+
+interface XlsxSheet {
+  name: string
+  headers: string[]
+  rows: string[][]
+  truncated: boolean
+}
+
+const XlsxPreview = memo(function XlsxPreview({
+  file,
+  workspaceId,
+}: {
+  file: WorkspaceFileRecord
+  workspaceId: string
+}) {
+  const {
+    data: fileData,
+    isLoading,
+    error: fetchError,
+  } = useWorkspaceFileBinary(workspaceId, file.id, file.key)
+
+  const [sheetNames, setSheetNames] = useState<string[]>([])
+  const [activeSheet, setActiveSheet] = useState(0)
+  const [currentSheet, setCurrentSheet] = useState<XlsxSheet | null>(null)
+  const [renderError, setRenderError] = useState<string | null>(null)
+  const workbookRef = useRef<unknown>(null)
+
+  useEffect(() => {
+    if (!fileData) return
+
+    let cancelled = false
+
+    async function parse() {
+      try {
+        setRenderError(null)
+        const XLSX = await import('xlsx')
+        const workbook = XLSX.read(fileData, { type: 'array' })
+        if (!cancelled) {
+          workbookRef.current = workbook
+          setSheetNames(workbook.SheetNames)
+          setActiveSheet(0)
+        }
+      } catch (err) {
+        if (!cancelled) {
+          const msg = err instanceof Error ? err.message : 'Failed to parse spreadsheet'
+          logger.error('XLSX parse failed', { error: msg })
+          setRenderError(msg)
+        }
+      }
+    }
+
+    parse()
+    return () => {
+      cancelled = true
+    }
+  }, [fileData])
+
+  useEffect(() => {
+    if (sheetNames.length === 0 || !workbookRef.current) return
+
+    let cancelled = false
+
+    async function parseSheet() {
+      try {
+        const XLSX = await import('xlsx')
+        const workbook = workbookRef.current as ReturnType<typeof XLSX.read>
+        const name = sheetNames[activeSheet]
+        const sheet = workbook.Sheets[name]
+        const allRows = XLSX.utils.sheet_to_json<string[]>(sheet, { header: 1 })
+        const headers = allRows[0] ?? []
+        const dataRows = allRows.slice(1)
+        const truncated = dataRows.length > XLSX_MAX_ROWS
+        if (!cancelled) {
+          setCurrentSheet({
+            name,
+            headers,
+            rows: truncated ? dataRows.slice(0, XLSX_MAX_ROWS) : dataRows,
+            truncated,
+          })
+        }
+      } catch (err) {
+        if (!cancelled) {
+          const msg = err instanceof Error ? err.message : 'Failed to parse sheet'
+          logger.error('XLSX sheet parse failed', { error: msg })
+          setRenderError(msg)
+        }
+      }
+    }
+
+    parseSheet()
+    return () => {
+      cancelled = true
+    }
+  }, [sheetNames, activeSheet])
+
+  const error = resolvePreviewError(fetchError, renderError)
+  if (error) return <PreviewError label='spreadsheet' error={error} />
+  if (isLoading || currentSheet === null) return DOCUMENT_SKELETON
+
+  return (
+    <div className='flex flex-1 flex-col overflow-hidden'>
+      {sheetNames.length > 1 && (
+        <div className='flex shrink-0 gap-0 border-b border-[var(--border)] bg-[var(--surface-1)]'>
+          {sheetNames.map((name, i) => (
+            <button
+              key={name}
+              type='button'
+              onClick={() => setActiveSheet(i)}
+              className={cn(
+                'px-3 py-1.5 text-[12px] transition-colors',
+                i === activeSheet
+                  ? 'border-b-2 border-[var(--brand-secondary)] font-medium text-[var(--text-primary)]'
+                  : 'text-[var(--text-muted)] hover:text-[var(--text-secondary)]'
+              )}
+            >
+              {name}
+            </button>
+          ))}
+        </div>
+      )}
+      <div className='flex-1 overflow-auto p-6'>
+        <div className='overflow-x-auto rounded-md border border-[var(--border)]'>
+          <table className='w-full border-collapse text-[13px]'>
+            <thead className='bg-[var(--surface-2)]'>
+              <tr>
+                {currentSheet.headers.map((header, i) => (
+                  <th
+                    key={i}
+                    className='whitespace-nowrap px-3 py-2 text-left font-semibold text-[12px] text-[var(--text-primary)]'
+                  >
+                    {String(header ?? '')}
+                  </th>
+                ))}
+              </tr>
+            </thead>
+            <tbody>
+              {currentSheet.rows.map((row, ri) => (
+                <tr key={ri} className='border-[var(--border)] border-t'>
+                  {currentSheet.headers.map((_, ci) => (
+                    <td
+                      key={ci}
+                      className='whitespace-nowrap px-3 py-2 text-[var(--text-secondary)]'
+                    >
+                      {String(row[ci] ?? '')}
+                    </td>
+                  ))}
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+        {currentSheet.truncated && (
+          <p className='mt-3 text-center text-[12px] text-[var(--text-muted)]'>
+            Showing first {XLSX_MAX_ROWS.toLocaleString()} rows. Download the file to view all data.
+          </p>
+        )}
+      </div>
+    </div>
+  )
+})
+
 const UnsupportedPreview = memo(function UnsupportedPreview({
   file,
 }: {

From 646f8d1237640740b490200ecd5c0d07effae732 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 19:16:49 -0700
Subject: [PATCH 02/11] lint

---
 .../files/components/file-viewer/file-viewer.tsx         | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

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 5ff0991487f..c97d90e2745 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
@@ -619,10 +619,7 @@ const ImagePreview = memo(function ImagePreview({ file }: { file: WorkspaceFileR
   )
 })
 
-function resolvePreviewError(
-  fetchError: Error | null,
-  renderError: string | null
-): string | null {
+function resolvePreviewError(fetchError: Error | null, renderError: string | null): string | null {
   if (fetchError) return fetchError instanceof Error ? fetchError.message : 'Failed to load file'
   return renderError
 }
@@ -1080,7 +1077,7 @@ const XlsxPreview = memo(function XlsxPreview({
   return (
     <div className='flex flex-1 flex-col overflow-hidden'>
       {sheetNames.length > 1 && (
-        <div className='flex shrink-0 gap-0 border-b border-[var(--border)] bg-[var(--surface-1)]'>
+        <div className='flex shrink-0 gap-0 border-[var(--border)] border-b bg-[var(--surface-1)]'>
           {sheetNames.map((name, i) => (
             <button
               key={name}
@@ -1089,7 +1086,7 @@ const XlsxPreview = memo(function XlsxPreview({
               className={cn(
                 'px-3 py-1.5 text-[12px] transition-colors',
                 i === activeSheet
-                  ? 'border-b-2 border-[var(--brand-secondary)] font-medium text-[var(--text-primary)]'
+                  ? 'border-[var(--brand-secondary)] border-b-2 font-medium text-[var(--text-primary)]'
                   : 'text-[var(--text-muted)] hover:text-[var(--text-secondary)]'
               )}
             >

From edc103d485d4e6e23f6837891044b08dd7438de9 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 19:22:52 -0700
Subject: [PATCH 03/11] fix(files): narrow fileData type for closure in
 docx/xlsx preview effects

---
 .../files/components/file-viewer/file-viewer.tsx            | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

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 c97d90e2745..6339533dd06 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
@@ -922,6 +922,7 @@ const DocxPreview = memo(function DocxPreview({
 
   useEffect(() => {
     if (!fileData) return
+    const data = fileData
 
     let cancelled = false
 
@@ -929,7 +930,7 @@ const DocxPreview = memo(function DocxPreview({
       try {
         setRenderError(null)
         const mammoth = await import('mammoth')
-        const result = await mammoth.convertToHtml({ arrayBuffer: fileData })
+        const result = await mammoth.convertToHtml({ arrayBuffer: data })
         if (!cancelled) setHtml(result.value)
       } catch (err) {
         if (!cancelled) {
@@ -1004,6 +1005,7 @@ const XlsxPreview = memo(function XlsxPreview({
 
   useEffect(() => {
     if (!fileData) return
+    const data = fileData
 
     let cancelled = false
 
@@ -1011,7 +1013,7 @@ const XlsxPreview = memo(function XlsxPreview({
       try {
         setRenderError(null)
         const XLSX = await import('xlsx')
-        const workbook = XLSX.read(fileData, { type: 'array' })
+        const workbook = XLSX.read(data, { type: 'array' })
         if (!cancelled) {
           workbookRef.current = workbook
           setSheetNames(workbook.SheetNames)

From 13c491947ea33880294a2a0c46eec1eb382d78a2 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 19:26:17 -0700
Subject: [PATCH 04/11] =?UTF-8?q?fix(files):=20address=20PR=20review=20?=
 =?UTF-8?q?=E2=80=94=20fix=20xlsx=20type,=20simplify=20error=20helper,=20t?=
 =?UTF-8?q?ighten=20iframe=20sandbox?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../files/components/file-viewer/file-viewer.tsx            | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

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 6339533dd06..e3aa559c64d 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
@@ -620,7 +620,7 @@ const ImagePreview = memo(function ImagePreview({ file }: { file: WorkspaceFileR
 })
 
 function resolvePreviewError(fetchError: Error | null, renderError: string | null): string | null {
-  if (fetchError) return fetchError instanceof Error ? fetchError.message : 'Failed to load file'
+  if (fetchError) return fetchError.message
   return renderError
 }
 
@@ -955,7 +955,7 @@ const DocxPreview = memo(function DocxPreview({
     <div className='flex flex-1 overflow-hidden'>
       <iframe
         srcDoc={buildDocxPreviewHtml(html)}
-        sandbox='allow-same-origin'
+        sandbox=''
         title={file.name}
         className='h-full w-full border-0'
       />
@@ -1013,7 +1013,7 @@ const XlsxPreview = memo(function XlsxPreview({
       try {
         setRenderError(null)
         const XLSX = await import('xlsx')
-        const workbook = XLSX.read(data, { type: 'array' })
+        const workbook = XLSX.read(new Uint8Array(data), { type: 'array' })
         if (!cancelled) {
           workbookRef.current = workbook
           setSheetNames(workbook.SheetNames)

From 0cd5e467bb1f4d6efe927475c8d07636ecac9d68 Mon Sep 17 00:00:00 2001
From: Vikhyath Mondreti <vikhyath@simstudio.ai>
Date: Sat, 4 Apr 2026 20:23:38 -0700
Subject: [PATCH 05/11] add mothership read externsions

---
 apps/sim/app/api/files/upload/route.ts        |  2 +
 .../workspace/[workspaceId]/files/files.tsx   |  2 +
 apps/sim/lib/uploads/utils/validation.ts      | 48 +++++++++++++++++++
 3 files changed, 52 insertions(+)

diff --git a/apps/sim/app/api/files/upload/route.ts b/apps/sim/app/api/files/upload/route.ts
index 387a2ccee82..b6791a3841b 100644
--- a/apps/sim/app/api/files/upload/route.ts
+++ b/apps/sim/app/api/files/upload/route.ts
@@ -8,6 +8,7 @@ import { generateWorkspaceFileKey } from '@/lib/uploads/contexts/workspace/works
 import { isImageFileType } from '@/lib/uploads/utils/file-utils'
 import {
   SUPPORTED_AUDIO_EXTENSIONS,
+  SUPPORTED_CODE_EXTENSIONS,
   SUPPORTED_DOCUMENT_EXTENSIONS,
   SUPPORTED_VIDEO_EXTENSIONS,
   validateFileType,
@@ -23,6 +24,7 @@ const IMAGE_EXTENSIONS = ['png', 'jpg', 'jpeg', 'gif', 'webp', 'svg'] as const
 
 const ALLOWED_EXTENSIONS = new Set<string>([
   ...SUPPORTED_DOCUMENT_EXTENSIONS,
+  ...SUPPORTED_CODE_EXTENSIONS,
   ...IMAGE_EXTENSIONS,
   ...SUPPORTED_AUDIO_EXTENSIONS,
   ...SUPPORTED_VIDEO_EXTENSIONS,
diff --git a/apps/sim/app/workspace/[workspaceId]/files/files.tsx b/apps/sim/app/workspace/[workspaceId]/files/files.tsx
index a4c82e1672e..a16f13eaf7e 100644
--- a/apps/sim/app/workspace/[workspaceId]/files/files.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/files/files.tsx
@@ -39,6 +39,7 @@ import {
 import {
   isSupportedExtension,
   SUPPORTED_AUDIO_EXTENSIONS,
+  SUPPORTED_CODE_EXTENSIONS,
   SUPPORTED_DOCUMENT_EXTENSIONS,
   SUPPORTED_VIDEO_EXTENSIONS,
 } from '@/lib/uploads/utils/validation'
@@ -83,6 +84,7 @@ const logger = createLogger('Files')
 
 const SUPPORTED_EXTENSIONS = [
   ...SUPPORTED_DOCUMENT_EXTENSIONS,
+  ...SUPPORTED_CODE_EXTENSIONS,
   ...SUPPORTED_AUDIO_EXTENSIONS,
   ...SUPPORTED_VIDEO_EXTENSIONS,
 ] as const
diff --git a/apps/sim/lib/uploads/utils/validation.ts b/apps/sim/lib/uploads/utils/validation.ts
index 05e4aee82ca..5462cfd557b 100644
--- a/apps/sim/lib/uploads/utils/validation.ts
+++ b/apps/sim/lib/uploads/utils/validation.ts
@@ -29,6 +29,54 @@ export const SUPPORTED_DOCUMENT_EXTENSIONS = [
   'yml',
 ] as const
 
+export const SUPPORTED_CODE_EXTENSIONS = [
+  'mdx',
+  'xml',
+  'css',
+  'scss',
+  'less',
+  'js',
+  'jsx',
+  'ts',
+  'tsx',
+  'py',
+  'rb',
+  'go',
+  'rs',
+  'java',
+  'kt',
+  'swift',
+  'c',
+  'cpp',
+  'h',
+  'hpp',
+  'cs',
+  'php',
+  'sh',
+  'bash',
+  'zsh',
+  'fish',
+  'sql',
+  'graphql',
+  'gql',
+  'toml',
+  'ini',
+  'conf',
+  'cfg',
+  'env',
+  'log',
+  'diff',
+  'patch',
+  'dockerfile',
+  'makefile',
+  'gitignore',
+  'editorconfig',
+  'prettierrc',
+  'eslintrc',
+] as const
+
+export type SupportedCodeExtension = (typeof SUPPORTED_CODE_EXTENSIONS)[number]
+
 export const SUPPORTED_AUDIO_EXTENSIONS = [
   'mp3',
   'm4a',

From 71b20bf2694529cdd8fe114d29bf4b692c5de2a2 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 20:30:35 -0700
Subject: [PATCH 06/11] =?UTF-8?q?fix(files):=20update=20upload=20test=20?=
 =?UTF-8?q?=E2=80=94=20js=20is=20now=20a=20supported=20extension?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/sim/app/api/files/upload/route.test.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/sim/app/api/files/upload/route.test.ts b/apps/sim/app/api/files/upload/route.test.ts
index 75c387b6a52..5b6a4455d0e 100644
--- a/apps/sim/app/api/files/upload/route.test.ts
+++ b/apps/sim/app/api/files/upload/route.test.ts
@@ -458,10 +458,10 @@ describe('File Upload Security Tests', () => {
       expect(response.status).toBe(200)
     })
 
-    it('should reject JavaScript files', async () => {
+    it('should reject unsupported file types', async () => {
       const formData = new FormData()
-      const maliciousJs = 'alert("XSS")'
-      const file = new File([maliciousJs], 'malicious.js', { type: 'application/javascript' })
+      const content = 'binary data'
+      const file = new File([content], 'archive.exe', { type: 'application/octet-stream' })
       formData.append('file', file)
       formData.append('context', 'workspace')
       formData.append('workspaceId', 'test-workspace-id')
@@ -475,7 +475,7 @@ describe('File Upload Security Tests', () => {
 
       expect(response.status).toBe(400)
       const data = await response.json()
-      expect(data.message).toContain("File type 'js' is not allowed")
+      expect(data.message).toContain("File type 'exe' is not allowed")
     })
 
     it('should reject files without extensions', async () => {

From 846214f85e7c803e791ba0ce7628ff3985ed5f2b Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 20:44:53 -0700
Subject: [PATCH 07/11] fix(files): deduplicate code extensions, handle dotless
 filenames

---
 .../components/file-viewer/file-viewer.tsx    | 48 ++-----------------
 1 file changed, 4 insertions(+), 44 deletions(-)

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 e3aa559c64d..2f92e334de4 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
@@ -7,6 +7,7 @@ import { Skeleton } from '@/components/emcn'
 import { cn } from '@/lib/core/utils/cn'
 import type { WorkspaceFileRecord } from '@/lib/uploads/contexts/workspace'
 import { getFileExtension } from '@/lib/uploads/utils/file-utils'
+import { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation'
 import {
   useUpdateWorkspaceFileContent,
   useWorkspaceFileBinary,
@@ -44,7 +45,6 @@ const TEXT_EDITABLE_MIME_TYPES = new Set([
 
 const TEXT_EDITABLE_EXTENSIONS = new Set([
   'md',
-  'mdx',
   'txt',
   'json',
   'yaml',
@@ -53,48 +53,7 @@ const TEXT_EDITABLE_EXTENSIONS = new Set([
   'html',
   'htm',
   'svg',
-  'xml',
-  'css',
-  'scss',
-  'less',
-  'js',
-  'jsx',
-  'ts',
-  'tsx',
-  'py',
-  'rb',
-  'go',
-  'rs',
-  'java',
-  'kt',
-  'swift',
-  'c',
-  'cpp',
-  'h',
-  'hpp',
-  'cs',
-  'php',
-  'sh',
-  'bash',
-  'zsh',
-  'fish',
-  'sql',
-  'graphql',
-  'gql',
-  'toml',
-  'ini',
-  'conf',
-  'cfg',
-  'env',
-  'log',
-  'diff',
-  'patch',
-  'dockerfile',
-  'makefile',
-  'gitignore',
-  'editorconfig',
-  'prettierrc',
-  'eslintrc',
+  ...SUPPORTED_CODE_EXTENSIONS,
 ])
 
 const IFRAME_PREVIEWABLE_MIME_TYPES = new Set(['application/pdf'])
@@ -136,7 +95,8 @@ function resolveFileCategory(mimeType: string | null, filename: string): FileCat
   if (mimeType && XLSX_PREVIEWABLE_MIME_TYPES.has(mimeType)) return 'xlsx-previewable'
 
   const ext = getFileExtension(filename)
-  if (TEXT_EDITABLE_EXTENSIONS.has(ext)) return 'text-editable'
+  const nameKey = ext || filename.toLowerCase()
+  if (TEXT_EDITABLE_EXTENSIONS.has(nameKey)) return 'text-editable'
   if (IFRAME_PREVIEWABLE_EXTENSIONS.has(ext)) return 'iframe-previewable'
   if (IMAGE_PREVIEWABLE_EXTENSIONS.has(ext)) return 'image-previewable'
   if (PPTX_PREVIEWABLE_EXTENSIONS.has(ext)) return 'pptx-previewable'

From a284499de3095712a7de1b691639961d3e775e62 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 20:58:34 -0700
Subject: [PATCH 08/11] fix(files): lower xlsx preview row cap to 1k and type
 workbookRef properly

Reduces XLSX_MAX_ROWS from 10,000 to 1,000 to prevent browser sluggishness
on large spreadsheets. Types workbookRef with the proper xlsx.WorkBook
interface instead of unknown, removing the unsafe cast.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../files/components/file-viewer/file-viewer.tsx            | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

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 2f92e334de4..0c5880c2fee 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
@@ -935,7 +935,7 @@ h1, h2, h3, h4, h5, h6 { margin: 16px 0 8px; }
 </style></head><body>${html}</body></html>`
 }
 
-const XLSX_MAX_ROWS = 10_000
+const XLSX_MAX_ROWS = 1_000
 
 interface XlsxSheet {
   name: string
@@ -961,7 +961,7 @@ const XlsxPreview = memo(function XlsxPreview({
   const [activeSheet, setActiveSheet] = useState(0)
   const [currentSheet, setCurrentSheet] = useState<XlsxSheet | null>(null)
   const [renderError, setRenderError] = useState<string | null>(null)
-  const workbookRef = useRef<unknown>(null)
+  const workbookRef = useRef<import('xlsx').WorkBook | null>(null)
 
   useEffect(() => {
     if (!fileData) return
@@ -1002,7 +1002,7 @@ const XlsxPreview = memo(function XlsxPreview({
     async function parseSheet() {
       try {
         const XLSX = await import('xlsx')
-        const workbook = workbookRef.current as ReturnType<typeof XLSX.read>
+        const workbook = workbookRef.current!
         const name = sheetNames[activeSheet]
         const sheet = workbook.Sheets[name]
         const allRows = XLSX.utils.sheet_to_json<string[]>(sheet, { header: 1 })

From a7b732be3563bf8640e7ec80eff11f7c9143d929 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 21:01:25 -0700
Subject: [PATCH 09/11] refactor(files): extract shared DataTable, isolate
 client-safe constants

- Move SUPPORTED_CODE_EXTENSIONS to validation-constants.ts so client
  components no longer transitively import Node's `path` module
- Extract shared DataTable component used by both CsvPreview and
  XlsxPreview, eliminating duplicated table markup

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../components/file-viewer/data-table.tsx     | 41 +++++++++++++++
 .../components/file-viewer/file-viewer.tsx    | 37 ++-----------
 .../components/file-viewer/preview-panel.tsx  | 29 +----------
 .../workspace/[workspaceId]/files/files.tsx   |  2 +-
 .../lib/uploads/utils/validation-constants.ts | 52 +++++++++++++++++++
 apps/sim/lib/uploads/utils/validation.ts      | 51 ++----------------
 6 files changed, 104 insertions(+), 108 deletions(-)
 create mode 100644 apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx
 create mode 100644 apps/sim/lib/uploads/utils/validation-constants.ts

diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx
new file mode 100644
index 00000000000..e14f94419d7
--- /dev/null
+++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx
@@ -0,0 +1,41 @@
+import { memo } from 'react'
+
+interface DataTableProps {
+  headers: string[]
+  rows: string[][]
+}
+
+export const DataTable = memo(function DataTable({ headers, rows }: DataTableProps) {
+  return (
+    <div className='overflow-x-auto rounded-md border border-[var(--border)]'>
+      <table className='w-full border-collapse text-[13px]'>
+        <thead className='bg-[var(--surface-2)]'>
+          <tr>
+            {headers.map((header, i) => (
+              <th
+                key={i}
+                className='whitespace-nowrap px-3 py-2 text-left font-semibold text-[12px] text-[var(--text-primary)]'
+              >
+                {String(header ?? '')}
+              </th>
+            ))}
+          </tr>
+        </thead>
+        <tbody>
+          {rows.map((row, ri) => (
+            <tr key={ri} className='border-[var(--border)] border-t'>
+              {headers.map((_, ci) => (
+                <td
+                  key={ci}
+                  className='whitespace-nowrap px-3 py-2 text-[var(--text-secondary)]'
+                >
+                  {String(row[ci] ?? '')}
+                </td>
+              ))}
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  )
+})
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 0c5880c2fee..ced62301630 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
@@ -7,7 +7,7 @@ import { Skeleton } from '@/components/emcn'
 import { cn } from '@/lib/core/utils/cn'
 import type { WorkspaceFileRecord } from '@/lib/uploads/contexts/workspace'
 import { getFileExtension } from '@/lib/uploads/utils/file-utils'
-import { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation'
+import { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation-constants'
 import {
   useUpdateWorkspaceFileContent,
   useWorkspaceFileBinary,
@@ -15,6 +15,7 @@ import {
 } from '@/hooks/queries/workspace-files'
 import { useAutosave } from '@/hooks/use-autosave'
 import { useStreamingText } from '@/hooks/use-streaming-text'
+import { DataTable } from './data-table'
 import { PreviewPanel, resolvePreviewType } from './preview-panel'
 
 const logger = createLogger('FileViewer')
@@ -1058,39 +1059,11 @@ const XlsxPreview = memo(function XlsxPreview({
         </div>
       )}
       <div className='flex-1 overflow-auto p-6'>
-        <div className='overflow-x-auto rounded-md border border-[var(--border)]'>
-          <table className='w-full border-collapse text-[13px]'>
-            <thead className='bg-[var(--surface-2)]'>
-              <tr>
-                {currentSheet.headers.map((header, i) => (
-                  <th
-                    key={i}
-                    className='whitespace-nowrap px-3 py-2 text-left font-semibold text-[12px] text-[var(--text-primary)]'
-                  >
-                    {String(header ?? '')}
-                  </th>
-                ))}
-              </tr>
-            </thead>
-            <tbody>
-              {currentSheet.rows.map((row, ri) => (
-                <tr key={ri} className='border-[var(--border)] border-t'>
-                  {currentSheet.headers.map((_, ci) => (
-                    <td
-                      key={ci}
-                      className='whitespace-nowrap px-3 py-2 text-[var(--text-secondary)]'
-                    >
-                      {String(row[ci] ?? '')}
-                    </td>
-                  ))}
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
+        <DataTable headers={currentSheet.headers} rows={currentSheet.rows} />
         {currentSheet.truncated && (
           <p className='mt-3 text-center text-[12px] text-[var(--text-muted)]'>
-            Showing first {XLSX_MAX_ROWS.toLocaleString()} rows. Download the file to view all data.
+            Showing first {XLSX_MAX_ROWS.toLocaleString()} rows. Download the file to view all
+            data.
           </p>
         )}
       </div>
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 953ceac9039..8bcbb3a3728 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
@@ -10,6 +10,7 @@ import remarkGfm from 'remark-gfm'
 import { Checkbox } from '@/components/emcn'
 import { cn } from '@/lib/core/utils/cn'
 import { getFileExtension } from '@/lib/uploads/utils/file-utils'
+import { DataTable } from './data-table'
 import { useAutoScroll } from '@/hooks/use-auto-scroll'
 import { useStreamingReveal } from '@/hooks/use-streaming-reveal'
 
@@ -486,33 +487,7 @@ const CsvPreview = memo(function CsvPreview({ content }: { content: string }) {
 
   return (
     <div className='h-full overflow-auto p-6'>
-      <div className='overflow-x-auto rounded-md border border-[var(--border)]'>
-        <table className='w-full border-collapse text-[13px]'>
-          <thead className='bg-[var(--surface-2)]'>
-            <tr>
-              {headers.map((header, i) => (
-                <th
-                  key={i}
-                  className='whitespace-nowrap px-3 py-2 text-left font-semibold text-[12px] text-[var(--text-primary)]'
-                >
-                  {header}
-                </th>
-              ))}
-            </tr>
-          </thead>
-          <tbody>
-            {rows.map((row, ri) => (
-              <tr key={ri} className='border-[var(--border)] border-t'>
-                {headers.map((_, ci) => (
-                  <td key={ci} className='whitespace-nowrap px-3 py-2 text-[var(--text-secondary)]'>
-                    {row[ci] ?? ''}
-                  </td>
-                ))}
-              </tr>
-            ))}
-          </tbody>
-        </table>
-      </div>
+      <DataTable headers={headers} rows={rows} />
     </div>
   )
 })
diff --git a/apps/sim/app/workspace/[workspaceId]/files/files.tsx b/apps/sim/app/workspace/[workspaceId]/files/files.tsx
index a16f13eaf7e..8bed291a461 100644
--- a/apps/sim/app/workspace/[workspaceId]/files/files.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/files/files.tsx
@@ -36,10 +36,10 @@ import {
   isAudioFileType,
   isVideoFileType,
 } from '@/lib/uploads/utils/file-utils'
+import { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation-constants'
 import {
   isSupportedExtension,
   SUPPORTED_AUDIO_EXTENSIONS,
-  SUPPORTED_CODE_EXTENSIONS,
   SUPPORTED_DOCUMENT_EXTENSIONS,
   SUPPORTED_VIDEO_EXTENSIONS,
 } from '@/lib/uploads/utils/validation'
diff --git a/apps/sim/lib/uploads/utils/validation-constants.ts b/apps/sim/lib/uploads/utils/validation-constants.ts
new file mode 100644
index 00000000000..1876d6a4f8f
--- /dev/null
+++ b/apps/sim/lib/uploads/utils/validation-constants.ts
@@ -0,0 +1,52 @@
+/**
+ * Extension constants that are safe to import from client components.
+ * Separated from validation.ts which imports Node's `path` module.
+ */
+
+export const SUPPORTED_CODE_EXTENSIONS = [
+  'mdx',
+  'xml',
+  'css',
+  'scss',
+  'less',
+  'js',
+  'jsx',
+  'ts',
+  'tsx',
+  'py',
+  'rb',
+  'go',
+  'rs',
+  'java',
+  'kt',
+  'swift',
+  'c',
+  'cpp',
+  'h',
+  'hpp',
+  'cs',
+  'php',
+  'sh',
+  'bash',
+  'zsh',
+  'fish',
+  'sql',
+  'graphql',
+  'gql',
+  'toml',
+  'ini',
+  'conf',
+  'cfg',
+  'env',
+  'log',
+  'diff',
+  'patch',
+  'dockerfile',
+  'makefile',
+  'gitignore',
+  'editorconfig',
+  'prettierrc',
+  'eslintrc',
+] as const
+
+export type SupportedCodeExtension = (typeof SUPPORTED_CODE_EXTENSIONS)[number]
diff --git a/apps/sim/lib/uploads/utils/validation.ts b/apps/sim/lib/uploads/utils/validation.ts
index 5462cfd557b..ecc42088c17 100644
--- a/apps/sim/lib/uploads/utils/validation.ts
+++ b/apps/sim/lib/uploads/utils/validation.ts
@@ -1,5 +1,8 @@
 import path from 'path'
 
+export { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation-constants'
+export type { SupportedCodeExtension } from '@/lib/uploads/utils/validation-constants'
+
 /**
  * Checks whether a string is a valid file extension (lowercase alphanumeric only).
  * Rejects extensions containing spaces, punctuation, or other non-alphanumeric characters
@@ -29,54 +32,6 @@ export const SUPPORTED_DOCUMENT_EXTENSIONS = [
   'yml',
 ] as const
 
-export const SUPPORTED_CODE_EXTENSIONS = [
-  'mdx',
-  'xml',
-  'css',
-  'scss',
-  'less',
-  'js',
-  'jsx',
-  'ts',
-  'tsx',
-  'py',
-  'rb',
-  'go',
-  'rs',
-  'java',
-  'kt',
-  'swift',
-  'c',
-  'cpp',
-  'h',
-  'hpp',
-  'cs',
-  'php',
-  'sh',
-  'bash',
-  'zsh',
-  'fish',
-  'sql',
-  'graphql',
-  'gql',
-  'toml',
-  'ini',
-  'conf',
-  'cfg',
-  'env',
-  'log',
-  'diff',
-  'patch',
-  'dockerfile',
-  'makefile',
-  'gitignore',
-  'editorconfig',
-  'prettierrc',
-  'eslintrc',
-] as const
-
-export type SupportedCodeExtension = (typeof SUPPORTED_CODE_EXTENSIONS)[number]
-
 export const SUPPORTED_AUDIO_EXTENSIONS = [
   'mp3',
   'm4a',

From e31cf4db25383e1bb4d625aa1adc1f46e2ce2799 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 21:03:49 -0700
Subject: [PATCH 10/11] refactor(validation): remove Node path import, use
 plain string extraction
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace `import path from 'path'` with a simple `extractExtension` helper
that does `fileName.slice(fileName.lastIndexOf('.') + 1)`. This removes
the only Node module dependency from validation.ts, making it safe to
import from client components without pulling in a Node polyfill.

Deletes the unnecessary validation-constants.ts that was introduced as
a workaround — the constants now live back in validation.ts where they
belong.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../components/file-viewer/file-viewer.tsx    |  2 +-
 .../workspace/[workspaceId]/files/files.tsx   |  2 +-
 .../lib/uploads/utils/validation-constants.ts | 52 ----------------
 apps/sim/lib/uploads/utils/validation.ts      | 62 ++++++++++++++++---
 4 files changed, 57 insertions(+), 61 deletions(-)
 delete mode 100644 apps/sim/lib/uploads/utils/validation-constants.ts

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 ced62301630..a7706947142 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
@@ -7,7 +7,7 @@ import { Skeleton } from '@/components/emcn'
 import { cn } from '@/lib/core/utils/cn'
 import type { WorkspaceFileRecord } from '@/lib/uploads/contexts/workspace'
 import { getFileExtension } from '@/lib/uploads/utils/file-utils'
-import { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation-constants'
+import { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation'
 import {
   useUpdateWorkspaceFileContent,
   useWorkspaceFileBinary,
diff --git a/apps/sim/app/workspace/[workspaceId]/files/files.tsx b/apps/sim/app/workspace/[workspaceId]/files/files.tsx
index 8bed291a461..a16f13eaf7e 100644
--- a/apps/sim/app/workspace/[workspaceId]/files/files.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/files/files.tsx
@@ -36,10 +36,10 @@ import {
   isAudioFileType,
   isVideoFileType,
 } from '@/lib/uploads/utils/file-utils'
-import { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation-constants'
 import {
   isSupportedExtension,
   SUPPORTED_AUDIO_EXTENSIONS,
+  SUPPORTED_CODE_EXTENSIONS,
   SUPPORTED_DOCUMENT_EXTENSIONS,
   SUPPORTED_VIDEO_EXTENSIONS,
 } from '@/lib/uploads/utils/validation'
diff --git a/apps/sim/lib/uploads/utils/validation-constants.ts b/apps/sim/lib/uploads/utils/validation-constants.ts
deleted file mode 100644
index 1876d6a4f8f..00000000000
--- a/apps/sim/lib/uploads/utils/validation-constants.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-/**
- * Extension constants that are safe to import from client components.
- * Separated from validation.ts which imports Node's `path` module.
- */
-
-export const SUPPORTED_CODE_EXTENSIONS = [
-  'mdx',
-  'xml',
-  'css',
-  'scss',
-  'less',
-  'js',
-  'jsx',
-  'ts',
-  'tsx',
-  'py',
-  'rb',
-  'go',
-  'rs',
-  'java',
-  'kt',
-  'swift',
-  'c',
-  'cpp',
-  'h',
-  'hpp',
-  'cs',
-  'php',
-  'sh',
-  'bash',
-  'zsh',
-  'fish',
-  'sql',
-  'graphql',
-  'gql',
-  'toml',
-  'ini',
-  'conf',
-  'cfg',
-  'env',
-  'log',
-  'diff',
-  'patch',
-  'dockerfile',
-  'makefile',
-  'gitignore',
-  'editorconfig',
-  'prettierrc',
-  'eslintrc',
-] as const
-
-export type SupportedCodeExtension = (typeof SUPPORTED_CODE_EXTENSIONS)[number]
diff --git a/apps/sim/lib/uploads/utils/validation.ts b/apps/sim/lib/uploads/utils/validation.ts
index ecc42088c17..3752e421d79 100644
--- a/apps/sim/lib/uploads/utils/validation.ts
+++ b/apps/sim/lib/uploads/utils/validation.ts
@@ -1,8 +1,3 @@
-import path from 'path'
-
-export { SUPPORTED_CODE_EXTENSIONS } from '@/lib/uploads/utils/validation-constants'
-export type { SupportedCodeExtension } from '@/lib/uploads/utils/validation-constants'
-
 /**
  * Checks whether a string is a valid file extension (lowercase alphanumeric only).
  * Rejects extensions containing spaces, punctuation, or other non-alphanumeric characters
@@ -12,6 +7,11 @@ export function isAlphanumericExtension(ext: string): boolean {
   return /^[a-z0-9]+$/.test(ext)
 }
 
+function extractExtension(fileName: string): string {
+  const lastDot = fileName.lastIndexOf('.')
+  return lastDot !== -1 ? fileName.slice(lastDot + 1).toLowerCase() : ''
+}
+
 export const MAX_FILE_SIZE = 100 * 1024 * 1024 // 100MB
 
 export const SUPPORTED_DOCUMENT_EXTENSIONS = [
@@ -32,6 +32,54 @@ export const SUPPORTED_DOCUMENT_EXTENSIONS = [
   'yml',
 ] as const
 
+export const SUPPORTED_CODE_EXTENSIONS = [
+  'mdx',
+  'xml',
+  'css',
+  'scss',
+  'less',
+  'js',
+  'jsx',
+  'ts',
+  'tsx',
+  'py',
+  'rb',
+  'go',
+  'rs',
+  'java',
+  'kt',
+  'swift',
+  'c',
+  'cpp',
+  'h',
+  'hpp',
+  'cs',
+  'php',
+  'sh',
+  'bash',
+  'zsh',
+  'fish',
+  'sql',
+  'graphql',
+  'gql',
+  'toml',
+  'ini',
+  'conf',
+  'cfg',
+  'env',
+  'log',
+  'diff',
+  'patch',
+  'dockerfile',
+  'makefile',
+  'gitignore',
+  'editorconfig',
+  'prettierrc',
+  'eslintrc',
+] as const
+
+export type SupportedCodeExtension = (typeof SUPPORTED_CODE_EXTENSIONS)[number]
+
 export const SUPPORTED_AUDIO_EXTENSIONS = [
   'mp3',
   'm4a',
@@ -149,7 +197,7 @@ export interface FileValidationError {
  * Validate if a file type is supported for document processing
  */
 export function validateFileType(fileName: string, mimeType: string): FileValidationError | null {
-  const raw = path.extname(fileName).toLowerCase().substring(1)
+  const raw = extractExtension(fileName)
   const extension = (isAlphanumericExtension(raw) ? raw : '') as SupportedDocumentExtension
 
   if (!SUPPORTED_DOCUMENT_EXTENSIONS.includes(extension)) {
@@ -234,7 +282,7 @@ export function validateMediaFileType(
   fileName: string,
   mimeType: string
 ): FileValidationError | null {
-  const raw = path.extname(fileName).toLowerCase().substring(1)
+  const raw = extractExtension(fileName)
   const extension = isAlphanumericExtension(raw) ? raw : ''
 
   const isAudio = SUPPORTED_AUDIO_EXTENSIONS.includes(extension as SupportedAudioExtension)

From 6c4b02e8040856080e46694861ae1caeca347459 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Sat, 4 Apr 2026 21:07:20 -0700
Subject: [PATCH 11/11] lint

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../files/components/file-viewer/data-table.tsx              | 5 +----
 .../files/components/file-viewer/file-viewer.tsx             | 3 +--
 .../files/components/file-viewer/preview-panel.tsx           | 2 +-
 3 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx
index e14f94419d7..5e31edcfb55 100644
--- a/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx
+++ b/apps/sim/app/workspace/[workspaceId]/files/components/file-viewer/data-table.tsx
@@ -25,10 +25,7 @@ export const DataTable = memo(function DataTable({ headers, rows }: DataTablePro
           {rows.map((row, ri) => (
             <tr key={ri} className='border-[var(--border)] border-t'>
               {headers.map((_, ci) => (
-                <td
-                  key={ci}
-                  className='whitespace-nowrap px-3 py-2 text-[var(--text-secondary)]'
-                >
+                <td key={ci} className='whitespace-nowrap px-3 py-2 text-[var(--text-secondary)]'>
                   {String(row[ci] ?? '')}
                 </td>
               ))}
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 a7706947142..f62caa1f51c 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
@@ -1062,8 +1062,7 @@ const XlsxPreview = memo(function XlsxPreview({
         <DataTable headers={currentSheet.headers} rows={currentSheet.rows} />
         {currentSheet.truncated && (
           <p className='mt-3 text-center text-[12px] text-[var(--text-muted)]'>
-            Showing first {XLSX_MAX_ROWS.toLocaleString()} rows. Download the file to view all
-            data.
+            Showing first {XLSX_MAX_ROWS.toLocaleString()} rows. Download the file to view all data.
           </p>
         )}
       </div>
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 8bcbb3a3728..2e77eae3eb4 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
@@ -10,9 +10,9 @@ import remarkGfm from 'remark-gfm'
 import { Checkbox } from '@/components/emcn'
 import { cn } from '@/lib/core/utils/cn'
 import { getFileExtension } from '@/lib/uploads/utils/file-utils'
-import { DataTable } from './data-table'
 import { useAutoScroll } from '@/hooks/use-auto-scroll'
 import { useStreamingReveal } from '@/hooks/use-streaming-reveal'
+import { DataTable } from './data-table'
 
 type PreviewType = 'markdown' | 'html' | 'csv' | 'svg' | null