1 files changed, 52 insertions, 5 deletions

diff --git a/src/client/views/nodes/TaskBox.tsx b/src/client/views/nodes/TaskBox.tsx
index dca01817f..ff1c70b90 100644
--- a/src/client/views/nodes/TaskBox.tsx
+++ b/src/client/views/nodes/TaskBox.tsx
@@ -9,26 +9,52 @@ import { Doc } from '../../../fields/Doc';
 
 import './TaskBox.scss';
 
+/**
+ * Props (reference to document) for Task Box
+ */
+
 interface TaskBoxProps {
     Document: Doc;
 }
 
+/**
+ * TaskBox class for adding task information + completing tasks
+ */
 @observer
 export class TaskBox extends React.Component<TaskBoxProps> {
+
+    /**
+     * Method to reuturn the 
+     * @param fieldStr 
+     * @returns 
+     */
     public static LayoutString(fieldStr: string) {
         return FieldView.LayoutString(TaskBox, fieldStr);
     }
 
+    /**
+     * Method to update the task description
+     * @param e - event of changing the description box input
+     */
+
     @action
     updateText = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
         this.props.Document.text = e.target.value;
     };
 
+    /**
+     * Method to update the task title
+     * @param e - event of changing the title box input
+     */
     @action
     updateTitle = (e: React.ChangeEvent<HTMLInputElement>) => {
         this.props.Document.title = e.target.value;
     };
 
+    /**
+     * Method to update the all day status
+     * @param e - event of changing the all day checkbox
+     */
     @action
     updateAllDay = (e: React.ChangeEvent<HTMLInputElement>) => {
         this.props.Document.$allDay = e.target.checked;
@@ -41,6 +67,10 @@ export class TaskBox extends React.Component<TaskBoxProps> {
         this.setTaskDateRange();
     };
 
+    /**
+     * Method to update the task start time
+     * @param e - event of changing the start time input
+     */
     @action
     updateStart = (e: React.ChangeEvent<HTMLInputElement>) => {
         const newStart = new Date(e.target.value);
@@ -60,8 +90,10 @@ export class TaskBox extends React.Component<TaskBoxProps> {
         this.setTaskDateRange();
     };
 
-
-
+    /**
+     * Method to update the task end time
+     * @param e - event of changing the end time input
+     */
     @action
     updateEnd = (e: React.ChangeEvent<HTMLInputElement>) => {
         const newEnd = new Date(e.target.value);
@@ -81,9 +113,9 @@ export class TaskBox extends React.Component<TaskBoxProps> {
         this.setTaskDateRange();
     };
 
-
-
-
+    /**
+     * Method to update the task date range
+     */
     @action
     setTaskDateRange() {
         const doc = this.props.Document;
@@ -107,11 +139,21 @@ export class TaskBox extends React.Component<TaskBoxProps> {
         }
     }
 
+    /**
+     * Method to set task's completion status
+     * @param e - event of changing the "completed" input checkbox
+     */
+
     @action
     toggleComplete = (e: React.ChangeEvent<HTMLInputElement>) => {
         this.props.Document.$completed = e.target.checked;
     };
 
+    /**
+     * Constructor for the task box
+     * @param props - props containing the document reference 
+     */
+
     constructor(props: TaskBoxProps) {
         super(props);
         makeObservable(this);
@@ -150,6 +192,11 @@ export class TaskBox extends React.Component<TaskBoxProps> {
         this._widthDisposer?.();
     }
 
+    /**
+     * Method to render the task box 
+     * @returns - HTML with taskbox components
+     */
+
     render() {
 
         function toLocalDateTimeString(date: Date): string {