web: histogram

apps/web/src/hooks/useBreakpoint.ts

@@ -13,7 +13,7 @@ const breakpoints = theme?.screens ?? {
 export function useBreakpoint<K extends string>(breakpointKey: K) {
   const breakpointValue = breakpoints[breakpointKey as keyof ScreensConfig];
   const bool = useMediaQuery({
-    query: `(max-width: ${breakpointValue})`,
+    query: `(max-width: ${breakpointValue as string})`,
   });
   const capitalizedKey =
     breakpointKey[0]?.toUpperCase() + breakpointKey.substring(1);

apps/web/src/hooks/useDebounceFn.ts

@@ -2,13 +2,15 @@ import { useEffect } from 'react';
 import debounce from 'lodash.debounce';
 
 export function useDebounceFn<T>(fn: T, ms = 500): T {
-  const debouncedFn = debounce(fn, ms);
-
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-unsafe-call
+  const debouncedFn = debounce(fn as any, ms);
+  
   useEffect(() => {
     return () => {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-call
       debouncedFn.cancel();
     };
   });
 
-  return debouncedFn;
+  return debouncedFn as T
 }