Added setting to disable animations, refactoring

flatpak/com.github.ransome1.sleek.appdata.xml

@@ -9,7 +9,7 @@
   <developer_name>Robin Ahle</developer_name>
   <content_rating type="oars-1.1"/>
   <releases>
-    <release version="2.0.4-rc.6" date="2023-12-30"/>
+    <release version="2.0.4" date="2024-01-02"/>
   </releases>
   <url type="homepage">https://github.com/ransome1/sleek</url>
   <url type="contact">https://github.com/ransome1/sleek/issues</url>

flatpak/com.github.ransome1.sleek.desktop

@@ -1,5 +1,5 @@
 [Desktop Entry]
-Version=2.0.4-rc.6
+Version=2.0.4
 Name=sleek
 Exec=sleek
 Type=Application

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sleek",
-  "version": "2.0.4-rc.6",
+  "version": "2.0.4",
   "main": "./src/main/main.tsx",
   "scripts": {
     "build": "concurrently \"yarn run peggy\" \"yarn run build:main\" \"yarn run build:renderer\"",

release/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sleek",
-  "version": "2.0.4-rc.6",
+  "version": "2.0.4",
   "description": "todo.txt manager for Linux, Windows and MacOS, free and open-source (FOSS)",
   "synopsis": "todo.txt manager for Linux, Windows and MacOS, free and open-source (FOSS)",
   "keywords": [

snap/snapcraft.yaml

@@ -1,6 +1,6 @@
 name: sleek
 base: core20
-version: "2.0.4-rc.6"
+version: "2.0.4"
 summary: todo.txt manager for Linux, free and open-source (FOSS)
 description: |
   sleek is an open-source (FOSS) todo manager based on the todo.txt syntax. Stripped down to only the most necessary features, and with a clean and simple interface, sleek aims to help you focus on getting things done.

src/__tests__/__mock__/recurrence.txt

@@ -1,15 +1,15 @@
 
-2023-12-30 Line 1 rec:1d due:2023-12-31
-2023-12-30 Line 1 rec:w due:2024-01-06
-2023-12-30 Line 1 rec:2m due:2024-02-29
-2023-12-30 Line 1 rec:+1d due:2024-01-01
-2023-12-30 Line 1 rec:7w due:2024-02-17
-2023-12-30 Line 1 due:2023-07-24 rec:+1b
-2023-12-30 taxes are due in one year t:2022-03-30 due:2022-04-30 rec:+1y
-2023-12-30 Water plants @home +quick due:2024-01-06 t:2023-12-27 rec:1w
-2023-12-30 Line 1 rec:+1d t:2023-09-20
-2023-12-30 Line 1 rec:1d pri:A due:2023-12-31
-2023-12-30 (A) Do something rec:d t:2023-12-31 @SomeContext
-2023-12-30 Do something rec:0d
-2023-12-30 Do something rec:0d due:2023-12-30
-2023-12-30 Do something rec:0d due:2023-12-30 t:2023-12-30
+2024-01-02 Line 1 rec:1d due:2024-01-03
+2024-01-02 Line 1 rec:w due:2024-01-09
+2024-01-02 Line 1 rec:2m due:2024-03-02
+2024-01-02 Line 1 rec:+1d due:2024-01-04
+2024-01-02 Line 1 rec:7w due:2024-02-20
+2024-01-02 Line 1 due:2023-07-24 rec:+1b
+2024-01-02 taxes are due in one year t:2022-03-30 due:2022-04-30 rec:+1y
+2024-01-02 Water plants @home +quick due:2024-01-09 t:2023-12-30 rec:1w
+2024-01-02 Line 1 rec:+1d t:2023-09-20
+2024-01-02 Line 1 rec:1d pri:A due:2024-01-03
+2024-01-02 (A) Do something rec:d t:2024-01-03 @SomeContext
+2024-01-02 Do something rec:0d
+2024-01-02 Do something rec:0d due:2024-01-02
+2024-01-02 Do something rec:0d due:2024-01-02 t:2024-01-02

src/__tests__/main/CreateTodoObjects.tsx

@@ -82,7 +82,7 @@ describe('Create todo objects', () => {
       priority: null,
       contexts: [],
       projects: [],
-      due: '2023-12-31',
+      due: '2024-12-31',
       dueString: 'end of the year',
       t: null,
       tString: null,
@@ -107,7 +107,7 @@ describe('Create todo objects', () => {
       projects: [],
       due: null,
       dueString: null,
-      t: '2024-01-01',
+      t: '2025-01-01',
       tString: 'first day of next year',
       rec: null,
       hidden: false,

src/main/config.tsx

@@ -85,6 +85,7 @@ const configStorage: Store<Settings> = new Store<Settings>({
       store.delete('isDrawerOpen');
       store.delete('useMultilineForBulkTodoCreation');
       store.set('bulkTodoCreation', false);
+      store.set('disableAnimations', false);
     },
   }
 });
@@ -112,7 +113,7 @@ if(!fs.existsSync(customStylesPath)) {
 filterStorage.onDidAnyChange(async () => {
   try {
     await processDataRequest();
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
   }
 });
@@ -121,7 +122,7 @@ configStorage.onDidAnyChange(async(settings) => {
   try {
     await processDataRequest();
     mainWindow!.webContents.send('settingsChanged', settings);
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
   }
 });
@@ -131,7 +132,7 @@ configStorage.onDidChange('files', (files: FileObject[] | null) => {
     if(files) {
       createFileWatcher(files);
     }
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
   }
 });
@@ -145,7 +146,7 @@ configStorage.onDidChange('colorTheme', (colorTheme) => {
 configStorage.onDidChange('tray', () => {
   try {
     createTray();
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
   }
 });

src/main/main.tsx

@@ -3,7 +3,6 @@ import path from 'path';
 import fs from 'fs';
 import { configStorage } from './config';
 import { createMenu } from './modules/Menu';
-import handleTheme from './modules/Theme';
 import { getAssetPath, resolveHtmlPath } from './util';
 import { createFileWatcher, watcher } from './modules/File/Watcher';
 import { addFile } from './modules/File/File';

src/main/modules/File/Watcher.tsx

@@ -26,7 +26,7 @@ function createFileWatcher(files: FileObject[]): void {
       try {
         await processDataRequest();
         console.log(`${file} has been changed`);
-      } catch(error) {
+      } catch(error: any) {
         console.error(error.message);
       }
     })

src/main/modules/Ipc.tsx

@@ -12,7 +12,7 @@ import { createTodoObject } from './ProcessDataRequest/CreateTodoObjects';
 async function handleDataRequest(event: IpcMainEvent, searchString: string): Promise<void> {
   try {
     await processDataRequest(searchString)
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
     event.reply('responseFromMainProcess', error);
   }
@@ -22,7 +22,7 @@ function handleUpdateAttributeFields(event: IpcMainEvent, index: number, string:
   try {
     const todoObject = createTodoObject(index, string);
     event.reply('updateAttributeFields', todoObject);
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
     event.reply('responseFromMainProcess', error);
   }
@@ -32,7 +32,7 @@ function handleUpdateTodoObject(event: IpcMainEvent, index: number, string: stri
  try {
     const todoObject = createTodoObject(index, string, attributeType, attributeValue);
     event.reply('updateTodoObject', todoObject);
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
     event.reply('responseFromMainProcess', error);
   } 
@@ -52,7 +52,7 @@ async function handleWriteTodoToFile(event: IpcMainEvent, index: number, string:
       const response = await writeTodoObjectToFile(index, updatedString);
       event.reply('writeTodoToFile', response);
     }
-  } catch(error) {
+  } catch(error: any) {
     console.error(error);
     event.reply('responseFromMainProcess', error);
   }

src/renderer/App.scss

@@ -55,6 +55,11 @@ body {
         }            
       }
     }
+    .disableAnimations {
+      .flexContainer {
+        transition: none;
+      }
+    }
   }
 
   h1, h2, h3, h4, h5 {

src/renderer/App.tsx

@@ -96,7 +96,7 @@ const App = () => {
       <I18nextProvider i18n={i18n}>
         <ThemeProvider theme={settings?.shouldUseDarkColors ? darkTheme : lightTheme}>
           <CssBaseline />
-          <Box className={`flexContainer ${settings?.isNavigationOpen ? '' : 'hideNavigation'} ${settings?.shouldUseDarkColors ? 'darkTheme' : 'lightTheme'}`}>
+          <Box className={`flexContainer ${settings?.isNavigationOpen ? '' : 'hideNavigation'} ${settings?.shouldUseDarkColors ? 'darkTheme' : 'lightTheme'} ${settings.disableAnimations ? 'disableAnimations' : ''}`}>
             <NavigationComponent
               setDialogOpen={setDialogOpen}
               settings={settings}

src/renderer/DataGrid/DatePickerInline.tsx

@@ -1,8 +1,7 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers';
 import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
 import { Button, Chip, Box, Badge } from '@mui/material';
-import { Item } from 'jstodotxt';
 import { handleFilterSelect } from '../Shared';
 import dayjs from 'dayjs';
 
@@ -29,7 +28,7 @@ const DatePickerInline: React.FC<Props> = ({
   const handleChange = (date: dayjs.Dayjs | null) => {
     try {
       ipcRenderer.send('writeTodoToFile', todoObject.id, todoObject.string, false, type, dayjs(date).format('YYYY-MM-DD'));
-    } catch(error) {
+    } catch(error: any) {
       console.error(error);
     }
   };
@@ -43,7 +42,7 @@ const DatePickerInline: React.FC<Props> = ({
 
   const DatePickerInline = ({ ...props }) => {
     const ButtonField = ({ ...props }) => {
-      const { setOpen, disabled, InputProps: { ref } = {}, inputProps: { 'aria-label': ariaLabel } = {} } = props;
+      const { disabled, InputProps: { ref } = {}, inputProps: { 'aria-label': ariaLabel } = {} } = props;
       const mustNotify = (type === 'due') ? !todoObject?.notify : true;
       return (
         <Button id={props.id} disabled={disabled} ref={ref} aria-label={ariaLabel} tabIndex={-1}>

src/renderer/DataGrid/Grid.tsx

@@ -5,7 +5,6 @@ import './Grid.scss';
 
 interface TodoDataGridProps {
   todoObjects: TodoObject[] | null;
-  attributes: Attributes | null;
   filters: Filters | null;
   setDialogOpen: React.Dispatch<React.SetStateAction<boolean>>;
   setContextMenu: React.Dispatch<React.SetStateAction<ContextMenu | null>>;
@@ -20,7 +19,6 @@ interface TodoDataGridProps {
 
 const TodoDataGrid: React.FC<TodoDataGridProps> = memo(({
   todoObjects,
-  attributes,
   filters,
   setDialogOpen,
   setContextMenu,

src/renderer/DataGrid/Row.tsx

@@ -13,7 +13,6 @@ import { i18n } from '../Settings/LanguageSelector';
 const { ipcRenderer } = window.api;
 
 interface Props extends WithTranslation {
-  key: number;
   todoObject: TodoObject;
   filters: Filters | null;
   setDialogOpen: React.Dispatch<React.SetStateAction<boolean>>;
@@ -25,7 +24,6 @@ interface Props extends WithTranslation {
 }
 
 const Row: React.FC<Props> = memo(({
-  key,
   todoObject,
   filters,
   setDialogOpen,

src/renderer/Dialog/AutoSuggest.tsx

@@ -92,7 +92,7 @@ const AutoSuggest: React.FC<Props> = ({
         setTextFieldValue(event.target.value);
         setSuggestions([]);
       }
-    } catch(error) {
+    } catch(error: any) {
       console.error(error);
     }
   };
@@ -105,7 +105,7 @@ const AutoSuggest: React.FC<Props> = ({
         event.stopPropagation();
         setSuggestions([]);
       }
-    } catch(error) {
+    } catch(error: any) {
       console.error(error);
     }
   };

src/renderer/Dialog/DatePicker.tsx

@@ -28,7 +28,7 @@ const DatePickerComponent: React.FC<Props> = ({
   const handleChange = (date: dayjs.Dayjs | null) => {
     try {
       ipcRenderer.send('updateTodoObject', todoObject?.id, textFieldValue, type, dayjs(date).format('YYYY-MM-DD'));
-    } catch(error) {
+    } catch(error: any) {
       console.error(error);
     }
   };

src/renderer/Dialog/PomodoroPicker.tsx

@@ -20,7 +20,7 @@ const PomodoroPicker: React.FC<Props> = ({
   const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     try {
       ipcRenderer.send('updateTodoObject', todoObject?.id, textFieldValue, 'pm', event.target.value);
-    } catch(error) {
+    } catch(error: any) {
       console.error(error);
     }
   };

src/renderer/Dialog/PriorityPicker.tsx

@@ -25,7 +25,7 @@ const PriorityPicker: React.FC<Props> = ({
   const handleChange = (event: SelectChangeEvent) => {
     try {
       ipcRenderer.send('updateTodoObject', todoObject?.id, textFieldValue, 'priority', event.target.value);
-    } catch(error) {
+    } catch(error: any) {
       console.error(error);
     }
   };

src/renderer/Dialog/RecurrencePicker.tsx

@@ -42,7 +42,7 @@ const RecurrencePicker: React.FC<Props> = ({
     try {
       event?.preventDefault();
       ipcRenderer.send('updateTodoObject', todoObject?.id, textFieldValue, 'rec', recurrence);
-    } catch(error) {
+    } catch(error: any) {
       console.error(error);
     }
   };

src/renderer/Drawer/Attributes.tsx

@@ -39,7 +39,7 @@ const DrawerAttributes: React.FC<Props> = memo(({
     }
   };
 
-  const handleCtrlCmdUp = () => {
+  const handleCtrlCmdUp = (event) => {
     setIsCtrlKeyPressed(false);
   };
 
@@ -58,13 +58,13 @@ const DrawerAttributes: React.FC<Props> = memo(({
 
     handleFocusFirstTabbableElement();
 
-    document.addEventListener('keydown', handleCtrlCmdDown);
-    document.addEventListener('keyup', handleCtrlCmdUp);
-    window.addEventListener('focus', handleCtrlCmdUp);
+    document.addEventListener('keydown', (event) => handleCtrlCmdDown(event));
+    document.addEventListener('keyup', (event) => handleCtrlCmdUp(event));
+    window.addEventListener('focus', (event) => handleCtrlCmdUp(event));
     return () => {
-      document.removeEventListener('keydown', handleCtrlCmdDown);
-      document.removeEventListener('keyup', handleCtrlCmdUp);
-      window.removeEventListener('focus', handleCtrlCmdUp);
+      document.removeEventListener('keydown', () => handleCtrlCmdDown);
+      document.removeEventListener('keyup', () => handleCtrlCmdUp);
+      window.removeEventListener('focus', () => handleCtrlCmdUp);
     };
   }, []);
 
@@ -96,7 +96,7 @@ const DrawerAttributes: React.FC<Props> = memo(({
               </AccordionSummary>
               <AccordionDetails>
                 <Box>
-                  {Object.keys(attributes[key]).map((value, childIndex) => {
+                  {attributes && Object.keys(attributes[key]).map((value, childIndex) => {
                     const excluded = filters && filters[key]?.some(
                       (filter: any) => filter.value === value && filter.exclude
                     );

src/renderer/Drawer/Drawer.scss

@@ -1,6 +1,6 @@
 @import "../Variables.scss";
 
-.Drawer {
+#drawer {
 	height: 100vh;
 	padding: 0;
 	transition: margin-left 0.3s ease;
@@ -33,4 +33,8 @@
 		min-width: 19em;
 		margin-left: 0!important;
 	}
+}
+
+.disableAnimations #drawer {
+	transition: none;
 }

src/renderer/Drawer/Drawer.tsx

@@ -83,7 +83,7 @@ const DrawerComponent: React.FC<Props> = memo(({
       ref={containerRef}
       variant="persistent"
       open={settings.isDrawerOpen}
-      className={`Drawer ${settings.isDrawerOpen ? 'open' : ''}`}
+      className={`${settings.isDrawerOpen ? 'open' : ''}`}
       style={{ width: drawerWidth, marginLeft: -drawerWidth }}
     >
       <Box className="drawerHandle" onMouseDown={handleMouseDown} />