- Bump version number to v0.3.4

- Introduced option to select starting day of the week for Calendar View
- Minor performance fixes

COMMITMESSAGE.md

@@ -1 +1,3 @@
-- Bump to v0.3.3
+- Bump version number to v0.3.4
+- Introduced option to select starting day of the week for Calendar View
+- Minor performance fixes

src/components/fullcalendar/DashboardView.js

@@ -23,7 +23,7 @@ import { getMessageFromAPIResponse } from "@/helpers/frontend/response";
 import { withRouter } from "next/router";
 import { RecurrenceHelper } from "@/helpers/frontend/classes/RecurrenceHelper";
 import { FULLCALENDAR_VIEWLIST } from "./FullCalendarHelper";
-import { getDefaultViewForCalendar } from "@/helpers/frontend/settings";
+import { getCalendarStartDay, getDefaultViewForCalendar } from "@/helpers/frontend/settings";
 import { ListGroupCalDAVAccounts } from "./ListGroupCalDAVAccounts";
 import { Preference_CalendarsToShow } from "@/helpers/frontend/classes/UserPreferences/Preference_CalendarsToShow";
 
@@ -34,7 +34,7 @@ class DashboardView extends Component {
         super(props)
         this.i18next = getI18nObject()
         var initialViewCalendar = "timeGridDay"
-        this.state = { showEventEditor: false, viewValue: initialViewCalendar, events: null, eventEdited: false, eventDataDashBoard: {}, initialViewCalendar: initialViewCalendar, allEvents: {}, recurMap: {}, selectedID: "", calendarAR: props.calendarAR,showTasksChecked: false, allEventsFromServer: null, caldav_accounts:null }
+        this.state = { showEventEditor: false, viewValue: initialViewCalendar, events: null, eventEdited: false, eventDataDashBoard: {}, initialViewCalendar: initialViewCalendar, allEvents: {}, recurMap: {}, selectedID: "", calendarAR: props.calendarAR,showTasksChecked: false, allEventsFromServer: null, caldav_accounts:null, firstDay:"3"}
         this.viewChanged = this.viewChanged.bind(this)
         this.eventClick = this.eventClick.bind(this)
         this.handleDateClick = this.handleDateClick.bind(this)
@@ -66,10 +66,11 @@ class DashboardView extends Component {
             this.setState({viewValue: view})
 
         }
-        this.setState({showTasksChecked: true})
+        this.setState({showTasksChecked: true, firstDay: getCalendarStartDay()})
 
     }
 
+
     async getCaldavAccountsfromDB() {
         var caldav_accounts = await getCaldavAccountsfromServer()
         if (caldav_accounts != null && caldav_accounts.success == true) {
@@ -653,6 +654,7 @@ class DashboardView extends Component {
                 rerenderEvents={this.rerenderEvents}
                 eventDrop={this.eventDrop}
                 eventResize={this.eventResize}
+                firstDay={this.state.firstDay}
             />
             <br />
             <br />

src/components/page/SettingsPage/SettingsPage.js

@@ -18,6 +18,7 @@ import DefaultCalendarViewSelect from "@/components/accounts/DefaultCalendarView
 import { VERSION_NUMBER } from "@/config/constants";
 import { setDefaultCalendarID } from "@/helpers/frontend/cookies";
 import { getMessageFromAPIResponse } from "@/helpers/frontend/response";
+import CalendarStartDayWeek from "@/components/settings/CalendarStartDayWeek";
 class SettingsPage extends Component {
 
     constructor(props) {
@@ -373,6 +374,8 @@ class SettingsPage extends Component {
                                 <DefaultCalendarViewSelect />
                             </Col>
                         </Row>
+                        <br />
+                        <CalendarStartDayWeek />
                         </div>
                         <br />
                         <br />

src/components/settings/CalendarStartDayWeek.tsx

@@ -0,0 +1,71 @@
+import SettingsHelper from '@/helpers/frontend/classes/SettingsHelper';
+import { setCookie } from '@/helpers/frontend/cookies';
+import { getI18nObject } from '@/helpers/frontend/general';
+import { SETTING_NAME_CALENDAR_START_DAY, getDefaultViewForCalendar } from '@/helpers/frontend/settings';
+import { useEffect, useState } from 'react';
+import Form from 'react-bootstrap/Form';
+import { FULLCALENDAR_VIEWLIST } from '../fullcalendar/FullCalendarHelper';
+import { DAY_ARRAY } from '@/helpers/general';
+import { Col, Row } from 'react-bootstrap';
+
+const defaultOptions = FULLCALENDAR_VIEWLIST
+
+
+const i18next = getI18nObject()
+
+function CalendarStartDayWeek(props:null){
+    const [valueofDDL, setValueofDDL] = useState("1")
+    useEffect(()=>{
+        const getVal = async () =>{
+            const settingVal:string = await SettingsHelper.getFromServer(SETTING_NAME_CALENDAR_START_DAY)
+            setCookie(SETTING_NAME_CALENDAR_START_DAY, settingVal)
+            setValueofDDL(settingVal)
+
+        }
+
+        getVal()
+    },[])
+
+    const  newStartDaySelected = async (e) =>{
+        const value: string = e.target.value
+        console.log("value", value)
+        if(value!=""){
+            setValueofDDL(value)
+            //Make request to Server.
+            if(await SettingsHelper.setKey(SETTING_NAME_CALENDAR_START_DAY, value)==true)
+            {
+                //Save to cookie if the insert was successful.
+                setCookie(SETTING_NAME_CALENDAR_START_DAY, value)
+            }
+
+        }
+    }
+
+    var finalOptions: Object[]  = []
+
+    for(const i in DAY_ARRAY)
+    {
+       finalOptions.push(<option key={DAY_ARRAY[i]} value={i}>{i18next.t(DAY_ARRAY[i])}</option>)
+    }
+
+    return(
+        <Row style={{display: "flex", alignItems: "center"}}>
+        <Col  xs={3}>
+            {i18next.t("START_DAY_CALENDAR_WEEK")}
+        </Col>
+        <Col  xs={9}>
+            <Form.Select value={valueofDDL} onChange={newStartDaySelected} >
+             {finalOptions}
+            </Form.Select>
+        </Col>
+    </Row>
+
+    )
+
+
+
+
+
+}
+
+export default CalendarStartDayWeek

src/components/tasks/TaskUI.js

@@ -80,7 +80,7 @@ export default class TaskUI extends Component {
             this.setState({ taskTitle: newTaskTitle })
 
             }catch(e){
-                console.error(e)
+                console.warn(e)
             }
 
         }

src/components/tasks/TaskView.js

@@ -151,7 +151,7 @@ export function RecursivelyGetListItemforTask(props) {
     }
     if (toReturn != []) {
 
-        return (<div key={getRandomString(5)} style={{marginBottom: 5}}>
+        return (<div style={{marginBottom: 5}}>
 
             {toReturn}
 

src/components/tasks/TaskWithFilters.js

@@ -8,12 +8,13 @@ import GenerateTaskUIList from "./GenerateTaskUIList";
 import { MdCancel } from "react-icons/md";
 import { SYSTEM_DEFAULT_LABEL_PREFIX } from "@/config/constants";
 import { getI18nObject } from "@/helpers/frontend/general";
+import { Loading } from "../common/Loading";
 export class TaskWithFilters extends Component{
     constructor(props)
     {
         super(props)
         this.i18next= getI18nObject()
-        this.state ={list: this.props.list, isFiltered: false, taskList: null, showAllChecked:false}
+        this.state ={list: this.props.list, isFiltered: false, taskList: null, showAllChecked:false, renderedTasks: <Loading padding={20} centered={true} />}
         this.getLabels = this.getLabels.bind(this)
         this.childlessList
         this.filterByLabelClicked = this.filterByLabelClicked.bind(this)
@@ -25,12 +26,13 @@ export class TaskWithFilters extends Component{
 
     componentDidMount(){
 
-     if(this.state.isFiltered==false) 
-     {
+     if(this.state.isFiltered==false) {
       this.setLabelMenu()
 
-      }
-
+    }
+
+
+      //
     }
 
     showAllChanged(e)
@@ -190,7 +192,8 @@ export class TaskWithFilters extends Component{
         </Row>
 
       {this.state.appliedFilters}
-      <GenerateTaskUIList scheduleItem={this.props.scheduleItem} showDone={this.state.showAllChecked} collapseButtonClicked={this.props.collapseButtonClicked} collapsed={this.props.collapsed} fetchEvents={this.props.fetchEvents} list={this.state.list} todoList={this.props.todoList} level={-1} context={this.props.context} listColor={this.props.listColor}  />      </>
+      <GenerateTaskUIList scheduleItem={this.props.scheduleItem} showDone={this.state.showAllChecked} collapseButtonClicked={this.props.collapseButtonClicked} collapsed={this.props.collapsed} fetchEvents={this.props.fetchEvents} list={this.state.list} todoList={this.props.todoList} level={-1} context={this.props.context} listColor={this.props.listColor}  /> 
+           </>
         )
     }
 }

src/helpers/frontend/classes/SettingsHelper.ts

@@ -13,7 +13,7 @@ export default class SettingsHelper
 {
 
 
-    static async getFromServer(keyName: string)
+    static async getFromServer(keyName: string): Promise<string>
     {
         const authorisationData = await getAuthenticationHeadersforUser()
         return new Promise( (resolve, reject) => {
@@ -32,7 +32,7 @@ export default class SettingsHelper
                     }else{
                         return resolve("")
                     }
-                  })  .catch(function (error) {
+                  }).catch(function (error) {
                     logError(error, "SettingsHelper.getFromServer");
                     return resolve("")
                   });

src/helpers/frontend/cookies.js

@@ -12,6 +12,7 @@ export function deleteAllCookies(){
     Cookies.remove("USERHASH")
     Cookies.remove("USER_PREFERENCE_CALENDARS_TO_SHOW")
     Cookies.remove("SSID")
+    Cookies.remove("MMDL_CALENDAR_START_DAY")
 
 
 

src/helpers/frontend/fullcalendar.ts

@@ -0,0 +1,4 @@
+
+export default function fullDayNameToNumber(nameOfDay){
+
+}

src/helpers/frontend/settings.js

@@ -2,6 +2,7 @@ import Cookies from "js-cookie";
 import { isValidResultArray, logError, varNotEmpty } from "../general";
 import SettingsHelper from "./classes/SettingsHelper";
 
+export const SETTING_NAME_CALENDAR_START_DAY="MMDL_CALENDAR_START_DAY"
 export function getSyncTimeout()
 {
     var timeout = Cookies.get("USER_SETTING_SYNCTIMEOUT")
@@ -22,7 +23,17 @@ export function saveLabelArrayToCookie(labels)
 
     }
 }
+export function getCalendarStartDay(){
+    const defaultCalendar= Cookies.get(SETTING_NAME_CALENDAR_START_DAY)
 
+    if(varNotEmpty(defaultCalendar)){
+        return defaultCalendar
+    }else{
+        return "1"
+    }
+
+
+}
 export function getLabelArrayFromCookie()
 {
     var array =[]

src/helpers/general.js

@@ -1,6 +1,7 @@
 import moment from "moment"
 import { dueDatetoUnixStamp } from "./frontend/general"
 
+export const DAY_ARRAY = ["SUNDAY", "MONDAY", "TUESDAY", "WEDNESDAY", "THURSDAY", "FRIDAY", "SATURDAY"]
 export function isValidResultArray(array)
 {
     if(array!=null && Array.isArray(array) && array.length>0)
@@ -188,3 +189,14 @@ export function getISO8601Date(date, skipTime)
     }
     return toReturn
 }
+
+export function dayNameFromNumber(dayNumber){
+
+    const dayArray = ["SUNDAY", "MONDAY", "TUESDAY", "WEDNESDAY", "THURSDAY", "FRIDAY", "SATURDAY", "SUNDAY"]
+    if(dayNumber>0 && dayNumber<dayArray.length-1){
+        return dayArray[dayNumber]
+    }
+
+    return ""
+
+}

src/i18n/strings.json

@@ -201,7 +201,15 @@
       "WEEKS": "Weeks",
       "WEEK_VIEW": "Week View",
       "YES": "Yes",
-      "YOUR_FILTERS": "Your Filters"
+      "YOUR_FILTERS": "Your Filters",
+      "SUNDAY": "Sunday",
+      "MONDAY":"Monday",
+      "TUESDAY":"Tuesday",
+      "WEDNESDAY": "Wednesday",
+      "THURSDAY":"Thursday",
+      "FRIDAY": "Friday",
+      "SATURDAY": "Saturday",
+      "START_DAY_CALENDAR_WEEK": "Starting Day of the Week for Calendar View"
     }
   },
   "hi":{