V1 (#118)

* chore: upgrade minor versions
* chore: upgrade cypress
* chore: upgrade fe dependencies
* update readme
* update osx images
* update readme
* upgrade dependencies
* upgrade test dependency
* feat: add option to input autofill
* feat: autofill to the left
* chore: update docs
* chore: cleanup ci
* version bump
* style: prevent zero height bar
* fix: prevent loosing menu
* ux: improve input, no spellcheck or autocomplete
* small ux improvements in cuesheets
* feat 111/increase maximum number of events
* fix: optimistic delete issue with filter
* refact: pincode workflow
* chore: add versioning to packages

client/src/features/table/tableElements/EditableCell.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { AutoTextArea } from '../../../common/input/AutoTextArea';
 import PropTypes from 'prop-types';
 
@@ -21,31 +21,30 @@ export default function EditableCell(props) {
   // We need to keep and update the state of the cell normally
   const [value, setValue] = useState(initialValue);
 
-  const onChange = (e) => {
-    setValue(e.target.value);
-  };
+  const onChange = useCallback((e) => setValue(e.target.value), []);
 
   // We'll only update the external data when the input is blurred
-  const onBlur = () => {
-    handleUpdate(index, id, value);
-  };
+  const onBlur = useCallback(() => handleUpdate(index, id, value), [handleUpdate, id, index, value]);
 
-  // If the initialValue is changed external, sync it up with our state
-  useEffect(() => {
-    setValue(initialValue);
-  }, [initialValue]);
 
-  return (
-    <AutoTextArea
-      size='sm'
-      borderColor='#0001'
-      defaultValue={value}
-      onChange={onChange}
-      onBlur={onBlur}
-      rows={3}
-      transition='none'
-    />
-  );
+// If the initialValue is changed external, sync it up with our state
+useEffect(() => {
+  setValue(initialValue);
+}, [initialValue]);
+
+return (
+  <AutoTextArea
+    size='sm'
+    borderColor='#0001'
+    defaultValue={value}
+    onChange={onChange}
+    onBlur={onBlur}
+    rows={3}
+    transition='none'
+    spellCheck={false}
+    autoComplete={false}
+  />
+);
 }
 
 EditableCell.propTypes = {

client/src/features/table/tableElements/SortableCell.jsx

@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 import styles from '../Table.module.scss';
 
 export default function SortableCell({ column }) {
-  const { key, style, ...restColumn } = column.getHeaderProps();
+  const { style, ...restColumn } = column.getHeaderProps();
   const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
     id: column.id,
   });