diff --git a/web/app/components/workflow/skill/hooks/use-skill-file-data.ts b/web/app/components/workflow/skill/hooks/use-skill-file-data.ts
index c762dfa354..979ad01ffd 100644
--- a/web/app/components/workflow/skill/hooks/use-skill-file-data.ts
+++ b/web/app/components/workflow/skill/hooks/use-skill-file-data.ts
@@ -9,19 +9,19 @@ export type SkillFileDataResult = {
 
 /**
  * Hook to fetch file data for skill documents.
- * Fetches content for editable files and download URL for media files.
+ * Fetches content for editable files and download URL for non-editable files.
  */
 export function useSkillFileData(
   appId: string,
   nodeId: string | null | undefined,
-  isMediaFile: boolean,
+  isEditable: boolean,
 ): SkillFileDataResult {
   const {
     data: fileContent,
     isLoading: isContentLoading,
     error: contentError,
   } = useGetAppAssetFileContent(appId, nodeId || '', {
-    enabled: !isMediaFile,
+    enabled: isEditable,
   })
 
   const {
@@ -29,11 +29,11 @@ export function useSkillFileData(
     isLoading: isDownloadUrlLoading,
     error: downloadUrlError,
   } = useGetAppAssetFileDownloadUrl(appId, nodeId || '', {
-    enabled: isMediaFile && !!nodeId,
+    enabled: !isEditable && !!nodeId,
   })
 
-  const isLoading = isMediaFile ? isDownloadUrlLoading : isContentLoading
-  const error = isMediaFile ? downloadUrlError : contentError
+  const isLoading = isEditable ? isContentLoading : isDownloadUrlLoading
+  const error = isEditable ? contentError : downloadUrlError
 
   return {
     fileContent,
diff --git a/web/app/components/workflow/skill/skill-doc-editor.tsx b/web/app/components/workflow/skill/skill-doc-editor.tsx
index b5f7bc0d94..a56eedc425 100644
--- a/web/app/components/workflow/skill/skill-doc-editor.tsx
+++ b/web/app/components/workflow/skill/skill-doc-editor.tsx
@@ -44,9 +44,9 @@ const SkillDocEditor: FC = () => {
 
   const currentFileNode = activeTabId ? nodeMap?.get(activeTabId) : undefined
 
-  const { isMarkdown, isCodeOrText, isImage, isVideo, isOffice, isEditable, isMediaFile } = useFileTypeInfo(currentFileNode)
+  const { isMarkdown, isCodeOrText, isImage, isVideo, isOffice, isEditable } = useFileTypeInfo(currentFileNode)
 
-  const { fileContent, downloadUrlData, isLoading, error } = useSkillFileData(appId, activeTabId, isMediaFile)
+  const { fileContent, downloadUrlData, isLoading, error } = useSkillFileData(appId, activeTabId, isEditable)
 
   const originalContent = fileContent?.content ?? ''
 
@@ -150,8 +150,8 @@ const SkillDocEditor: FC = () => {
     )
   }
 
-  const mediaPreviewUrl = downloadUrlData?.download_url || ''
-  const textPreviewUrl = fileContent?.content || ''
+  // For non-editable files (media, office, unsupported), use download URL
+  const downloadUrl = downloadUrlData?.download_url || ''
   const fileName = currentFileNode?.name || ''
   const fileSize = currentFileNode?.size
   const isUnsupportedFile = !isMarkdown && !isCodeOrText && !isImage && !isVideo && !isOffice
@@ -183,7 +183,7 @@ const SkillDocEditor: FC = () => {
         ? (
             <MediaFilePreview
               type={isImage ? 'image' : 'video'}
-              src={mediaPreviewUrl}
+              src={downloadUrl}
             />
           )
         : null}
@@ -197,7 +197,7 @@ const SkillDocEditor: FC = () => {
             <UnsupportedFileDownload
               name={fileName}
               size={fileSize}
-              downloadUrl={textPreviewUrl}
+              downloadUrl={downloadUrl}
             />
           )
         : null}