diff --git a/app/pages/lab-pages-editor/components/TasksPage.jsx b/app/pages/lab-pages-editor/components/TasksPage.jsx
index f09833cf13..9f20e1e3b1 100644
--- a/app/pages/lab-pages-editor/components/TasksPage.jsx
+++ b/app/pages/lab-pages-editor/components/TasksPage.jsx
@@ -5,19 +5,45 @@
/* eslint-disable react/jsx-boolean-value */
import { useWorkflowContext } from '../context.js';
+import getNewTaskKey from '../helpers/getNewTaskKey.js';
+import getNewStepKey from '../helpers/getNewStepKey.js';
+import createTask from '../helpers/createTask.js';
+import createStep from '../helpers/createStep.js';
// import strings from '../strings.json'; // TODO: move all text into strings
import GripIcon from '../icons/GripIcon.jsx';
export default function TasksPage() {
- const { workflow } = useWorkflowContext();
+ const { workflow, update } = useWorkflowContext();
const isActive = true; // TODO
- function placeholderEventHandler() {
- console.log('+++ TODO');
+ // Automatically adds one pre-built Text Task
+ function experimentalAddNewTaskWithStep() {
+ const newTaskKey = getNewTaskKey(workflow?.tasks);
+ const newStepKey = getNewStepKey(workflow?.steps);
+ const newTask = createTask('text');
+ const newStep = createStep(newStepKey, [newTaskKey]);
+
+ if (!newTaskKey || !newStepKey || !newTask || !newStep) {
+ console.error('TasksPage: could not create Task');
+ return;
+ }
+
+ const tasks = {
+ ...workflow.tasks,
+ [newTaskKey]: newTask
+ };
+ const steps = [...workflow.steps, newStep];
+
+ update({ tasks, steps });
}
- console.log('+++ workflow: ', workflow);
+ function experimentalReset() {
+ update({
+ tasks: {},
+ steps: []
+ });
+ }
if (!workflow) return null;
@@ -33,7 +59,7 @@ export default function TasksPage() {
);
diff --git a/app/pages/lab-pages-editor/helpers/constants.js b/app/pages/lab-pages-editor/helpers/constants.js
new file mode 100644
index 0000000000..0a7d608c28
--- /dev/null
+++ b/app/pages/lab-pages-editor/helpers/constants.js
@@ -0,0 +1,2 @@
+export const TASK_KEY_PREFIX = 'T';
+export const STEP_KEY_PREFIX = 'P'; // Steps are known as Pages to users
diff --git a/app/pages/lab-pages-editor/helpers/convertKeyToIndex.js b/app/pages/lab-pages-editor/helpers/convertKeyToIndex.js
new file mode 100644
index 0000000000..195367b946
--- /dev/null
+++ b/app/pages/lab-pages-editor/helpers/convertKeyToIndex.js
@@ -0,0 +1,10 @@
+/*
+Transforms "T1234" (string) to 1234 (number).
+Returns 0 by default.
+ */
+/* eslint-disable radix */
+
+export default function convertKeyToIndex(taskKeyOrStepKey = '') {
+ const indexStr = taskKeyOrStepKey?.replace(/^(\D)+/g, '');
+ return parseInt(indexStr) || 0;
+}
diff --git a/app/pages/lab-pages-editor/helpers/createStep.js b/app/pages/lab-pages-editor/helpers/createStep.js
new file mode 100644
index 0000000000..4879660193
--- /dev/null
+++ b/app/pages/lab-pages-editor/helpers/createStep.js
@@ -0,0 +1,7 @@
+/*
+Creates a Step, with tasks, that's ready to be inserted into a Workflow.
+ */
+
+export default function createStep(stepKey, taskKeys = []) {
+ return [stepKey, { stepKey, taskKeys }];
+}
diff --git a/app/pages/lab-pages-editor/helpers/createTask.js b/app/pages/lab-pages-editor/helpers/createTask.js
new file mode 100644
index 0000000000..e231e95418
--- /dev/null
+++ b/app/pages/lab-pages-editor/helpers/createTask.js
@@ -0,0 +1,12 @@
+/*
+Creates an empty/placeholder Task that's ready to be inserted into a Workflow.
+NOTE: the Task Key isn't handled by this function. Whatever's calling this
+function needs to assign the appropriate Task Key to this Task, and then add it
+to the Workflow.
+ */
+
+import tasks from '../../../classifier/tasks';
+
+export default function createTask(taskType) {
+ return tasks[taskType]?.getDefaultTask();
+}
diff --git a/app/pages/lab-pages-editor/helpers/getNewStepKey.js b/app/pages/lab-pages-editor/helpers/getNewStepKey.js
new file mode 100644
index 0000000000..4d0bd2013f
--- /dev/null
+++ b/app/pages/lab-pages-editor/helpers/getNewStepKey.js
@@ -0,0 +1,20 @@
+/*
+Searches the Workflow's existing Steps and finds the next available Step Key.
+- Goes through workflow.steps and finds steps in the format of P0, P1, P2, etc
+- Finds the LARGEST/HIGHEST key and returns one higher.
+- e.g. if given [P0, P1, P5], this will return P6.
+- Return P0 by default.
+ */
+
+import { STEP_KEY_PREFIX } from './constants.js';
+import convertKeyToIndex from './convertKeyToIndex.js';
+
+export default function getNewStepKey(steps = []) {
+ let newIndex = 0;
+ const stepKeys = steps.map((step) => (step[0] || '')).filter((step) => (step.length > 0));
+ stepKeys.forEach((stepKey) => {
+ const index = convertKeyToIndex(stepKey);
+ newIndex = (newIndex <= index) ? index + 1 : newIndex;
+ });
+ return `${STEP_KEY_PREFIX}${newIndex}`;
+}
diff --git a/app/pages/lab-pages-editor/helpers/getNewTaskKey.js b/app/pages/lab-pages-editor/helpers/getNewTaskKey.js
new file mode 100644
index 0000000000..bd333a5731
--- /dev/null
+++ b/app/pages/lab-pages-editor/helpers/getNewTaskKey.js
@@ -0,0 +1,20 @@
+/*
+Searches the Workflow's existing Tasks and finds the next available Task Key.
+- Goes through workflow.tasks and finds keys in the format of T0, T1, T2, etc
+- Finds the LARGEST/HIGHEST key and returns one higher.
+- e.g. if given [T0, T1, T5], this will return T6.
+- Return T0 by default.
+ */
+
+import { TASK_KEY_PREFIX } from './constants.js';
+import convertKeyToIndex from './convertKeyToIndex.js';
+
+export default function getNewTaskKey(tasks = {}) {
+ let newIndex = 0;
+ const taskKeys = Object.keys(tasks);
+ taskKeys.forEach((taskKey) => {
+ const index = convertKeyToIndex(taskKey);
+ newIndex = (newIndex <= index) ? index + 1 : newIndex;
+ });
+ return `${TASK_KEY_PREFIX}${newIndex}`;
+}
diff --git a/css/lab-pages-editor.styl b/css/lab-pages-editor.styl
index 4f297c63d2..e7cf7cce05 100644
--- a/css/lab-pages-editor.styl
+++ b/css/lab-pages-editor.styl
@@ -73,6 +73,7 @@ $fontWeightBoldPlus = 700
button
color: $black
+ cursor: pointer
font-family: $fontFamilies
&.big