diff --git a/src/app/(auth)/register/page.tsx b/src/app/(auth)/register/page.tsx
index 82450fb..53e498f 100644
--- a/src/app/(auth)/register/page.tsx
+++ b/src/app/(auth)/register/page.tsx
@@ -1,9 +1,8 @@
 "use client";
 
+import ClientError from "@/core/error/ClientError";
 import createUserAction from "@/modules/auth/actions/createUserAction";
-import createUser from "@/modules/auth/actions/createUserAction";
 import { CreateUserSchema } from "@/modules/auth/formSchemas/CreateUserFormSchema";
-import DashboardError from "@/modules/dashboard/errors/DashboardError";
 import withServerAction from "@/modules/dashboard/utils/withServerAction";
 import {
 	Paper,
@@ -17,10 +16,11 @@ import {
 } from "@mantine/core";
 import { useForm } from "@mantine/form";
 import { showNotification } from "@mantine/notifications";
-import React, { useEffect, useState } from "react";
+import React from "react";
 
 export default function RegisterPage() {
-	const [errorMessage, setErrorMessage] = useState("");
+	//TODO: Display error message
+	// const [errorMessage, setErrorMessage] = useState("");
 
 	const form = useForm<CreateUserSchema>({
 		initialValues: {
@@ -43,24 +43,24 @@ export default function RegisterPage() {
 		},
 	});
 
-	const handleSubmit = async (values: CreateUserSchema) => {
+	const handleSubmit = async () => {
 		withServerAction(createUserAction, form.values)
-			.then((response) => {
+			.then(() => {
 				showNotification({message: "Register Success", color: "green"})
 			})
 			.catch((e) => {
-				if (e instanceof DashboardError) {
+				if (e instanceof ClientError) {
 					if (e.errorCode === "INVALID_FORM_DATA") {
 						form.setErrors(e.formErrors ?? {});
 					} else {
-						setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`);
+						// setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`);
 					}
 				} else if (e instanceof Error) {
-					setErrorMessage(`ERROR: ${e.message}`);
+					// setErrorMessage(`ERROR: ${e.message}`);
 				} else {
-					setErrorMessage(
-						`Unkown error is occured. Please contact administrator`
-					);
+					// setErrorMessage(
+					// 	`Unkown error is occured. Please contact administrator`
+					// );
 				}
 			})
 	};
@@ -72,7 +72,7 @@ export default function RegisterPage() {
 					Register
 				</Text>
 				<form
-					onSubmit={form.onSubmit((values) => handleSubmit(values))}
+					onSubmit={form.onSubmit(() => handleSubmit())}
 				>
 					<Stack>
 						<TextInput
diff --git a/src/app/api/login/route.ts b/src/app/api/login/route.ts
index 95ee487..1e8e598 100644
--- a/src/app/api/login/route.ts
+++ b/src/app/api/login/route.ts
@@ -3,10 +3,7 @@ import handleCatchApi from "@/core/utils/handleCatchApi";
 import AuthError from "@/modules/auth/error/AuthError";
 import signInSchema from "@/modules/auth/formSchemas/signInSchema";
 import signIn from "@/modules/auth/services/signIn";
-import getTokenFromHeaders from "@/modules/auth/utils/getTokenFromHeaders";
-import { headers } from "next/headers";
 import { NextRequest, NextResponse } from "next/server";
-import { json } from "stream/consumers";
 
 export const dynamic = "force-dynamic";
 
diff --git a/src/core/error/ClientError.ts b/src/core/error/ClientError.ts
new file mode 100644
index 0000000..e23488f
--- /dev/null
+++ b/src/core/error/ClientError.ts
@@ -0,0 +1,43 @@
+import "client-only"
+export const ClientErrorCodes = ["UNKNOWN_ERROR", "UNSUPPORTED_CONTENT_TYPE"] as const;
+
+interface ErrorOptions {
+	message?: string;
+	errorCode: (typeof ClientErrorCodes)[number] | (string & {});
+	statusCode?: number
+    formErrors?: Record<string, string>
+}
+
+class ClientError extends Error {
+	public readonly errorCode: ErrorOptions['errorCode'];
+	public readonly statusCode: ErrorOptions['statusCode'];
+    public readonly formErrors?: ErrorOptions['formErrors']
+
+	constructor(options: ErrorOptions) {
+		super(options.message ?? "Undetermined Error");
+		this.errorCode = options.errorCode ?? "UNKNOWN_ERROR";
+		this.statusCode = options.statusCode ?? 500;
+        this.formErrors = options.formErrors;
+
+		Object.setPrototypeOf(this, new.target.prototype);
+	}
+
+	getActionResponseObject() {
+		return {
+			success: false,
+			error: {
+				message: this.message,
+				errorCode: this.errorCode,
+			},
+		} as const;
+	}
+
+	getRestApiResponseObject(){
+		return {
+			message: this.message,
+			errorCode: this.errorCode
+		}
+	}
+}
+
+export default ClientError;
diff --git a/src/core/logger/Logger.ts b/src/core/logger/Logger.ts
index d682d3a..29693ab 100644
--- a/src/core/logger/Logger.ts
+++ b/src/core/logger/Logger.ts
@@ -1,3 +1,4 @@
+import "server-only"
 import { appendFileSync } from "node:fs";
 import { format } from 'date-fns';
 
diff --git a/src/modules/auth/actions/createUserAction.ts b/src/modules/auth/actions/createUserAction.ts
index 6e92ab3..4b4d2a7 100644
--- a/src/modules/auth/actions/createUserAction.ts
+++ b/src/modules/auth/actions/createUserAction.ts
@@ -1,10 +1,6 @@
 "use server";
-import { z } from "zod";
-import prisma from "@/core/db";
 import { cookies } from "next/headers";
 import { redirect } from "next/navigation";
-import { hashPassword } from "../utils/hashPassword";
-import { createJwtToken } from "../utils/createJwtToken";
 import createUser from "../services/createUser";
 import ServerResponseAction from "@/modules/dashboard/types/ServerResponseAction";
 import handleCatch from "@/modules/dashboard/utils/handleCatch";
diff --git a/src/modules/dashboard/utils/withServerAction.ts b/src/modules/dashboard/utils/withServerAction.ts
index 6d7f76b..52d1550 100644
--- a/src/modules/dashboard/utils/withServerAction.ts
+++ b/src/modules/dashboard/utils/withServerAction.ts
@@ -1,4 +1,4 @@
-import DashboardError from "../errors/DashboardError";
+import ClientError from "@/core/error/ClientError";
 import ServerResponseAction from "../types/ServerResponseAction";
 
 /**
@@ -21,7 +21,7 @@ async function withServerAction<T, Args extends unknown[] = []>(
 	} else {
         if (result.dashboardError && result.error) {
 			const errorDetails = result.error;
-			throw new DashboardError({
+			throw new ClientError({
 				message: errorDetails.message,
 				errorCode: errorDetails.errorCode,
 				formErrors: errorDetails.errors,
diff --git a/src/modules/permission/modals/PermissionDeleteModal.tsx b/src/modules/permission/modals/PermissionDeleteModal.tsx
index 910a402..7d74a3a 100644
--- a/src/modules/permission/modals/PermissionDeleteModal.tsx
+++ b/src/modules/permission/modals/PermissionDeleteModal.tsx
@@ -1,5 +1,4 @@
 "use client";
-import { useRouter } from "next/navigation";
 import React, { useState } from "react";
 import {
 	Button,
@@ -9,11 +8,9 @@ import {
 	Alert,
 } from "@mantine/core";
 import { showNotification } from "@/utils/notifications";
-import { error } from "console";
-import { revalidatePath } from "next/cache";
 import withServerAction from "@/modules/dashboard/utils/withServerAction";
 import deletePermission from "../actions/deletePermission";
-import DashboardError from "@/modules/dashboard/errors/DashboardError";
+import ClientError from "@/core/error/ClientError";
 
 export interface DeleteModalProps {
 	data?: {
@@ -24,8 +21,6 @@ export interface DeleteModalProps {
 }
 
 export default function DeleteModal(props: DeleteModalProps) {
-	const router = useRouter();
-
 	const [isSubmitting, setSubmitting] = useState(false);
 	const [errorMessage, setErrorMessage] = useState("");
 
@@ -51,7 +46,7 @@ export default function DeleteModal(props: DeleteModalProps) {
                 props.onClose()
 			})
 			.catch((e) => {
-                if (e instanceof DashboardError){
+                if (e instanceof ClientError){
                     setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`)
                 }
                 else if (e instanceof Error) {
diff --git a/src/modules/permission/modals/PermissionFormModal.tsx b/src/modules/permission/modals/PermissionFormModal.tsx
index 3428bd6..a4db843 100644
--- a/src/modules/permission/modals/PermissionFormModal.tsx
+++ b/src/modules/permission/modals/PermissionFormModal.tsx
@@ -4,25 +4,23 @@ import {
 	Flex,
 	Modal,
 	Stack,
-	Switch,
 	TextInput,
 	Textarea,
 	Button,
 	ScrollArea,
 	Checkbox,
 	Skeleton,
-	Fieldset,
 	Alert,
 } from "@mantine/core";
 import { useForm, zodResolver } from "@mantine/form";
 import { useRouter } from "next/navigation";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { TbDeviceFloppy } from "react-icons/tb";
 import permissionFormDataSchema, { PermissionFormData } from "../formSchemas/PermissionFormData";
 import getPermissionById from "../actions/getPermissionById";
 import withServerAction from "@/modules/dashboard/utils/withServerAction";
 import upsertPermission from "../actions/upsertPermission";
-import DashboardError from "@/modules/dashboard/errors/DashboardError";
+import ClientError from "@/core/error/ClientError";
 
 export interface ModalProps {
 	title: string;
@@ -103,7 +101,7 @@ export default function FormModal(props: ModalProps) {
 				closeModal();
 			})
 			.catch((e) => {
-				if (e instanceof DashboardError) {
+				if (e instanceof ClientError) {
 					if (e.errorCode === "INVALID_FORM_DATA") {
 						form.setErrors(e.formErrors ?? {});
 					} else {
diff --git a/src/modules/role/modals/DeleteModal.tsx b/src/modules/role/modals/DeleteModal.tsx
index 0b13a9e..82a0dea 100644
--- a/src/modules/role/modals/DeleteModal.tsx
+++ b/src/modules/role/modals/DeleteModal.tsx
@@ -1,5 +1,4 @@
 "use client";
-import { useRouter } from "next/navigation";
 import React, { useState } from "react";
 import {
 	Button,
@@ -11,7 +10,7 @@ import {
 import { showNotification } from "@/utils/notifications";
 import withServerAction from "@/modules/dashboard/utils/withServerAction";
 import deleteRole from "../actions/deleteRole";
-import DashboardError from "@/modules/dashboard/errors/DashboardError";
+import ClientError from "@/core/error/ClientError";
 
 export interface DeleteModalProps {
 	data?: {
@@ -22,7 +21,6 @@ export interface DeleteModalProps {
 }
 
 export default function DeleteModal(props: DeleteModalProps) {
-	const router = useRouter();
 
 	const [isSubmitting, setSubmitting] = useState(false);
 	const [errorMessage, setErrorMessage] = useState("");
@@ -49,7 +47,7 @@ export default function DeleteModal(props: DeleteModalProps) {
                 props.onClose()
 			})
 			.catch((e) => {
-                if (e instanceof DashboardError){
+                if (e instanceof ClientError){
                     setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`)
                 }
                 else if (e instanceof Error) {
diff --git a/src/modules/role/modals/FormModal.tsx b/src/modules/role/modals/FormModal.tsx
index ba23090..49b57b2 100644
--- a/src/modules/role/modals/FormModal.tsx
+++ b/src/modules/role/modals/FormModal.tsx
@@ -4,7 +4,6 @@ import {
 	Flex,
 	Modal,
 	Stack,
-	Switch,
 	TextInput,
 	Textarea,
 	Button,
@@ -17,15 +16,14 @@ import {
 } from "@mantine/core";
 import { useForm, zodResolver } from "@mantine/form";
 import { useRouter } from "next/navigation";
-import React, { useCallback, useEffect, useMemo, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { TbDeviceFloppy } from "react-icons/tb";
-import { string } from "zod";
 import roleFormDataSchema, { RoleFormData } from "../formSchemas/RoleFormData";
 import getAllPermissions from "@/modules/permission/actions/getAllPermissions";
 import withServerAction from "@/modules/dashboard/utils/withServerAction";
-import DashboardError from "@/modules/dashboard/errors/DashboardError";
 import getRoleById from "../actions/getRoleById";
 import upsertRole from "../actions/upsertRole";
+import ClientError from "@/core/error/ClientError";
 
 export interface ModalProps {
 	title: string;
@@ -74,7 +72,7 @@ export default function FormModal(props: ModalProps) {
 				setAllPermissions(response.data);
 			})
 			.catch((e) => {
-				if (e instanceof DashboardError) {
+				if (e instanceof ClientError) {
 					setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`);
 				} else if (e instanceof Error) {
 					setErrorMessage(`ERROR: ${e.message}`);
@@ -113,7 +111,7 @@ export default function FormModal(props: ModalProps) {
 				});
 			})
 			.catch((e) => {
-				if (e instanceof DashboardError) {
+				if (e instanceof ClientError) {
 					setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`);
 				} else if (e instanceof Error) {
 					setErrorMessage(`ERROR: ${e.message}`);
@@ -141,7 +139,7 @@ export default function FormModal(props: ModalProps) {
 				closeModal();
 			})
 			.catch((e) => {
-				if (e instanceof DashboardError) {
+				if (e instanceof ClientError) {
 					if (e.errorCode === "INVALID_FORM_DATA") {
 						form.setErrors(e.formErrors ?? {});
 					} else {
diff --git a/src/modules/role/tables/RolesTable/RolesTable.tsx b/src/modules/role/tables/RolesTable/RolesTable.tsx
index c9ff6e1..45883f8 100644
--- a/src/modules/role/tables/RolesTable/RolesTable.tsx
+++ b/src/modules/role/tables/RolesTable/RolesTable.tsx
@@ -4,7 +4,6 @@ import { Text, Flex, Button } from "@mantine/core";
 import { getCoreRowModel, useReactTable } from "@tanstack/react-table";
 import React, { useState } from "react";
 import { TbPlus } from "react-icons/tb";
-import getAllRoles from "../../actions/getAllRoles";
 import FormModal, { ModalProps } from "../../modals/FormModal";
 import DeleteModal, { DeleteModalProps } from "../../modals/DeleteModal";
 import createColumns from "./columns";
diff --git a/src/modules/userManagement/modals/UserDeleteModal.tsx b/src/modules/userManagement/modals/UserDeleteModal.tsx
index c781a4f..56ec82a 100644
--- a/src/modules/userManagement/modals/UserDeleteModal.tsx
+++ b/src/modules/userManagement/modals/UserDeleteModal.tsx
@@ -1,23 +1,16 @@
 "use client";
-import { useRouter } from "next/navigation";
 import React, { useState } from "react";
 import {
-	Avatar,
 	Button,
-	Center,
 	Flex,
 	Modal,
-	ScrollArea,
 	Text,
-	Stack,
-	TextInput,
-	Title,
 	Alert,
 } from "@mantine/core";
 import { showNotification } from "@/utils/notifications";
 import withServerAction from "@/modules/dashboard/utils/withServerAction";
 import deleteUser from "../actions/deleteUser";
-import DashboardError from "@/modules/dashboard/errors/DashboardError";
+import ClientError from "@/core/error/ClientError";
 
 export interface DeleteModalProps {
 	data?: {
@@ -28,7 +21,6 @@ export interface DeleteModalProps {
 }
 
 export default function UserDeleteModal(props: DeleteModalProps) {
-	const router = useRouter();
 
 	const [isSubmitting, setSubmitting] = useState(false);
 	const [errorMessage, setErrorMessage] = useState("");
@@ -55,7 +47,7 @@ export default function UserDeleteModal(props: DeleteModalProps) {
                 props.onClose()
 			})
 			.catch((e) => {
-                if (e instanceof DashboardError){
+                if (e instanceof ClientError){
                     setErrorMessage(`ERROR: ${e.message} (${e.errorCode})`)
                 }
                 else if (e instanceof Error) {
diff --git a/src/modules/userManagement/modals/UserFormModal.tsx b/src/modules/userManagement/modals/UserFormModal.tsx
index 4f4bb65..582f096 100644
--- a/src/modules/userManagement/modals/UserFormModal.tsx
+++ b/src/modules/userManagement/modals/UserFormModal.tsx
@@ -4,14 +4,10 @@ import {
 	Flex,
 	Modal,
 	Stack,
-	Switch,
 	TextInput,
-	Textarea,
 	Button,
 	ScrollArea,
-	Checkbox,
 	Skeleton,
-	Fieldset,
 	Alert,
 	Center,
 	Avatar,
@@ -20,7 +16,7 @@ import {
 } from "@mantine/core";
 import { useForm, zodResolver } from "@mantine/form";
 import { useRouter } from "next/navigation";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useEffect, useState } from "react";
 import { TbDeviceFloppy } from "react-icons/tb";
 import userFormDataSchema, {
 	UserFormData,
@@ -28,7 +24,7 @@ import userFormDataSchema, {
 import getUserDetailById from "../actions/getUserDetailById";
 import withServerAction from "@/modules/dashboard/utils/withServerAction";
 import upsertUser from "../actions/upsertUser";
-import DashboardError from "@/modules/dashboard/errors/DashboardError";
+import ClientError from "@/core/error/ClientError";
 import stringToColorHex from "@/core/utils/stringToColorHex";
 import getAllRoles from "@/modules/role/actions/getAllRoles";
 import Role from "@/modules/role/types/Role";
@@ -122,7 +118,7 @@ export default function UserFormModal(props: ModalProps) {
 				closeModal();
 			})
 			.catch((e) => {
-				if (e instanceof DashboardError) {
+				if (e instanceof ClientError) {
 					if (e.errorCode === "INVALID_FORM_DATA") {
 						form.setErrors(e.formErrors ?? {});
 					} else {