test(ui): add firewall section related unitary tests

This commit adds  unitary tests related to the firewall section, testing
integration with the API and the component rendering and validation.

Author: luannmoreira

ui/src/components/firewall/FirewallRuleAdd.vue

@@ -3,6 +3,7 @@
     @click="showDialog = true"
     v-bind="$attrs"
     :disabled="notHasAuthorization"
+    data-test="firewall-delete-dialog-btn"
   >
     <div class="d-flex align-center">
       <div class="mr-2">
@@ -50,55 +51,46 @@
   </v-dialog>
 </template>
 
-<script lang="ts">
-import { defineComponent, ref } from "vue";
+<script setup lang="ts">
+import { ref } from "vue";
 import {
   INotificationsError,
   INotificationsSuccess,
 } from "../../interfaces/INotifications";
 import { useStore } from "../../store";
 import handleError from "@/utils/handleError";
 
-export default defineComponent({
-  props: {
-    id: {
-      type: String,
-      required: true,
-    },
-    notHasAuthorization: {
-      type: Boolean,
-      default: false,
-    },
+const props = defineProps({
+  id: {
+    type: String,
+    required: true,
   },
-  emits: ["update"],
-  setup(props, ctx) {
-    const showDialog = ref(false);
-    const store = useStore();
-
-    const remove = async () => {
-      try {
-        await store.dispatch("firewallRules/remove", props.id);
-
-        store.dispatch(
-          "snackbar/showSnackbarSuccessAction",
-          INotificationsSuccess.firewallRuleDeleting,
-        );
-        ctx.emit("update");
-      } catch (error: unknown) {
-        store.dispatch(
-          "snackbar/showSnackbarErrorAction",
-          INotificationsError.firewallRuleDeleting,
-        );
-        handleError(error);
-      } finally {
-        showDialog.value = false;
-      }
-    };
-
-    return {
-      showDialog,
-      remove,
-    };
+  notHasAuthorization: {
+    type: Boolean,
+    default: false,
   },
 });
+const emit = defineEmits(["update"]);
+const showDialog = ref(false);
+const store = useStore();
+
+const remove = async () => {
+  try {
+    await store.dispatch("firewallRules/remove", props.id);
+
+    store.dispatch(
+      "snackbar/showSnackbarSuccessAction",
+      INotificationsSuccess.firewallRuleDeleting,
+    );
+    emit("update");
+  } catch (error: unknown) {
+    store.dispatch(
+      "snackbar/showSnackbarErrorAction",
+      INotificationsError.firewallRuleDeleting,
+    );
+    handleError(error);
+  } finally {
+    showDialog.value = false;
+  }
+};
 </script>