diff --git a/src/pages/blocks/components/CreateBlockModal.tsx b/src/components/blocks/CreateBlockModal.tsx
similarity index 93%
rename from src/pages/blocks/components/CreateBlockModal.tsx
rename to src/components/blocks/CreateBlockModal.tsx
index 8feaf26c..fce2f871 100644
--- a/src/pages/blocks/components/CreateBlockModal.tsx
+++ b/src/components/blocks/CreateBlockModal.tsx
@@ -110,13 +110,6 @@ const CreateBlockModal: React.FC<CreateBlockModalProps> = ({
   );
 };
 
-export async function getStaticProps({ locale }: any) {
-  return {
-    props: {
-      ...(await serverSideTranslations(locale, ['common'])),
-      // Other props you want to pass to your component
-    },
-  };
-}
+
 
 export default CreateBlockModal;
diff --git a/src/pages/blocks/components/FilterModal.tsx b/src/components/blocks/FilterBlockModal.tsx
similarity index 78%
rename from src/pages/blocks/components/FilterModal.tsx
rename to src/components/blocks/FilterBlockModal.tsx
index 8b85f896..c9fe130e 100644
--- a/src/pages/blocks/components/FilterModal.tsx
+++ b/src/components/blocks/FilterBlockModal.tsx
@@ -22,9 +22,6 @@ import { useTheme } from '@mui/material/styles';
 interface FilterModalProps {
   open: boolean;
   handleClose: () => void;
-  blocks: string[];
-  selectedBlocks: string[];
-  setSelectedBlocks: (blocks: string[]) => void;
   sortOrder: string;
   setSortOrder: (order: string) => void;
   onApply: () => void;
@@ -33,32 +30,13 @@ interface FilterModalProps {
 const FilterModal: React.FC<FilterModalProps> = ({
   open,
   handleClose,
-  blocks,
-  selectedBlocks,
-  setSelectedBlocks,
   sortOrder,
   setSortOrder,
   onApply,
 }) => {
   const { t } = useTranslation();
-  const [searchInput, setSearchInput] = useState('');
-  const theme = useTheme<any>();
-
-  const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-    setSearchInput(event.target.value);
-  };
 
-  const handleBlockToggle = (block: string) => {
-    if (selectedBlocks.includes(block)) {
-      setSelectedBlocks(selectedBlocks.filter((b) => b !== block));
-    } else {
-      setSelectedBlocks([...selectedBlocks, block]);
-    }
-  };
-
-  const filteredBlocks = blocks.filter((block) =>
-    block.toLowerCase().includes(searchInput.toLowerCase())
-  );
+  const theme = useTheme<any>();
 
   const handleApplyClick = () => {
     onApply();
@@ -77,10 +55,10 @@ const FilterModal: React.FC<FilterModalProps> = ({
             p: 2,
             borderRadius: 5,
             outline: 'none',
-             position: 'absolute',
+            position: 'absolute',
             top: '50%',
             left: '50%',
-            transform: 'translate(-50%, -50%)'
+            transform: 'translate(-50%, -50%)',
           }}
         >
           <Box display="flex" justifyContent="space-between" mb={2}>
@@ -144,8 +122,11 @@ const FilterModal: React.FC<FilterModalProps> = ({
             color="primary"
             fullWidth
             onClick={handleApplyClick}
-            sx={{ mt: 2,   border: 'none',
-              backgroundColor: theme?.palette?.primary?.main }}
+            sx={{
+              mt: 2,
+              border: 'none',
+              backgroundColor: theme?.palette?.primary?.main,
+            }}
           >
             {t('COMMON.APPLY')}
           </Button>
diff --git a/src/pages/blocks/index.tsx b/src/pages/blocks/index.tsx
index 88f2c4eb..11bbe747 100644
--- a/src/pages/blocks/index.tsx
+++ b/src/pages/blocks/index.tsx
@@ -14,10 +14,8 @@ import Search from '@mui/icons-material/Search';
 import { ArrowDropDown, KeyboardArrowRight } from '@mui/icons-material';
 import AddIcon from '@mui/icons-material/Add';
 import { useRouter } from 'next/router';
-
-import CreateBlockModal from './components/CreateBlockModal';
-import FilterModal from './components/FilterModal';
-
+import CreateBlockModal from '@/components/blocks/CreateBlockModal';
+import FilterModal from '@/components/blocks/FilterBlockModal';
 interface BlocksProps {
   // Define any props if needed
 }
@@ -56,7 +54,7 @@ const Blocks: React.FC<BlocksProps> = () => {
   const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     const value = event.target.value;
     setSearchInput(value);
-    const filtered = blocks.filter((block) =>
+    const filtered = blocks?.filter((block) =>
       block.toLowerCase().includes(value.toLowerCase())
     );
     setFilteredBlocks(filtered);
@@ -176,9 +174,7 @@ const Blocks: React.FC<BlocksProps> = () => {
           <FilterModal
             open={filterModalOpen}
             handleClose={handleFilterModalClose}
-            blocks={blocks}
-            selectedBlocks={selectedBlocks}
-            setSelectedBlocks={setSelectedBlocks}
+  
             sortOrder={sortOrder}
             setSortOrder={setSortOrder}
             onApply={handleApplyFilters}