From b9cd625c53b2d18806a0f34fe0e834b30e2fbfa7 Mon Sep 17 00:00:00 2001 From: yessenia Date: Mon, 9 Feb 2026 16:30:12 +0800 Subject: [PATCH] feat: add Playground icon component and integrate it into the navigation operations --- .../icons/assets/vender/plugin/playground.svg | 5 ++ .../icons/src/vender/plugin/Playground.json | 50 +++++++++++++++++++ .../icons/src/vender/plugin/Playground.tsx | 20 ++++++++ .../base/icons/src/vender/plugin/index.ts | 1 + .../plugins/plugin-page/nav-operations.tsx | 5 +- 5 files changed, 79 insertions(+), 2 deletions(-) create mode 100644 web/app/components/base/icons/assets/vender/plugin/playground.svg create mode 100644 web/app/components/base/icons/src/vender/plugin/Playground.json create mode 100644 web/app/components/base/icons/src/vender/plugin/Playground.tsx diff --git a/web/app/components/base/icons/assets/vender/plugin/playground.svg b/web/app/components/base/icons/assets/vender/plugin/playground.svg new file mode 100644 index 0000000000..44367fc17d --- /dev/null +++ b/web/app/components/base/icons/assets/vender/plugin/playground.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/web/app/components/base/icons/src/vender/plugin/Playground.json b/web/app/components/base/icons/src/vender/plugin/Playground.json new file mode 100644 index 0000000000..746da37da2 --- /dev/null +++ b/web/app/components/base/icons/src/vender/plugin/Playground.json @@ -0,0 +1,50 @@ +{ + "icon": { + "type": "element", + "isRootNode": true, + "name": "svg", + "attributes": { + "width": "16", + "height": "16", + "viewBox": "0 0 16 16", + "fill": "none", + "xmlns": "http://www.w3.org/2000/svg" + }, + "children": [ + { + "type": "element", + "name": "path", + "attributes": { + "d": "M11.6301 11.3333C11.6301 12.4379 10.7347 13.3333 9.63013 13.3333C8.52559 13.3333 7.63013 12.4379 7.63013 11.3333C7.63013 10.2287 8.52559 9.33325 9.63013 9.33325C10.7347 9.33325 11.6301 10.2287 11.6301 11.3333Z", + "stroke": "currentColor", + "stroke-width": "1.5", + "stroke-linejoin": "round" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M3.1353 4.75464L6.67352 7.72353L2.33325 9.30327L3.1353 4.75464Z", + "stroke": "currentColor", + "stroke-width": "1.5", + "stroke-linejoin": "round" + }, + "children": [] + }, + { + "type": "element", + "name": "path", + "attributes": { + "d": "M9.79576 2.5L13.6595 3.53527L12.6242 7.399L8.7605 6.36371L9.79576 2.5Z", + "stroke": "currentColor", + "stroke-width": "1.5", + "stroke-linejoin": "round" + }, + "children": [] + } + ] + }, + "name": "Playground" +} diff --git a/web/app/components/base/icons/src/vender/plugin/Playground.tsx b/web/app/components/base/icons/src/vender/plugin/Playground.tsx new file mode 100644 index 0000000000..2ed91906f9 --- /dev/null +++ b/web/app/components/base/icons/src/vender/plugin/Playground.tsx @@ -0,0 +1,20 @@ +// GENERATE BY script +// DON NOT EDIT IT MANUALLY + +import type { IconData } from '@/app/components/base/icons/IconBase' +import * as React from 'react' +import IconBase from '@/app/components/base/icons/IconBase' +import data from './Playground.json' + +const Icon = ( + { + ref, + ...props + }: React.SVGProps & { + ref?: React.RefObject> + }, +) => + +Icon.displayName = 'Playground' + +export default Icon diff --git a/web/app/components/base/icons/src/vender/plugin/index.ts b/web/app/components/base/icons/src/vender/plugin/index.ts index b345526eb7..43b22a3d5d 100644 --- a/web/app/components/base/icons/src/vender/plugin/index.ts +++ b/web/app/components/base/icons/src/vender/plugin/index.ts @@ -1,3 +1,4 @@ export { default as BoxSparkleFill } from './BoxSparkleFill' export { default as LeftCorner } from './LeftCorner' +export { default as Playground } from './Playground' export { default as Trigger } from './Trigger' diff --git a/web/app/components/plugins/plugin-page/nav-operations.tsx b/web/app/components/plugins/plugin-page/nav-operations.tsx index ca943e77f7..9cd8792454 100644 --- a/web/app/components/plugins/plugin-page/nav-operations.tsx +++ b/web/app/components/plugins/plugin-page/nav-operations.tsx @@ -1,11 +1,12 @@ 'use client' -import { RiAddLine, RiBookOpenLine, RiGithubLine, RiLayoutGridLine, RiPuzzle2Line } from '@remixicon/react' +import { RiAddLine, RiBookOpenLine, RiGithubLine, RiPuzzle2Line } from '@remixicon/react' import Link from 'next/link' import { useSearchParams } from 'next/navigation' import { useState } from 'react' import { useTranslation } from 'react-i18next' import Badge from '@/app/components/base/badge' import Button, { buttonVariants } from '@/app/components/base/button' +import { Playground } from '@/app/components/base/icons/src/vender/plugin' import { PortalToFollowElem, PortalToFollowElemContent, @@ -111,7 +112,7 @@ export const CreationTypeTabs = ({ creationType: creationTypeProp }: CreationTyp creationType === 'templates' && 'bg-state-base-hover text-text-secondary', )} > - + {t('templates', { ns: 'plugin' })}