feat(admin): make the left navigation bar collapsable (#10774)

packages/frontend/admin/src/modules/common.ts

@@ -4,6 +4,7 @@ import {
   FeatureType,
   getCurrentUserFeaturesQuery,
 } from '@affine/graphql';
+import { useEffect, useState } from 'react';
 
 import { useMutateQueryResource } from '../use-mutation';
 import { useQuery } from '../use-query';
@@ -43,3 +44,21 @@ export function isAdmin(
 ) {
   return user.features.includes(FeatureType.Admin);
 }
+
+export function useMediaQuery(query: string) {
+  const [value, setValue] = useState(false);
+
+  useEffect(() => {
+    function onChange(event: MediaQueryListEvent) {
+      setValue(event.matches);
+    }
+
+    const result = matchMedia(query);
+    result.addEventListener('change', onChange);
+    setValue(result.matches);
+
+    return () => result.removeEventListener('change', onChange);
+  }, [query]);
+
+  return value;
+}