From 9d4d6c24f4add6e0d79b30a3751c5e4b2ac77f2a Mon Sep 17 00:00:00 2001 From: Jooha Yoo Date: Mon, 16 Jun 2025 15:30:15 -0400 Subject: [PATCH 01/18] use storageKey --- frontend/src/editor/editor.tsx | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/frontend/src/editor/editor.tsx b/frontend/src/editor/editor.tsx index 4c7e3ce0..d3ada9c5 100644 --- a/frontend/src/editor/editor.tsx +++ b/frontend/src/editor/editor.tsx @@ -148,10 +148,12 @@ function getCursorText(aNode: any, aOffset: any, mode: string): string { function LexicalEditor({ updateDocContext, - initialState + initialState, + storageKey = 'doc' }: { updateDocContext: (docContext: DocContext) => void; initialState: InitialEditorStateType | null; + storageKey?: string; }) { return ( <> @@ -186,10 +188,7 @@ function LexicalEditor({ JSON.stringify(editorState) ); const currentDate = new Date().toISOString(); - localStorage.setItem( - 'doc-date', - currentDate - ); + localStorage.setItem(`${storageKey}-date`, currentDate); }); } } /> From b94d29fe22f56b5eac76fb469da4b718e78bf8c4 Mon Sep 17 00:00:00 2001 From: Jooha Yoo Date: Mon, 16 Jun 2025 15:31:16 -0400 Subject: [PATCH 02/18] creating taskIDs and storage keys for each --- frontend/src/editor/index.tsx | 106 ++++++++++++++++++++++++++++++++-- 1 file changed, 100 insertions(+), 6 deletions(-) diff --git a/frontend/src/editor/index.tsx b/frontend/src/editor/index.tsx index f725213b..e876fb14 100644 --- a/frontend/src/editor/index.tsx +++ b/frontend/src/editor/index.tsx @@ -16,7 +16,7 @@ function Sidebar({ editorAPI }: { editorAPI: EditorAPI}) { ); } -function EditorScreen() { +function EditorScreen( {taskID, initialContent }: {taskID?: string; initialContent?: string}) { const mode = useAtomValue(overallModeAtom); const isDemo = mode === OverallMode.demo; @@ -90,14 +90,63 @@ function EditorScreen() { handleSelectionChange(); }; + // Create initial state from content + const createInitialState = (text: string) => { + return JSON.stringify({ + root: { + children: text.split('\n\n').map(paragraph => ({ + children: [ + { + detail: 0, + format: 0, + mode: "normal", + style: "", + text: paragraph, + type: "text", + version: 1 + } + ], + direction: "ltr", + format: "", + indent: 0, + type: "paragraph", + version: 1 + })), + direction: "ltr", + format: "", + indent: 0, + type: "root", + version: 1 + } + }); + }; + + //Determine storage keys based on the task + const getStorageKey = () => { + return taskID ? `doc-${taskID}` : 'doc'; + }; + + //Get initial state + const getInitialState = () => { + const storageKey = getStorageKey(); + + if (initialContent) { + localStorage.removeItem(storageKey); + localStorage.removeItem(`${storageKey}-date`); + return createInitialState(initialContent); + } + return localStorage.getItem(storageKey) || undefined; + }; + return (
{ isDemo && (
@@ -139,6 +188,17 @@ function Router({ page: string; }) { + // This function will clear previous task data when moving to a different page + const clearPreviousData = (currentTaskID: string) => { + const allTaskIDs = ['task1', 'task2', 'task3']; + allTaskIDs.forEach(taskID => { + if (taskID !== currentTaskID) { + localStorage.removeItem(`doc-${taskID}`); + localStorage.removeItem(`doc-${taskID}-date`); + } + }); + }; + if (page === 'editor') { getDefaultStore().set(overallModeAtom, OverallMode.full); return ; @@ -228,11 +288,12 @@ function Router({ getDefaultStore().set(studyConditionAtom, condition); const taskDescription = 'Task 1: Should companies adopt a four-day work week (working Monday through Thursday) instead of the traditional five-day schedule? Consider impacts on productivity, employee well-being, and business operations.'; getDefaultStore().set(taskDescriptionAtom, taskDescription); + clearPreviousData('task1'); return
{taskDescription}
- +
; } else { - return
Unknown study page
; - } - } + return
Unknown study page
; }} else { return
Page not found
; } From 0b55330215656c5a5c14082eec7f08a907bd3b26 Mon Sep 17 00:00:00 2001 From: Jooha Yoo Date: Tue, 17 Jun 2025 13:43:35 -0400 Subject: [PATCH 09/18] using storageKey --- frontend/src/editor/editor.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/editor/editor.tsx b/frontend/src/editor/editor.tsx index d3ada9c5..37bba7fc 100644 --- a/frontend/src/editor/editor.tsx +++ b/frontend/src/editor/editor.tsx @@ -184,7 +184,7 @@ function LexicalEditor({ updateDocContext(docContext); localStorage.setItem( - 'doc', + storageKey ='doc', JSON.stringify(editorState) ); const currentDate = new Date().toISOString(); From 2357f61051127859ca196eefa6777e60efbb7f8c Mon Sep 17 00:00:00 2001 From: Jooha Yoo Date: Tue, 17 Jun 2025 13:44:07 -0400 Subject: [PATCH 10/18] don't actually need --- frontend/src/editor/index.tsx | 12 ------------ 1 file changed, 12 deletions(-) diff --git a/frontend/src/editor/index.tsx b/frontend/src/editor/index.tsx index 29c2a1a9..b37c2272 100644 --- a/frontend/src/editor/index.tsx +++ b/frontend/src/editor/index.tsx @@ -228,17 +228,6 @@ function Router({ page: string; }) { - // This function will clear previous task data when moving to a different page - const clearPreviousData = (currentTaskID: string) => { - const allTaskIDs = ['task1', 'task2', 'task3']; - allTaskIDs.forEach(taskID => { - if (taskID !== currentTaskID) { - localStorage.removeItem(`doc-${taskID}`); - localStorage.removeItem(`doc-${taskID}-date`); - } - }); - }; - if (page === 'editor') { getDefaultStore().set(overallModeAtom, OverallMode.full); return ; @@ -329,7 +318,6 @@ function Router({ const taskID = `task${taskNumber}`; getDefaultStore().set(studyConditionAtom, taskConfig.condition); getDefaultStore().set(taskDescriptionAtom, taskConfig.taskDescription); - clearPreviousData(taskID); return (
From dc0e98e695dfda0b284fbf43b091c8c8c01068f9 Mon Sep 17 00:00:00 2001 From: Jooha Yoo Date: Tue, 17 Jun 2025 16:34:22 -0400 Subject: [PATCH 11/18] task prompt + inital content = taskPrompt --- frontend/src/editor/index.tsx | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/frontend/src/editor/index.tsx b/frontend/src/editor/index.tsx index b37c2272..eccbe145 100644 --- a/frontend/src/editor/index.tsx +++ b/frontend/src/editor/index.tsx @@ -16,7 +16,7 @@ function Sidebar({ editorAPI }: { editorAPI: EditorAPI}) { ); } -function EditorScreen( {taskID, initialContent }: {taskID?: string; initialContent?: string}) { +function EditorScreen( {taskID, taskPrompt }: {taskID?: string; taskPrompt?: string}) { const mode = useAtomValue(overallModeAtom); const isDemo = mode === OverallMode.demo; @@ -126,10 +126,10 @@ function EditorScreen( {taskID, initialContent }: {taskID?: string; initialConte const getInitialState = () => { const storageKey = getStorageKey(); - if (initialContent) { + if (taskPrompt) { localStorage.removeItem(storageKey); localStorage.removeItem(`${storageKey}-date`); - return createInitialState(initialContent); + return createInitialState(taskPrompt); } return localStorage.getItem(storageKey) || undefined; }; @@ -182,13 +182,12 @@ const SURVEY_URLS = { const taskConfigs = { '1': { condition: 'Completion', - taskDescription: 'Task 1: Should companies adopt a four-day work week (working Monday through Thursday) instead of the traditional five-day schedule? Consider impacts on productivity, employee well-being, and business operations.', - initialContent: `` + taskPrompt: 'Task 1: Should companies adopt a four-day work week (working Monday through Thursday) instead of the traditional five-day schedule? Consider impacts on productivity, employee well-being, and business operations.', }, '2': { condition: 'Question', - taskDescription: 'Task 2: Write a cover letter for the position described. The applicant is a recent college graduate with a major in Environmental Sustainability and a minor in Marketing, with relevant internship experience. Demonstrate how their background aligns with the company’s mission and requirements. [Details are given below in the editor document]', - initialContent: `GreenTech Solutions - Sustainability Coordinator Position + taskPrompt: `Task 2: Write a cover letter for the position described. The applicant is a recent college graduate with a major in Environmental Sustainability and a minor in Marketing, with relevant internship experience. Demonstrate how their background aligns with the company’s mission and requirements. [Details are given below in the editor document] + GreenTech Solutions - Sustainability Coordinator Position Company Overview: GreenTech Solutions is a fast-growing environmental consulting firm that helps businesses reduce their carbon footprint and implement sustainable practices. We work with companies across various industries to develop eco-friendly strategies that benefit both the environment and their bottom line. @@ -211,8 +210,9 @@ const taskConfigs = { }, '3': { condition: 'RMove', - taskDescription: 'Task 3: After reading these paragraphs, write a summary that explains CRISPR gene editing to your 11th grade biology classmates. Your goal is to help them understand what CRISPR is, how it works, and why it matters, using language and examples they would find clear and engaging.', - initialContent: ` CRISPR-Cas9 is a revolutionary gene-editing technology that allows scientists to make precise changes to DNA. Originally discovered as part of bacteria's immune system, CRISPR works like molecular scissors that can cut DNA at specific locations and either remove, add, or replace genetic material. + taskPrompt: `Task 3: After reading these paragraphs, write a summary that explains CRISPR gene editing to your 11th grade biology classmates. Your goal is to help them understand what CRISPR is, how it works, and why it matters, using language and examples they would find clear and engaging. + + CRISPR-Cas9 is a revolutionary gene-editing technology that allows scientists to make precise changes to DNA. Originally discovered as part of bacteria's immune system, CRISPR works like molecular scissors that can cut DNA at specific locations and either remove, add, or replace genetic material. The CRISPR system consists of two main components: a guide RNA that identifies the target DNA sequence, and the Cas9 protein that acts as the cutting tool. When these components are introduced into a cell, they seek out the matching DNA sequence and make a precise cut. The cell's natural repair mechanisms then fix the break, allowing scientists to insert new genetic material or correct defective genes. @@ -317,15 +317,15 @@ function Router({ } const taskID = `task${taskNumber}`; getDefaultStore().set(studyConditionAtom, taskConfig.condition); - getDefaultStore().set(taskDescriptionAtom, taskConfig.taskDescription); + getDefaultStore().set(taskDescriptionAtom, taskConfig.taskPrompt); return (
-
{taskConfig.taskDescription}
+
{taskConfig.taskPrompt}