Merge pull request #14419 from ElectronicBlueberry/logged-out-users

Present unavailable options to logged-out users

client/src/components/History/CurrentHistory/HistoryNavigation.vue

@@ -31,7 +31,6 @@
                     size="sm"
                     variant="link"
                     toggle-class="text-decoration-none"
-                    title="Show history options"
                     menu-class="history-options-button-menu"
                     data-description="history options">
                     <b-dropdown-text>
@@ -43,84 +42,101 @@
                     </b-dropdown-text>
 
                     <b-dropdown-item
-                        v-if="!currentUser.isAnonymous"
                         data-description="switch to multi history view"
+                        :disabled="currentUser.isAnonymous"
+                        :title="userTitle('Open History Multiview')"
                         @click="redirect('/history/view_multiple')">
                         <Icon fixed-width class="mr-1" icon="columns" />
                         <span v-localize>Show Histories Side-by-Side</span>
                     </b-dropdown-item>
 
                     <b-dropdown-divider></b-dropdown-divider>
 
-                    <b-dropdown-item v-if="!currentUser.isAnonymous" v-b-modal:copy-history-modal>
+                    <b-dropdown-item
+                        :title="l('Resume all Paused Jobs in this History')"
+                        @click="iframeRedirect('/history/resume_paused_jobs?current=True')">
+                        <Icon fixed-width icon="play" class="mr-1" />
+                        <span v-localize>Resume Paused Jobs</span>
+                    </b-dropdown-item>
+
+                    <b-dropdown-item
+                        data-description="show structure"
+                        :title="l('Show Detailed Structure View of History')"
+                        @click="$router.push('/histories/show_structure')">
+                        <Icon fixed-width icon="code-branch" class="mr-1" />
+                        <span v-localize>Show Structure</span>
+                    </b-dropdown-item>
+
+                    <b-dropdown-divider></b-dropdown-divider>
+
+                    <b-dropdown-item
+                        v-b-modal:copy-history-modal
+                        :disabled="currentUser.isAnonymous"
+                        :title="userTitle('Copy History to a New History')">
                         <Icon fixed-width icon="copy" class="mr-1" />
                         <span v-localize>Copy this History</span>
                     </b-dropdown-item>
 
-                    <b-dropdown-item v-b-modal:delete-history-modal>
+                    <b-dropdown-item v-b-modal:delete-history-modal :title="l('Permanently Delete History')">
                         <Icon fixed-width icon="trash" class="mr-1" />
                         <span v-localize>Delete this History</span>
                     </b-dropdown-item>
 
-                    <b-dropdown-divider></b-dropdown-divider>
+                    <b-dropdown-item
+                        :title="l('Export Citations for all Tools used in this History')"
+                        @click="$router.push(`/histories/citations?id=${history.id}`)">
+                        <Icon fixed-width icon="stream" class="mr-1" />
+                        <span v-localize>Export Tool Citations</span>
+                    </b-dropdown-item>
 
-                    <b-dropdown-item @click="iframeRedirect('/history/resume_paused_jobs?current=True')">
-                        <Icon fixed-width icon="play" class="mr-1" />
-                        <span v-localize>Resume Paused Jobs</span>
+                    <b-dropdown-item
+                        data-description="export to file"
+                        :title="l('Export and Download History as a File')"
+                        @click="$router.push(`/histories/${history.id}/export`)">
+                        <Icon fixed-width icon="file-archive" class="mr-1" />
+                        <span v-localize>Export History to File</span>
                     </b-dropdown-item>
 
                     <b-dropdown-item
-                        v-if="!currentUser.isAnonymous"
+                        :disabled="currentUser.isAnonymous"
+                        :title="userTitle('Convert History to Workflow')"
                         @click="iframeRedirect('/workflow/build_from_current_history')">
                         <Icon fixed-width icon="file-export" class="mr-1" />
                         <span v-localize>Extract Workflow</span>
                     </b-dropdown-item>
 
+                    <b-dropdown-divider></b-dropdown-divider>
+
                     <b-dropdown-item
-                        data-description="show structure"
-                        @click="$router.push('/histories/show_structure')">
-                        <Icon fixed-width icon="code-branch" class="mr-1" />
-                        <span v-localize>Show Structure</span>
+                        :disabled="currentUser.isAnonymous"
+                        :title="userTitle('Share or Publish this History')"
+                        data-description="share or publish"
+                        @click="$router.push(`/histories/sharing?id=${history.id}`)">
+                        <Icon fixed-width icon="share-alt" class="mr-1" />
+                        <span v-localize>Share or Publish</span>
                     </b-dropdown-item>
 
-                    <template v-if="!currentUser.isAnonymous">
-                        <b-dropdown-divider></b-dropdown-divider>
-
-                        <b-dropdown-item
-                            data-description="share or publish"
-                            @click="$router.push(`/histories/sharing?id=${history.id}`)">
-                            <Icon fixed-width icon="share-alt" class="mr-1" />
-                            <span v-localize>Share or Publish</span>
-                        </b-dropdown-item>
-
-                        <b-dropdown-item @click="$router.push(`/histories/permissions?id=${history.id}`)">
-                            <Icon fixed-width icon="user-lock" class="mr-1" />
-                            <span v-localize>Set Permissions</span>
-                        </b-dropdown-item>
-
-                        <b-dropdown-item v-b-modal:history-privacy-modal>
-                            <Icon fixed-width icon="lock" class="mr-1" />
-                            <span v-localize>Make Private</span>
-                        </b-dropdown-item>
-                    </template>
-                    <b-dropdown-divider></b-dropdown-divider>
-
-                    <b-dropdown-item @click="$router.push(`/histories/citations?id=${history.id}`)">
-                        <Icon fixed-width icon="stream" class="mr-1" />
-                        <span v-localize>Export Tool Citations</span>
+                    <b-dropdown-item
+                        :disabled="currentUser.isAnonymous"
+                        :title="userTitle('Set who can View or Edit this History')"
+                        @click="$router.push(`/histories/permissions?id=${history.id}`)">
+                        <Icon fixed-width icon="user-lock" class="mr-1" />
+                        <span v-localize>Set Permissions</span>
                     </b-dropdown-item>
 
                     <b-dropdown-item
-                        data-description="export to file"
-                        @click="$router.push(`/histories/${history.id}/export`)">
-                        <Icon fixed-width icon="file-archive" class="mr-1" />
-                        <span v-localize>Export History to File</span>
+                        v-b-modal:history-privacy-modal
+                        :disabled="currentUser.isAnonymous"
+                        :title="userTitle('Make this History Private')">
+                        <Icon fixed-width icon="lock" class="mr-1" />
+                        <span v-localize>Make Private</span>
                     </b-dropdown-item>
 
                     <b-dropdown-divider></b-dropdown-divider>
 
                     <b-dropdown-item
                         data-description="switch to legacy history view"
+                        :title="l('Switch to Legacy History Panel')"
                         @click="switchToLegacyHistoryPanel">
                         <Icon fixed-width class="mr-1" icon="arrow-up" />
                         <span v-localize>Return to legacy panel</span>
@@ -187,6 +203,13 @@ export default {
     },
     methods: {
         switchToLegacyHistoryPanel,
+        userTitle(title) {
+            if (this.currentUser.isAnonymous) {
+                return this.l("Log in to") + " " + this.l(title);
+            } else {
+                return this.l(title);
+            }
+        },
     },
 };
 </script>

client/src/components/History/Layout/DetailsLayout.vue

@@ -1,12 +1,12 @@
 <template>
     <section class="m-3 details" data-description="edit details">
         <b-button
-            v-if="!currentUser.isAnonymous && writeable"
+            :disabled="currentUser.isAnonymous || !writeable"
             class="edit-button ml-1 float-right"
             data-description="editor toggle"
             size="sm"
             variant="link"
-            :title="'Edit' | l"
+            :title="editButtonTitle"
             :pressed="editing"
             @click="onToggle">
             <Icon icon="pen" />
@@ -91,6 +91,17 @@ export default {
     },
     computed: {
         ...mapGetters("user", ["currentUser"]),
+        editButtonTitle() {
+            if (this.currentUser?.isAnonymous) {
+                return this.l("Log in to Rename History");
+            } else {
+                if (this.writeable) {
+                    return this.l("Edit");
+                } else {
+                    return this.l("Not Editable");
+                }
+            }
+        },
     },
     methods: {
         onSave() {

client/src/components/History/Modals/CopyModal.vue

@@ -3,7 +3,7 @@
         <transition name="fade">
             <b-alert v-localize :show="currentUser.isAnonymous" variant="warning">
                 As an anonymous user, unless you login or register, you will lose your current history after copying
-                this history. You can <a href="/user/login">login here</a> or <a href="/user/create">register here</a>.
+                this history. You can <a href="/user/login">log in here</a> or <a href="/user/create">register here</a>.
             </b-alert>
         </transition>
 

client/src/components/Masthead/MastheadItem.vue

@@ -84,7 +84,7 @@ export default {
             return this.tab.menu;
         },
         popoverNote() {
-            return `Please <a href="${getAppRoot()}login">login or register</a> to use this feature.`;
+            return `Please <a href="${getAppRoot()}login">log in or register</a> to use this feature.`;
         },
         classes() {
             const isActiveTab = this.tab.id == this.activeTab;

client/src/components/Panels/Buttons/FavoritesButton.vue

@@ -5,6 +5,7 @@
         size="sm"
         variant="link"
         aria-label="Show favorite tools"
+        :disabled="currentUser.isAnonymous"
         :title="tooltipText"
         @click="onFavorites">
         <icon v-if="toggle" :icon="['fas', 'star']" />
@@ -13,7 +14,7 @@
 </template>
 
 <script>
-import _l from "utils/localization";
+import { mapGetters } from "vuex";
 
 export default {
     name: "FavoritesButton",
@@ -25,17 +26,21 @@ export default {
     data() {
         return {
             searchKey: "#favorites",
-            tooltipToggle: _l("Show favorites"),
-            tooltipUntoggle: "Clear",
             toggle: false,
         };
     },
     computed: {
+        ...mapGetters("user", ["currentUser"]),
+
         tooltipText() {
-            if (this.toggle) {
-                return this.tooltipUntoggle;
+            if (this.currentUser.isAnonymous) {
+                return this.l("Log in to Favorite Tools");
             } else {
-                return this.tooltipToggle;
+                if (this.toggle) {
+                    return this.l("Clear");
+                } else {
+                    return this.l("Show favorites");
+                }
             }
         },
     },

client/src/components/Panels/ToolBox.vue

@@ -6,7 +6,7 @@
                     <h4 v-localize class="m-1">Tools</h4>
                     <div class="panel-header-buttons">
                         <b-button-group>
-                            <favorites-button v-if="isUser" :query="query" @onFavorites="onQuery" />
+                            <favorites-button :query="query" @onFavorites="onQuery" />
                             <panel-view-button
                                 v-if="panelViews && Object.keys(panelViews).length > 1"
                                 :panel-views="panelViews"

client/src/components/Tour/Tour.vue

@@ -9,7 +9,7 @@
                 static
                 ok-only
                 hide-header>
-                <b-alert show variant="danger"> You must login to Galaxy to use this tour. </b-alert>
+                <b-alert show variant="danger"> You must log in to Galaxy to use this tour. </b-alert>
             </b-modal>
             <b-modal
                 v-else-if="adminRequired(user)"

client/src/components/User/ExternalIdentities/ExternalIdentities.vue

@@ -17,7 +17,7 @@
             <p>
                 Users with existing Galaxy user accounts (e.g., via Galaxy username and password) can associate their
                 account with their 3rd party identities. For instance, if a user associates their Galaxy account with
-                their Google account, then they can login to Galaxy either using their Galaxy username and password, or
+                their Google account, then they can log in to Galaxy either using their Galaxy username and password, or
                 their Google account. Whichever method they use they will be assuming same Galaxy user account, hence
                 having access to the same histories, workflows, datasets, libraries, etc.
             </p>

client/src/style/scss/overrides.scss

@@ -184,3 +184,21 @@ table.info_data_table th:nth-child(1) {
 .progress-bar.bg-warning {
     background: $state-warning-bg !important;
 }
+
+// add disabled variant of bootstrap vue button link
+.btn.btn-link.disabled {
+    pointer-events: unset;
+    background-color: unset;
+    border: none;
+}
+
+// enable titles on disabled dropdown items
+.dropdown-menu {
+    .dropdown-item.disabled {
+        pointer-events: unset;
+        cursor: default;
+
+        // differentiate disabled items more
+        color: #bfc7cf !important;
+    }
+}

config/plugins/tours/core.history.yaml

@@ -88,7 +88,7 @@ steps:
       intro: "You can filter your history by typing your search term in here. Galaxy supports more advanced filters that can be seen here."
       textinsert: ""
 
-    - element: "#current-history-panel [title='Show history options']"
+    - element: "#current-history-panel [data-description='history options']"
       title: "History Options"
       intro: "In the History menu you will find a lot more useful History options."
       postclick: true

lib/galaxy/selenium/has_driver.py

@@ -56,6 +56,12 @@ def assert_absent_or_hidden(self, selector_template: Target):
         for element in elements:
             assert not element.is_displayed()
 
+    def assert_disabled(self, selector_template: Target):
+        elements = self.find_elements(selector_template)
+        assert len(elements) > 0
+        for element in elements:
+            assert not element.is_enabled()
+
     def selector_is_displayed(self, selector: str):
         element = self.driver.find_element(By.CSS_SELECTOR, selector)
         return element.is_displayed()

lib/galaxy/selenium/smart_components.py

@@ -105,6 +105,9 @@ def assert_absent_or_hidden(self, **kwds):
     def assert_absent_or_hidden_after_transitions(self, **kwds):
         self._has_driver.assert_absent_or_hidden_after_transitions(self._target, **kwds)
 
+    def assert_disabled(self, **kwds):
+        self._has_driver.assert_disabled(self._target, **kwds)
+
     def has_class(self, class_name):
         classes_str = self._has_driver.driver.find_element(*self._target.element_locator).get_attribute("class") or ""
         return class_name in classes_str.split(" ")

lib/galaxy_test/selenium/test_anon_history.py

@@ -11,7 +11,7 @@ def test_anon_history_landing(self):
         self.assert_initial_history_panel_state_correct()
 
         if self.is_beta_history():
-            self.beta_history_element("editor toggle").assert_absent_or_hidden()
+            self.beta_history_element("editor toggle").assert_disabled()
         else:
             # Anonymous users cannot annotate or tag, these components should be absent.
             self.components.history_panel.tag_icon.assert_absent_or_hidden()