Add ping animation to update button

src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx

@@ -477,6 +477,7 @@ export default function NodeToolbarComponent({
                     value={"Update"}
                     icon={"Code"}
                     dataTestId="update-button-modal"
+                    ping={isOutdated}
                   />
                 </SelectItem>
               )}

src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/toolbarSelectItem/index.tsx

@@ -9,14 +9,18 @@ export default function ToolbarSelectItem({
   icon,
   styleObj,
   dataTestId,
+  ping,
 }: toolbarSelectItemProps) {
   return (
     <div className="flex" data-testid={dataTestId}>
       <ForwardedIconComponent
         name={icon}
-        className={`relative top-0.5 mr-2 h-4 w-4 ${styleObj?.iconClasses}`}
-      />{" "}
-      <span className={styleObj?.valueClasses}>{value}</span>{" "}
+        className={`relative top-0.5 mr-2 h-4 w-4 ${styleObj?.iconClasses} ${
+          ping && "animate-pulse text-green-500"
+        }`}
+      />
+      <span className={styleObj?.valueClasses}>{value}</span>
+
       {isMac ? (
         <ForwardedIconComponent
           name="Command"

src/frontend/src/types/components/index.ts

@@ -707,4 +707,5 @@ export type toolbarSelectItemProps = {
     valueClasses?: string;
   };
   dataTestId: string;
+  ping?: boolean;
 };