fix: filter Update All components to not include edited ones, changed Node Toolbar to show Restore for edited componetns (#8050)

* Updated updateAllComponents to not include user edited components

* Changed GenericNode to display isOutdated to node toolbar if user edited

* Changed Restore color

---------

Co-authored-by: Edwin Jose <edwin.jose@datastax.com>

src/frontend/src/CustomNodes/GenericNode/index.tsx

@@ -119,6 +119,7 @@ function GenericNode({
       state.componentsToUpdate.find((component) => component.id === data.id),
     ),
   );
+
   const {
     outdated: isOutdated,
     breakingChange: hasBreakingChange,
@@ -330,7 +331,7 @@ function GenericNode({
             openAdvancedModal={false}
             onCloseAdvancedModal={() => {}}
             updateNode={() => handleUpdateCode()}
-            isOutdated={isOutdated && dismissAll}
+            isOutdated={isOutdated && (dismissAll || isUserEdited)}
             isUserEdited={isUserEdited}
             hasBreakingChange={hasBreakingChange}
           />

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

@@ -48,7 +48,8 @@ export default function UpdateAllComponents({}: {}) {
   const componentsToUpdateFiltered = useMemo(
     () =>
       componentsToUpdate.filter(
-        (component) => !dismissedNodes.includes(component.id),
+        (component) =>
+          !dismissedNodes.includes(component.id) && !component.userEdited,
       ),
     [componentsToUpdate, dismissedNodes],
   );

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

@@ -606,7 +606,9 @@ const NodeToolbarComponent = memo(
                         shortcuts.find((obj) => obj.name === "Update")
                           ?.shortcut!
                       }
-                      style={hasBreakingChange ? "text-warning" : ""}
+                      style={
+                        hasBreakingChange ? "text-accent-amber-foreground" : ""
+                      }
                       value={isUserEdited ? "Restore" : "Update"}
                       icon={isUserEdited ? "RefreshCcwDot" : "CircleArrowUp"}
                       dataTestId="update-button-modal"