feat: added temporary dummy button menu

ref: N25B-189

src/pages/VisProgPage/visualProgrammingUI/components/DragDropSidebar.tsx

@@ -131,18 +131,38 @@ export function DndToolbar() {
   );
 
   return (
-    <div className={`flex-col gap-lg padding-md ${styles.innerDndPanel}`}>
-      <div className="description">
-        You can drag these nodes to the pane to create new nodes.
+    
+    
+    <div>
+      <div className={`flex-col gap-lg padding-md ${styles.saveLoadPanel }`}>
+        <div className="description">
+          You can save and load your graph here.
+        </div>
+        <div className={`flex-row gap-lg ${styles.dndNodeContainer}`}>
+          <DraggableNode className={styles.draggableNodePhase} nodeType="phase" onDrop={handleNodeDrop}>
+            Save Graph
+          </DraggableNode>
+          <DraggableNode className={styles.draggableNodeNorm} nodeType="norm" onDrop={handleNodeDrop}>
+            Load Graph
+          </DraggableNode>
+        </div>
       </div>
-      <div className={`flex-row gap-lg ${styles.dndNodeContainer}`}>
-        <DraggableNode className={styles.draggableNodePhase} nodeType="phase" onDrop={handleNodeDrop}>
-          phase Node
-        </DraggableNode>
-        <DraggableNode className={styles.draggableNodeNorm} nodeType="norm" onDrop={handleNodeDrop}>
-          norm Node
-        </DraggableNode>
+
+      <div className={`flex-col gap-lg padding-md ${styles.innerDndPanel}`}>
+        <div className="description">
+          You can drag these nodes to the pane to create new nodes.
+        </div>
+        <div className={`flex-row gap-lg ${styles.dndNodeContainer}`}>
+          <DraggableNode className={styles.draggableNodePhase} nodeType="phase" onDrop={handleNodeDrop}>
+            phase Node
+          </DraggableNode>
+          <DraggableNode className={styles.draggableNodeNorm} nodeType="norm" onDrop={handleNodeDrop}>
+            norm Node
+          </DraggableNode>
+        </div>
       </div>
+
+      
     </div>
   );
 }