Scope of addType function is global

.eslintrc.js

@@ -16,5 +16,6 @@ module.exports = {
   rules: {
     "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
     "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
+    "@typescript-eslint/no-explicit-any": "off",
   }
 };

src/components/celestials/CelestialCard.vue

@@ -70,9 +70,6 @@ export default defineComponent({
   },
   props: {
     celestial: Object
-  },
-  mounted() {
-    console.log(this.celestial);
   }
 });
 </script>

src/plugins/methods/index.ts

@@ -0,0 +1,26 @@
+export const addCelestialType = (celestial: any) => {
+  if (celestial.isPlanet) {
+    if (celestial.moons) {
+      celestial.type = "planète à lunes";
+    } else {
+      celestial.type = "planète";
+    }
+
+    // Check if element is moon
+  } else if (celestial.aroundPlanet != null) {
+    celestial.type = "lune";
+
+    // Check if element is star
+  } else if (celestial.id === "soleil") {
+    celestial.type = "étoile";
+
+    // ...else, body is "other"
+  } else {
+    celestial.type = "autre";
+  }
+  return celestial;
+};
+
+export default {
+  addCelestialType
+};

src/views/celestials/Celestials.vue

@@ -11,9 +11,13 @@
 
 <script lang="ts">
 import { defineComponent } from "vue";
+import CelestialsList from "@/components/celestials/CelestialsList.vue";
+
+// API
 import axios from "axios";
 
-import CelestialsList from "@/components/celestials/CelestialsList.vue";
+// Global methods
+import { addCelestialType } from "@/plugins/methods";
 
 export default defineComponent({
   name: "Celestials",
@@ -24,7 +28,7 @@ export default defineComponent({
   // Initial state
   data() {
     return {
-      celestials: []
+      celestials: Array<any>()
     };
   },
 
@@ -34,13 +38,14 @@ export default defineComponent({
       // ...and add type
       this.celestials = this.addType(res);
     });
+    console.log(this.$options);
   },
 
   methods: {
     /**
      * Fetches celestial bodies from API
      */
-    fetchBodies() {
+    fetchBodies(): Promise<any> {
       return axios
         .get("https://api.le-systeme-solaire.net/rest/bodies/")
         .then(res => {
@@ -55,30 +60,8 @@ export default defineComponent({
     /**
      * Assign a type from the celestial object provided
      */
-    addType(bodies: []) {
+    addType(bodies: Array<any>): Array<any> {
-      return bodies.filter((e: any) => {
+      return bodies.map((e: any) => addCelestialType(e));
-        // Check if element is planet
-        if (e.isPlanet) {
-          if (e.moons) {
-            e.type = "planète à lunes";
-          } else {
-            e.type = "planète";
-          }
-
-          // Check if element is moon
-        } else if (e.aroundPlanet != null) {
-          e.type = "lune";
-
-          // Check if element is star
-        } else if (e.id === "soleil") {
-          e.type = "étoile";
-
-          // ...else, body is "other"
-        } else {
-          e.type = "autre";
-        }
-        return e;
-      });
     }
   }
 });