Expand workflow metadata for readme.

client/src/components/Workflow/Editor/Index.vue

@@ -91,12 +91,18 @@
                     :versions="versions"
                     :license="license"
                     :creator="creator"
+                    :logo-url="logoUrl"
+                    :readme="readme"
+                    :help="help"
                     @version="onVersion"
                     @tags="setTags"
                     @license="onLicense"
                     @creator="onCreator"
                     @update:nameCurrent="setName"
-                    @update:annotationCurrent="setAnnotation" />
+                    @update:annotationCurrent="setAnnotation"
+                    @update:logoUrlCurrent="setLogoUrl"
+                    @update:readmeCurrent="setReadme"
+                    @update:helpCurrent="setHelp" />
             </template>
         </ActivityBar>
         <template v-if="reportActive">
@@ -363,7 +369,7 @@ export default {
             undoRedoStore,
             (value) => (annotation.value = value),
             showAttributes,
-            "modify annotation"
+            "modify short description"
         );
         /** user set annotation. queues an undo/redo action */
         function setAnnotation(newAnnotation) {
@@ -372,6 +378,47 @@ export default {
             }
         }
 
+        const readme = ref(null);
+        const setReadmeHandler = new SetValueActionHandler(
+            undoRedoStore,
+            (value) => (readme.value = value),
+            showAttributes,
+            "modify readme"
+        );
+        function setReadme(newReadme) {
+            console.log("IN SET README>.....");
+            if (readme.value !== newReadme) {
+                console.log("setting with the readme handler...");
+                setReadmeHandler.set(readme.value, newReadme);
+            }
+        }
+
+        const help = ref(null);
+        const setHelpHandler = new SetValueActionHandler(
+            undoRedoStore,
+            (value) => (help.value = value),
+            showAttributes,
+            "modify help"
+        );
+        function setHelp(newHelp) {
+            if (help.value !== newHelp) {
+                setHelpHandler.set(help.value, newHelp);
+            }
+        }
+
+        const logoUrl = ref(null);
+        const setLogoUrlHandler = new SetValueActionHandler(
+            undoRedoStore,
+            (value) => (logoUrl.value = value),
+            showAttributes,
+            "modify logo url"
+        );
+        function setLogoUrl(newLogoUrl) {
+            if (logoUrl.value !== newLogoUrl) {
+                setLogoUrlHandler.set(logoUrl.value, newLogoUrl);
+            }
+        }
+
         const tags = ref([]);
 
         watch(
@@ -496,6 +543,12 @@ export default {
             setCreator,
             annotation,
             setAnnotation,
+            readme,
+            setReadme,
+            help,
+            setHelp,
+            logoUrl,
+            setLogoUrl,
             tags,
             setTags,
             rightPanelElement,
@@ -581,6 +634,21 @@ export default {
                 this.hasChanges = true;
             }
         },
+        readme(newReadme, oldReadme) {
+            if (newReadme != oldReadme) {
+                this.hasChanges = true;
+            }
+        },
+        help(newHelp, oldHelp) {
+            if (newHelp != oldHelp) {
+                this.hasChanges = true;
+            }
+        },
+        logoUrl(newLogoUrl, oldLogoUrl) {
+            if (newLogoUrl != oldLogoUrl) {
+                this.hasChanges = true;
+            }
+        },
         hasChanges() {
             this.$emit("update:confirmation", this.hasChanges);
         },
@@ -976,6 +1044,15 @@ export default {
             if (data.annotation !== undefined) {
                 this.annotation = data.annotation;
             }
+            if (data.readme !== undefined) {
+                this.readme = data.readme;
+            }
+            if (data.help !== undefined) {
+                this.help = data.help;
+            }
+            if (data.logo_url !== undefined) {
+                this.logoUrl = data.logo_url;
+            }
             if (data.version !== undefined) {
                 this.version = data.version;
             }

client/src/components/Workflow/Editor/Lint.vue

@@ -5,11 +5,23 @@
         </template>
         <LintSection
             :okay="checkAnnotation"
-            success-message="This workflow is annotated. Ideally, this helps the executors of the workflow
+            success-message="This workflow has a short description. Ideally, this helps the executors of the workflow
                     understand the purpose and usage of the workflow."
             :warning-message="bestPracticeWarningAnnotation"
-            attribute-link="Annotate your Workflow."
+            attribute-link="Describe your Workflow."
             @onClick="onAttributes('annotation')" />
+        <LintSection
+            :okay="checkAnnotationLength"
+            :success-message="annotationLengthSuccessMessage"
+            :warning-message="bestPracticeWarningAnnotationLength"
+            attribute-link="Shorten your Workflow Description."
+            @onClick="onAttributes('annotation')" />
+        <LintSection
+            :okay="checkReadme"
+            success-message="This workflow has a readme. Ideally, this helps the researchers understand the purpose, limitations, and usage of the workflow."
+            :warning-message="bestPracticeWarningReadme"
+            attribute-link="Provider Readme for your Workflow."
+            @onClick="onAttributes('readme')" />
         <LintSection
             :okay="checkCreator"
             success-message="This workflow defines creator information."
@@ -75,8 +87,10 @@ import { useWorkflowStores } from "@/composables/workflowStores";
 
 import {
     bestPracticeWarningAnnotation,
+    bestPracticeWarningAnnotationLength,
     bestPracticeWarningCreator,
     bestPracticeWarningLicense,
+    bestPracticeWarningReadme,
     fixAllIssues,
     fixDisconnectedInput,
     fixUnlabeledOutputs,
@@ -136,8 +150,10 @@ export default {
     data() {
         return {
             bestPracticeWarningAnnotation: bestPracticeWarningAnnotation,
+            bestPracticeWarningAnnotationLength: bestPracticeWarningAnnotationLength,
             bestPracticeWarningCreator: bestPracticeWarningCreator,
             bestPracticeWarningLicense: bestPracticeWarningLicense,
+            bestPracticeWarningReadme: bestPracticeWarningReadme,
         };
     },
     computed: {
@@ -149,6 +165,23 @@ export default {
         checkAnnotation() {
             return !!this.annotation;
         },
+        checkAnnotationLength() {
+            const annotation = this.annotation;
+            if (annotation && annotation.length > 250) {
+                return false;
+            }
+            return true;
+        },
+        annotationLengthSuccessMessage() {
+            if (this.annotation) {
+                return "This workflow has a short description of appropriate length.";
+            } else {
+                return "This workflow does not have a short description.";
+            }
+        },
+        checkReadme() {
+            return !!this.annotation;
+        },
         checkLicense() {
             return !!this.license;
         },