hunk.code_window:             </Stack>
             </div>
           </Tooltip>
         </When>
         <div style={{ pointerEvents: 'none' }}>
           <WorkflowNode
             showDelete={false}
             Icon={TapeGradient}
             label={'Trigger'}
             active={selected}
             channelType={StepTypeEnum.TRIGGER}
           />
           <Handle style={noChildStyle} type="source" id="a" position={Position.Bottom} />
         </div>
       </div>
     );
   });
hunk.labels: keep keep keep keep replace replace replace replace replace replace replace replace replace replace keep keep keep
hunk.after_edit:       <WorkflowNode
           showDelete={false}
           Icon={TapeGradient}
           label={'Trigger'}
           active={selected}
           channelType={StepTypeEnum.TRIGGER}
         />
         <Handle style={noChildStyle} type="source" id="a" position={Position.Bottom} />
  
hunk.file_path: apps/web/src/pages/templates/workflow/workflow/node-types/TriggerNode.tsx
hunk.type: replace
file: import { StepTypeEnum } from '@novu/shared';
  import { memo, useState } from 'react';
  import { Handle, Position, useReactFlow } from 'react-flow-renderer';
  
  import { WorkflowNode } from './WorkflowNode';
  import { Check, TapeGradient } from '../../../../../design-system/icons';
  import { Stack, useMantineColorScheme } from '@mantine/core';
  import { colors, Tooltip } from '../../../../../design-system';
  import { useFormContext } from 'react-hook-form';
  import { IForm } from '../../../components/formTypes';
  import { When } from '../../../../../components/utils/When';
  import { createStyles } from '@mantine/core';
  import { useDidUpdate } from '@mantine/hooks';
  
  const useStyles = createStyles(
    (
      theme,
      params: {
        animate: boolean;
      }
    ) => ({
      savedIcon: {
        position: 'absolute',
        top: -11,
        right: -11,
        zIndex: 99999,
        height: 22,
        width: 22,
        borderRadius: 22,
        background: colors.success,
        animation: `fade-in-save-icon 2s linear 0s${params.animate ? ', pulse-animation-save-icon 2s linear 2s 3' : ''}`,
        '@keyframes fade-in-save-icon': {
          '0%': {
            opacity: 0,
          },
          '100%': {
            opacity: 1,
          },
        },
        '@keyframes pulse-animation-save-icon': {
          '0%': {
            boxShadow: '0 0 0 0 rgb(77, 153, 128, 0.7)',
          },
          '70%': {
            boxShadow: '0 0 0 10px rgba(77, 153, 128, 0)',
          },
          '100%': {
            boxShadow: '0 0 0 0 rgba(77, 153, 128, 0)',
          },
        },
      },
    })
  );
  
  export default memo(({ selected }: { selected: boolean }) => {
    const { getNodes } = useReactFlow();
    const isParent = getNodes().length > 2;
    const noChildStyle = isParent ? {} : { border: 'none', background: 'transparent' };
    const {
      formState: { isDirty },
    } = useFormContext<IForm>();
    const theme = useMantineColorScheme();
    const [shouldAnimate, setShouldAnimate] = useState(false);
    const { classes } = useStyles({
      animate: shouldAnimate,
    });
  
    useDidUpdate(() => {
      setShouldAnimate(true);
    }, [isDirty]);
  
    return (
      <div data-test-id={'node-triggerSelector'} style={{ position: 'relative' }}>
        <When truthy={!isDirty}>
          <Tooltip label="Workflow is saved">
            <div className={classes.savedIcon}>
              <Stack
                justify="center"
                align="center"
                sx={{
                  height: '100%',
                }}
              >
                <Check color={theme.colorScheme === 'dark' ? colors.B15 : colors.white} />
              </Stack>
            </div>
          </Tooltip>
        </When>
        <div style={{ pointerEvents: 'none' }}>
          <WorkflowNode
            showDelete={false}
            Icon={TapeGradient}
            label={'Trigger'}
            active={selected}
            channelType={StepTypeEnum.TRIGGER}
          />
          <Handle style={noChildStyle} type="source" id="a" position={Position.Bottom} />
        </div>
      </div>
    );
  });
  