Update Footer Design

src/renderer/src/stories/Main.js

@@ -98,6 +98,7 @@ export class Main extends LitElement {
                     footer = Object.assign(
                         {
                             exit: false,
+                            next: "Complete Pipeline",
                             onNext: () => this.toRender.page.to("/"),
                         },
                         footer && typeof footer === "object" ? footer : {}
@@ -106,7 +107,7 @@ export class Main extends LitElement {
             }
 
             if (footer === true) footer = {};
-            if (footer && "onNext" in footer && !("next" in footer)) footer.next = "Save and Continue";
+            if (footer && "onNext" in footer && !("next" in footer)) footer.next = "Next";
 
             // Default Capsules Behavior
             const section = sections[info.section];

src/renderer/src/stories/pages/guided-mode/GuidedFooter.js

@@ -27,7 +27,7 @@ export class GuidedFooter extends LitElement {
     constructor({
         back = "Back",
         next = "Next",
-        exit = "Return to Home Screen",
+        exit = "Exit Current Pipeline",
         onBack = () => this.to(-1),
         onNext = () => this.to(1),
         onExit = () => this.to("/"),
@@ -54,11 +54,12 @@ export class GuidedFooter extends LitElement {
     render() {
         return html`
             <nwb-footer style="display: flex; align-items: center; justify-content: space-between;">
+                <div>${this.exit ? html`<nwb-button @click=${this.onExit}>${this.exit}</nwb-button>` : ""}</div>
+
                 <div>
                     ${this.back ? html`<nwb-button @click=${this.onBack}>${this.back}</nwb-button>` : ""}
                     ${this.next ? html`<nwb-button @click=${this.onNext} primary>${this.next}</nwb-button>` : ""}
                 </div>
-                ${this.exit ? html`<nwb-button @click=${this.onExit}>${this.exit}</nwb-button>` : ""}
             </nwb-footer>
         `;
     }

src/renderer/src/stories/pages/guided-mode/data/GuidedMetadata.js

@@ -105,7 +105,6 @@ export class GuidedMetadataPage extends ManagedPage {
     };
 
     footer = {
-        next: "Run Conversion Preview",
         onNext: async () => {
             await this.save(); // Save in case the conversion fails
 

src/renderer/src/stories/pages/guided-mode/data/GuidedPathExpansion.js

@@ -214,7 +214,6 @@ export class GuidedPathExpansionPage extends Page {
     };
 
     footer = {
-        next: "Populate Subject Details",
         onNext: async () => {
             await this.save(); // Save in case the request fails
 

src/renderer/src/stories/pages/guided-mode/data/GuidedSourceData.js

@@ -58,7 +58,6 @@ export class GuidedSourceDataPage extends ManagedPage {
     };
 
     footer = {
-        next: "Request Metadata Schema",
         onNext: async () => {
             await this.save(); // Save in case the conversion fails
 

src/renderer/src/stories/pages/guided-mode/options/GuidedConversionOptions.js

@@ -9,7 +9,6 @@ export class GuidedConversionOptionsPage extends Page {
     }
 
     footer = {
-        next: "Run Conversion Preview",
         onNext: async () => {
             await this.save(); // Save in case the conversion fails
             await this.form.validate(); // Will throw an error in the callback

src/renderer/src/stories/pages/guided-mode/options/GuidedInspectorPage.js

@@ -76,9 +76,7 @@ export class GuidedInspectorPage extends Page {
     };
 
     // NOTE: We may want to trigger this whenever (1) this page is visited AND (2) data has been changed.
-    footer = {
-        next: "Preview Files",
-    };
+    footer = {};
 
     getStatus = (list) => {
         return list.reduce((acc, messageInfo) => {

src/renderer/src/stories/pages/guided-mode/options/GuidedUpload.js

@@ -88,7 +88,6 @@ export class GuidedUploadPage extends Page {
     }
 
     footer = {
-        next: "Upload Project",
         onNext: async () => {
             await this.save(); // Save in case the conversion fails
 

src/renderer/src/stories/pages/guided-mode/results/GuidedResults.js

@@ -8,9 +8,7 @@ export class GuidedResultsPage extends Page {
         super(...args);
     }
 
-    footer = {
-        next: "Complete Conversion",
-    };
+    footer = {};
 
     render() {
         const { conversion } = this.info.globalState;

src/renderer/src/stories/pages/guided-mode/setup/GuidedSubjects.js

@@ -67,9 +67,7 @@ export class GuidedSubjectsPage extends Page {
         updateResultsFromSubjects(results, subjects, sourceDataObject); // NOTE: This directly mutates the results object
     };
 
-    footer = {
-        next: "Generate Data Structure",
-    };
+    footer = {};
 
     updated() {
         const add = this.query("#addButton");