Feat: Support DFIQ objects (#140)

Corresponding PR in yeti has been merged

docker/dev/Dockerfile

@@ -4,8 +4,6 @@ RUN apt update && apt install \
     python3 \
     git
 
-RUN npm install -g n && n 16
-
 ADD . /app
 WORKDIR /app
 

src/components/EditDFIQObject.vue

@@ -0,0 +1,99 @@
+<template>
+  <v-card>
+    <v-card-title>{{ object.name || object.value }}</v-card-title>
+    <v-card-subtitle>Editing DFIQ {{ object.type }}</v-card-subtitle>
+    <v-card-text>
+      <v-textarea class="yeti-code" label="DFIQ Yaml" auto-grow v-model="object.dfiq_yaml"></v-textarea>
+    </v-card-text>
+
+    <v-card-actions>
+      <v-btn text="Toggle full screen" color="primary" @click="toggleFullScreen"></v-btn>
+      <v-spacer></v-spacer>
+      <v-btn text="Cancel" color="cancel" @click="isActive.value = false"></v-btn>
+      <v-btn text="Save" color="primary" @click="saveDFIQObject" variant="tonal"></v-btn>
+    </v-card-actions>
+    <v-alert v-if="errors.length > 0" type="error">
+      Error saving DFIQ {{ object.type }}:
+      <ul>
+        <li v-for="error in errors">
+          <strong>{{ error.field }}</strong
+          >: {{ error.message }}
+        </li>
+      </ul>
+    </v-alert>
+  </v-card>
+</template>
+
+<script lang="ts" setup>
+import axios from "axios";
+
+import ObjectFields from "@/components/ObjectFields.vue";
+</script>
+
+<script lang="ts">
+export default {
+  components: { ObjectFields },
+  props: {
+    object: {
+      type: Object,
+      default: () => {}
+    },
+    isActive: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      localObject: { ...this.object },
+      errors: [],
+      fullScreen: false,
+      typeToEndpointMapping: {
+        entity: "entities",
+        observable: "observables",
+        indicator: "indicators",
+        dfiq: "dfiq"
+      }
+    };
+  },
+  mounted() {},
+  methods: {
+    saveDFIQObject() {
+      let patchRequest = {
+        dfiq_type: this.object.type,
+        dfiq_yaml: this.object.dfiq_yaml
+      };
+
+      axios
+        .patch(`/api/v2/dfiq/${this.object.id}`, patchRequest)
+        .then(response => {
+          this.$eventBus.emit("displayMessage", {
+            message: "DFIQ object succesfully updated",
+            status: "success"
+          });
+          this.$emit("success", response.data);
+          this.isActive.value = false;
+        })
+        .catch(error => {
+          console.log(error);
+          this.errors = error.response.data.detail
+            .filter(detail => detail.loc[1] !== "type")
+            .map(detail => {
+              return { field: detail.loc[1], message: detail.msg };
+            });
+        })
+        .finally();
+    },
+    toggleFullScreen() {
+      this.fullScreen = !this.fullScreen;
+      this.$emit("toggle-fullscreen", this.fullScreen);
+    }
+  }
+};
+</script>
+
+<style>
+.yeti-code textarea {
+  font-family: monospace;
+}
+</style>

src/components/EditObject.vue

@@ -30,6 +30,7 @@ import axios from "axios";
 import { ENTITY_TYPES } from "@/definitions/entityDefinitions.js";
 import { INDICATOR_TYPES } from "@/definitions/indicatorDefinitions.js";
 import { OBSERVABLE_TYPES } from "@/definitions/observableDefinitions.js";
+import { DFIQ_TYPES } from "@/definitions/dfiqDefinitions.js";
 import ObjectFields from "@/components/ObjectFields.vue";
 import { objectTypeAnnotation } from "@babel/types";
 </script>
@@ -55,7 +56,8 @@ export default {
       typeToEndpointMapping: {
         entity: "entities",
         observable: "observables",
-        indicator: "indicators"
+        indicator: "indicators",
+        dfiq: "dfiq"
       }
     };
   },
@@ -101,7 +103,8 @@ export default {
       return (
         ENTITY_TYPES.find(t => t.type === this.object.type) ||
         INDICATOR_TYPES.find(t => t.type === this.object.type) ||
-        OBSERVABLE_TYPES.find(t => t.type === this.object.type)
+        OBSERVABLE_TYPES.find(t => t.type === this.object.type) ||
+        DFIQ_TYPES.find(t => t.type === this.object.type)
       );
     },
     editableFields() {

src/components/ObjectList.vue

@@ -16,13 +16,7 @@
       <template v-slot:item.name="{ item }">
         <span class="short-links">
           <v-tooltip activator="parent" location="top" :open-delay="200">{{ item.name }}</v-tooltip>
-          <router-link
-            :to="{
-              name: searchType === 'entities' ? 'EntityDetails' : 'IndicatorDetails',
-              params: { id: item.id }
-            }"
-            >{{ item.name }}</router-link
-          >
+          <router-link :to="`${searchType}/${item.id}`">{{ item.name }}</router-link>
         </span>
       </template>
       <template v-slot:item.tags="{ item }">
@@ -37,6 +31,9 @@
       <template v-slot:item.relevant_tags="{ item }">
         <v-chip v-for="name in item.relevant_tags" :text="name" class="mr-1" size="small"></v-chip>
       </template>
+      <template v-slot:item.dfiq_tags="{ item }">
+        <v-chip v-for="name in item.dfiq_tags" :text="name" class="mr-1" size="small"></v-chip>
+      </template>
       <template v-slot:item.aliases="{ item }">
         <v-chip v-for="value in item.aliases" :text="value" class="mr-1" size="small"></v-chip>
       </template>
@@ -54,6 +51,9 @@
       <template v-slot:item.created="{ item }">
         {{ moment(item.created).format("YYYY-MM-DD HH:mm:ss") }}
       </template>
+      <template v-slot:item.modified="{ item }">
+        {{ moment(item.modified).format("YYYY-MM-DD HH:mm:ss") }}
+      </template>
       <template v-slot:item.last_seen="{ item }">
         {{ moment(item.last_seen).format("YYYY-MM-DD HH:mm:ss") }}
       </template>

src/components/RelatedObjects.vue

@@ -57,6 +57,15 @@
               </router-link>
             </span>
           </span>
+          <span v-else-if="node.root_type === 'dfiq'" class="short-links">
+            <v-icon :icon="getIconForType(node.type)" start size="small"></v-icon>
+            <span>
+              <v-tooltip activator="parent" location="top" :open-delay="200">{{ node.name }}</v-tooltip>
+              <router-link :to="{ name: 'DFIQDetails', params: { id: node.id } }">
+                {{ node.name }}
+              </router-link>
+            </span>
+          </span>
           <span v-else>
             <v-chip> {{ node.name }}</v-chip>
           </span>
@@ -97,6 +106,7 @@ import axios from "axios";
 
 import { ENTITY_TYPES } from "@/definitions/entityDefinitions.js";
 import { INDICATOR_TYPES } from "@/definitions/indicatorDefinitions.js";
+import { DFIQ_TYPES } from "@/definitions/dfiqDefinitions.js";
 import EditLink from "@/components/EditLink.vue";
 import YetiMarkdown from "@/components/YetiMarkdown.vue";
 </script>
@@ -135,7 +145,7 @@ export default {
       perPage: 20,
       total: 0,
       loading: false,
-      objectTypes: ENTITY_TYPES.concat(INDICATOR_TYPES),
+      objectTypes: ENTITY_TYPES.concat(INDICATOR_TYPES).concat(DFIQ_TYPES),
       showEditLink: false
     };
   },