Refactor code for parameterComponent and nodeToolbarComponent

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

@@ -355,10 +355,14 @@ export default function ParameterComponent({
         <div
           className={
             "w-full truncate text-sm" +
-            (left ? "" : " text-end") +
+            (left ? "" : " gap-2 flex justify-end items-center") +
             (info !== "" ? " flex items-center" : "")
           }
         >
+          {!left && data.node?.pinned  &&
+            <div>
+              <IconComponent className="w-5 h-5 text-blue-400" name={"Snowflake"} />
+            </div>}
           {proxy ? (
             <ShadTooltip content={<span>{proxy.id}</span>}>
               <span>{title}</span>

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

@@ -267,7 +267,7 @@ export default function NodeToolbarComponent({
             </button>
           </ShadTooltip>
 
-          <ShadTooltip content="Pin" side="top">
+          <ShadTooltip content="Freeze" side="top">
             <button
               className={classNames(
                 "relative -ml-px inline-flex items-center bg-background px-2 py-2 text-foreground shadow-md ring-1 ring-inset ring-ring  transition-all duration-500 ease-in-out hover:bg-muted focus:z-10"
@@ -287,10 +287,11 @@ export default function NodeToolbarComponent({
               }}
             >
               <IconComponent
-                name="Pin"
+                name="Snowflake"
                 className={cn(
                   "h-4 w-4 transition-all",
-                  pinned ? "animate-wiggle fill-current" : ""
+                  // TODO UPDATE THIS COLOR TO BE A VARIABLE
+                  pinned ? "animate-wiggle text-blue-400" : ""
                 )}
               />
             </button>

src/frontend/src/stores/flowStore.ts

@@ -187,10 +187,12 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
       typeof change === "function"
         ? change(get().nodes.find((node) => node.id === id)!)
         : change;
-
     get().setNodes((oldNodes) =>
       oldNodes.map((node) => {
         if (node.id === id) {
+          if((node.data as NodeDataType).node?.pinned){
+            (newChange.data as NodeDataType).node!.pinned = false;
+          }
           return newChange;
         }
         return node;

src/frontend/src/utils/styleUtils.ts

@@ -6,6 +6,7 @@ import {
   BookMarked,
   BookmarkPlus,
   Bot,
+  Snowflake,
   Boxes,
   Braces,
   Cable,
@@ -383,6 +384,7 @@ export const nodeIconsLucide: iconsType = {
   Clipboard,
   Code2,
   Variable,
+  Snowflake,
   Store,
   Download,
   Eraser,