From a197faff8da3a7a93506f3ab4464c5180d9f72ea Mon Sep 17 00:00:00 2001
From: "Shaun A. Noordin" <shaun.a.noordin@gmail.com>
Date: Tue, 7 May 2024 01:29:29 +0100
Subject: [PATCH] TasksPage, WorkflowSettingsPage: introduce Advanced Mode

---
 .../components/TasksPage/TasksPage.jsx        | 20 +++++++++++++++----
 .../WorkflowSettingsPage.jsx                  | 18 +++++++++--------
 2 files changed, 26 insertions(+), 12 deletions(-)

diff --git a/app/pages/lab-pages-editor/components/TasksPage/TasksPage.jsx b/app/pages/lab-pages-editor/components/TasksPage/TasksPage.jsx
index 1c3cf3eac1..97ca412db8 100644
--- a/app/pages/lab-pages-editor/components/TasksPage/TasksPage.jsx
+++ b/app/pages/lab-pages-editor/components/TasksPage/TasksPage.jsx
@@ -17,6 +17,15 @@ import StepItem from './components/StepItem';
 import WorkflowVersion from '../WorkflowVersion.jsx';
 import WrenchIcon from '../../icons/WrenchIcon.jsx';
 
+// Use ?advanced=true to enable advanced mode.
+// - switches from simpler "linear workflow" to "manual workflow".
+// - enables Experimental Panel.
+// - shows hidden options in workflow settings.
+function getAdvancedMode() {
+  const params = new URLSearchParams(window?.location?.search);
+  return !!params.get('advanced');
+}
+
 export default function TasksPage() {
   const { workflow, update } = useWorkflowContext();
   const editStepDialog = useRef(null);
@@ -25,12 +34,13 @@ export default function TasksPage() {
   const [ activeDragItem, setActiveDragItem ] = useState(-1);  // Keeps track of active item being dragged (StepItem). This is because "dragOver" CAN'T read the data from dragEnter.dataTransfer.getData().
   const firstStepKey = workflow?.steps?.[0]?.[0] || '';
   const isActive = true; // TODO
+  const advancedMode = getAdvancedMode();
 
   // A linear workflow means every step (except branching steps) will move into
   // the next step in the workflow.steps array. e.g. step0.next = step1 
   // A manual (i.e. non-linear) workflow asks the user to explicity spell out
   // the next step of each step. 
-  const isLinearWorkflow = true;
+  const isLinearWorkflow = !advancedMode;
 
   /*
   Adds a new Task of a specified type (with default settings) to a Step.
@@ -313,9 +323,11 @@ export default function TasksPage() {
         />
 
         {/* EXPERIMENTAL */}
-        <ExperimentalPanel
-          update={update}
-        />
+        {advancedMode && (
+          <ExperimentalPanel
+            update={update}
+          />
+        )}
       </section>
     </div>
   );
diff --git a/app/pages/lab-pages-editor/components/WorkflowSettingsPage/WorkflowSettingsPage.jsx b/app/pages/lab-pages-editor/components/WorkflowSettingsPage/WorkflowSettingsPage.jsx
index 06e525602b..8dfea58724 100644
--- a/app/pages/lab-pages-editor/components/WorkflowSettingsPage/WorkflowSettingsPage.jsx
+++ b/app/pages/lab-pages-editor/components/WorkflowSettingsPage/WorkflowSettingsPage.jsx
@@ -3,16 +3,18 @@ import AssociatedSubjectSets from './components/AssociatedSubjectSets.jsx';
 import AssociatedTutorial from './components/AssociatedTutorial.jsx';
 import WorkflowVersion from '../WorkflowVersion.jsx';
 
-// Use ?showRemovedOptions=true to show options that are technically valid in
-// the API, but removed from the editor.
-function getShowRemovedOptions() {
+// Use ?advanced=true to enable advanced mode.
+// - switches from simpler "linear workflow" to "manual workflow".
+// - enables Experimental Panel.
+// - shows hidden options in workflow settings.
+function getAdvancedMode() {
   const params = new URLSearchParams(window?.location?.search);
-  return !!params.get('showRemovedOptions');
+  return !!params.get('advanced');
 }
 
 export default function WorkflowSettingsPage() {
   const { workflow, update, project } = useWorkflowContext();
-  const showRemovedOptions = getShowRemovedOptions();
+  const advancedMode = getAdvancedMode();
   const showSeparateFramesOptions = !!workflow?.configuration?.enable_switching_flipbook_and_separate;
 
   function onSubmit(e) {
@@ -94,14 +96,14 @@ export default function WorkflowSettingsPage() {
               aria-label="Retirement criteria"
               className="flex-item"
               defaultValue={workflow?.retirement?.criteria}
-              disabled={!showRemovedOptions}
+              disabled={!advancedMode}
               aria-describedby="subject-retirement-info"
               name="retirement.criteria"
               onChange={doUpdate}
             >
               <option value="classification_count">Classification count</option>
               {/* Reason for removal (May 2024): standardisation. PFE/FEM Lab doesn't allow "never retire" option, nor setting the retirement count. */}
-              {(showRemovedOptions || workflow?.retirement?.criteria === 'never_retire') &&
+              {(advancedMode || workflow?.retirement?.criteria === 'never_retire') &&
                 <option value="never_retire">Never retire</option>
               }
             </select>
@@ -294,7 +296,7 @@ export default function WorkflowSettingsPage() {
           </div>
         </fieldset>
 
-        {showRemovedOptions && (<>  {/* Reason for removal (Apr 2024): we want users to use automatic subject viewer selection, to reduce complexity and complications. */}
+        {advancedMode && (<>  {/* Reason for removal (Apr 2024): we want users to use automatic subject viewer selection, to reduce complexity and complications. */}
           <hr />
 
           <fieldset>