Merge pull request #16297 from martenson/norot

[23.1] use router instead of hard links for certain page urls
galaxyproject · Jul 28, 2023 · 889b570 · 889b570
2 parents e302349 + 8c5dfb0
commit 889b570
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 19 deletions.
diff --git a/client/src/components/Page/PageDropdown.vue b/client/src/components/Page/PageDropdown.vue
@@ -18,7 +18,6 @@ interface Page {
 }
 interface PageDropdownProps {
     page: Page;
-    root: string;
     published?: Boolean;
 }
 
@@ -27,10 +26,6 @@ const { isAnonymous } = storeToRefs(useUserStore());
 
 const emit = defineEmits(["onRemove", "onSuccess", "onError"]);
 
-const urlEdit = computed(() => `${props.root}pages/editor?id=${props.page.id}`);
-const urlEditAttributes = computed(() => `${props.root}pages/edit?id=${props.page.id}`);
-const urlShare = computed(() => `${props.root}pages/sharing?id=${props.page.id}`);
-const urlView = computed(() => `${props.root}published/page?id=${props.page.id}`);
 const readOnly = computed(() => props.page.shared || props.published || unref(isAnonymous));
 
 function onDelete(page_id: string) {
@@ -57,22 +52,31 @@ function onDelete(page_id: string) {
         </b-link>
         <p v-if="props.page.description">{{ props.page.description }}</p>
         <div class="dropdown-menu" aria-labelledby="page-dropdown">
-            <a class="dropdown-item dropdown-item-view" :href="urlView">
+            <router-link :to="`/published/page?id=${props.page.id}`" class="dropdown-item dropdown-item-view">
                 <span class="fa fa-eye fa-fw mr-1" />
                 <span>View</span>
-            </a>
-            <a v-if="!readOnly" class="dropdown-item dropdown-item-edit" :href="urlEdit">
+            </router-link>
+            <router-link
+                v-if="!readOnly"
+                :to="`/pages/editor?id=${props.page.id}`"
+                class="dropdown-item dropdown-item-edit">
                 <span class="fa fa-edit fa-fw mr-1" />
                 <span>Edit content</span>
-            </a>
-            <a v-if="!readOnly" class="dropdown-item dropdown-item-attributes" :href="urlEditAttributes">
+            </router-link>
+            <router-link
+                v-if="!readOnly"
+                :to="`/pages/edit?id=${props.page.id}`"
+                class="dropdown-item dropdown-item-attributes">
                 <span class="fa fa-pencil fa-fw mr-1" />
                 <span>Edit attributes</span>
-            </a>
-            <a v-if="!readOnly" class="dropdown-item dropdown-item-share" :href="urlShare">
+            </router-link>
+            <router-link
+                v-if="!readOnly"
+                :to="`/pages/sharing?id=${props.page.id}`"
+                class="dropdown-item dropdown-item-share">
                 <span class="fa fa-share-alt fa-fw mr-1" />
                 <span>Control sharing</span>
-            </a>
+            </router-link>
             <a
                 v-if="!readOnly"
                 v-b-modal="`delete-page-modal-${props.page.id}`"

diff --git a/client/src/components/Page/PageList.vue b/client/src/components/Page/PageList.vue
@@ -9,7 +9,7 @@
                 <IndexFilter v-bind="filterAttrs" id="page-search" v-model="filter" />
             </b-col>
             <b-col>
-                <PageIndexActions :root="root" class="float-right" />
+                <PageIndexActions class="float-right" />
             </b-col>
         </b-row>
         <b-table v-model="pageItemsModel" v-bind="{ ...defaultTableAttrs, ...indexTableAttrs }">
@@ -26,7 +26,6 @@
             <template v-slot:cell(title)="row">
                 <PageDropdown
                     :page="row.item"
-                    :root="root"
                     :published="published"
                     @onAdd="onAdd"
                     @onRemove="onRemove"
@@ -61,8 +60,9 @@
                 </span>
                 <a
                     v-if="!row.item.published && !row.item.shared && !row.item.importable"
-                    :href="shareLink(row.item)"
-                    class="share-this-page">
+                    :href="`sharing?id=${row.item.id}`"
+                    class="share-this-page"
+                    @click.prevent="shareLink(row.item)">
                     <span>Share this</span>
                 </a>
             </template>
@@ -90,7 +90,8 @@ import filtersMixin from "components/Indices/filtersMixin";
 import PageIndexActions from "./PageIndexActions";
 import CopyToClipboard from "components/CopyToClipboard";
 import IndexFilter from "components/Indices/IndexFilter";
-import { withPrefix, absPath } from "@/utils/redirect";
+import { absPath } from "@/utils/redirect";
+import { useRouter } from "vue-router/composables";
 import { getGalaxyInstance } from "app";
 
 import SharingIndicators from "components/Indices/SharingIndicators";
@@ -152,6 +153,12 @@ export default {
             default: true,
         },
     },
+    setup() {
+        const router = useRouter();
+        return {
+            router,
+        };
+    },
     data() {
         const fields = this.published ? PUBLISHED_FIELDS : PERSONAL_FIELDS;
         const implicitFilter = this.published ? "is:published" : null;
@@ -216,7 +223,7 @@ export default {
             this.refresh();
         },
         shareLink: function (item) {
-            return withPrefix(`sharing?id=${item.id}`);
+            this.router.push(`sharing?id=${item.id}`);
         },
         decorateData(page) {
             const Galaxy = getGalaxyInstance();