add icon of yaml

web/app/components/app/create-from-dsl-modal/uploader.tsx

@@ -4,7 +4,7 @@ import React, { useEffect, useRef, useState } from 'react'
 import cn from 'classnames'
 import { useTranslation } from 'react-i18next'
 import { useContext } from 'use-context-selector'
-import { Csv as CSVIcon } from '@/app/components/base/icons/src/public/files'
+import { Yaml as YamlIcon } from '@/app/components/base/icons/src/public/files'
 import { ToastContext } from '@/app/components/base/toast'
 import { Trash03, UploadCloud01 } from '@/app/components/base/icons/src/vender/line/general'
 import Button from '@/app/components/base/button'
@@ -104,7 +104,7 @@ const Uploader: FC<Props> = ({
         )}
         {file && (
           <div className={cn('flex items-center h-20 px-6 rounded-xl bg-gray-50 border border-gray-200 text-sm font-normal group', 'hover:bg-[#F5F8FF] hover:border-[#B2CCFF]')}>
-            <CSVIcon className="shrink-0" />
+            <YamlIcon className="shrink-0" />
             <div className='flex ml-2 w-0 grow'>
               <span className='max-w-[calc(100%_-_30px)] text-ellipsis whitespace-nowrap overflow-hidden text-gray-800'>{file.name.replace(/(.yaml|.yml)$/, '')}</span>
               <span className='shrink-0 text-gray-500'>.yml</span>

web/app/components/base/icons/assets/public/files/yaml.svg

+<svg fill="none" height="26" viewBox="0 0 24 26" width="24" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><filter id="a" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse" height="26" width="22" x="1" y="0"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" result="hardAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="1"/><feGaussianBlur stdDeviation="1"/><feColorMatrix type="matrix" values="0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0"/><feBlend in2="BackgroundImageFix" mode="normal" result="effect1_dropShadow_7605_8828"/><feBlend in="SourceGraphic" in2="effect1_dropShadow_7605_8828" mode="normal" result="shape"/></filter><g filter="url(#a)"><path d="m3 5.8c0-1.68016 0-2.52024.32698-3.16197.28762-.56449.74656-1.02343 1.31105-1.31105.64173-.32698 1.48181-.32698 3.16197-.32698h6.2l7 7v10.2c0 1.6802 0 2.5202-.327 3.162-.2876.5645-.7465 1.0234-1.311 1.311-.6418.327-1.4818.327-3.162.327h-8.4c-1.68016 0-2.52024 0-3.16197-.327-.56449-.2876-1.02343-.7465-1.31105-1.311-.32698-.6418-.32698-1.4818-.32698-3.162z" fill="#e8eaed"/><path d="m16.2 22.75h-8.4c-.8442 0-1.46232-.0002-1.95004-.04-.48479-.0397-.81868-.1172-1.09843-.2597-.51745-.2637-.93815-.6844-1.2018-1.2018-.14254-.2798-.22008-.6137-.25969-1.0985-.03985-.4877-.04004-1.1058-.04004-1.95v-12.4c0-.8442.00019-1.46232.04004-1.95004.03961-.48479.11715-.81868.25969-1.09843.26365-.51745.68435-.93815 1.2018-1.2018.27975-.14254.61364-.22008 1.09843-.25969.48772-.03985 1.10584-.04004 1.95004-.04004h6.0964l6.8536 6.85355v10.09645c0 .8442-.0002 1.4623-.04 1.95-.0397.4848-.1172.8187-.2597 1.0985-.2637.5174-.6844.9381-1.2018 1.2018-.2798.1425-.6137.22-1.0985.2597-.4877.0398-1.1058.04-1.95.04z" stroke="#000" stroke-opacity=".03" stroke-width=".5"/></g><path d="m14 1 7 7h-5c-1.1046 0-2-.89543-2-2z" fill="#fff" opacity=".5"/><path d="m11.5264 9-2.15191 3.2267v2.0455h-1.31897v-2.0455l-2.05552-3.2267h1.48242l1.30707 2.0776 1.31781-2.0776z" fill="#000"/><path d="m13.7426 13.1121h-2.3874l-.4855 1.1724h-1.0572l2.2355-5.27223h1.0813l2.1448 5.27223h-1.1297zm-.3966-1.0526-.7318-1.9348-.8165 1.9348z" fill="#cb171e"/><g fill="#000"><path d="m8.05469 14.8635v5.1673h1.10866v-3.5643l1.16025 2.3957h.8727l1.1999-2.4799v3.6474h1.0636v-5.1662h-1.4522l-1.2885 2.3369-1.22722-2.3369z"/><path d="m17.9994 18.9079h-2.7272v-4.0456h-1.1296v5.1451h3.8568z"/></g></svg>
\ No newline at end of file

web/app/components/base/icons/src/public/files/Yaml.json

+{
+	"icon": {
+		"type": "element",
+		"isRootNode": true,
+		"name": "svg",
+		"attributes": {
+			"fill": "none",
+			"height": "26",
+			"viewBox": "0 0 24 26",
+			"width": "24",
+			"xmlns": "http://www.w3.org/2000/svg",
+			"xmlns:xlink": "http://www.w3.org/1999/xlink"
+		},
+		"children": [
+			{
+				"type": "element",
+				"name": "filter",
+				"attributes": {
+					"id": "a",
+					"color-interpolation-filters": "sRGB",
+					"filterUnits": "userSpaceOnUse",
+					"height": "26",
+					"width": "22",
+					"x": "1",
+					"y": "0"
+				},
+				"children": [
+					{
+						"type": "element",
+						"name": "feFlood",
+						"attributes": {
+							"flood-opacity": "0",
+							"result": "BackgroundImageFix"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "feColorMatrix",
+						"attributes": {
+							"in": "SourceAlpha",
+							"result": "hardAlpha",
+							"type": "matrix",
+							"values": "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "feOffset",
+						"attributes": {
+							"dy": "1"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "feGaussianBlur",
+						"attributes": {
+							"stdDeviation": "1"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "feColorMatrix",
+						"attributes": {
+							"type": "matrix",
+							"values": "0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "feBlend",
+						"attributes": {
+							"in2": "BackgroundImageFix",
+							"mode": "normal",
+							"result": "effect1_dropShadow_7605_8828"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "feBlend",
+						"attributes": {
+							"in": "SourceGraphic",
+							"in2": "effect1_dropShadow_7605_8828",
+							"mode": "normal",
+							"result": "shape"
+						},
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "element",
+				"name": "g",
+				"attributes": {
+					"filter": "url(#a)"
+				},
+				"children": [
+					{
+						"type": "element",
+						"name": "path",
+						"attributes": {
+							"d": "m3 5.8c0-1.68016 0-2.52024.32698-3.16197.28762-.56449.74656-1.02343 1.31105-1.31105.64173-.32698 1.48181-.32698 3.16197-.32698h6.2l7 7v10.2c0 1.6802 0 2.5202-.327 3.162-.2876.5645-.7465 1.0234-1.311 1.311-.6418.327-1.4818.327-3.162.327h-8.4c-1.68016 0-2.52024 0-3.16197-.327-.56449-.2876-1.02343-.7465-1.31105-1.311-.32698-.6418-.32698-1.4818-.32698-3.162z",
+							"fill": "#e8eaed"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "path",
+						"attributes": {
+							"d": "m16.2 22.75h-8.4c-.8442 0-1.46232-.0002-1.95004-.04-.48479-.0397-.81868-.1172-1.09843-.2597-.51745-.2637-.93815-.6844-1.2018-1.2018-.14254-.2798-.22008-.6137-.25969-1.0985-.03985-.4877-.04004-1.1058-.04004-1.95v-12.4c0-.8442.00019-1.46232.04004-1.95004.03961-.48479.11715-.81868.25969-1.09843.26365-.51745.68435-.93815 1.2018-1.2018.27975-.14254.61364-.22008 1.09843-.25969.48772-.03985 1.10584-.04004 1.95004-.04004h6.0964l6.8536 6.85355v10.09645c0 .8442-.0002 1.4623-.04 1.95-.0397.4848-.1172.8187-.2597 1.0985-.2637.5174-.6844.9381-1.2018 1.2018-.2798.1425-.6137.22-1.0985.2597-.4877.0398-1.1058.04-1.95.04z",
+							"stroke": "#000",
+							"stroke-opacity": ".03",
+							"stroke-width": ".5"
+						},
+						"children": []
+					}
+				]
+			},
+			{
+				"type": "element",
+				"name": "path",
+				"attributes": {
+					"d": "m14 1 7 7h-5c-1.1046 0-2-.89543-2-2z",
+					"fill": "#fff",
+					"opacity": ".5"
+				},
+				"children": []
+			},
+			{
+				"type": "element",
+				"name": "path",
+				"attributes": {
+					"d": "m11.5264 9-2.15191 3.2267v2.0455h-1.31897v-2.0455l-2.05552-3.2267h1.48242l1.30707 2.0776 1.31781-2.0776z",
+					"fill": "#000"
+				},
+				"children": []
+			},
+			{
+				"type": "element",
+				"name": "path",
+				"attributes": {
+					"d": "m13.7426 13.1121h-2.3874l-.4855 1.1724h-1.0572l2.2355-5.27223h1.0813l2.1448 5.27223h-1.1297zm-.3966-1.0526-.7318-1.9348-.8165 1.9348z",
+					"fill": "#cb171e"
+				},
+				"children": []
+			},
+			{
+				"type": "element",
+				"name": "g",
+				"attributes": {
+					"fill": "#000"
+				},
+				"children": [
+					{
+						"type": "element",
+						"name": "path",
+						"attributes": {
+							"d": "m8.05469 14.8635v5.1673h1.10866v-3.5643l1.16025 2.3957h.8727l1.1999-2.4799v3.6474h1.0636v-5.1662h-1.4522l-1.2885 2.3369-1.22722-2.3369z"
+						},
+						"children": []
+					},
+					{
+						"type": "element",
+						"name": "path",
+						"attributes": {
+							"d": "m17.9994 18.9079h-2.7272v-4.0456h-1.1296v5.1451h3.8568z"
+						},
+						"children": []
+					}
+				]
+			}
+		]
+	},
+	"name": "Yaml"
+}
\ No newline at end of file

web/app/components/base/icons/src/public/files/Yaml.tsx

+// GENERATE BY script
+// DON NOT EDIT IT MANUALLY
+
+import * as React from 'react'
+import data from './Yaml.json'
+import IconBase from '@/app/components/base/icons/IconBase'
+import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
+
+const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
+  props,
+  ref,
+) => <IconBase {...props} ref={ref} data={data as IconData} />)
+
+Icon.displayName = 'Yaml'
+
+export default Icon

web/app/components/base/icons/src/public/files/index.ts

@@ -8,3 +8,4 @@ export { default as Pdf } from './Pdf'
 export { default as Txt } from './Txt'
 export { default as Unknow } from './Unknow'
 export { default as Xlsx } from './Xlsx'
+export { default as Yaml } from './Yaml'