Migrate to Mantine v8 and Design Changes (#961)

* mantine v8 migration

* various design changes and improvements

src/shared/hooks/use-is-overflow.ts

@@ -0,0 +1,20 @@
+import { MutableRefObject, useLayoutEffect, useState } from 'react';
+
+export const useIsOverflow = (ref: MutableRefObject<HTMLDivElement | null>) => {
+    const [isOverflow, setIsOverflow] = useState<boolean | undefined>(undefined);
+
+    useLayoutEffect(() => {
+        const { current } = ref;
+
+        const trigger = () => {
+            const hasOverflow = (current?.scrollHeight || 0) > (current?.clientHeight || 0);
+            setIsOverflow(hasOverflow);
+        };
+
+        if (current) {
+            trigger();
+        }
+    }, [ref]);
+
+    return isOverflow;
+};