From 8701c69f2b7e37d19a118e5b23a75394d6d5ece7 Mon Sep 17 00:00:00 2001
From: John Chilton <jmchilton@gmail.com>
Date: Tue, 14 May 2024 09:18:24 -0400
Subject: [PATCH] Implement many PR comments around Vue stuff and docs.

---
 .../ConfigTemplates/EditSecretsForm.vue       | 18 +++++------
 .../ConfigTemplates/InstanceDropdown.vue      |  6 ++--
 .../ConfigTemplates/InstanceForm.test.ts      |  6 ++--
 .../ConfigTemplates/InstanceForm.vue          |  4 ++-
 .../ConfigTemplates/ManageIndexHeader.vue     | 10 +++---
 .../ConfigTemplates/VaultSecret.vue           |  2 +-
 .../components/ConfigTemplates/formUtil.ts    | 23 +++++++++-----
 .../src/components/ConfigTemplates/icons.ts   |  5 ---
 .../FileSources/Instances/ManageIndex.vue     |  2 --
 client/src/components/Form/FormElement.vue    |  2 +-
 ...form-elements.scss => _form-elements.scss} |  0
 .../ObjectStore/Instances/ManageIndex.vue     |  2 --
 doc/source/admin/data.md                      | 31 +++++++++----------
 lib/galaxy/files/templates/examples/play.yml  |  0
 14 files changed, 57 insertions(+), 54 deletions(-)
 delete mode 100644 client/src/components/ConfigTemplates/icons.ts
 rename client/src/components/Form/{form-elements.scss => _form-elements.scss} (100%)
 delete mode 100644 lib/galaxy/files/templates/examples/play.yml

diff --git a/client/src/components/ConfigTemplates/EditSecretsForm.vue b/client/src/components/ConfigTemplates/EditSecretsForm.vue
index 9baa7ac5f7c0..7d5cd1777d5b 100644
--- a/client/src/components/ConfigTemplates/EditSecretsForm.vue
+++ b/client/src/components/ConfigTemplates/EditSecretsForm.vue
@@ -23,16 +23,14 @@ async function update(secretName: string, secretValue: string) {
 <template>
     <FormCard :title="title">
         <template v-slot:body>
-            <div>
-                <div v-for="secret in template.secrets" :key="secret.name">
-                    <VaultSecret
-                        :label="secret.label || secret.name"
-                        :name="secret.name"
-                        :help="secret.help || ''"
-                        :is-set="true"
-                        @update="update">
-                    </VaultSecret>
-                </div>
+            <div v-for="secret in template.secrets" :key="secret.name">
+                <VaultSecret
+                    :label="secret.label || secret.name"
+                    :name="secret.name"
+                    :help="secret.help || ''"
+                    :is-set="true"
+                    @update="update">
+                </VaultSecret>
             </div>
         </template>
     </FormCard>
diff --git a/client/src/components/ConfigTemplates/InstanceDropdown.vue b/client/src/components/ConfigTemplates/InstanceDropdown.vue
index 72089a4e0862..9191f032cdc7 100644
--- a/client/src/components/ConfigTemplates/InstanceDropdown.vue
+++ b/client/src/components/ConfigTemplates/InstanceDropdown.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import "./icons";
-
+import { library } from "@fortawesome/fontawesome-svg-core";
+import { faCaretDown } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BLink } from "bootstrap-vue";
 import { useRouter } from "vue-router/composables";
@@ -13,6 +13,8 @@ interface Props {
     isUpgradable: boolean;
 }
 
+library.add(faCaretDown);
+
 const title = "";
 
 const router = useRouter();
diff --git a/client/src/components/ConfigTemplates/InstanceForm.test.ts b/client/src/components/ConfigTemplates/InstanceForm.test.ts
index 546a6670d68f..30189e068d54 100644
--- a/client/src/components/ConfigTemplates/InstanceForm.test.ts
+++ b/client/src/components/ConfigTemplates/InstanceForm.test.ts
@@ -1,11 +1,13 @@
 import { shallowMount } from "@vue/test-utils";
 import { getLocalVue } from "tests/jest/helpers";
 
+import { FormEntry } from "./formUtil";
+
 import InstanceForm from "./InstanceForm.vue";
 
 const localVue = getLocalVue(true);
 
-const inputs: any[] = [];
+const inputs: FormEntry[] = [];
 const SUBMIT_TITLE = "Submit the form!";
 
 describe("InstanceForm", () => {
@@ -13,7 +15,6 @@ describe("InstanceForm", () => {
         const wrapper = shallowMount(InstanceForm, {
             propsData: {
                 title: "MY FORM",
-                loading: true,
                 inputs: null,
                 submitTitle: SUBMIT_TITLE,
             },
@@ -28,7 +29,6 @@ describe("InstanceForm", () => {
         const wrapper = shallowMount(InstanceForm, {
             propsData: {
                 title: "MY FORM",
-                loading: false,
                 inputs: inputs,
                 submitTitle: SUBMIT_TITLE,
             },
diff --git a/client/src/components/ConfigTemplates/InstanceForm.vue b/client/src/components/ConfigTemplates/InstanceForm.vue
index 7e9bba13e4aa..68684e4b39c0 100644
--- a/client/src/components/ConfigTemplates/InstanceForm.vue
+++ b/client/src/components/ConfigTemplates/InstanceForm.vue
@@ -1,13 +1,15 @@
 <script setup lang="ts">
 import { BButton } from "bootstrap-vue";
 
+import { FormEntry } from "./formUtil";
+
 import FormCard from "@/components/Form/FormCard.vue";
 import FormDisplay from "@/components/Form/FormDisplay.vue";
 import LoadingSpan from "@/components/LoadingSpan.vue";
 
 interface Props {
     title: string;
-    inputs: any | null; // not fully reactive so make sure these are ready to go when loading is false
+    inputs: Array<FormEntry> | null; // not fully reactive so make sure to not mutate this array
     submitTitle: string;
     loadingMessage: string;
 }
diff --git a/client/src/components/ConfigTemplates/ManageIndexHeader.vue b/client/src/components/ConfigTemplates/ManageIndexHeader.vue
index 880c1a92c3d7..4b7c46276fe9 100644
--- a/client/src/components/ConfigTemplates/ManageIndexHeader.vue
+++ b/client/src/components/ConfigTemplates/ManageIndexHeader.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
-import "./icons";
-
+import { library } from "@fortawesome/fontawesome-svg-core";
+import { faPlus } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BAlert, BButton, BCol, BRow } from "bootstrap-vue";
 import { useRouter } from "vue-router/composables";
 
-import _l from "@/utils/localization";
+import localize from "@/utils/localization";
+
+library.add(faPlus);
 
 interface Props {
     message: String | null | undefined;
@@ -27,7 +29,7 @@ const router = useRouter();
             <BCol>
                 <BButton :id="createButtonId" class="m-1 float-right" @click="router.push(createRoute)">
                     <FontAwesomeIcon icon="plus" />
-                    {{ _l("Create") }}
+                    {{ localize("Create") }}
                 </BButton>
             </BCol>
         </BRow>
diff --git a/client/src/components/ConfigTemplates/VaultSecret.vue b/client/src/components/ConfigTemplates/VaultSecret.vue
index 11835fd4fe71..fe231af18417 100644
--- a/client/src/components/ConfigTemplates/VaultSecret.vue
+++ b/client/src/components/ConfigTemplates/VaultSecret.vue
@@ -64,5 +64,5 @@ async function onOk() {
 </template>
 
 <style lang="scss" scoped>
-@import "../Form/form-elements.scss";
+@import "../Form/_form-elements.scss";
 </style>
diff --git a/client/src/components/ConfigTemplates/formUtil.ts b/client/src/components/ConfigTemplates/formUtil.ts
index 1f65581ffe5f..c785f48e0c11 100644
--- a/client/src/components/ConfigTemplates/formUtil.ts
+++ b/client/src/components/ConfigTemplates/formUtil.ts
@@ -9,7 +9,16 @@ import type {
 } from "@/api/configTemplates";
 import { markup } from "@/components/ObjectStore/configurationMarkdown";
 
-export function metadataFormEntryName(what: string) {
+export interface FormEntry {
+    name: string;
+    label?: string;
+    optional?: boolean;
+    help?: string | null;
+    type: string;
+    value?: any;
+}
+
+export function metadataFormEntryName(what: string): FormEntry {
     return {
         name: "_meta_name",
         label: "Name",
@@ -19,7 +28,7 @@ export function metadataFormEntryName(what: string) {
     };
 }
 
-export function metadataFormEntryDescription(what: string) {
+export function metadataFormEntryDescription(what: string): FormEntry {
     return {
         name: "_meta_description",
         label: "Description",
@@ -29,7 +38,7 @@ export function metadataFormEntryDescription(what: string) {
     };
 }
 
-export function templateVariableFormEntry(variable: TemplateVariable, variableValue: VariableValueType) {
+export function templateVariableFormEntry(variable: TemplateVariable, variableValue: VariableValueType): FormEntry {
     const common_fields = {
         name: variable.name,
         label: variable.label ?? variable.name,
@@ -69,7 +78,7 @@ export function templateVariableFormEntry(variable: TemplateVariable, variableVa
     }
 }
 
-export function templateSecretFormEntry(secret: TemplateSecret) {
+export function templateSecretFormEntry(secret: TemplateSecret): FormEntry {
     return {
         name: secret.name,
         label: secret.label ?? secret.name,
@@ -79,7 +88,7 @@ export function templateSecretFormEntry(secret: TemplateSecret) {
     };
 }
 
-export function editTemplateForm(template: TemplateSummary, what: string, instance: Instance) {
+export function editTemplateForm(template: TemplateSummary, what: string, instance: Instance): FormEntry[] {
     const form = [];
     const nameInput = metadataFormEntryName(what);
     form.push({ value: instance.name ?? "", ...nameInput });
@@ -114,7 +123,7 @@ export function editFormDataToPayload(template: TemplateSummary, formData: any)
     return payload;
 }
 
-export function createTemplateForm(template: TemplateSummary, what: string) {
+export function createTemplateForm(template: TemplateSummary, what: string): FormEntry[] {
     const form = [];
     const variables = template.variables ?? [];
     const secrets = template.secrets ?? [];
@@ -196,7 +205,7 @@ export function formDataTypedGet(variableDefinition: TemplateVariable, formData:
     }
 }
 
-export function upgradeForm(template: TemplateSummary, instance: Instance): Array<any> {
+export function upgradeForm(template: TemplateSummary, instance: Instance): FormEntry[] {
     const form = [];
     const variables = template.variables ?? [];
     const secrets = template.secrets ?? [];
diff --git a/client/src/components/ConfigTemplates/icons.ts b/client/src/components/ConfigTemplates/icons.ts
deleted file mode 100644
index 0c95a604c25c..000000000000
--- a/client/src/components/ConfigTemplates/icons.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { library } from "@fortawesome/fontawesome-svg-core";
-import { faCaretDown, faPlus } from "@fortawesome/free-solid-svg-icons";
-
-library.add(faCaretDown);
-library.add(faPlus);
diff --git a/client/src/components/FileSources/Instances/ManageIndex.vue b/client/src/components/FileSources/Instances/ManageIndex.vue
index e064a873a991..60e4b671bf31 100644
--- a/client/src/components/FileSources/Instances/ManageIndex.vue
+++ b/client/src/components/FileSources/Instances/ManageIndex.vue
@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import "@/components/ConfigTemplates/icons";
-
 import { BTable } from "bootstrap-vue";
 import { computed } from "vue";
 
diff --git a/client/src/components/Form/FormElement.vue b/client/src/components/Form/FormElement.vue
index 5b6288570094..3ecde5128092 100644
--- a/client/src/components/Form/FormElement.vue
+++ b/client/src/components/Form/FormElement.vue
@@ -312,5 +312,5 @@ const isOptional = computed(() => !isRequired.value && attrs.value["optional"] !
 </template>
 
 <style lang="scss" scoped>
-@import "./form-elements.scss";
+@import "./_form-elements.scss";
 </style>
diff --git a/client/src/components/Form/form-elements.scss b/client/src/components/Form/_form-elements.scss
similarity index 100%
rename from client/src/components/Form/form-elements.scss
rename to client/src/components/Form/_form-elements.scss
diff --git a/client/src/components/ObjectStore/Instances/ManageIndex.vue b/client/src/components/ObjectStore/Instances/ManageIndex.vue
index 1dd1c718c8d4..0a06ee247c47 100644
--- a/client/src/components/ObjectStore/Instances/ManageIndex.vue
+++ b/client/src/components/ObjectStore/Instances/ManageIndex.vue
@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import "@/components/ConfigTemplates/icons";
-
 import { BTable } from "bootstrap-vue";
 import { computed } from "vue";
 
diff --git a/doc/source/admin/data.md b/doc/source/admin/data.md
index d4d518a40ec4..707c9c41af1a 100644
--- a/doc/source/admin/data.md
+++ b/doc/source/admin/data.md
@@ -2,7 +2,7 @@
 
 Galaxy has countless ways for users to connect with things that might be considered their "data" - file sources (aka "remote files"), object stores (aka "storage locations"), data libraries, the upload API, visualizations, display applications, custom tools, etc...
 
-This document is going to discuss two of these (file sources and object stores) that are most important Galaxy administrators and how to build Galaxy configuration that allow administrators to let users tie into various pieces of infrastructure.
+This document is going to discuss two of these (file sources and object stores) that are most important Galaxy administrators and how to build Galaxy configurations that allow administrators to let users tie into various pieces of infrastructure (local and publicly available).
 
 ```{contents} Table of Contents
 :depth: 4
@@ -46,9 +46,8 @@ A minimal object store template might look something like:
 
 This is the most basic sort of object store template that just makes disk paths available to users
 for storing data. Paths can be built up from the user supplied variables, user details, supplied
-environment variables, etc.. The simple example used to demonstrate these concepts just uses
-a user supplied project name and the user's username to produce a unique path for each user
-defined object store.
+environment variables, etc.. The simple example just uses a user supplied project name and the
+user's username to produce a unique path for each user defined object store.
 
 ```{literalinclude} ../../../lib/galaxy/objectstore/templates/examples/simple_example.yml
 :language: yaml
@@ -222,11 +221,11 @@ store configuration).
 
 ### Ready To Use Production Object Store Templates
 
-The templates have been tested by a Galaxy developer and are sufficiently generic that
-they may make sense for a variety of Galaxy instances, address a variety of potential use
-cases, and do not have need any additional tailoring, parameterization, or other
-customization. These assume your Galaxy instance has a Vault configured and you're
-comfortable with it storing your user's secrets.
+The templates are sufficiently generic that they may make sense for a variety of
+Galaxy instances, address a variety of potential use cases, and do not need any
+additional tailoring, parameterization, or other customization. These assume your
+Galaxy instance has [a Vault configured](https://docs.galaxyproject.org/en/master/admin/special_topics/vault.html)
+and you're comfortable with it storing your user's secrets.
 
 #### Allow Users to Define Azure Blob Storage as Object Stores
 
@@ -345,11 +344,11 @@ configuration).
 
 ### Ready To Use Production File Source Templates
 
-The templates have been tested by a Galaxy developer and are sufficiently generic that
-they may make sense for a variety of Galaxy instances, address a variety of potential use
-cases, and do not have need any additional tailoring, parameterization, or other
-customization. These assume your Galaxy instance has a Vault configured and you're
-comfortable with it storing your user's secrets.
+The templates are sufficiently generic that they may make sense for a variety of
+Galaxy instances, address a variety of potential use cases, and do not need any
+additional tailoring, parameterization, or other customization. These (mostly) assume
+your Galaxy instance has [a Vault configured](https://docs.galaxyproject.org/en/master/admin/special_topics/vault.html)
+and you are comfortable with it storing your user's secrets.
 
 #### Allow Users to Define Generic FTP Servers as File Sources
 
@@ -407,7 +406,7 @@ by Ansible at deploy time, the file could start with:
 ```
 
 In this case, variables wrapped by ``[%`` and ``%]`` are expanded by Ansible and use the Ansible
-environment and ``{`` and ``}`` are reserved for Galaxy templating.
+environment and ``{{`` and ``}}`` are reserved for Galaxy templating.
 
 Alternatively, Galaxy can be configured to use a custom template on a per-configuration
 object basis by setting the ``template_start`` and/or ``template_end`` variables.
@@ -484,7 +483,7 @@ use the Galaxy user's username to generate unique paths.
 ### ``ensure_path_component``
 
 This [Jinja filter](https://jinja.palletsprojects.com/en/3.0.x/templates/#filters)
-will fail template evaluation if the value it is applies to is not
+will fail template evaluation if the value it is applied to is not
 a simple directory name. If it contain ``..`` or ``/`` or in some other way might
 be used to attempt path exploitation of cause odd path-related bugs. This is
 useful when producing paths for ``disk`` object stores or ``posix`` file sources.
diff --git a/lib/galaxy/files/templates/examples/play.yml b/lib/galaxy/files/templates/examples/play.yml
deleted file mode 100644
index e69de29bb2d1..000000000000