From 86ac9ca9562dae2cdc56048f2deb80de4df82f7b Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Thu, 11 Feb 2021 16:00:18 +0100
Subject: [PATCH 1/9] first implementation

---
 .../LibraryFolder/LibraryFolder.vue           |   2 +-
 .../LibraryFolderDatasetPermissions.vue       | 148 ++++++++++++++++++
 .../LibraryFolderPermissions.vue              | 127 +++++----------
 .../LibraryPermissionsWarning.vue             |  25 +++
 .../PermissionsInputField.vue                 |  71 ++++++---
 .../LibraryFolderPermissions/services.js      |  23 ++-
 .../LibraryFolderPermissions/utils.js         |   9 ++
 .../LibraryFolder/LibraryFolderRouter.vue     |   9 +-
 client/src/entry/analysis/AnalysisRouter.js   |   1 +
 lib/galaxy/webapps/galaxy/buildapp.py         |   1 +
 10 files changed, 308 insertions(+), 108 deletions(-)
 create mode 100644 client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
 create mode 100644 client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue
 create mode 100644 client/src/components/LibraryFolder/LibraryFolderPermissions/utils.js

diff --git a/client/src/components/LibraryFolder/LibraryFolder.vue b/client/src/components/LibraryFolder/LibraryFolder.vue
index 10248d84889..432402730e7 100644
--- a/client/src/components/LibraryFolder/LibraryFolder.vue
+++ b/client/src/components/LibraryFolder/LibraryFolder.vue
@@ -461,7 +461,7 @@ export default {
             else if (element.type === "folder") return `${this.root}library/folders/${element.id}`;
         },
         navigateToPermission(element) {
-            if (element.type === "file") window.location.replace(`${this.createContentLink(element)}/permissions`);
+            if (element.type === "file") this.$router.push({ path: `/permissions/${this.folder_id}/dataset/${element.id}` })
             else if (element.type === "folder") this.$router.push({ path: `/permissions/${element.id}` });
         },
         getMessage(element) {
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
new file mode 100644
index 00000000000..c5abd0db36b
--- /dev/null
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
@@ -0,0 +1,148 @@
+<template>
+    <div>
+        <div v-if="dataset">
+            <b-button variant="primary" :to="{ path: `/${this.folder_id}` }">
+                <font-awesome-icon icon="angle-double-left">1</font-awesome-icon>
+            </b-button>
+            <div>
+                <div class="header text-center">{{ dataset.name }}</div>
+            </div>
+        </div>
+        <LibraryPermissionsWarning :is_admin="is_admin" />
+        <hr class="my-4" />
+        <b-container fluid>
+            <h2 class="text-center">Library-related permissions</h2>
+            <PermissionsInputField
+                v-if="modify_item_roles"
+                :id="dataset_id"
+                :permission_type="manage_type"
+                :initial_value="modify_item_roles"
+                title="Roles that can modify the library item"
+                :apiRootUrl="apiRootUrl"
+                alert="User with <strong>any</strong> of these roles can modify name, metadata, and other information about this library item."
+                @input="setUserPermissionsPreferences"
+            />
+            <hr class="my-4" />
+            <h2 class="text-center">Dataset-related permissions</h2>
+            <div class="alert alert-warning text-center">
+                Changes made below will affect <strong>every</strong> library item that was created from this dataset
+                and also every history this dataset is part of.
+            </div>
+            <PermissionsInputField
+                v-if="access_dataset_roles"
+                :id="dataset_id"
+                :permission_type="manage_type"
+                :initial_value="access_dataset_roles"
+                :apiRootUrl="apiRootUrl"
+                title="Roles that can access the dataset"
+                alert="User has to have <strong>all these roles</strong> in order to access this dataset.
+                        Users without access permission <strong>cannot</strong> have other permissions on this dataset.
+                        If there are no access roles set on the dataset it is considered <strong>unrestricted</strong>."
+                @input="setUserPermissionsPreferences"
+            />
+            <PermissionsInputField
+                v-if="manage_dataset_roles"
+                :id="dataset_id"
+                :permission_type="manage_type"
+                :initial_value="manage_dataset_roles"
+                :apiRootUrl="apiRootUrl"
+                title="Roles that can manage permissions on the dataset"
+                alert="User with <strong>any</strong> of these roles can manage permissions of this dataset.
+                        If you remove yourself you will lose the ability manage this dataset unless you are an admin."
+                @input="setUserPermissionsPreferences"
+            />
+        </b-container>
+    </div>
+</template>
+
+<script>
+import Vue from "vue";
+import { getAppRoot } from "onload/loadConfig";
+import BootstrapVue from "bootstrap-vue";
+import { Services } from "./services";
+import { Toast } from "ui/toast";
+import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
+import { getGalaxyInstance } from "app";
+import PermissionsInputField from "./PermissionsInputField.vue";
+import { initManageFolderIcons } from "components/LibraryFolder/icons";
+import LibraryPermissionsWarning from "components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue";
+import { extractRoles } from "./utils";
+
+import "vue-multiselect/dist/vue-multiselect.min.css";
+import VueObserveVisibility from "vue-observe-visibility";
+
+Vue.use(VueObserveVisibility);
+Vue.use(BootstrapVue);
+initManageFolderIcons();
+
+export default {
+    props: {
+        folder_id: {
+            type: String,
+            required: true,
+        },
+        dataset_id: {
+            type: String,
+            required: true,
+        },
+    },
+    components: {
+        PermissionsInputField,
+        LibraryPermissionsWarning,
+        FontAwesomeIcon,
+    },
+    data() {
+        return {
+            permissions: undefined,
+            dataset: undefined,
+            is_admin: undefined,
+            access_dataset_roles: undefined,
+            modify_item_roles: undefined,
+            manage_dataset_roles: undefined,
+            add_type: "add_type",
+            manage_type: "manage_type",
+            modify_type: "modify_type",
+            apiRootUrl: `${getAppRoot()}api/libraries/datasets`,
+        };
+    },
+    created() {
+        const Galaxy = getGalaxyInstance();
+        this.root = getAppRoot();
+        this.services = new Services({ root: this.root });
+        this.is_admin = Galaxy.user.attributes.is_admin;
+        this.services.getDatasetPermissions(this.dataset_id).then((fetched_permissions) => {
+            this.access_dataset_roles = extractRoles(fetched_permissions.access_dataset_roles);
+            this.modify_item_roles = extractRoles(fetched_permissions.modify_item_roles);
+            this.manage_dataset_roles = extractRoles(fetched_permissions.manage_dataset_roles);
+        });
+        this.services.getDataset(this.dataset_id).then((response) => {
+            this.dataset = response;
+        });
+    },
+
+    methods: {
+        getParentLink() {
+            return `${this.root}library/folders/${this.folder_id}`;
+        },
+        setUserPermissionsPreferences(ids, permission_type) {
+            switch (permission_type) {
+                case "manage_type":
+                    this.manage_folder_role_list = ids;
+                    break;
+                case "add_type":
+                    this.add_library_item_role_list = ids;
+                    break;
+                case "modify_type":
+                    this.modify_folder_role_list = ids;
+                    break;
+            }
+        },
+    },
+};
+</script>
+
+<style scoped>
+.header {
+    font-size: 45px;
+}
+</style>
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue
index 982ef7bd18e..8f1340681e2 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue
@@ -9,77 +9,44 @@
                     <div class="header text-center">{{ folder.name }}</div>
                 </div>
             </div>
-            <div>
-                <div class="text-center">
-                    <b-alert show variant="warning" v-if="is_admin">
-                        You are logged in as an <strong>administrator</strong> therefore you can manage any folder on
-                        this Galaxy instance. Please make sure you understand the consequences.
-                    </b-alert>
-                    <b-alert show variant="warning" v-else>
-                        You can assign any number of roles to any of the following permission types. However please read
-                        carefully the implications of such actions.
-                    </b-alert>
-                </div>
-            </div>
+            <LibraryPermissionsWarning :is_admin="is_admin" />
             <hr class="my-4" />
             <b-container fluid>
                 <div class="dataset_table">
-                    <h2>Folder permissions</h2>
-                    <h4>
-                        Roles that can manage permissions on this folder
-                    </h4>
-                    <b-row>
-                        <b-col>
-                            <PermissionsInputField
-                                v-if="manage_folder_role_list"
-                                :folder_id="folder_id"
-                                :permission_type="manage_type"
-                                :initial_value="manage_folder_role_list"
-                                @input="setUserPermissionsPreferences"
-                        /></b-col>
-                        <b-col>
-                            <b-alert show variant="info">
-                                User with <strong>any</strong> of these roles can manage permissions on this folder.
-                            </b-alert>
-                        </b-col>
-                    </b-row>
-                    <h4>
-                        Roles that can add items to this folder
-                    </h4>
-                    <b-row>
-                        <b-col>
-                            <PermissionsInputField
-                                v-if="add_library_item_role_list"
-                                :folder_id="folder_id"
-                                :permission_type="add_type"
-                                :initial_value="add_library_item_role_list"
-                                @input="setUserPermissionsPreferences"
-                        /></b-col>
-                        <b-col>
-                            <b-alert class="p-3" show variant="info">
-                                User with <strong>any</strong> of these roles can add items to this folder (folders and
-                                datasets).
-                            </b-alert>
-                        </b-col>
-                    </b-row>
-                    <h4>
-                        Roles that can modify this folder
-                    </h4>
-                    <b-row>
-                        <b-col>
-                            <PermissionsInputField
-                                v-if="modify_folder_role_list"
-                                :folder_id="folder_id"
-                                :permission_type="modify_type"
-                                :initial_value="modify_folder_role_list"
-                                @input="setUserPermissionsPreferences"
-                        /></b-col>
-                        <b-col>
-                            <b-alert show variant="info">
-                                User with <strong>any</strong> of these roles can modify this folder (name, etc.).
-                            </b-alert></b-col
-                        >
-                    </b-row>
+                    <h2 class="text-center">Folder permissions</h2>
+                    <PermissionsInputField
+                        v-if="manage_folder_role_list"
+                        :id="folder_id"
+                        :permission_type="manage_type"
+                        :initial_value="manage_folder_role_list"
+                        :apiRootUrl="apiRootUrl"
+                        alert="User with <strong>any</strong> of these roles can manage permissions on this folder."
+                        title="Roles that can manage permissions on this folder"
+                        @input="setUserPermissionsPreferences"
+                    />
+
+                    <PermissionsInputField
+                        v-if="add_library_item_role_list"
+                        :id="folder_id"
+                        :permission_type="add_type"
+                        :initial_value="add_library_item_role_list"
+                        :apiRootUrl="apiRootUrl"
+                        title="Roles that can add items to this folder"
+                        alert="User with <strong>any</strong> of these roles can add items to this folder (folders and
+                                datasets)."
+                        @input="setUserPermissionsPreferences"
+                    />
+
+                    <PermissionsInputField
+                        v-if="modify_folder_role_list"
+                        :id="folder_id"
+                        :permission_type="modify_type"
+                        :initial_value="modify_folder_role_list"
+                        :apiRootUrl="apiRootUrl"
+                        title="Roles that can modify this folder"
+                        alert="User with <strong>any</strong> of these roles can modify this folder (name, etc.)."
+                        @input="setUserPermissionsPreferences"
+                    />
                     <button
                         data-toggle="tooltip"
                         data-placement="top"
@@ -106,12 +73,11 @@ import { Toast } from "ui/toast";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { getGalaxyInstance } from "app";
 import PermissionsInputField from "./PermissionsInputField.vue";
+import LibraryPermissionsWarning from "components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue";
+import { extractRoles } from "./utils";
+
 import { initManageFolderIcons } from "components/LibraryFolder/icons";
 
-import "vue-multiselect/dist/vue-multiselect.min.css";
-import VueObserveVisibility from "vue-observe-visibility";
-
-Vue.use(VueObserveVisibility);
 Vue.use(BootstrapVue);
 initManageFolderIcons();
 
@@ -124,6 +90,7 @@ export default {
     },
     components: {
         PermissionsInputField,
+        LibraryPermissionsWarning,
         FontAwesomeIcon,
     },
     data() {
@@ -137,6 +104,7 @@ export default {
             add_type: "add_type",
             manage_type: "manage_type",
             modify_type: "modify_type",
+            apiRootUrl: `${getAppRoot()}api/folders`,
         };
     },
     created() {
@@ -145,9 +113,9 @@ export default {
         this.services = new Services({ root: this.root });
         this.is_admin = Galaxy.user.attributes.is_admin;
         this.services.getFolderPermissions(this.folder_id).then((fetched_permissions) => {
-            this.add_library_item_role_list = this._serializeRoles(fetched_permissions.add_library_item_role_list);
-            this.manage_folder_role_list = this._serializeRoles(fetched_permissions.manage_folder_role_list);
-            this.modify_folder_role_list = this._serializeRoles(fetched_permissions.modify_folder_role_list);
+            this.add_library_item_role_list = extractRoles(fetched_permissions.add_library_item_role_list);
+            this.manage_folder_role_list = extractRoles(fetched_permissions.manage_folder_role_list);
+            this.modify_folder_role_list = extractRoles(fetched_permissions.modify_folder_role_list);
         });
         this.services.getFolder(this.folder_id).then((response) => {
             this.folder = response;
@@ -187,15 +155,6 @@ export default {
                 }
             );
         },
-
-        _serializeRoles: function (role_list) {
-            const selected_roles = [];
-            role_list.forEach((item) => {
-                selected_roles.push({ name: item[0], id: item[1] });
-            });
-
-            return selected_roles;
-        },
     },
 };
 </script>
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue
new file mode 100644
index 00000000000..1eb6b871ad3
--- /dev/null
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue
@@ -0,0 +1,25 @@
+<template>
+    <div>
+        <div class="text-center">
+            <b-alert show variant="warning" v-if="is_admin">
+                You are logged in as an <strong>administrator</strong> therefore you can manage any folder on
+                this Galaxy instance. Please make sure you understand the consequences.
+            </b-alert>
+            <b-alert show variant="warning" v-else>
+                You can assign any number of roles to any of the following permission types. However please read
+                carefully the implications of such actions.
+            </b-alert>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        props: {
+            is_admin: {
+                type: Boolean,
+                required: true,
+            },
+        },
+    }
+</script>
\ No newline at end of file
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue
index 3a889956ebc..f2dcfa8a9ff 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue
@@ -1,33 +1,56 @@
 <template>
-    <div v-if="options && value">
-        <multiselect
-            v-model="value"
-            :options="fetched_options"
-            :clear-on-select="true"
-            :preserve-search="true"
-            :multiple="true"
-            label="name"
-            track-by="id"
-            @input="valueChanged"
-            @search-change="searchChanged"
-            :internal-search="false"
-        >
-            <template slot="afterList">
-                <div v-observe-visibility="reachedEndOfList" v-if="hasMorePages">
-                    <span class="spinner fa fa-spinner fa-spin fa-1x" />
+    <div>
+        <h4>
+            {{ title }}
+        </h4>
+        <b-row>
+            <b-col>
+                <div v-if="options && value">
+                    <multiselect
+                        v-model="value"
+                        :options="fetched_options"
+                        :clear-on-select="true"
+                        :preserve-search="true"
+                        :multiple="true"
+                        label="name"
+                        track-by="id"
+                        @input="valueChanged"
+                        @search-change="searchChanged"
+                        :internal-search="false"
+                    >
+                        <template slot="afterList">
+                            <div v-observe-visibility="reachedEndOfList" v-if="hasMorePages">
+                                <span class="spinner fa fa-spinner fa-spin fa-1x" />
+                            </div>
+                        </template>
+                    </multiselect>
                 </div>
-            </template>
-        </multiselect>
+            </b-col>
+            <b-col>
+                <b-alert show variant="info">
+                    <div v-html="alert" />
+                </b-alert>
+            </b-col>
+        </b-row>
     </div>
 </template>
 
 <script>
+import Vue from "vue";
+
+import VueObserveVisibility from "vue-observe-visibility";
 import Multiselect from "vue-multiselect";
 import { Services } from "./services";
+import "vue-multiselect/dist/vue-multiselect.min.css";
 
+Vue.use(VueObserveVisibility);
 export default {
     props: {
-        folder_id: {
+        id: {
+            type: String,
+            required: true,
+        },
+        title: {
             type: String,
             required: true,
         },
@@ -39,6 +62,14 @@ export default {
             type: Array,
             required: true,
         },
+        apiRootUrl: {
+            type: String,
+            required: true,
+        },
+        alert: {
+            type: String,
+            required: true,
+        },
     },
     components: {
         Multiselect,
@@ -70,7 +101,7 @@ export default {
     methods: {
         getSelectOptions(searchChanged = false) {
             this.services
-                .getSelectOptions(this.folder_id, true, this.page, this.page_limit, this.searchValue)
+                .getSelectOptions(this.apiRootUrl, this.id, true, this.page, this.page_limit, this.searchValue)
                 .then((response) => {
                     this.options = response;
                     if (searchChanged) this.fetched_options = this.options.roles;
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
index a7781482066..478c6cd4db7 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
@@ -16,6 +16,24 @@ export class Services {
             rethrowSimple(e);
         }
     }
+    async getDatasetPermissions(id) {
+        const url = `${this.root}api/libraries/datasets/${id}/permissions?scope=current`;
+        try {
+            const response = await axios.get(url);
+            return response.data;
+        } catch (e) {
+            rethrowSimple(e);
+        }
+    }
+    async getDataset(id) {
+        const url = `${this.root}api/libraries/datasets/${id}`;
+        try {
+            const response = await axios.get(url);
+            return response.data;
+        } catch (e) {
+            rethrowSimple(e);
+        }
+    }
     async getFolder(id) {
         const url = `${this.root}api/folders/${id}`;
         try {
@@ -25,9 +43,9 @@ export class Services {
             rethrowSimple(e);
         }
     }
-    async getSelectOptions(id, is_library_access, page, page_limit, searchQuery) {
+    async getSelectOptions(apiRootUrl, id, is_library_access, page, page_limit, searchQuery) {
         searchQuery = searchQuery ? `&q=${searchQuery}` : "";
-        const url = `${this.root}api/folders/${id}/permissions?scope=available&is_library_access=${is_library_access}&page_limit=${page_limit}&page=${page}${searchQuery}`;
+        const url = `${apiRootUrl}/${id}/permissions?scope=available&is_library_access=${is_library_access}&page_limit=${page_limit}&page=${page}${searchQuery}`;
         try {
             const response = await axios.get(url);
             return response.data;
@@ -35,6 +53,7 @@ export class Services {
             rethrowSimple(e);
         }
     }
+
     async setPermissions(id, add_ids, manage_ids, modify_ids, onSuccess, onError) {
         var formData = new FormData();
         formData.append(
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/utils.js b/client/src/components/LibraryFolder/LibraryFolderPermissions/utils.js
new file mode 100644
index 00000000000..692c1db1b51
--- /dev/null
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/utils.js
@@ -0,0 +1,9 @@
+// legacy code
+export function extractRoles(role_list) {
+    const selected_roles = [];
+    role_list.forEach((item) => {
+        selected_roles.push({ name: item[0], id: item[1] });
+    });
+
+    return selected_roles;
+}
diff --git a/client/src/components/LibraryFolder/LibraryFolderRouter.vue b/client/src/components/LibraryFolder/LibraryFolderRouter.vue
index 7de34fcdf67..f3bd91063a2 100644
--- a/client/src/components/LibraryFolder/LibraryFolderRouter.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderRouter.vue
@@ -2,8 +2,9 @@
 import { getAppRoot } from "onload/loadConfig";
 import Vue from "vue";
 import VueRouter from "vue-router";
-import LibraryFolderPermissions from "./LibraryFolderPermissions/LibraryFolderPermissions.vue";
+import LibraryFolderPermissions from "components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue";
 import LibraryFolder from "components/LibraryFolder/LibraryFolder.vue";
+import LibraryFolderDatasetPermissions from "components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue";
 
 Vue.use(VueRouter);
 
@@ -23,6 +24,12 @@ export default new VueRouter({
             component: LibraryFolderPermissions,
             props: true,
         },
+        {
+            path: "/permissions/:folder_id/dataset/:dataset_id",
+            name: "LibraryFolder",
+            component: LibraryFolderDatasetPermissions,
+            props: true,
+        },
     ],
 });
 </script>
diff --git a/client/src/entry/analysis/AnalysisRouter.js b/client/src/entry/analysis/AnalysisRouter.js
index f38c044cdef..21e7e4430e0 100644
--- a/client/src/entry/analysis/AnalysisRouter.js
+++ b/client/src/entry/analysis/AnalysisRouter.js
@@ -101,6 +101,7 @@ export const getAnalysisRouter = (Galaxy) => {
             "(/)interactivetool_entry_points(/)list": "show_interactivetool_list",
             "(/)library/folders(/)(:folder_id)": "show_library_folder",
             "(/)library/folders/permissions(/)(:folder_id)": "show_library_folder",
+            "(/)library/folders/permissions(/)(:folder_id)(/)dataset(/)(:dataset_id)": "show_library_folder",
         },
 
         require_login: ["show_user", "show_user_form", "show_workflows", "show_cloud_auth", "show_external_ids"],
diff --git a/lib/galaxy/webapps/galaxy/buildapp.py b/lib/galaxy/webapps/galaxy/buildapp.py
index 6c63ce4e672..e57818d9b45 100644
--- a/lib/galaxy/webapps/galaxy/buildapp.py
+++ b/lib/galaxy/webapps/galaxy/buildapp.py
@@ -193,6 +193,7 @@ def app_pair(global_conf, load_app_kwds=None, wsgi_preflight=True, **kwargs):
     webapp.add_client_route('/interactivetool_entry_points/list')
     webapp.add_client_route('/library/folders/{folder_id}')
     webapp.add_client_route('/library/folders/permissions/{folder_id}')
+    webapp.add_client_route('/library/folders/permissions/{folder_id}/dataset/{dataset_id}')
 
     # ==== Done
     # Indicate that all configuration settings have been provided

From c4feeb61571d0536bae082180733396e1c474908 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Thu, 11 Feb 2021 18:14:48 +0100
Subject: [PATCH 2/9] working implementation

---
 .../LibraryFolderDatasetPermissions.vue       | 108 +++++++++++++-----
 .../LibraryFolderPermissions.vue              |  35 +++---
 .../LibraryFolderPermissions/services.js      |  22 ++--
 client/src/components/LibraryFolder/icons.js  |   4 +-
 4 files changed, 103 insertions(+), 66 deletions(-)

diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
index c5abd0db36b..b4fce4bb3dc 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
@@ -1,21 +1,51 @@
 <template>
     <div>
-        <div v-if="dataset">
-            <b-button variant="primary" :to="{ path: `/${this.folder_id}` }">
-                <font-awesome-icon icon="angle-double-left">1</font-awesome-icon>
-            </b-button>
-            <div>
-                <div class="header text-center">{{ dataset.name }}</div>
-            </div>
-        </div>
-        <LibraryPermissionsWarning :is_admin="is_admin" />
-        <hr class="my-4" />
         <b-container fluid>
+            <div v-if="dataset">
+                <b-breadcrumb>
+                    <b-breadcrumb-item title="Return to the list of libraries" :href="`${root}library/list`">
+                        Libraries
+                    </b-breadcrumb-item>
+                    <template v-for="path_item in this.dataset.full_path">
+                        <b-breadcrumb-item
+                            :key="path_item[0]"
+                            :to="{ path: `/${path_item[0]}` }"
+                            :active="path_item[0] === dataset_id"
+                            href="#"
+                            >{{ path_item[1] }}</b-breadcrumb-item
+                        >
+                    </template>
+                </b-breadcrumb>
+                <b-row>
+                    <b-col>
+                        <b-button
+                            data-toggle="tooltip"
+                            data-placement="top"
+                            title="Go to Dataset Details"
+                            variant="secondary"
+                            type="button"
+                            :href="`${root}library/list#folders/${folder_id}/datasets/${dataset_id}`"
+                        >
+                            <font-awesome-icon :icon="['far', 'file']" />
+                            &nbsp;Dataset Details
+                        </b-button>
+                    </b-col>
+                    <b-col>
+                        <div>
+                            <div class="header text-center">{{ dataset.name }}</div>
+                        </div>
+                    </b-col>
+                    <b-col />
+                </b-row>
+            </div>
+
+            <LibraryPermissionsWarning :is_admin="is_admin" />
+            <hr class="my-4" />
             <h2 class="text-center">Library-related permissions</h2>
             <PermissionsInputField
                 v-if="modify_item_roles"
                 :id="dataset_id"
-                :permission_type="manage_type"
+                :permission_type="modify_item_roles_type"
                 :initial_value="modify_item_roles"
                 title="Roles that can modify the library item"
                 :apiRootUrl="apiRootUrl"
@@ -31,7 +61,7 @@
             <PermissionsInputField
                 v-if="access_dataset_roles"
                 :id="dataset_id"
-                :permission_type="manage_type"
+                :permission_type="access_dataset_roles_type"
                 :initial_value="access_dataset_roles"
                 :apiRootUrl="apiRootUrl"
                 title="Roles that can access the dataset"
@@ -43,7 +73,7 @@
             <PermissionsInputField
                 v-if="manage_dataset_roles"
                 :id="dataset_id"
-                :permission_type="manage_type"
+                :permission_type="manage_dataset_roles_type"
                 :initial_value="manage_dataset_roles"
                 :apiRootUrl="apiRootUrl"
                 title="Roles that can manage permissions on the dataset"
@@ -51,6 +81,17 @@
                         If you remove yourself you will lose the ability manage this dataset unless you are an admin."
                 @input="setUserPermissionsPreferences"
             />
+            <b-button
+                data-toggle="tooltip"
+                data-placement="top"
+                title="Save modifications"
+                class="toolbtn_save_permissions"
+                variant="secondary"
+                @click="postPermissions"
+            >
+                <font-awesome-icon :icon="['far', 'save']" />
+                &nbsp;Save
+            </b-button>
         </b-container>
     </div>
 </template>
@@ -64,7 +105,7 @@ import { Toast } from "ui/toast";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { getGalaxyInstance } from "app";
 import PermissionsInputField from "./PermissionsInputField.vue";
-import { initManageFolderIcons } from "components/LibraryFolder/icons";
+import { initPermissionsIcons } from "components/LibraryFolder/icons";
 import LibraryPermissionsWarning from "components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue";
 import { extractRoles } from "./utils";
 
@@ -73,7 +114,7 @@ import VueObserveVisibility from "vue-observe-visibility";
 
 Vue.use(VueObserveVisibility);
 Vue.use(BootstrapVue);
-initManageFolderIcons();
+initPermissionsIcons();
 
 export default {
     props: {
@@ -99,9 +140,9 @@ export default {
             access_dataset_roles: undefined,
             modify_item_roles: undefined,
             manage_dataset_roles: undefined,
-            add_type: "add_type",
-            manage_type: "manage_type",
-            modify_type: "modify_type",
+            access_dataset_roles_type: "access_dataset_roles",
+            modify_item_roles_type: "modify_item_roles",
+            manage_dataset_roles_type: "manage_dataset_roles",
             apiRootUrl: `${getAppRoot()}api/libraries/datasets`,
         };
     },
@@ -125,17 +166,26 @@ export default {
             return `${this.root}library/folders/${this.folder_id}`;
         },
         setUserPermissionsPreferences(ids, permission_type) {
-            switch (permission_type) {
-                case "manage_type":
-                    this.manage_folder_role_list = ids;
-                    break;
-                case "add_type":
-                    this.add_library_item_role_list = ids;
-                    break;
-                case "modify_type":
-                    this.modify_folder_role_list = ids;
-                    break;
-            }
+            this[permission_type] = ids;
+        },
+        postPermissions() {
+            this.services.setPermissions(
+                this.apiRootUrl,
+                this.dataset_id,
+                [
+                    { "access_ids[]": this.access_dataset_roles },
+                    { "modify_ids[]": this.modify_item_roles },
+                    { "manage_ids[]": this.manage_dataset_roles },
+                ],
+                (fetched_permissions) => {
+                    Toast.success("Permissions saved.");
+                    this.permissions = fetched_permissions;
+                },
+                (error) => {
+                    Toast.error("An error occurred while attempting to set folder permissions.");
+                    console.error(error);
+                }
+            );
         },
     },
 };
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue
index 8f1340681e2..7e6b3d6871a 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderPermissions.vue
@@ -2,8 +2,8 @@
     <div>
         <div>
             <div v-if="folder">
-                <b-button variant="primary" :to="{ path: `/${this.folder.parent_id}` }">
-                    <font-awesome-icon icon="angle-double-left">1</font-awesome-icon>
+                <b-button variant="primary" title="back to parent folder" :to="{ path: `/${this.folder.parent_id}` }">
+                    <font-awesome-icon icon="angle-double-left" />
                 </b-button>
                 <div>
                     <div class="header text-center">{{ folder.name }}</div>
@@ -76,10 +76,10 @@ import PermissionsInputField from "./PermissionsInputField.vue";
 import LibraryPermissionsWarning from "components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue";
 import { extractRoles } from "./utils";
 
-import { initManageFolderIcons } from "components/LibraryFolder/icons";
+import { initPermissionsIcons } from "components/LibraryFolder/icons";
 
 Vue.use(BootstrapVue);
-initManageFolderIcons();
+initPermissionsIcons();
 
 export default {
     props: {
@@ -101,9 +101,9 @@ export default {
             add_library_item_role_list: undefined,
             modify_folder_role_list: undefined,
             manage_folder_role_list: undefined,
-            add_type: "add_type",
-            manage_type: "manage_type",
-            modify_type: "modify_type",
+            add_type: "add_library_item_role_list",
+            manage_type: "manage_folder_role_list",
+            modify_type: "modify_folder_role_list",
             apiRootUrl: `${getAppRoot()}api/folders`,
         };
     },
@@ -127,24 +127,17 @@ export default {
             return `${this.root}library/folders/${this.folder.parent_id}`;
         },
         setUserPermissionsPreferences(ids, permission_type) {
-            switch (permission_type) {
-                case "manage_type":
-                    this.manage_folder_role_list = ids;
-                    break;
-                case "add_type":
-                    this.add_library_item_role_list = ids;
-                    break;
-                case "modify_type":
-                    this.modify_folder_role_list = ids;
-                    break;
-            }
+            this[permission_type] = ids;
         },
         postPermissions() {
             this.services.setPermissions(
+                this.apiRootUrl,
                 this.folder_id,
-                this.add_library_item_role_list,
-                this.manage_folder_role_list,
-                this.modify_folder_role_list,
+                [
+                    { "add_ids[]": this.add_library_item_role_list },
+                    { "manage_ids[]": this.manage_folder_role_list },
+                    { "modify_ids[]": this.modify_folder_role_list },
+                ],
                 (fetched_permissions) => {
                     Toast.success("Permissions saved.");
                     this.permissions = fetched_permissions;
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
index 478c6cd4db7..30cdf881d22 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
@@ -54,24 +54,18 @@ export class Services {
         }
     }
 
-    async setPermissions(id, add_ids, manage_ids, modify_ids, onSuccess, onError) {
+    async setPermissions(apiRootUrl, id, new_roles_ids, onSuccess, onError) {
         var formData = new FormData();
-        formData.append(
-            "add_ids[]",
-            add_ids.map((a) => a.id)
-        );
-        formData.append(
-            "manage_ids[]",
-            manage_ids.map((a) => a.id)
-        );
-        formData.append(
-            "modify_ids[]",
-            modify_ids.map((a) => a.id)
-        );
+        new_roles_ids.forEach((permissionType) => {
+            Object.keys(permissionType).map(function (k) {
+                const ids = permissionType[k].map((a) => a.id);
+                formData.append(k, ids);
+            });
+        });
 
         axios({
             method: "post",
-            url: `${getAppRoot()}api/folders/${id}/permissions?action=set_permissions`,
+            url: `${apiRootUrl}/${id}/permissions?action=set_permissions`,
             data: formData,
             headers: { "Content-Type": "multipart/form-data" },
         })
diff --git a/client/src/components/LibraryFolder/icons.js b/client/src/components/LibraryFolder/icons.js
index 3255459ffe5..5e4b08504d8 100644
--- a/client/src/components/LibraryFolder/icons.js
+++ b/client/src/components/LibraryFolder/icons.js
@@ -38,7 +38,7 @@ const tableIcons = [
     faMinusSquare,
 ];
 
-const manageIcons = [faAngleDoubleLeft, faSave];
+const manageIcons = [faAngleDoubleLeft, faSave, faFile];
 const topBarIcons = [faHome, faPlus, faInfoCircle, faTrash, faDownload, faBook];
 
 export function initFolderTableIcons() {
@@ -47,7 +47,7 @@ export function initFolderTableIcons() {
     });
 }
 
-export function initManageFolderIcons() {
+export function initPermissionsIcons() {
     manageIcons.forEach((icon) => {
         library.add(icon);
     });

From bc1659128ed3c0baba6bd3e37183cfc59433b475 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Thu, 11 Feb 2021 19:16:15 +0100
Subject: [PATCH 3/9] makeDatasetPrivate

---
 .../LibraryFolderDatasetPermissions.vue       | 34 ++++++++++++++++++-
 .../LibraryFolderPermissions/services.js      | 10 ++++++
 2 files changed, 43 insertions(+), 1 deletion(-)

diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
index b4fce4bb3dc..ebe78365d38 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
@@ -58,6 +58,21 @@
                 Changes made below will affect <strong>every</strong> library item that was created from this dataset
                 and also every history this dataset is part of.
             </div>
+            <p class="text-center" v-if="is_unrestricted">
+                You can
+                <strong class="remove-restrictions">
+                    <a href="javascript:void(0)">remove all access restrictions</a></strong
+                >
+                on this dataset.
+            </p>
+            <p class="text-center" v-else>
+                You can
+                <strong @click="makeDatasetPrivate()" class="make-private">
+                    <a href="javascript:void(0)">make this dataset private</a></strong
+                >
+                to you.
+            </p>
+
             <PermissionsInputField
                 v-if="access_dataset_roles"
                 :id="dataset_id"
@@ -160,8 +175,25 @@ export default {
             this.dataset = response;
         });
     },
-
+    computed: {
+        is_unrestricted() {
+            return this.access_dataset_roles ? this.access_dataset_roles.length === 0 : false;
+        },
+    },
     methods: {
+        makeDatasetPrivate() {
+            this.services.makeDatasetPrivate(
+                this.dataset_id,
+                (fetched_permissions) => {
+                    Toast.success("Permissions saved.");
+                    this.permissions = fetched_permissions;
+                },
+                (error) => {
+                    Toast.error("An error occurred while attempting to set folder permissions.");
+                    console.error(error);
+                }
+            );
+        },
         getParentLink() {
             return `${this.root}library/folders/${this.folder_id}`;
         },
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
index 30cdf881d22..a173b3fc4a4 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
@@ -76,4 +76,14 @@ export class Services {
                 onError(response);
             });
     }
+    async makeDatasetPrivate(id, onSuccess, onError) {
+        await axios
+            .get(`${getAppRoot()}api/libraries/datasets/${id}/permissions?action=make_private`)
+            .then((fetched_permissions) => {
+                onSuccess(fetched_permissions);
+            })
+            .catch((response) => {
+                onError(response);
+            });
+    }
 }

From 7eeba235b292b40b94d6518c0ef69271ec2b5377 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Fri, 12 Feb 2021 17:20:59 +0100
Subject: [PATCH 4/9] implement permissions toggle

---
 .../LibraryFolderDatasetPermissions.vue       | 49 ++++++++++++-------
 .../PermissionsInputField.vue                 |  5 +-
 .../LibraryFolderPermissions/services.js      | 11 +++--
 3 files changed, 43 insertions(+), 22 deletions(-)

diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
index ebe78365d38..c7f5b2050d8 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryFolderDatasetPermissions.vue
@@ -60,20 +60,21 @@
             </div>
             <p class="text-center" v-if="is_unrestricted">
                 You can
-                <strong class="remove-restrictions">
-                    <a href="javascript:void(0)">remove all access restrictions</a></strong
-                >
-                on this dataset.
+                <strong @click="toggleDatasetPrivacy(true)" class="make-private">
+                    <a href="javascript:void(0)">make this dataset private</a>
+                </strong>
+                to you.
             </p>
             <p class="text-center" v-else>
                 You can
-                <strong @click="makeDatasetPrivate()" class="make-private">
-                    <a href="javascript:void(0)">make this dataset private</a></strong
-                >
-                to you.
+                <strong @click="toggleDatasetPrivacy(false)" class="remove-restrictions">
+                    <a href="javascript:void(0)">remove all access restrictions</a>
+                </strong>
+                on this dataset.
             </p>
 
             <PermissionsInputField
+                ref="access_field"
                 v-if="access_dataset_roles"
                 :id="dataset_id"
                 :permission_type="access_dataset_roles_type"
@@ -166,11 +167,9 @@ export default {
         this.root = getAppRoot();
         this.services = new Services({ root: this.root });
         this.is_admin = Galaxy.user.attributes.is_admin;
-        this.services.getDatasetPermissions(this.dataset_id).then((fetched_permissions) => {
-            this.access_dataset_roles = extractRoles(fetched_permissions.access_dataset_roles);
-            this.modify_item_roles = extractRoles(fetched_permissions.modify_item_roles);
-            this.manage_dataset_roles = extractRoles(fetched_permissions.manage_dataset_roles);
-        });
+        this.services
+            .getDatasetPermissions(this.dataset_id)
+            .then((fetched_permissions) => this.assignFetchedPermissions(fetched_permissions));
         this.services.getDataset(this.dataset_id).then((response) => {
             this.dataset = response;
         });
@@ -181,12 +180,26 @@ export default {
         },
     },
     methods: {
-        makeDatasetPrivate() {
-            this.services.makeDatasetPrivate(
+        assignFetchedPermissions(fetched_permissions) {
+            this.access_dataset_roles = extractRoles(fetched_permissions.access_dataset_roles);
+            this.modify_item_roles = extractRoles(fetched_permissions.modify_item_roles);
+            this.manage_dataset_roles = extractRoles(fetched_permissions.manage_dataset_roles);
+            console.log(this.access_dataset_roles);
+        },
+        toggleDatasetPrivacy(isMakePrivate) {
+            this.services.toggleDatasetPrivacy(
                 this.dataset_id,
+                isMakePrivate,
                 (fetched_permissions) => {
-                    Toast.success("Permissions saved.");
-                    this.permissions = fetched_permissions;
+                    Toast.success(
+                        `${
+                            isMakePrivate
+                                ? "The dataset is now private to you."
+                                : "Access to this dataset is now unrestricted."
+                        }`
+                    );
+                    this.assignFetchedPermissions(fetched_permissions);
+                    this.$refs.access_field.assignValue(this.access_dataset_roles);
                 },
                 (error) => {
                     Toast.error("An error occurred while attempting to set folder permissions.");
@@ -211,7 +224,7 @@ export default {
                 ],
                 (fetched_permissions) => {
                     Toast.success("Permissions saved.");
-                    this.permissions = fetched_permissions;
+                    this.assignFetchedPermissions(fetched_permissions);
                 },
                 (error) => {
                     Toast.error("An error occurred while attempting to set folder permissions.");
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue
index f2dcfa8a9ff..c5125c8061d 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/PermissionsInputField.vue
@@ -90,7 +90,7 @@ export default {
     created() {
         this.services = new Services({ root: this.root });
         // Avoid mutating a prop directly
-        this.value = this.initial_value;
+        this.assignValue(this.initial_value);
         this.getSelectOptions();
     },
     computed: {
@@ -122,6 +122,9 @@ export default {
             this.searchValue = searchValue;
             this.getSelectOptions(true);
         },
+        assignValue(value) {
+            this.value = value;
+        },
     },
 };
 </script>
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
index a173b3fc4a4..98659dd7935 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
@@ -1,6 +1,7 @@
 import axios from "axios";
 import { rethrowSimple } from "utils/simple-error";
 import { getAppRoot } from "onload/loadConfig";
+import $ from "jquery";
 
 export class Services {
     constructor(options = {}) {
@@ -76,11 +77,15 @@ export class Services {
                 onError(response);
             });
     }
-    async makeDatasetPrivate(id, onSuccess, onError) {
+    async toggleDatasetPrivacy(id, isMakePrivate, onSuccess, onError) {
         await axios
-            .get(`${getAppRoot()}api/libraries/datasets/${id}/permissions?action=make_private`)
+            .post(
+                `${getAppRoot()}api/libraries/datasets/${id}/permissions?action=${
+                    isMakePrivate ? "make_private" : "remove_restrictions"
+                }`
+            )
             .then((fetched_permissions) => {
-                onSuccess(fetched_permissions);
+                onSuccess(fetched_permissions.data);
             })
             .catch((response) => {
                 onError(response);

From c80360e8a15a9c0df14a23b492d3109eac94207a Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Fri, 12 Feb 2021 17:21:21 +0100
Subject: [PATCH 5/9] remove jquery from services

---
 .../LibraryFolder/LibraryFolderPermissions/services.js           | 1 -
 1 file changed, 1 deletion(-)

diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
index 98659dd7935..89700478c55 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/services.js
@@ -1,7 +1,6 @@
 import axios from "axios";
 import { rethrowSimple } from "utils/simple-error";
 import { getAppRoot } from "onload/loadConfig";
-import $ from "jquery";
 
 export class Services {
     constructor(options = {}) {

From c39e22f128e69b916e5b79b6265608e8777ec215 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Fri, 12 Feb 2021 17:50:37 +0100
Subject: [PATCH 6/9] prettier

---
 .../LibraryFolder/LibraryFolder.vue           |  3 ++-
 .../LibraryPermissionsWarning.vue             | 20 +++++++++----------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/client/src/components/LibraryFolder/LibraryFolder.vue b/client/src/components/LibraryFolder/LibraryFolder.vue
index 432402730e7..8366cf38b92 100644
--- a/client/src/components/LibraryFolder/LibraryFolder.vue
+++ b/client/src/components/LibraryFolder/LibraryFolder.vue
@@ -461,7 +461,8 @@ export default {
             else if (element.type === "folder") return `${this.root}library/folders/${element.id}`;
         },
         navigateToPermission(element) {
-            if (element.type === "file") this.$router.push({ path: `/permissions/${this.folder_id}/dataset/${element.id}` })
+            if (element.type === "file")
+                this.$router.push({ path: `/permissions/${this.folder_id}/dataset/${element.id}` });
             else if (element.type === "folder") this.$router.push({ path: `/permissions/${element.id}` });
         },
         getMessage(element) {
diff --git a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue
index 1eb6b871ad3..c3f10670bfa 100644
--- a/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue
+++ b/client/src/components/LibraryFolder/LibraryFolderPermissions/LibraryPermissionsWarning.vue
@@ -2,8 +2,8 @@
     <div>
         <div class="text-center">
             <b-alert show variant="warning" v-if="is_admin">
-                You are logged in as an <strong>administrator</strong> therefore you can manage any folder on
-                this Galaxy instance. Please make sure you understand the consequences.
+                You are logged in as an <strong>administrator</strong> therefore you can manage any folder on this
+                Galaxy instance. Please make sure you understand the consequences.
             </b-alert>
             <b-alert show variant="warning" v-else>
                 You can assign any number of roles to any of the following permission types. However please read
@@ -14,12 +14,12 @@
 </template>
 
 <script>
-    export default {
-        props: {
-            is_admin: {
-                type: Boolean,
-                required: true,
-            },
+export default {
+    props: {
+        is_admin: {
+            type: Boolean,
+            required: true,
         },
-    }
-</script>
\ No newline at end of file
+    },
+};
+</script>

From fab7116c5265e204b7a88c2e40eadc6632838067 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Mon, 15 Feb 2021 14:23:20 +0200
Subject: [PATCH 7/9] delete legacy code

---
 .../src/mvc/library/library-dataset-view.js   | 259 ------------------
 1 file changed, 259 deletions(-)

diff --git a/client/src/mvc/library/library-dataset-view.js b/client/src/mvc/library/library-dataset-view.js
index a2a4b84c1a4..7d8078c1f76 100644
--- a/client/src/mvc/library/library-dataset-view.js
+++ b/client/src/mvc/library/library-dataset-view.js
@@ -27,9 +27,6 @@ var LibraryDatasetView = Backbone.View.extend({
         "click .toolbtn-download-dataset": "downloadDataset",
         "click .toolbtn-import-dataset": "importIntoHistory",
         "click .copy-link-to-clipboard": "copyToClipboard",
-        "click .make-private": "makeDatasetPrivate",
-        "click .remove-restrictions": "removeDatasetRestrictions",
-        "click .toolbtn_save_permissions": "savePermissions",
         "click .toolbtn_save_modifications": "saveModifications",
         "click .toolbtn_detect_datatype": "detectDatatype",
     },
@@ -298,40 +295,6 @@ var LibraryDatasetView = Backbone.View.extend({
         );
     },
 
-    showPermissions: function (options) {
-        const Galaxy = getGalaxyInstance();
-        var template = this.templateDatasetPermissions();
-        var self = this;
-        this.options = _.extend(this.options, options);
-        $(".tooltip").remove();
-        if (this.options.fetched_permissions !== undefined) {
-            if (this.options.fetched_permissions.access_dataset_roles.length === 0) {
-                this.model.set({ is_unrestricted: true });
-            } else {
-                this.model.set({ is_unrestricted: false });
-            }
-        }
-        this.$el.html(
-            template({
-                item: this.model,
-                is_admin: Galaxy.config.is_admin_user,
-                rootPath: getAppRoot(),
-            })
-        );
-        $.get(`${getAppRoot()}api/libraries/datasets/${self.id}/permissions?scope=current`)
-            .done((fetched_permissions) => {
-                self.prepareSelectBoxes({
-                    fetched_permissions: fetched_permissions,
-                    is_admin: Galaxy.config.is_admin_user,
-                });
-            })
-            .fail(() => {
-                Toast.error("An error occurred while attempting to fetch dataset permissions.");
-            });
-        $('#center [data-toggle="tooltip"]').tooltip({ trigger: "hover" });
-        $("#center").css("overflow", "auto");
-    },
-
     _serializeRoles: function (role_list) {
         var selected_roles = [];
         for (var i = 0; i < role_list.length; i++) {
@@ -341,79 +304,6 @@ var LibraryDatasetView = Backbone.View.extend({
         return selected_roles;
     },
 
-    prepareSelectBoxes: function (options) {
-        this.options = _.extend(this.options, options);
-        this.accessSelectObject = new mod_select.View(
-            this._generate_select_options({
-                selector: "access_perm",
-                initialData: this._serializeRoles(this.options.fetched_permissions.access_dataset_roles),
-            })
-        );
-        this.modifySelectObject = new mod_select.View(
-            this._generate_select_options({
-                selector: "modify_perm",
-                initialData: this._serializeRoles(this.options.fetched_permissions.modify_item_roles),
-            })
-        );
-        this.manageSelectObject = new mod_select.View(
-            this._generate_select_options({
-                selector: "manage_perm",
-                initialData: this._serializeRoles(this.options.fetched_permissions.manage_dataset_roles),
-            })
-        );
-    },
-
-    _generate_select_options: function (options) {
-        var select_options = {
-            minimumInputLength: 0,
-            multiple: true,
-            placeholder: "Click to select a role",
-            formatResult: function roleFormatResult(role) {
-                return `${role.name} type: ${role.type}`;
-            },
-            formatSelection: function roleFormatSelection(role) {
-                return role.name;
-            },
-            initSelection: function (element, callback) {
-                // the input tag has a value attribute preloaded that points to a preselected role's id
-                // this function resolves that id attribute to an object that select2 can render
-                // using its formatResult renderer - that way the role name is shown preselected
-                var data = [];
-                $(element.val().split(",")).each(function () {
-                    var item = this.split(":");
-                    data.push({
-                        id: item[0],
-                        name: item[1],
-                    });
-                });
-                callback(data);
-            },
-            dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
-        };
-        select_options.container = this.$el.find(`#${options.selector}`);
-        select_options.css = options.selector;
-        select_options.initialData = options.initialData.join(",");
-        select_options.ajax = {
-            url: `${getAppRoot()}api/libraries/datasets/${this.id}/permissions?scope=available`,
-            dataType: "json",
-            quietMillis: 100,
-            data: function (term, page) {
-                // page is the one-based page number tracked by Select2
-                return {
-                    q: term, //search term
-                    page_limit: 10, // page size, should be same as used in 'more' variable below
-                    page: page, // page number
-                };
-            },
-            results: function (data, page) {
-                var more = page * 10 < data.total; // whether or not there are more results available
-                // notice we return the value of more so Select2 knows if more results can be loaded
-                return { results: data.roles, more: more };
-            },
-        };
-        return select_options;
-    },
-
     detectDatatype: function (options) {
         const ld = this.model;
         ld.set("file_ext", "auto");
@@ -490,36 +380,6 @@ var LibraryDatasetView = Backbone.View.extend({
         window.prompt("Copy to clipboard: Ctrl+C, Enter", href);
     },
 
-    makeDatasetPrivate: function () {
-        var self = this;
-        $.post(`${getAppRoot()}api/libraries/datasets/${self.id}/permissions?action=make_private`)
-            .done((fetched_permissions) => {
-                self.model.set({ is_unrestricted: false });
-                self.showPermissions({
-                    fetched_permissions: fetched_permissions,
-                });
-                Toast.success("The dataset is now private to you.");
-            })
-            .fail(() => {
-                Toast.error("An error occurred while attempting to make dataset private.");
-            });
-    },
-
-    removeDatasetRestrictions: function () {
-        var self = this;
-        $.post(`${getAppRoot()}api/libraries/datasets/${self.id}/permissions?action=remove_restrictions`)
-            .done((fetched_permissions) => {
-                self.model.set({ is_unrestricted: true });
-                self.showPermissions({
-                    fetched_permissions: fetched_permissions,
-                });
-                Toast.success("Access to this dataset is now unrestricted.");
-            })
-            .fail(() => {
-                Toast.error("An error occurred while attempting to make dataset unrestricted.");
-            });
-    },
-
     /**
      * Extract the role ids from Select2 elements's 'data'
      */
@@ -531,30 +391,6 @@ var LibraryDatasetView = Backbone.View.extend({
         return ids_list;
     },
 
-    /**
-     * Save the permissions for roles entered in the select boxes.
-     */
-    savePermissions: function (event) {
-        var self = this;
-        var access_ids = this._extractIds(this.accessSelectObject.$el.select2("data"));
-        var manage_ids = this._extractIds(this.manageSelectObject.$el.select2("data"));
-        var modify_ids = this._extractIds(this.modifySelectObject.$el.select2("data"));
-        $.post(`${getAppRoot()}api/libraries/datasets/${self.id}/permissions?action=set_permissions`, {
-            "access_ids[]": access_ids,
-            "manage_ids[]": manage_ids,
-            "modify_ids[]": modify_ids,
-        })
-            .done((fetched_permissions) => {
-                self.showPermissions({
-                    fetched_permissions: fetched_permissions,
-                });
-                Toast.success("Permissions saved.");
-            })
-            .fail(() => {
-                Toast.error("An error occurred while attempting to set dataset permissions.");
-            });
-    },
-
     /**
      * If needed request all extensions and/or genomes from Galaxy
      * and save them in sorted arrays.
@@ -1110,101 +946,6 @@ var LibraryDatasetView = Backbone.View.extend({
             </div>`
         );
     },
-
-    templateDatasetPermissions: function () {
-        return _.template(
-            `<!-- CONTAINER START -->
-            <div class="library_style_container">
-                <div class="d-flex mb-2">
-                    <a href="#folders/<%- item.get("folder_id") %>/datasets/<%- item.id %>">
-                        <button data-toggle="tooltip" data-placement="top" title="Go back to dataset"
-                            class="btn btn-secondary toolbar-item mr-1" type="button">
-                            <span class="fa fa-file-o"></span>
-                            &nbsp;Dataset Details
-                        </button>
-                    </a>
-                </div>
-
-                <!-- BREADCRUMBS -->
-                <ol class="breadcrumb">
-                    <li class="breadcrumb-item">
-                        <a title="Return to the list of libraries" href="#">Libraries</a>
-                    </li>
-                    <% _.each(item.get("full_path"), function(path_item) { %>
-                        <% if (path_item[0] != item.id) { %>
-                            <li class="breadcrumb-item">
-                                <a title="Return to this folder" href="<% rootPath %>folders/<%- path_item[0] %>">
-                                    <%- path_item[1] %>
-                                </a>
-                            </li>
-                        <% } else { %>
-                            <li class="breadcrumb-item active">
-                                <span title="You are here">
-                                    <%- path_item[1] %>
-                                </span>
-                            </li>
-                        <% } %>
-                    <% }); %>
-                </ol>
-
-                <h1>Dataset: <%= _.escape(item.get("name")) %></h1>
-                <div class="alert alert-warning">
-                    <% if (is_admin) { %>
-                        You are logged in as an <strong>administrator</strong> therefore you can manage any dataset
-                        on this Galaxy instance. Please make sure you understand the consequences.
-                    <% } else { %>
-                        You can assign any number of roles to any of the following permission types. However please
-                        read carefully the implications of such actions.
-                    <% } %>
-                </div>
-                <div class="dataset_table">
-                    <h2>Library-related permissions</h2>
-                    <h4>Roles that can modify the library item</h4>
-                    <div id="modify_perm" class="modify_perm roles-selection"></div>
-                    <div class="alert alert-info roles-selection">
-                        User with <strong>any</strong> of these roles can modify name, metadata,
-                        and other information about this library item.
-                    </div>
-                    <hr/>
-                    <h2>Dataset-related permissions</h2>
-                    <div class="alert alert-warning">
-                        Changes made below will affect <strong>every</strong> library item that was created from
-                        this dataset and also every history this dataset is part of.
-                    </div>
-                    <% if (!item.get("is_unrestricted")) { %>
-                        <p>
-                            You can <span class="remove-restrictions">
-                            <a href="javascript:void(0)">remove all access restrictions</a></span> on this dataset.
-                        </p>
-                    <% } else { %>
-                        <p>
-                            You can <span class="make-private">
-                            <a href="javascript:void(0)">make this dataset private</a></span> to you.</p>
-                    <% } %>
-                    <h4>Roles that can access the dataset</h4>
-                    <div id="access_perm" class="access_perm roles-selection"></div>
-                    <div class="alert alert-info roles-selection">
-                        User has to have <strong>all these roles</strong> in order to access this dataset.
-                        Users without access permission <strong>cannot</strong> have other permissions on this dataset.
-                        If there are no access roles set on the dataset it is considered <strong>unrestricted</strong>.
-                    </div>
-                    <h4>Roles that can manage permissions on the dataset</h4>
-                    <div id="manage_perm" class="manage_perm roles-selection"></div>
-                    <div class="alert alert-info roles-selection">
-                        User with <strong>any</strong> of these roles can manage permissions of this dataset.
-                        If you remove yourself you will lose the ability manage this dataset unless you are an admin.
-                    </div>
-                    <button data-toggle="tooltip" data-placement="top" title="Save modifications made on this page"
-                        class="btn btn-secondary toolbtn_save_permissions type="button">
-                        <span class="fa fa-floppy-o"></span>
-                        &nbsp;Save
-                    </button>
-                </div>
-            <!-- CONTAINER END -->
-            </div>`
-        );
-    },
-
     templateBulkImportInModal: function () {
         return _.template(
             `<div>

From 18fb62508b394b5da0834487a1940c7b4f4bcc69 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Mon, 15 Feb 2021 14:37:19 +0200
Subject: [PATCH 8/9] fix permissions button in dataset details view

---
 client/src/mvc/library/library-dataset-view.js | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/client/src/mvc/library/library-dataset-view.js b/client/src/mvc/library/library-dataset-view.js
index 7d8078c1f76..f0ba308722d 100644
--- a/client/src/mvc/library/library-dataset-view.js
+++ b/client/src/mvc/library/library-dataset-view.js
@@ -73,9 +73,7 @@ var LibraryDatasetView = Backbone.View.extend({
         var self = this;
         this.model.fetch({
             success: function () {
-                if (self.options.show_permissions) {
-                    self.showPermissions();
-                } else if (self.options.show_version) {
+                if (self.options.show_version) {
                     self.fetchVersion();
                 } else {
                     self.render();
@@ -489,7 +487,7 @@ var LibraryDatasetView = Backbone.View.extend({
                         </button>
                     <% } %>
                     <% if (item.get("can_user_manage")) { %>
-                        <a href="#folders/<%- item.get("folder_id") %>/datasets/<%- item.id %>/permissions">
+                        <a href="<% rootPath %>/library/folders/permissions/<%- item.get("folder_id") %>/dataset/<%- item.id %>">
                             <button data-toggle="tooltip" data-placement="top" title="Manage permissions"
                                 class="btn btn-secondary toolbtn_change_permissions toolbar-item mr-1"
                                 type="button">

From 9bc56539b1da294bb37dc7dca438b7727382e2f3 Mon Sep 17 00:00:00 2001
From: Oleg Zharkov <oleg.zharkov22@gmail.com>
Date: Mon, 15 Feb 2021 14:40:32 +0200
Subject: [PATCH 9/9] another little legacy code removal

---
 client/src/mvc/library/library-dataset-view.js | 9 ---------
 1 file changed, 9 deletions(-)

diff --git a/client/src/mvc/library/library-dataset-view.js b/client/src/mvc/library/library-dataset-view.js
index f0ba308722d..6d4aa0f09d1 100644
--- a/client/src/mvc/library/library-dataset-view.js
+++ b/client/src/mvc/library/library-dataset-view.js
@@ -293,15 +293,6 @@ var LibraryDatasetView = Backbone.View.extend({
         );
     },
 
-    _serializeRoles: function (role_list) {
-        var selected_roles = [];
-        for (var i = 0; i < role_list.length; i++) {
-            // Replace the : and , in role's name since these are select2 separators for initialData
-            selected_roles.push(`${role_list[i][1]}:${role_list[i][0].replace(":", " ").replace(",", " &")}`);
-        }
-        return selected_roles;
-    },
-
     detectDatatype: function (options) {
         const ld = this.model;
         ld.set("file_ext", "auto");