Add an ESLint rule to prevent the usage of useRef other than for HTML elements. (#2014)

* Add an ESLint rule to prevent the usage of useRef other than for HTML elements

Co-authored-by: v1b3m <vibenjamin6@gmail.com>

* Bump eslint version and rewrite rule

* Fix

---------

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: Charles Bochet <charles@twenty.com>

front/src/modules/ui/feedback/snack-bar/hooks/usePausableTimeout.ts

@@ -1,9 +1,13 @@
 import { useCallback, useEffect, useRef } from 'react';
 
 export const usePausableTimeout = (callback: () => void, delay: number) => {
+  // eslint-disable-next-line twenty/no-state-useref
   const savedCallback = useRef<() => void>(callback);
+  // eslint-disable-next-line twenty/no-state-useref
   const remainingTime = useRef<number>(delay);
+  // eslint-disable-next-line twenty/no-state-useref
   const startTime = useRef<number>(Date.now());
+  // eslint-disable-next-line twenty/no-state-useref
   const timeoutId = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   const tick = () => {