diff --git a/src/components/property/buttonAction.tsx b/src/components/property/buttonAction.tsx
index 8300b1d..bd2943e 100644
--- a/src/components/property/buttonAction.tsx
+++ b/src/components/property/buttonAction.tsx
@@ -4,7 +4,7 @@
 import type { ButtonComponent, Component } from "../../types/component";
 import type { Screen } from "../../types/screen";
 import type { Table } from "../../types/table";
-import { useEffect, useMemo, useState } from "react"
+import { useEffect, useState } from "react"
 import { MdEdit } from "react-icons/md";
 
 interface ButtonActionPropertiesProps {
@@ -27,7 +27,7 @@
     activateSelectMode
 }: ButtonActionPropertiesProps) {
 
-    const buttonAction = useMemo(() => component.action?.type ?? "", [component]);
+    const buttonAction = component.action?.type ?? "";
     const [action, setAction] = useState<ButtonActionType | "">(component.action?.type ?? "");
 
     useEffect(() => {
@@ -107,7 +107,7 @@
     updateComponent,
 }: NavigatePropertiesProps) {
 
-    const originalScreenName = useMemo(() => (component.action?.action as ButtonNavigateAction)?.nextScreenName ?? "", [component])
+    const originalScreenName = (component.action?.action as ButtonNavigateAction)?.nextScreenName ?? "";
     const [screenName, setScreenName] = useState<string>(originalScreenName);
 
     useEffect(() => {
@@ -186,13 +186,15 @@
     activateSelectMode
 }: AddDataPropertiesProps) {
 
-    const buttonAction = useMemo(() => (component.action?.type ?? "") === "addData" ? component.action?.action as ButtonAddDataAction
+    const buttonAction = 
+        (component.action?.type ?? "") === "addData" 
+        ? component.action?.action as ButtonAddDataAction
         : {
             tableName: "",
             newData: {},
             failScreenName: "",
             successScreenName: ""
-        }, [component])
+        };
 
     const [tableName, setTableName] = useState<string>(buttonAction?.tableName ?? "");
     const [data, setData] = useState<{ [key: string]: string }>(buttonAction?.newData ?? {});
@@ -395,13 +397,15 @@
     activateSelectMode
 }: UpdateDataPropertiesProps) {
 
-    const buttonAction = useMemo(() => (component.action?.type ?? "") === "updateData" ? component.action?.action as ButtonUpdateDataAction
+    const buttonAction = 
+        (component.action?.type ?? "") === "updateData" 
+        ? component.action?.action as ButtonUpdateDataAction
         : {
             tableName: "",
             newData: {},
             failScreenName: "",
             successScreenName: ""
-        }, [component])
+        };
 
     const [tableName, setTableName] = useState<string>(buttonAction?.tableName ?? "");
     const [data, setData] = useState<{ [key: string]: string }>(buttonAction?.newData ?? {});
@@ -602,12 +606,15 @@
     activateSelectMode
 }: DeleteDataPropertiesProps) {
 
-    const buttonAction = useMemo(() => (component.action?.type ?? "") === "deleteData" ? component.action?.action as ButtonDeleteDataAction : {
-        tableName: "",
-        deleteData: {},
-        failScreenName: "",
-        successScreenName: ""
-    }, [component])
+    const buttonAction = 
+        (component.action?.type ?? "") === "deleteData" 
+        ? component.action?.action as ButtonDeleteDataAction 
+        : {
+            tableName: "",
+            deleteData: {},
+            failScreenName: "",
+            successScreenName: ""
+        };
 
     const [tableName, setTableName] = useState<string>(buttonAction?.tableName ?? "");
     const [data, setData] = useState<{ [key: string]: string }>(buttonAction?.deleteData ?? {});
@@ -800,11 +807,14 @@
     activateSelectMode
 }: SearchDataPropertiesProps) {
 
-    const buttonAction = useMemo(() => (component.action?.type ?? "") === "searchData" ? component.action?.action as ButtonSearchDataAction : {
+    const buttonAction = 
+    (component.action?.type ?? "") === "searchData" 
+    ? component.action?.action as ButtonSearchDataAction 
+    : {
         tableName: "",
         searchData: {},
         targetComponentName: ""
-    } as ButtonSearchDataAction, [component])
+    } as ButtonSearchDataAction 
 
     const [tableName, setTableName] = useState<string>(buttonAction?.tableName ?? "");
     const [selectableColumns, setSelectableColumns] = useState<string[]>(Object.keys(buttonAction?.searchData ?? {}));
diff --git a/src/components/property/buttonGeneral.tsx b/src/components/property/buttonGeneral.tsx
index 0c9fda0..3ddd3c5 100644
--- a/src/components/property/buttonGeneral.tsx
+++ b/src/components/property/buttonGeneral.tsx
@@ -1,5 +1,5 @@
 import type { ButtonGeneralData, Component } from "../../types/component";
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 
 
 interface ButtonGeneralPropertiesProps {
@@ -14,7 +14,7 @@
     updateComponent,
 }: ButtonGeneralPropertiesProps) {
 
-    const generalData = useMemo(() => component.generalData as ButtonGeneralData, [component])
+    const generalData = component.generalData as ButtonGeneralData;
     const [text, setText] = useState<string>(generalData.text);
 
     useEffect(() => {
diff --git a/src/components/property/property.tsx b/src/components/property/property.tsx
index df180d7..1c26f53 100644
--- a/src/components/property/property.tsx
+++ b/src/components/property/property.tsx
@@ -1,7 +1,7 @@
 import type { ComponentActions, ComponentState } from "../../hooks/useComponent";
 import { ComponentType } from "../../types/component";
 import type { Component } from "../../types/component";
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 import { TextProperty } from "./textProperties";
 import { ButtonProperty } from "./buttonProperties";
 import type { Table } from "../../types/table";
@@ -58,7 +58,8 @@
     curScreenIndex,
     componentActions
 }: ComponentPropertyAreaProps) {
-    const componentName = useMemo(() => component.name, [component])
+    
+    const componentName = component.name;
     const [name, setName] = useState<string>(componentName);
     const [activeTab, setActiveTab] = useState<ActiveTab>(ActiveTab.GENERAL);
 
diff --git a/src/components/property/tableProperties.tsx b/src/components/property/tableProperties.tsx
index 4b2f21c..86de231 100644
--- a/src/components/property/tableProperties.tsx
+++ b/src/components/property/tableProperties.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from "react"
+import { useEffect, useState } from "react"
 import { ActiveTab } from "../../constants/activeTab"
 import type { Component, TableComponent, TableGeneralData } from "../../types/component"
 import type { Table } from "../../types/table"
@@ -21,9 +21,9 @@
     updateComponent,
 }: TablePropertyProps) {
 
-    const generalData = useMemo(() => component.generalData as TableGeneralData, [component])
+    const generalData = component.generalData as TableGeneralData;
     const [reference, setReference] = useState<string>(generalData.referenceTableName);
-    const selectableColumns = useMemo(() => tables.find(table => table.name === reference)?.columns ?? [], [tables, reference])
+    const selectableColumns = tables.find(table => table.name === reference)?.columns ?? [];
     const [columns, setColumns] = useState<string[]>(generalData.columns);
 
     useEffect(() => {
diff --git a/src/components/property/textProperties.tsx b/src/components/property/textProperties.tsx
index 47e85f0..8167507 100644
--- a/src/components/property/textProperties.tsx
+++ b/src/components/property/textProperties.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from "react"
+import { useEffect, useState } from "react"
 import { ActiveTab } from "../../constants/activeTab"
 import type { Component, TextComponent, TextGeneralData } from "../../types/component"
 import { MdEdit } from "react-icons/md"
@@ -20,7 +20,7 @@
     updateComponent,
 }: TextPropertyProps) {
 
-    const generalData = useMemo(() => component.generalData as TextGeneralData, [component])
+    const generalData = component.generalData as TextGeneralData;
     const [text, setText] = useState<string>(generalData.text);
     const [selectMode, setSelectMode] = useState<boolean>(false);
 
diff --git a/src/components/sidebar/screenList.tsx b/src/components/sidebar/screenList.tsx
index be97afa..e8ab75d 100644
--- a/src/components/sidebar/screenList.tsx
+++ b/src/components/sidebar/screenList.tsx
@@ -5,7 +5,7 @@
 import { ComponentType } from "../../types/component"
 import type { ButtonComponent, Component, TextComponent, TextFieldComponent } from "../../types/component";
 import type { Screen } from "../../types/screen"
-import { useMemo, useState } from "react";
+import { useState } from "react";
 import { FiEdit3, FiMoreHorizontal, FiTrash2, FiX } from "react-icons/fi"
 
 interface ScreenListPorps {
@@ -369,7 +369,7 @@
 
 function AddTemplate({ tableState, componenetActions, screenName, screenActions, screenState, close }: AddTemplateProps) {
 
-    const tables = useMemo(() => tableState.tables, [tableState.tables])
+    const tables = tableState.tables;
     const [selectedTableId, setSelectedTableId] = useState("");
     const [successScreen, setSuccessScreen] = useState("");
 
diff --git a/src/components/sidebar/tableList.tsx b/src/components/sidebar/tableList.tsx
index b1d5770..0256100 100644
--- a/src/components/sidebar/tableList.tsx
+++ b/src/components/sidebar/tableList.tsx
@@ -1,7 +1,7 @@
 import type { TablesActions, TablesState } from "../../hooks/useTables";
 import { DataType,  translateDataType } from "../../types/table";
 import type { Column, Table } from "../../types/table";
-import { useMemo, useState } from "react"
+import { useState } from "react"
 import { FiX } from "react-icons/fi";
 import { MdDeleteOutline, MdOutlineDelete, MdOutlineEdit } from "react-icons/md";
 
@@ -483,10 +483,7 @@
 
     const [name, setName] = useState<string>(column?.name ?? "")
     const [referencedTableId, setReferencedTableId] = useState<string>(column?.foreignTableName ?? "");
-    const referencedTableColumns = useMemo(
-        () => tables.find((table) => table.name === referencedTableId)?.columns ?? [],
-        [referencedTableId, tables]
-    )
+    const referencedTableColumns = tables.find((table) => table.name === referencedTableId)?.columns ?? [];
     const [selectedColumns, setSelectedColumns] = useState<string[]>(column?.foreignTableColumns ?? []);
 
     const selectRefTable = (tableId: string) => {
diff --git a/src/hooks/useComponent.ts b/src/hooks/useComponent.ts
index d0e4445..caf143e 100644
--- a/src/hooks/useComponent.ts
+++ b/src/hooks/useComponent.ts
@@ -1,7 +1,7 @@
 import type { ButtonGeneralData, Component, GeneralData, TableGeneralData, TextFieldGeneralData, TextGeneralData, UIData } from "../types/component";
 import { ComponentType } from "../types/component";
 import type { Screen } from "../types/screen";
-import { useCallback, useMemo, useRef, useState } from "react";
+import { useCallback, useRef, useState } from "react";
 import type { Dispatch, SetStateAction } from "react";
 
 export interface ComponentState {
@@ -42,15 +42,10 @@
 
     const [selectingComponentIndex, setSelectingComponentIndex] = useState<number>(-1);
     const [selectMode, setSelectMode] = useState<boolean>(false);
-    // const [selectComponentCallback, setSelectComponentCallback] = useState<SelectComponentListenerType | null>(null);
     const selectComponentCallbackRef = useRef<SelectComponentListenerType | null>(null);
-    const curScreenComponents: Component[] = useMemo(() => curScreen.components, [curScreen])
-    const selectingComponent: Component | null = useMemo(() => {
-        if (selectingComponentIndex === -1) {
-            return null;
-        }
-        return curScreenComponents[selectingComponentIndex]
-    }, [curScreenComponents, selectingComponentIndex]);
+    
+    const curScreenComponents: Component[] = curScreen.components;
+    const selectingComponent = selectingComponentIndex === -1 ? null : curScreenComponents[selectingComponentIndex];
 
     function getInitialGeneralData(type: ComponentType): GeneralData {
         switch (type) {
@@ -140,15 +135,6 @@
             } : screen
         ));
 
-        // await fetch(`/api/projects/${curScreen.projectId}/screens/${curScreen.id}/components`, {
-        //     method: "POST",
-        //     headers: {
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({
-        //         newComponents: [newComponent],
-        //     }),
-        // });
     }
 
     const addComponents = async (components: Component[], screenId: string) => {
@@ -158,16 +144,6 @@
                 components: [...screen.components, ...components]
             } : screen
         ));
-
-        // await fetch(`/api/projects/${curScreen.projectId}/screens/${screenId}/components`, {
-        //     method: "POST",
-        //     headers: {
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({
-        //         newComponents: components,
-        //     }),
-        // });
     }
 
     const moveComponent = async (index: number, uiData: UIData) => {
@@ -178,13 +154,6 @@
                 components: screens[i].components.map((comp, j) => j === index ? { ...comp, uiData: uiData } : comp)
             } : screen
         ));
-        // await fetch(`/api/projects/${curScreen.projectId}/screens/${curScreen.id}/components/${selectingComponent.id}/uiData`, {
-        //     method: "PUT",
-        //     headers: {
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({ uiData: uiData }),
-        // });
     }
 
     const deleteComponent = async (index: number) => {
@@ -192,10 +161,6 @@
             ...screen,
             components: screen.components.filter((_, compIdx) => compIdx !== index)
         } : screen)));
-        
-        // await fetch(`/api/projects/${curScreen.projectId}/screens/${curScreen.id}/components/${id}`, {
-        //     method: "DELETE",
-        // });
     }
 
     const updateComponent = (index: number, newComponent: Component) => {
diff --git a/src/hooks/useDragComponent.ts b/src/hooks/useDragComponent.ts
index 3bee4e9..b1f9735 100644
--- a/src/hooks/useDragComponent.ts
+++ b/src/hooks/useDragComponent.ts
@@ -1,5 +1,5 @@
 import type { Component, UIData } from "../types/component";
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 
 export function useDragComponent(
     selectingComponent: Component | null,
@@ -13,10 +13,10 @@
     const [componentY, setComponentY] = useState<number>(0);
     const [componentW, setComponentW] = useState<number>(0);
     const [componentH, setComponentH] = useState<number>(0);
-    const baseX = useMemo(() => selectingComponent ? selectingComponent.uiData.posX : 0, [selectingComponent])
-    const baseY = useMemo(() => selectingComponent ? selectingComponent.uiData.posY : 0, [selectingComponent])
-    const baseW = useMemo(() => selectingComponent ? selectingComponent.uiData.width : 0, [selectingComponent])
-    const baseH = useMemo(() => selectingComponent ? selectingComponent.uiData.height : 0, [selectingComponent])
+    const baseX = selectingComponent ? selectingComponent.uiData.posX : 0;
+    const baseY = selectingComponent ? selectingComponent.uiData.posY : 0;
+    const baseW = selectingComponent ? selectingComponent.uiData.width : 0;
+    const baseH = selectingComponent ? selectingComponent.uiData.height : 0;
 
     const [prevX, setPrevX] = useState<number>(0);
     const [prevY, setPrevY] = useState<number>(0);
diff --git a/src/hooks/useScreen.ts b/src/hooks/useScreen.ts
index 6caeb03..733f161 100644
--- a/src/hooks/useScreen.ts
+++ b/src/hooks/useScreen.ts
@@ -1,6 +1,6 @@
 import type { Project } from "../types/project";
 import type { Screen } from "../types/screen";
-import { useMemo, useState } from "react";
+import { useState } from "react";
 import type { Dispatch, SetStateAction } from "react";
 
 export interface ScreenState {
@@ -29,8 +29,7 @@
     const [screens, setScreens] = useState<Screen[]>(project.screens);
     const [curScreenIndex, setCurScreenIndex] = useState<number>(0);
 
-    const curScreen: Screen = useMemo(() => screens[curScreenIndex], [screens, curScreenIndex]);
-
+    const curScreen: Screen = screens[curScreenIndex];
 
     const addScreen = async (name: string): Promise<string> => {
         const nextIndex = screens[screens.length - 1].index + 1;
@@ -46,36 +45,15 @@
         setScreens((curScreens) => [...curScreens, newScreen]);
         setCurScreenIndex(screens.length - 1);
 
-        // await fetch(`/api/projects/${project.id}/screens`, {
-        //     method: "POST",
-        //     headers: {
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({
-        //         newScreen: newScreen
-        //     }),
-        // });
         return newScreenId;
     };
 
     const deleteScreen = async (index: number) => {
         setCurScreenIndex(0);
-        // const screenId = screens[index].id;
-        // await fetch(`/api/projects/${project.id}/screens/${screenId}`, { method: "DELETE" })
         setScreens((prev) => prev.filter((_, i) => i !== index));
     }
 
     const updateScreen = async (index: number, name: string) => {
-        // const screenId = screens[index].id;
-        // await fetch(`/api/projects/${project.id}/screens/${screenId}`, {
-        //     method: "PUT",
-        //     headers: {
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({
-        //         name: name,
-        //     }),
-        // })
         setScreens((prev) => prev.map((item, i) => i === index ? { ...item, name: name } : item));
     }
 
diff --git a/src/hooks/useTables.ts b/src/hooks/useTables.ts
index 05ea89d..34cf4d4 100644
--- a/src/hooks/useTables.ts
+++ b/src/hooks/useTables.ts
@@ -23,35 +23,14 @@
 
     const addTable = async (table: Table) => {
         setTables(cur => [...cur, table])
-        // await fetch(`/api/projects/${project.id}/tables`, {
-        //     method: "POST",
-        //     headers: {
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({
-        //         newTable: table,
-        //     }),
-        // });
     }
 
     const deleteTable = async (id: string) => {
         setTables(cur => cur.filter((cur) => cur.id !== id))
-        // await fetch(`/api/projects/${project.id}/tables/${id}`, {
-        //     method: "DELETE",
-        // });
     }
 
     const updateTable = async (updatedTable: Table) => {
         setTables(cur => cur.map((table) => table.id === updatedTable.id ? updatedTable : table));
-        // await fetch(`/api/projects/${project.id}/tables/${updatedTable.id}`, {
-        //     method: "PUT",
-        //     headers: {
-        //         'Content-Type': 'application/json',
-        //     },
-        //     body: JSON.stringify({
-        //         table: updatedTable,
-        //     }),
-        // });
     }
 
     return {