refactor: replace getCurrentInstance router access with useRouter

kestra-io · Nov 29, 2024 · 7c0bd59 · 7c0bd59
1 parent 68e113c
commit 7c0bd59
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 11 deletions.
diff --git a/ui/src/components/LeftMenuLink.vue b/ui/src/components/LeftMenuLink.vue
@@ -28,7 +28,8 @@
 </script>
 
 <script setup>
-    import {computed, getCurrentInstance, ref, onMounted} from "vue"
+    import {computed, ref, onMounted} from "vue"
+    import {useRouter} from "vue-router";
     import EnterpriseTooltip from "./EnterpriseTooltip.vue";
 
     const props = defineProps({
@@ -38,7 +39,7 @@
         },
     })
 
-    const router = getCurrentInstance().appContext.config.globalProperties.$router
+    const router = useRouter()
 
     const isHyperLink = computed(() => {
         return !!(!props.item.href || props.item.external || !router)

diff --git a/ui/src/components/flows/FlowDependencies.vue b/ui/src/components/flows/FlowDependencies.vue
@@ -1,6 +1,6 @@
 <script setup>
     import {ref, onMounted, inject, nextTick, getCurrentInstance} from "vue";
-    import {useRoute} from "vue-router";
+    import {useRoute, useRouter} from "vue-router";
     import {VueFlow, useVueFlow, Position, MarkerType} from "@vue-flow/core"
     import {Controls, ControlButton} from "@vue-flow/controls"
     import {Background} from "@vue-flow/background";
@@ -19,7 +19,7 @@
     const route = useRoute();
     const store = useStore();
     const axios = inject("axios")
-    const router = getCurrentInstance().appContext.config.globalProperties.$router;
+    const router = useRouter();
     const t = getCurrentInstance().appContext.config.globalProperties.$t;
 
     const loaded = ref([]);

diff --git a/ui/src/components/inputs/EditorView.vue b/ui/src/components/inputs/EditorView.vue
@@ -1,6 +1,7 @@
 <script setup>
     import {computed, getCurrentInstance, h, nextTick, onBeforeUnmount, onMounted, ref, watch,} from "vue";
     import {useStore} from "vuex";
+    import {useRouter} from "vue-router";
 
     // Icons
     import ContentSave from "vue-material-design-icons/ContentSave.vue";
@@ -31,7 +32,7 @@
     import {ElMessageBox} from "element-plus";
 
     const store = useStore();
-    const router = getCurrentInstance().appContext.config.globalProperties.$router;
+    const router = useRouter();
     const emit = defineEmits(["follow", "expand-subflow"]);
     const toast = getCurrentInstance().appContext.config.globalProperties.$toast();
     const t = getCurrentInstance().appContext.config.globalProperties.$t;
@@ -1413,15 +1414,15 @@
         position: fixed;
         z-index: 9999;
         border-right: none;
-        
+
         & li {
             height: 30px;
             padding: 16px;
             font-size: var(--el-font-size-small);
             color: var(--bs-gray-700);
 
             &:hover {
-                color: var(--bs-secondary);            
+                color: var(--bs-secondary);
             }
         }
     }

diff --git a/ui/src/components/inputs/LowCodeEditor.vue b/ui/src/components/inputs/LowCodeEditor.vue
@@ -3,6 +3,7 @@
     import {getCurrentInstance, nextTick, onMounted, ref, watch} from "vue";
     import {useStore} from "vuex";
     import {useVueFlow} from "@vue-flow/core";
+    import {useRouter} from "vue-router";
 
     import TaskEdit from "../flows/TaskEdit.vue";
     import SearchField from "../layout/SearchField.vue";
@@ -22,7 +23,7 @@
     import Markdown from "../layout/Markdown.vue";
     import Editor from "./Editor.vue";
 
-    const router = getCurrentInstance().appContext.config.globalProperties.$router;
+    const router = useRouter();
 
     const vueflowId = ref(Math.random().toString());
     // Vue flow methods to interact with Graph

diff --git a/ui/src/components/namespace/NamespaceDependencies.vue b/ui/src/components/namespace/NamespaceDependencies.vue
@@ -1,5 +1,7 @@
 <script setup>
-    import {ref, onMounted, inject, nextTick, getCurrentInstance} from "vue";
+    import {ref, onMounted, inject, nextTick} from "vue";
+    import {useStore} from "vuex";
+    import {useRouter} from "vue-router"
     import {VueFlow, useVueFlow, Position, MarkerType} from "@vue-flow/core"
     import {Controls, ControlButton} from "@vue-flow/controls"
     import {Background} from "@vue-flow/background";
@@ -11,12 +13,12 @@
 
     import {linkedElements} from "../../utils/vueFlow"
     import {apiUrl} from "override/utils/route";
-    import {useStore} from "vuex";
+
 
     const {id: vueFlowId, addNodes, addEdges, getNodes, removeNodes, getEdges, removeEdges, fitView, addSelectedElements, removeSelectedNodes, removeSelectedEdges} = useVueFlow();
 
     const axios = inject("axios")
-    const router = getCurrentInstance().appContext.config.globalProperties.$router;
+    const router = useRouter();
     const store = useStore();
 
     const loaded = ref([]);