estel/dify
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Chore: frontend infrastructure upgrade (#16420)

Browse Source 
Co-authored-by: NFish <douxc512@gmail.com>
Co-authored-by: zxhlyh <jasonapring2015@outlook.com>
Co-authored-by: twwu <twwu@dify.ai>
Co-authored-by: jZonG <jzongcode@gmail.com>
This commit is contained in:
Joel
2025-03-21 17:41:03 +08:00
committed by GitHub
parent e61415223b
commit 7709d9df20
1435 changed files with 13372 additions and 11612 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/app/components/workflow/note-node/note-editor/toolbar/color-picker.tsx
View File

@@ -63,24 +63,24 @@ const ColorPicker = ({
>
<PortalToFollowElemTrigger onClick={() => setOpen(!open)}>
<div className={cn(
'flex items-center justify-center w-8 h-8 rounded-md cursor-pointer hover:bg-black/5',
'flex h-8 w-8 cursor-pointer items-center justify-center rounded-md hover:bg-black/5',
open && 'bg-black/5',
)}>
<div
className={cn(
'w-4 h-4 rounded-full border border-black/5',
'h-4 w-4 rounded-full border border-black/5',
THEME_MAP[theme].title,
)}
></div>
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent>
<div className='grid grid-cols-3 grid-rows-2 gap-0.5 p-0.5 rounded-lg border-[0.5px] border-components-actionbar-border bg-components-actionbar-bg shadow-lg'>
<div className='grid grid-cols-3 grid-rows-2 gap-0.5 rounded-lg border-[0.5px] border-components-actionbar-border bg-components-actionbar-bg p-0.5 shadow-lg'>
{
COLOR_LIST.map(color => (
<div
key={color.key}
className='group relative flex items-center justify-center w-8 h-8 rounded-md cursor-pointer'
className='group relative flex h-8 w-8 cursor-pointer items-center justify-center rounded-md'
onClick={(e) => {
e.stopPropagation()
onThemeChange(color.key)
@@ -89,13 +89,13 @@ const ColorPicker = ({
>
<div
className={cn(
'hidden group-hover:block absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-5 h-5 rounded-full border-[1.5px]',
'absolute left-1/2 top-1/2 hidden h-5 w-5 -translate-x-1/2 -translate-y-1/2 rounded-full border-[1.5px] group-hover:block',
color.outer,
)}
></div>
<div
className={cn(
'absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-4 h-4 rounded-full border border-black/5',
'absolute left-1/2 top-1/2 h-4 w-4 -translate-x-1/2 -translate-y-1/2 rounded-full border border-black/5',
color.inner,
)}
></div>

12
web/app/components/workflow/note-node/note-editor/toolbar/command.tsx
View File

@@ -32,15 +32,15 @@ const Command = ({
const icon = useMemo(() => {
switch (type) {
case 'bold':
return <RiBold className={cn('w-4 h-4', selectedIsBold && 'text-primary-600')} />
return <RiBold className={cn('h-4 w-4', selectedIsBold && 'text-primary-600')} />
case 'italic':
return <RiItalic className={cn('w-4 h-4', selectedIsItalic && 'text-primary-600')} />
return <RiItalic className={cn('h-4 w-4', selectedIsItalic && 'text-primary-600')} />
case 'strikethrough':
return <RiStrikethrough className={cn('w-4 h-4', selectedIsStrikeThrough && 'text-primary-600')} />
return <RiStrikethrough className={cn('h-4 w-4', selectedIsStrikeThrough && 'text-primary-600')} />
case 'link':
return <RiLink className={cn('w-4 h-4', selectedIsLink && 'text-primary-600')} />
return <RiLink className={cn('h-4 w-4', selectedIsLink && 'text-primary-600')} />
case 'bullet':
return <RiListUnordered className={cn('w-4 h-4', selectedIsBullet && 'text-primary-600')} />
return <RiListUnordered className={cn('h-4 w-4', selectedIsBullet && 'text-primary-600')} />
}
}, [type, selectedIsBold, selectedIsItalic, selectedIsStrikeThrough, selectedIsLink, selectedIsBullet])
@@ -65,7 +65,7 @@ const Command = ({
>
<div
className={cn(
'flex items-center justify-center w-8 h-8 cursor-pointer rounded-md text-text-tertiary hover:text-text-accent hover:bg-state-accent-active',
'flex h-8 w-8 cursor-pointer items-center justify-center rounded-md text-text-tertiary hover:bg-state-accent-active hover:text-text-accent',
type === 'bold' && selectedIsBold && 'bg-state-accent-active',
type === 'italic' && selectedIsItalic && 'bg-state-accent-active',
type === 'strikethrough' && selectedIsStrikeThrough && 'bg-state-accent-active',

2
web/app/components/workflow/note-node/note-editor/toolbar/divider.tsx
View File

@@ -1,6 +1,6 @@
const Divider = () => {
return (
<div className='mx-1 w-[1px] h-3.5 bg-divider-regular'></div>
<div className='mx-1 h-3.5 w-[1px] bg-divider-regular'></div>
)
}

10
web/app/components/workflow/note-node/note-editor/toolbar/font-size-selector.tsx
View File

@@ -42,20 +42,20 @@ const FontSizeSelector = () => {
>
<PortalToFollowElemTrigger onClick={() => handleOpenFontSizeSelector(!fontSizeSelectorShow)}>
<div className={cn(
'flex items-center pl-2 pr-1.5 h-8 rounded-md text-[13px] font-medium text-text-tertiary hover:text-text-secondary cursor-pointer hover:bg-state-base-hover',
'flex h-8 cursor-pointer items-center rounded-md pl-2 pr-1.5 text-[13px] font-medium text-text-tertiary hover:bg-state-base-hover hover:text-text-secondary',
fontSizeSelectorShow && 'bg-state-base-hover text-text-secondary',
)}>
<RiFontSize className='mr-1 w-4 h-4' />
<RiFontSize className='mr-1 h-4 w-4' />
{FONT_SIZE_LIST.find(font => font.key === fontSize)?.value || t('workflow.nodes.note.editor.small')}
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent>
<div className='p-1 w-[120px] bg-components-panel-bg-blur border-[0.5px] border-components-panel-border rounded-md shadow-xl text-text-secondary'>
<div className='w-[120px] rounded-md border-[0.5px] border-components-panel-border bg-components-panel-bg-blur p-1 text-text-secondary shadow-xl'>
{
FONT_SIZE_LIST.map(font => (
<div
key={font.key}
className='flex items-center justify-between pl-3 pr-2 h-8 rounded-md cursor-pointer hover:bg-state-base-hover'
className='flex h-8 cursor-pointer items-center justify-between rounded-md pl-3 pr-2 hover:bg-state-base-hover'
onClick={(e) => {
e.stopPropagation()
handleFontSize(font.key)
@@ -69,7 +69,7 @@ const FontSizeSelector = () => {
</div>
{
fontSize === font.key && (
<Check className='w-4 h-4 text-text-accent' />
<Check className='h-4 w-4 text-text-accent' />
)
}
</div>

2
web/app/components/workflow/note-node/note-editor/toolbar/index.tsx
View File

@@ -18,7 +18,7 @@ const Toolbar = ({
onShowAuthorChange,
}: ToolbarProps) => {
return (
<div className='inline-flex items-center p-0.5 bg-components-actionbar-bg rounded-lg border-[0.5px] border-components-actionbar-border shadow-sm'>
<div className='inline-flex items-center rounded-lg border-[0.5px] border-components-actionbar-border bg-components-actionbar-bg p-0.5 shadow-sm'>
<ColorPicker
theme={theme}
onThemeChange={onThemeChange}

14
web/app/components/workflow/note-node/note-editor/toolbar/operator.tsx
View File

@@ -40,18 +40,18 @@ const Operator = ({
<PortalToFollowElemTrigger onClick={() => setOpen(!open)}>
<div
className={cn(
'flex items-center justify-center w-8 h-8 cursor-pointer rounded-lg text-text-tertiary hover:text-text-secondary hover:bg-state-base-hover',
'flex h-8 w-8 cursor-pointer items-center justify-center rounded-lg text-text-tertiary hover:bg-state-base-hover hover:text-text-secondary',
open && 'bg-state-base-hover text-text-secondary',
)}
>
<RiMoreFill className='w-4 h-4' />
<RiMoreFill className='h-4 w-4' />
</div>
</PortalToFollowElemTrigger>
<PortalToFollowElemContent>
<div className='min-w-[192px] bg-components-panel-bg-blur rounded-md border-[0.5px] border-components-panel-border shadow-xl'>
<div className='min-w-[192px] rounded-md border-[0.5px] border-components-panel-border bg-components-panel-bg-blur shadow-xl'>
<div className='p-1'>
<div
className='flex items-center justify-between px-3 h-8 cursor-pointer rounded-md text-sm text-text-secondary hover:bg-state-base-hover'
className='flex h-8 cursor-pointer items-center justify-between rounded-md px-3 text-sm text-text-secondary hover:bg-state-base-hover'
onClick={() => {
onCopy()
setOpen(false)
@@ -61,7 +61,7 @@ const Operator = ({
<ShortcutsName keys={['ctrl', 'c']} />
</div>
<div
className='flex items-center justify-between px-3 h-8 cursor-pointer rounded-md text-sm text-text-secondary hover:bg-state-base-hover'
className='flex h-8 cursor-pointer items-center justify-between rounded-md px-3 text-sm text-text-secondary hover:bg-state-base-hover'
onClick={() => {
onDuplicate()
setOpen(false)
@@ -74,7 +74,7 @@ const Operator = ({
<div className='h-[1px] bg-divider-subtle'></div>
<div className='p-1'>
<div
className='flex items-center justify-between px-3 h-8 cursor-pointer rounded-md text-sm text-text-secondary hover:bg-state-base-hover'
className='flex h-8 cursor-pointer items-center justify-between rounded-md px-3 text-sm text-text-secondary hover:bg-state-base-hover'
onClick={e => e.stopPropagation()}
>
<div>{t('workflow.nodes.note.editor.showAuthor')}</div>
@@ -88,7 +88,7 @@ const Operator = ({
<div className='h-[1px] bg-divider-subtle'></div>
<div className='p-1'>
<div
className='flex items-center justify-between px-3 h-8 cursor-pointer rounded-md text-sm text-text-secondary hover:text-text-destructive hover:bg-state-destructive-hover'
className='flex h-8 cursor-pointer items-center justify-between rounded-md px-3 text-sm text-text-secondary hover:bg-state-destructive-hover hover:text-text-destructive'
onClick={() => {
onDelete()
setOpen(false)