refactor: upgrade react and add compiler

apps/client/src/common/components/input/auto-textarea/AutoTextarea.tsx

@@ -5,7 +5,7 @@ import autosize from 'autosize/dist/autosize';
 import Textarea, { type TextareaProps } from '../textarea/Textarea';
 
 interface AutoTextAreaProps extends TextareaProps {
-  inputref: RefObject<HTMLTextAreaElement>;
+  inputref: RefObject<HTMLTextAreaElement | null>;
 }
 
 /**

apps/client/src/common/components/input/text-input/useReactiveTextInput.tsx

@@ -11,7 +11,7 @@ interface UseReactiveTextInputReturn {
 export default function useReactiveTextInput(
   initialText: string,
   submitCallback: (newValue: string) => void,
-  ref: RefObject<HTMLInputElement | HTMLTextAreaElement>,
+  ref: RefObject<HTMLInputElement | HTMLTextAreaElement | null>,
   options?: {
     submitOnEnter?: boolean;
     submitOnCtrlEnter?: boolean;

apps/client/src/common/hooks/useLongPress.tsx

@@ -1,64 +0,0 @@
-import { MouseEvent, SyntheticEvent, TouchEvent, useMemo, useRef } from 'react';
-
-type LongPressOptions = {
-  threshold?: number;
-  onStart?: (e: SyntheticEvent) => void;
-  onFinish?: (e: SyntheticEvent) => void;
-  onCancel?: (e: SyntheticEvent) => void;
-};
-
-type LongPressFns = {
-  onMouseDown: (e: MouseEvent) => void;
-  onMouseUp: (e: MouseEvent) => void;
-  onMouseLeave: (e: MouseEvent) => void;
-  onTouchStart: (e: TouchEvent) => void;
-  onTouchEnd: (e: TouchEvent) => void;
-};
-
-export default function useLongPress(callback: () => void, options: LongPressOptions = {}): LongPressFns {
-  const { threshold = 400, onStart, onFinish, onCancel } = options;
-  const isLongPressActive = useRef(false);
-  const isPressed = useRef(false);
-  const timerId = useRef<NodeJS.Timeout>();
-
-  return useMemo(() => {
-    const start = (event: SyntheticEvent) => {
-      if (onStart) {
-        onStart(event);
-      }
-
-      isPressed.current = true;
-      timerId.current = setTimeout(() => {
-        callback();
-        isLongPressActive.current = true;
-      }, threshold);
-    };
-
-    const cancel = (event: SyntheticEvent) => {
-      if (isLongPressActive.current) {
-        if (onFinish) {
-          onFinish(event);
-        }
-      } else if (isPressed.current) {
-        if (onCancel) {
-          onCancel(event);
-        }
-      }
-
-      isLongPressActive.current = false;
-      isPressed.current = false;
-
-      if (timerId.current) {
-        clearTimeout(timerId.current);
-      }
-    };
-
-    return {
-      onMouseDown: start,
-      onMouseUp: cancel,
-      onMouseLeave: cancel,
-      onTouchStart: start,
-      onTouchEnd: cancel,
-    };
-  }, [callback, threshold, onCancel, onFinish, onStart]);
-}

apps/client/src/common/hooks/useMemoisedFn.ts

@@ -27,7 +27,7 @@ export default function useMemoisedFn<T extends noop>(fn: T) {
   // https://github.com/alibaba/hooks/issues/728
   fnRef.current = useMemo(() => fn, [fn]);
 
-  const memoizedFn = useRef<PickFunction<T>>();
+  const memoizedFn = useRef<PickFunction<T>>(undefined);
   if (!memoizedFn.current) {
     memoizedFn.current = function (this, ...args) {
       return fnRef.current.apply(this, args);