Fixing more type inconsistencies, upgraded dependencies

PRIVACY.md

@@ -3,16 +3,12 @@ This document contains the types of information that is collected by sleek and h
 
 I myself am very sensible about my own privacy and in these days of massive and needless collection of personal data, I want sleek to be different. I am not interested in who sleek's users are and will therefore not gather any sensitive data.
 
-However, I want to know how many users are actively using sleek and, in case a user explicitly agrees to it, how sleek is being used. The app communicates with a Matomo instance I host myself. The data is exclusively sent via a secure SSL-encrypted connection. sleek follows a standard procedure of logging. The information collected by Matomo includes only masked internet protocol (IP) addresses, operating system, screen resolution, date and time stamp as well as the user's basic app settings. Also, a non-personalized random user id is generated. This way, I can see how many unique sleek users are out there without collecting sensitive data.
+However, I want to know how many users are actively using sleek and, in case a user explicitly agrees to it, how sleek is being used. The app communicates with a Matomo instance I host myself. The data is exclusively sent via a secure SSL-encrypted connection. sleek follows a standard procedure of logging. The information collected by Matomo includes only masked internet protocol (IP) addresses, operating system, screen resolution, date and time stamp. Also, a non-personalized random user id is generated. This way, I can see how many unique sleek users are out there without collecting sensitive data.
 
-## Default logging
-Once sleek is opened, it will announce to the Matomo instance that it has been started. This happens one time per app session and has the purpose of telling me how many users are using sleek and where these users are roughly located. With this information I can, for instance, decide which language should be added next and so forth.
-
-## Error logging
-Error logging is not active per default. You need to activate it explicitly in sleek's settings. While developing sleek, I rely on error response messages that tell me what is going on with sleek. The problem with this is that I can only see errors I provoke myself using sleek for my own use cases. But these will most likely differ from how other users will utilize the app. Once error logging is active, all error information users provoke will be sent to the Matomo instance. With this information I can maintain and improve sleek.
+The analysis can be disabled in the settings window.
 
 ## Event logging
-Event logging is not active per default. You need to activate it explicitly in sleek's settings. Events are mostly clicks on buttons, checkboxes, links and so on. This information is valuable to me, as it tells me which features are used and which ones are not. Those insights help me keeping sleek clean of unnecessary features that will interfere with sleek's usability. This type of logging will not collect any personal information like the content of your todos or filters. It will only tell me which elements have been clicked.
+Events are mostly clicks on buttons, checkboxes, links and so on. This information is valuable to me, as it tells me which features are used and which ones are not. Those insights help me keeping sleek clean of unnecessary features that will interfere with sleek's usability. This type of logging will not collect any personal information like the content of your todos or filters. It will only tell me which elements have been clicked.
 
 ## Cookies
 sleek itself doesn't use cookies. Data that needs to be persisted is written to a local file that does not transfer anywhere else.

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.5" date="2024-01-04"/>
+    <release version="2.0.5" date="2024-01-05"/>
   </releases>
   <url type="homepage">https://github.com/ransome1/sleek</url>
   <url type="contact">https://github.com/ransome1/sleek/issues</url>

package.json

@@ -97,10 +97,10 @@
     "@teamsupercell/typings-for-css-modules-loader": "^2.5.2",
     "@testing-library/jest-dom": "^6.1.5",
     "@testing-library/react": "^14.0.0",
-    "@types/react-autosuggest": "^10.1.10",
     "@types/jest": "^29.5.2",
-    "@types/node": "20.10.5",
+    "@types/node": "20.10.6",
     "@types/react": "^18.2.8",
+    "@types/react-autosuggest": "^10.1.10",
     "@types/react-dom": "^18.2.4",
     "@types/react-test-renderer": "^18.0.0",
     "@types/webpack-bundle-analyzer": "^4.6.0",

src/__tests__/__mock__/recurrence.txt

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

src/main/main.tsx

@@ -21,7 +21,7 @@ const handleCreateWindow = () => {
   }
 }
 
-const handleClosed = async (event) => {
+const handleClosed = async () => {
   if(watcher) await watcher.close();
 
   mainWindow = null;

src/main/modules/Menu.tsx

@@ -4,7 +4,6 @@ import { mainWindow } from '../main';
 import { openFile, createFile } from './File/Dialog';
 import { handleRequestArchive } from './File/Archive';
 import { configStorage, filterStorage } from '../config';
-import { isCyrillic } from '../util';
 import appPackage from '../../../release/app/package.json';
 
 const isMac: boolean = process.platform === 'darwin';

src/renderer/Dialog/DatePicker.tsx

@@ -10,6 +10,7 @@ const { ipcRenderer } = window.api;
 
 interface Props extends WithTranslation {
   date: string | null;
+  type: string;
   settings: Settings;
   textFieldValue: string;
   todoObject: TodoObject | null;

src/renderer/Dialog/Dialog.tsx

@@ -90,9 +90,11 @@ const DialogComponent: React.FC<Props> = memo(({
   }
 
   useEffect(() => {
-    const updatedValue = todoObject?.string.replaceAll(String.fromCharCode(16), '\n') || '';
-    setTextFieldValue(updatedValue);
-    updateAttributeFields(todoObject);
+    if(todoObject) {
+      const updatedValue = todoObject.string?.replaceAll(String.fromCharCode(16), '\n') || '';
+      setTextFieldValue(updatedValue);
+      updateAttributeFields(todoObject);
+    }
   }, [todoObject]);
 
   useEffect(() => {

src/renderer/Drawer/Sorting/DraggableListItem.tsx

@@ -5,15 +5,15 @@ import SortIcon from '@mui/icons-material/Sort';
 import DragHandleIcon from '@mui/icons-material/DragHandle';
 import './DraggableListItem.scss';
 
-type Props = {
+type DraggableListItemProps = {
   item: Sorting;
   index: number;
   settings: Settings;
   attributeMapping: TranslatedAttributes;
-  setAccordionOrder: React.Dispatch<React.SetStateAction<Sorting>>;
+  setAccordionOrder: React.Dispatch<React.SetStateAction<Sorting[]>>;
 };
 
-const DraggableListItem: React.FC<Props> = ({
+const DraggableListItem: React.FC<DraggableListItemProps> = ({
   item,
   index,
   settings,

src/renderer/Grid/DatePickerInline.tsx

@@ -11,7 +11,7 @@ interface Props {
   type: string;
   todoObject: TodoObject;
   date: string | null;
-  filters: Filters;
+  filters: Filters | null;
   settings: Settings;
 }
 
@@ -33,9 +33,14 @@ const DatePickerInline: React.FC<Props> = ({
     }
   };
 
-  const handleClick = (event) => {
+  const handleClick = (event: React.MouseEvent) => {
     event.preventDefault();
-    if((event.type === 'keydown' && event.key === 'Enter') || event.type === 'click') {
+    setOpen?.((prev) => !prev)
+  };
+
+  const handleKeyDown = (event: React.KeyboardEvent) => {
+    event.preventDefault();
+    if(event.key === 'Enter') {
       setOpen?.((prev) => !prev)
     }
   };
@@ -54,8 +59,8 @@ const DatePickerInline: React.FC<Props> = ({
               tabIndex={0}
             />
             <Box
-              onClick={handleClick}
-              onKeyDown={handleClick}
+              onClick={(event) => handleClick(event)}
+              onKeyDown={(event) => handleKeyDown(event)}
               data-testid={`datagrid-picker-date-${type}`}
               tabIndex={0}
             >

src/renderer/Grid/Elements.tsx

@@ -118,7 +118,7 @@ const Elements: React.FC<Props> = memo(({
         className={selected ? 'filter selected' : 'filter'}
         data-todotxt-attribute={element.type}
       >
-        {replacements[element.type]
+        {element.type && element.value && replacements[element.type]
           ? replacements[element.type](element.value, element.type)
           : element.value ? <span>{element.value}</span> : null}
       </Box>

src/renderer/Grid/Grid.tsx

@@ -17,7 +17,7 @@ interface GridComponentProps {
   setLoadMoreRows: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
-const GridComponent: React.FC<GridProps> = memo(({
+const GridComponent: React.FC<GridComponentProps> = memo(({
   todoObjects,
   filters,
   setDialogOpen,

src/renderer/Matomo.tsx

@@ -1,12 +1,12 @@
 import React, { useEffect } from 'react';
 
-interface Props {
+interface MatomoComponentProps {
   settings: Settings;
 }
 
 const environment = process.env.NODE_ENV;
 
-const MatomoComponent: React.FC<Props> = ({
+const MatomoComponent: React.FC<MatomoComponentProps> = ({
   settings,
 }) => {
   useEffect(() => {

src/renderer/Navigation.tsx

@@ -7,7 +7,6 @@ import SettingsIcon from '@mui/icons-material/Settings';
 import KeyboardArrowLeftIcon from '@mui/icons-material/KeyboardArrowLeft';
 import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
 import { Button, Box } from '@mui/material';
-import { isCyrillic } from './Shared';
 import './Navigation.scss';
 
 const { ipcRenderer, store } = window.api;
@@ -36,17 +35,17 @@ const NavigationComponent: React.FC<Props> = memo(({
   };
 
   useEffect(() => {
-    const handleKeyDown = (event) => {
-      if(event.ctrlKey & event.key === 'т') {
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if(event.ctrlKey && event.key === 'т') {
         handleOpen();
       }
     };
 
     ipcRenderer.on('isDialogOpen', handleOpen);
-    if(isCyrillic()) document.addEventListener('keydown', handleKeyDown)
+    document.addEventListener('keydown', handleKeyDown)
     return () => {
       ipcRenderer.off('isDialogOpen', handleOpen);
-      if(isCyrillic()) document.removeEventListener('keydown', handleKeyDown)
+      document.removeEventListener('keydown', handleKeyDown)
     };
   }, []);
 

src/renderer/Settings/LanguageSelector.tsx

@@ -108,25 +108,17 @@ const LanguageSelector: React.FC<Props> = ({
 	const changeLanguage = (event: SelectChangeEvent) => {
 		const language = event.target.value;
 		store.set('language', language);
+		i18n.changeLanguage(language);
 	};
 
-	useEffect(() => {
-		i18n.changeLanguage(settings.language)
-		.then(() => {
-			store.set('language', settings.language);
-		})
-			.catch((error) => {
-			console.error('Error loading translation:', error);
-		});
-	}, [settings.language]);
-
 	return (
 		<FormControl>
 			<InputLabel id='language'>{i18n.t('settings.language')}</InputLabel>
 			<Select
 				labelId='language'
 				id='language'
 				label='Language'
+				data-testid={'setting-select-language'}
 				value={settings.language || navigator.language}
 				name='language'
 				onChange={(event: SelectChangeEvent) => changeLanguage(event)}

src/renderer/Settings/Settings.scss

@@ -27,7 +27,7 @@
     top: 0.3em;
     right: -0.3em;
     svg {
-      font-size: 1.2em;
+      font-size: 1em;
       color: $blue;
     }
   }

src/renderer/Shared.tsx

@@ -34,9 +34,4 @@ export const handleFilterSelect = (key: string, value: string | string[] | null,
   } catch (error: any) {
     console.error(error);
   }
-};
-
-export const isCyrillic = () => {
-  const locale = navigator.language;
-  return locale.includes('ru') || locale.includes('bg') || locale.includes('sr') || locale.includes('uk') || locale.includes('be') || locale.includes('mk') || locale.includes('ky') || locale.includes('kk') || locale.includes('mn') || locale.includes('tg') || locale.includes('tt') || locale.includes('uz');
 };

src/types.tsx

@@ -83,6 +83,7 @@ declare global {
     fromVersion: string;
     toVersion: string;
     accordionOpenState: boolean;
+    disableAnimations: boolean;
     __internal__: { migrations: { version: string }};
   }