Fix sticky note in marketplace chatflows

packages/ui/src/ui-component/cards/NodeCardWrapper.js

@@ -2,9 +2,9 @@
 import { styled } from '@mui/material/styles'
 
 // project imports
-import MainCard from '../../ui-component/cards/MainCard'
+import MainCard from './MainCard'
 
-const CardWrapper = styled(MainCard)(({ theme }) => ({
+const NodeCardWrapper = styled(MainCard)(({ theme }) => ({
     background: theme.palette.card.main,
     color: theme.darkTextPrimary,
     border: 'solid 1px',
@@ -18,4 +18,4 @@ const CardWrapper = styled(MainCard)(({ theme }) => ({
     }
 }))
 
-export default CardWrapper
+export default NodeCardWrapper

packages/ui/src/ui-component/tooltip/NodeTooltip.js

@@ -1,7 +1,7 @@
 import { styled } from '@mui/material/styles'
 import Tooltip, { tooltipClasses } from '@mui/material/Tooltip'
 
-const LightTooltip = styled(({ className, ...props }) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({
+const NodeTooltip = styled(({ className, ...props }) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({
     [`& .${tooltipClasses.tooltip}`]: {
         backgroundColor: theme.palette.nodeToolTip.background,
         color: theme.palette.nodeToolTip.color,
@@ -9,4 +9,4 @@ const LightTooltip = styled(({ className, ...props }) => <Tooltip {...props} cla
     }
 }))
 
-export default LightTooltip
+export default NodeTooltip

packages/ui/src/views/canvas/CanvasNode.js

@@ -8,8 +8,8 @@ import { IconButton, Box, Typography, Divider, Button } from '@mui/material'
 import Tooltip from '@mui/material/Tooltip'
 
 // project imports
-import CardWrapper from './CardWrapper'
-import LightTooltip from './LightTooltip'
+import NodeCardWrapper from '../../ui-component/cards/NodeCardWrapper'
+import NodeTooltip from '../../ui-component/tooltip/NodeTooltip'
 import NodeInputHandler from './NodeInputHandler'
 import NodeOutputHandler from './NodeOutputHandler'
 import AdditionalParamsDialog from 'ui-component/dialog/AdditionalParamsDialog'
@@ -72,7 +72,7 @@ const CanvasNode = ({ data }) => {
 
     return (
         <>
-            <CardWrapper
+            <NodeCardWrapper
                 content={false}
                 sx={{
                     padding: 0,
@@ -80,7 +80,7 @@ const CanvasNode = ({ data }) => {
                 }}
                 border={false}
             >
-                <LightTooltip
+                <NodeTooltip
                     open={!canvas.canvasDialogShow && open}
                     onClose={handleClose}
                     onOpen={handleOpen}
@@ -225,8 +225,8 @@ const CanvasNode = ({ data }) => {
                             <NodeOutputHandler key={index} outputAnchor={outputAnchor} data={data} />
                         ))}
                     </Box>
-                </LightTooltip>
-            </CardWrapper>
+                </NodeTooltip>
+            </NodeCardWrapper>
             <AdditionalParamsDialog
                 show={showDialog}
                 dialogProps={dialogProps}

packages/ui/src/views/canvas/StickyNote.js

@@ -6,8 +6,8 @@ import { useSelector } from 'react-redux'
 import { useTheme } from '@mui/material/styles'
 
 // project imports
-import CardWrapper from './CardWrapper'
-import LightTooltip from './LightTooltip'
+import NodeCardWrapper from '../../ui-component/cards/NodeCardWrapper'
+import NodeTooltip from '../../ui-component/tooltip/NodeTooltip'
 import { IconButton, Box } from '@mui/material'
 import { IconCopy, IconTrash } from '@tabler/icons'
 import { Input } from 'ui-component/input/Input'
@@ -33,7 +33,7 @@ const StickyNote = ({ data }) => {
 
     return (
         <>
-            <CardWrapper
+            <NodeCardWrapper
                 content={false}
                 sx={{
                     padding: 0,
@@ -42,7 +42,7 @@ const StickyNote = ({ data }) => {
                 }}
                 border={false}
             >
-                <LightTooltip
+                <NodeTooltip
                     open={!canvas.canvasDialogShow && open}
                     onClose={handleClose}
                     onOpen={handleOpen}
@@ -90,8 +90,8 @@ const StickyNote = ({ data }) => {
                             nodeId={data.id}
                         />
                     </Box>
-                </LightTooltip>
-            </CardWrapper>
+                </NodeTooltip>
+            </NodeCardWrapper>
         </>
     )
 }

packages/ui/src/views/marketplaces/MarketplaceCanvas.js

@@ -11,10 +11,10 @@ import { useTheme } from '@mui/material/styles'
 
 // project imports
 import MarketplaceCanvasNode from './MarketplaceCanvasNode'
-
 import MarketplaceCanvasHeader from './MarketplaceCanvasHeader'
+import StickyNote from '../canvas/StickyNote'
 
-const nodeTypes = { customNode: MarketplaceCanvasNode }
+const nodeTypes = { customNode: MarketplaceCanvasNode, stickyNote: StickyNote }
 const edgeTypes = { buttonedge: '' }
 
 // ==============================|| CANVAS ||============================== //