mirror of
https://github.com/langgenius/dify.git
synced 2026-05-05 18:08:07 +08:00
refactor(skill): replace @remixicon/react imports with CSS icon classes
Migrate all Remixicon component imports in workflow/skill to Tailwind CSS icon utility classes (i-ri-*), reducing JS bundle size. Update MenuItem to accept string icon classes alongside React components. Adjust test selectors that relied on SVG element queries.
This commit is contained in:
@ -1,7 +1,6 @@
|
||||
'use client'
|
||||
|
||||
import type { SandboxFileTreeNode } from '@/types/sandbox-file'
|
||||
import { RiArrowDownSLine, RiArrowRightSLine, RiLoader2Line } from '@remixicon/react'
|
||||
import * as React from 'react'
|
||||
import { useCallback, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
@ -74,15 +73,15 @@ const ArtifactsSection = ({ className }: ArtifactsSectionProps) => {
|
||||
|
||||
<div className="relative flex items-center">
|
||||
{showSpinner
|
||||
? <RiLoader2Line className="size-3.5 animate-spin text-text-tertiary" aria-hidden="true" />
|
||||
? <span className="i-ri-loader-2-line size-3.5 animate-spin text-text-tertiary" aria-hidden="true" />
|
||||
: (
|
||||
<>
|
||||
{showBlueDot && (
|
||||
<div className="absolute -left-2 size-[7px] rounded-full border border-white bg-state-accent-solid" />
|
||||
)}
|
||||
{isExpanded
|
||||
? <RiArrowDownSLine className="size-4 text-text-tertiary" aria-hidden="true" />
|
||||
: <RiArrowRightSLine className="size-4 text-text-tertiary" aria-hidden="true" />}
|
||||
? <span className="i-ri-arrow-down-s-line size-4 text-text-tertiary" aria-hidden="true" />
|
||||
: <span className="i-ri-arrow-right-s-line size-4 text-text-tertiary" aria-hidden="true" />}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@ -2,7 +2,6 @@
|
||||
|
||||
import type { FileAppearanceType } from '@/app/components/base/file-uploader/types'
|
||||
import type { SandboxFileTreeNode } from '@/types/sandbox-file'
|
||||
import { RiDownloadLine, RiFolderLine, RiFolderOpenLine } from '@remixicon/react'
|
||||
import * as React from 'react'
|
||||
import { useCallback, useState } from 'react'
|
||||
import FileTypeIcon from '@/app/components/base/file-uploader/file-type-icon'
|
||||
@ -84,8 +83,8 @@ const ArtifactsTreeNode = ({
|
||||
{isFolder
|
||||
? (
|
||||
isExpanded
|
||||
? <RiFolderOpenLine className="size-4 text-text-accent" aria-hidden="true" />
|
||||
: <RiFolderLine className="size-4 text-text-secondary" aria-hidden="true" />
|
||||
? <span className="i-ri-folder-open-line size-4 text-text-accent" aria-hidden="true" />
|
||||
: <span className="i-ri-folder-line size-4 text-text-secondary" aria-hidden="true" />
|
||||
)
|
||||
: <FileTypeIcon type={fileIconType as FileAppearanceType} size="sm" />}
|
||||
</div>
|
||||
@ -107,7 +106,7 @@ const ArtifactsTreeNode = ({
|
||||
)}
|
||||
aria-label={`Download ${node.name}`}
|
||||
>
|
||||
<RiDownloadLine className="size-3.5 text-text-tertiary" />
|
||||
<span className="i-ri-download-line size-3.5 text-text-tertiary" />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user