Merge pull request #39 from elhagen13/add-pomodoros-to-task

Added estimated pomodoros to tasks
elhagen13 · Nov 29, 2023 · ce07a71 · ce07a71
2 parents cf8e87d + 4ae31f9
commit ce07a71
Show file tree

Hide file tree

Showing 10 changed files with 4,214 additions and 821 deletions.
diff --git a/.prettierrc b/.prettierrc
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,19 +11,22 @@
     "start": "cd packages/studywell-frontend && npm start",
     "test": "echo \"Error: no test specified\"",
     "lint": "n && npx prettier --check .",
-    "dev": "nodemon studywell-backend/backend.js"
+    "dev": "nodemon studywell-backend/backend.js",
+    "build": "cd packages/studywell-frontend && npm run build"
   },
   "author": "",
   "license": "ISC",
   "dependencies": {
     "create-react-app": "^5.0.1",
     "mongoose": "^8.0.0",
+    "react-modal": "^3.16.1",
     "react-router-dom": "^6.18.0",
-    "react-scripts": "^5.0.1"
+    "react-scripts": "^5.0.1",
+    "webpack": "^4.44.2"
   },
   "devDependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
-    "eslint": "^8.53.0",
+    "eslint": "^8.54.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-plugin-import": "^2.29.0",
     "eslint-plugin-jsx-a11y": "^6.8.0",

diff --git a/packages/studywell-frontend/src/App.js b/packages/studywell-frontend/src/App.js
@@ -1,5 +1,5 @@
 import "./App.css";
-import "./components/timer/Timer.css";
+import "./Timer.css";
 import ShortBreak from "./pages/ShortBreak";
 import LongBreak from "./pages/LongBreak";
 import MainScreen from "./pages/MainScreen";

diff --git a/...l-frontend/src/components/timer/Timer.css → packages/studywell-frontend/src/Timer.css b/...l-frontend/src/components/timer/Timer.css → packages/studywell-frontend/src/Timer.css
diff --git a/packages/studywell-frontend/src/components/taskbar/Task.js b/packages/studywell-frontend/src/components/taskbar/Task.js
@@ -3,39 +3,59 @@ import React, { useState } from "react";
 function Task(props) {
   const [task, setTask] = useState({
     task: "type here...",
+    pomodoros: "",
   });
 
   function submitTask() {
     props.handleSubmit(task);
-    setTask({ task: "type here..." });
+    setTask({ ...task, task: "type here...", pomodoros: "" });
   }
 
-  function handleChange(event) {
+  function handleTaskChange(event) {
     const { value } = event.target;
-    setTask({ task: value });
+    setTask({ ...task, task: value });
+  }
+
+  function handlePomodoroChange(event) {
+    const { value } = event.target;
+    setTask({ ...task, pomodoros: Number(value) });
   }
 
   function handleInputClick(event) {
-    setTask({ task: "" });
+    setTask({ ...task, task: "" });
   }
 
   const placeholderStyle = {
     fontStyle: "italic",
   };
 
   return (
-    <form className="submit_row">
-      <input
-        type="text"
-        task="task"
-        class="task_form"
-        style={task.task === "type here..." ? placeholderStyle : {}}
-        value={task.task}
-        onChange={handleChange}
-        onClick={handleInputClick}
-      />
-      <input type="button" class="submit_task" value="+" onClick={submitTask} />
-    </form>
+    <div>
+      <form className="submit_row">
+        <input
+          type="text"
+          task="task"
+          class="task_form"
+          style={task.task === "type here..." ? placeholderStyle : {}}
+          value={task.task}
+          onChange={handleTaskChange}
+          onClick={handleInputClick}
+        />
+        <input
+          type="number"
+          // style={task.pomodoros === 0 ? placeholderStyle : {}}
+          placeholder="# of pomodoros"
+          onChange={handlePomodoroChange}
+          value={task.pomodoros}
+        />
+        <input
+          type="button"
+          class="submit_task"
+          value="+"
+          onClick={submitTask}
+        />
+      </form>
+    </div>
   );
 }
 export default Task;
diff --git a/packages/studywell-frontend/src/components/taskbar/TaskBar.js b/packages/studywell-frontend/src/components/taskbar/TaskBar.js
@@ -31,6 +31,9 @@ function TaskBarBody(props) {
           <td style={{ width: "65%" }}>
             <div className="text">{row.task}</div>
           </td>
+          <td>
+            <div className="number">{row.pomodoros}</div>
+          </td>
           <td style={{ width: "25%" }}>
             <button
               className="delete_button"

diff --git a/packages/studywell-frontend/src/pages/LongBreak.js b/packages/studywell-frontend/src/pages/LongBreak.js
@@ -1,5 +1,5 @@
 import "../App.css";
-import "../components/timer/Timer.css";
+import "../Timer.css";
 import React from "react";
 import Timer from "../components/timer/Timer";
 import "./Page.css";

diff --git a/packages/studywell-frontend/src/pages/MainScreen.js b/packages/studywell-frontend/src/pages/MainScreen.js
@@ -1,6 +1,6 @@
 import "../App.css";
-import "../components/timer/Timer.css";
-import React, { useState, useEffect } from "react";
+import "../Timer.css";
+import React, { useState } from "react";
 import Task from "../components/taskbar/Task";
 import TaskBar from "../components/taskbar/TaskBar";
 import Timer from "../components/timer/Timer";

diff --git a/packages/studywell-frontend/src/pages/ShortBreak.js b/packages/studywell-frontend/src/pages/ShortBreak.js
@@ -1,5 +1,5 @@
 import "../App.css";
-import "../components/timer/Timer.css";
+import "../Timer.css";
 import "./Page.css";
 import Timer from "../components/timer/Timer";