diff --git a/client/src/components/Masthead/HelpModeSwitch.vue b/client/src/components/Masthead/HelpModeSwitch.vue
new file mode 100644
index 000000000000..1354cc78fb72
--- /dev/null
+++ b/client/src/components/Masthead/HelpModeSwitch.vue
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
diff --git a/client/src/components/Masthead/Masthead.vue b/client/src/components/Masthead/Masthead.vue
index 21a26bc7b6d7..65f7138794b2 100644
--- a/client/src/components/Masthead/Masthead.vue
+++ b/client/src/components/Masthead/Masthead.vue
@@ -1,5 +1,5 @@
diff --git a/client/src/components/Panels/HelpModeText.vue b/client/src/components/Panels/HelpModeText.vue
new file mode 100644
index 000000000000..240126205c92
--- /dev/null
+++ b/client/src/components/Panels/HelpModeText.vue
@@ -0,0 +1,21 @@
+
+
+
+
+
diff --git a/client/src/components/Panels/ToolBox.vue b/client/src/components/Panels/ToolBox.vue
index c376b260eee8..ae7be7f807ef 100644
--- a/client/src/components/Panels/ToolBox.vue
+++ b/client/src/components/Panels/ToolBox.vue
@@ -73,6 +73,8 @@
+
+
@@ -83,10 +85,13 @@ import { useGlobalUploadModal } from "composables/globalUploadModal";
import { getAppRoot } from "onload";
import _l from "utils/localization";
+import { useHelpModeStatusStore } from "@/stores/helpmode/helpModeStatusStore";
+
import FavoritesButton from "./Buttons/FavoritesButton";
import PanelViewButton from "./Buttons/PanelViewButton";
import ToolSearch from "./Common/ToolSearch";
import ToolSection from "./Common/ToolSection";
+import HelpModeText from "./HelpModeText";
import { filterTools, filterToolSections, hasResults, hideToolsSection } from "./utilities";
export default {
@@ -96,6 +101,7 @@ export default {
PanelViewButton,
ToolSection,
ToolSearch,
+ HelpModeText,
},
props: {
toolbox: {
@@ -115,6 +121,7 @@ export default {
},
data() {
return {
+ status: useHelpModeStatusStore(),
closestTerm: null,
query: null,
results: null,
diff --git a/client/src/stores/helpmode/helpModeStatusStore.js b/client/src/stores/helpmode/helpModeStatusStore.js
new file mode 100644
index 000000000000..05540359bad4
--- /dev/null
+++ b/client/src/stores/helpmode/helpModeStatusStore.js
@@ -0,0 +1,15 @@
+import { defineStore } from "pinia";
+
+export const useHelpModeStatusStore = defineStore("helpModeStatusStore", {
+ state: () => {
+ return {
+ helpmodestatus: false,
+ };
+ },
+
+ actions: {
+ setHelpModeStatus(status) {
+ this.helpmodestatus = status;
+ },
+ },
+});
diff --git a/client/src/stores/helpmode/helpModeTextStore.js b/client/src/stores/helpmode/helpModeTextStore.js
new file mode 100644
index 000000000000..bcab6fbde29b
--- /dev/null
+++ b/client/src/stores/helpmode/helpModeTextStore.js
@@ -0,0 +1,17 @@
+import { defineStore } from "pinia";
+
+import config from './helpTextConfig.yml';
+
+export const useHelpModeTextStore = defineStore("helpModeText", {
+ state: () => {
+ return {
+ helpmodetext: "Welcome to Galaxy Help Mode!",
+ };
+ },
+
+ actions: {
+ addHelpModeText(text) {
+ this.helpmodetext = config[text];
+ },
+ },
+});
diff --git a/client/src/stores/helpmode/helpTextConfig.yml b/client/src/stores/helpmode/helpTextConfig.yml
new file mode 100644
index 000000000000..e642a0096709
--- /dev/null
+++ b/client/src/stores/helpmode/helpTextConfig.yml
@@ -0,0 +1,2 @@
+---
+quotaMeterHelpString: This is your Quota storage meter. It is an indication of how much storage you are using. To learn more about Quota Storage, check out this GTN tutorial.s
\ No newline at end of file
diff --git a/client/src/utils/sentry.js b/client/src/utils/sentry.js
new file mode 100644
index 000000000000..528edc0017a0
--- /dev/null
+++ b/client/src/utils/sentry.js
@@ -0,0 +1,10 @@
+function logSentryEvent(type, id) {
+ Galaxy.Sentry?.captureMessage(`TEST - HelpMode - ${type} - ${id}`, {
+ extra: {
+ sandbox: true,
+ feature: "HelpMode",
+ eventType: type,
+ eventId: id,
+ },
+ })
+}
diff --git a/client/webpack.config.js b/client/webpack.config.js
index e68cd301aadf..c8a8b39e7d8b 100644
--- a/client/webpack.config.js
+++ b/client/webpack.config.js
@@ -105,6 +105,10 @@ module.exports = (env = {}, argv = {}) => {
test: /\.vue$/,
loader: "vue-loader",
},
+ {
+ test: /\.ya?ml$/,
+ loader: "yaml-loader",
+ },
{
test: /\.tsx?$/,
exclude: /node_modules/,