fix: misc

src/pages/home/Categories.tsx

@@ -7,10 +7,9 @@ import Button from '@mui/material/Button';
 import { useState } from 'react';
 import { categoriesColors } from 'config/uiConfig';
 import { Icon } from '@iconify/react';
-import { useUserTypeFilter } from '@components/UserTypeFilter';
 import { useTranslation } from 'react-i18next';
 import { getI18nNamespaceFromToolCategory } from '@utils/string';
-import { validNamespaces } from '../../i18n';
+import { useUserTypeFilter } from '../../providers/UserTypeFilterProvider';
 
 type ArrayElement<ArrayType extends readonly unknown[]> =
   ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
@@ -119,7 +118,7 @@ export default function Categories() {
   const categories = getToolsByCategory(selectedUserTypes, t);
 
   return (
-    <Grid width={'80%'} container mt={2} spacing={2}>
+    <Grid width={'80%'} container spacing={2}>
       {categories.map((category, index) => (
         <SingleCategory key={category.type} category={category} index={index} />
       ))}

src/pages/home/index.tsx

@@ -2,17 +2,12 @@ import { Box, useTheme } from '@mui/material';
 import Hero from 'components/Hero';
 import Categories from './Categories';
 import { Helmet } from 'react-helmet';
-import UserTypeFilter, { useUserTypeFilter } from 'components/UserTypeFilter';
-import { UserType } from '@tools/defineTool';
+import { useUserTypeFilter } from 'providers/UserTypeFilterProvider';
+import UserTypeFilter from '@components/UserTypeFilter';
 
 export default function Home() {
   const theme = useTheme();
   const { selectedUserTypes, setSelectedUserTypes } = useUserTypeFilter();
-
-  const handleUserTypesChange = (userTypes: UserType[]) => {
-    setSelectedUserTypes(userTypes);
-  };
-
   return (
     <Box
       padding={{
@@ -36,11 +31,12 @@ export default function Home() {
     >
       <Helmet title={'OmniTools'} />
       <Hero />
-      <UserTypeFilter
-        selectedUserTypes={selectedUserTypes}
-        onUserTypesChange={handleUserTypesChange}
-        label="Filter by User Type"
-      />
+      <Box my={3}>
+        <UserTypeFilter
+          selectedUserTypes={selectedUserTypes}
+          onUserTypesChange={setSelectedUserTypes}
+        />
+      </Box>
       <Categories />
     </Box>
   );