From af2f2412443fa0a5e6ab7500c7512978ea5a5023 Mon Sep 17 00:00:00 2001
From: Aldo Ortega <aortegay@fiu.edu>
Date: Fri, 16 Aug 2024 13:04:16 -0400
Subject: [PATCH 1/2] Added UI modal for disabling a switch

---
 ui/k-info-panel/link_info.kytos   |  6 +--
 ui/k-info-panel/switch_info.kytos | 82 ++++++++++++++++++++++---------
 2 files changed, 62 insertions(+), 26 deletions(-)

diff --git a/ui/k-info-panel/link_info.kytos b/ui/k-info-panel/link_info.kytos
index 55287a6..d261810 100644
--- a/ui/k-info-panel/link_info.kytos
+++ b/ui/k-info-panel/link_info.kytos
@@ -236,8 +236,8 @@
               title: 'Delete link: Success',
               description: 'The link ' + name + ' was deleted.',
          }
-         _this.$kytos.$emit("setNotification", notification)
-         _this.$kytos.$emit("hideInfoPanel")
+         _this.$kytos.eventBus.$emit("setNotification", notification)
+         _this.$kytos.eventBus.$emit("hideInfoPanel")
        });
        request.fail(function(data) {
          let notification = {
@@ -245,7 +245,7 @@
               title: 'Delete link: Failure',
               description: data.status + ': ' + data.responseJSON.description + ' The link ' + name + ' was not deleted.',
          }
-         _this.$kytos.$emit("setNotification", notification)
+         _this.$kytos.eventBus.$emit("setNotification", notification)
        });
      },
    },
diff --git a/ui/k-info-panel/switch_info.kytos b/ui/k-info-panel/switch_info.kytos
index e4a767c..3e80bc6 100644
--- a/ui/k-info-panel/switch_info.kytos
+++ b/ui/k-info-panel/switch_info.kytos
@@ -2,13 +2,13 @@
     <k-accordion>
       <div class="buttons">
         <div class="button-left">
-          <k-button @click="bt_state_toggle" :title="next_state"></k-button>
+          <k-button @click="bt_disable" :title="next_state"></k-button>
         </div>
         <div class="button-right">
           <k-button @click="bt_delete" title="Delete"></k-button>
         </div>
       </div>
-      <template v-if="show_modal">
+      <template v-if="show_dl_modal">
         <div class="modal-mask">
           <div class="modal-wrapper">
             <div class="modal-container">
@@ -18,12 +18,12 @@
               </div>
               <div class="modal-body">
                 <slot name="body">
-                  Delete Switch {{metadata.node_name !== undefined && metadata.node_name.length !== 0? metadata.node_name : metadata.id}}
+                  Delete Switch {{metadata.node_name !== undefined && metadata.node_name.length !== 0? metadata.node_name : metadata.id}}?
                 </slot>
               </div>
               <div class="modal-footer">
                 <slot name="footer">
-                  <k-button tooltip="Cancel" title="Cancel" @click="modal_cancel">
+                  <k-button tooltip="Cancel" title="Cancel" @click="modal_dl_cancel">
                   </k-button>
                   <k-button id="modal-delete" tooltip="Delete" title="Delete" @click="modal_delete">
                   </k-button>
@@ -33,6 +33,31 @@
           </div>
         </div>
       </template>
+      <template v-else-if="show_dis_modal">
+        <div class="modal-mask">
+          <div class="modal-wrapper">
+            <div class="modal-container">
+              <div class="modal-header">
+                <slot name="header">
+                </slot>
+              </div>
+              <div class="modal-body">
+                <slot name="body">
+                  {{next_state}} Switch {{metadata.node_name !== undefined && metadata.node_name.length !== 0? metadata.node_name : metadata.id}}?
+                </slot>
+              </div>
+              <div class="modal-footer">
+                <slot name="footer">
+                  <k-button tooltip="Cancel" title="Cancel" @click="modal_dis_cancel">
+                  </k-button>
+                  <k-button id="modal-delete" tooltip="Disable/Enable switch" :title="next_state" @click="modal_disable">
+                  </k-button>
+                </slot>
+              </div>
+            </div>
+          </div>
+        </div>
+      </template>
       <k-accordion-item title="Usage Radar" v-if="this.metadata.id">
         <k-switch-radar :dpid="metadata.id" :showGrid="true" :showAxis="true" :showLabels="true" :showLegend="false"></k-switch-radar>
       </k-accordion-item>
@@ -146,7 +171,8 @@
        flows: [],
        links: [],
        headers: ['Links'],
-       show_modal: false
+       show_dl_modal: false,
+       show_dis_modal: false
      }
    },
    methods: {
@@ -308,7 +334,7 @@
        }
        this.$kytos.eventBus.$emit("setNotification", notification)
      },
-     bt_state_toggle(){
+     state_toggle(){
        let request = $.ajax({
                         type:"POST",
                         url: this.$kytos_server_api + "kytos/topology/v3/switches/" + this.metadata.dpid
@@ -317,6 +343,16 @@
        request.done(this.msg_state_success)
        request.fail(this.msg_state_failure)
      },
+     bt_disable(){
+      this.show_dis_modal = true
+     },
+     modal_dis_cancel(){
+      this.show_dis_modal = false;
+     },
+     modal_disable(){
+      this.show_dis_modal = false;
+      this.state_toggle()
+     },
      bt_request(){
        var interfaces = {}
        interfaces["interfaces"] = this.chosen_interfaces
@@ -346,13 +382,13 @@
        })
      },
      bt_delete(){
-       this.show_modal = true;
+       this.show_dl_modal = true;
      },
-     modal_cancel(){
-       this.show_modal = false;
+     modal_dl_cancel(){
+       this.show_dl_modal = false;
      },
      modal_delete(){
-       this.show_modal = false;
+       this.show_dl_modal = false;
        this.delete_switch();
      },
      delete_switch(){
@@ -362,21 +398,21 @@
                         url: this.$kytos_server_api + "kytos/topology/v3/switches/" + this.metadata.dpid,
                         async: true,});
        request.done(function() {
-        let notification = {
-              icon: 'gear',
-              title: 'Delete Switch: Success',
-              description: 'The switch ' + _this.metadata.dpid + ' was deleted.',
-        }
-        _this.$kytos.$emit("setNotification", notification)
-        _this.$kytos.$emit("hideInfoPanel")
+          let notification = {
+                icon: 'gear',
+                title: 'Delete Switch: Success',
+                description: 'The switch ' + _this.metadata.dpid + ' was deleted.',
+          }
+          _this.$kytos.eventBus.$emit("setNotification", notification)
+          _this.$kytos.eventBus.$emit("hideInfoPanel")
        });
        request.fail(function(data) {
-        let notification = {
-              icon: 'gear',
-              title: 'Delete Switch: Failure',
-              description: data.status + ': ' + data.responseJSON.description + ' The switch ' + _this.metadata.dpid + ' was not deleted.',
-        }
-        _this.$kytos.$emit("setNotification", notification)
+          let notification = {
+                icon: 'gear',
+                title: 'Delete Switch: Failure',
+                description: data.status + ': ' + data.responseJSON.description + ' The switch ' + _this.metadata.dpid + ' was not deleted.',
+          }
+          _this.$kytos.eventBus.$emit("setNotification", notification)
        });
      },
    },

From 974dd9f6117aa2a5017fb41689c01a43f0a33e76 Mon Sep 17 00:00:00 2001
From: Aldo Ortega <aortegay@fiu.edu>
Date: Fri, 16 Aug 2024 13:06:18 -0400
Subject: [PATCH 2/2] Updated changelog

---
 CHANGELOG.rst | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.rst b/CHANGELOG.rst
index dbebb60..63b2164 100644
--- a/CHANGELOG.rst
+++ b/CHANGELOG.rst
@@ -10,6 +10,7 @@ All notable changes to the ``topology`` project will be documented in this file.
 Added
 =====
 - Added endpoint ``DELETE v3/interfaces/{interface_id}`` to delete an interface.
+- Added confirmation windown to confirm the disabling or enabling of a switch in the UI interface.
 
 Changed
 =======