diff --git a/.eslintignore b/.eslintignore
deleted file mode 100644
index dc0f9d8..0000000
--- a/.eslintignore
+++ /dev/null
@@ -1,5 +0,0 @@
-dist/*
-.cache
-public
-node_modules
-*.esm.js
diff --git a/.eslintrc.json b/.eslintrc.json
deleted file mode 100644
index fe113b7..0000000
--- a/.eslintrc.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/eslintrc",
-  "root": true,
-  "extends": [
-    "next/core-web-vitals",
-    "prettier",
-    "plugin:tailwindcss/recommended"
-  ],
-  "plugins": ["tailwindcss"],
-  "rules": {
-    "@next/next/no-html-link-for-pages": "off",
-    "react/jsx-key": "off",
-    "tailwindcss/no-custom-classname": "off"
-  },
-  "settings": {
-    "tailwindcss": {
-      "callees": ["cn"],
-      "config": "tailwind.config.js"
-    },
-    "next": {
-      "rootDir": ["./"]
-    }
-  },
-  "overrides": [
-    {
-      "files": ["*.ts", "*.tsx"],
-      "parser": "@typescript-eslint/parser"
-    }
-  ]
-}
diff --git a/components/editor/hooks/use-onnx-session.ts b/components/editor/hooks/use-onnx-session.ts
index 91c3693..5fa12db 100644
--- a/components/editor/hooks/use-onnx-session.ts
+++ b/components/editor/hooks/use-onnx-session.ts
@@ -151,7 +151,7 @@ export const useOnnxSession = (
 
       return blob
     },
-    [getOrCreateSession]
+    [getOrCreateSession, ortRef]
   )
 
   /**
@@ -211,7 +211,7 @@ export const useOnnxSession = (
 
       return blob
     },
-    [getOrCreateSession]
+    [getOrCreateSession, ortRef]
   )
 
   return {
diff --git a/components/ui/file-uploader.tsx b/components/ui/file-uploader.tsx
index 6794e48..6c5efc0 100644
--- a/components/ui/file-uploader.tsx
+++ b/components/ui/file-uploader.tsx
@@ -7,7 +7,6 @@ import {
   forwardRef,
   useCallback,
   useContext,
-  useEffect,
   useRef,
   useState,
 } from "react"
@@ -74,12 +73,10 @@ export const FileUploader = forwardRef<
     ref
   ) => {
     const [isFileTooBig, setIsFileTooBig] = useState(false)
-    const [isLOF, setIsLOF] = useState(false)
     const [activeIndex, setActiveIndex] = useState(-1)
+    const inputRef = useRef<HTMLInputElement | null>(null)
     const {
-      accept = {
-        "image/*": [".jpg", ".jpeg", ".png", ".gif"],
-      },
+      accept = { "image/*": [".jpg", ".jpeg", ".png", ".gif"] },
       maxFiles = 1,
       maxSize = 4 * 1024 * 1024,
       multiple = true,
@@ -87,6 +84,7 @@ export const FileUploader = forwardRef<
 
     const reSelectAll = maxFiles === 1 ? true : reSelect
     const direction: DirectionOptions = dir === "rtl" ? "rtl" : "ltr"
+    const isLOF = Boolean(value?.length && value.length === maxFiles)
 
     const removeFileFromSet = useCallback(
       (i: number) => {
@@ -97,6 +95,38 @@ export const FileUploader = forwardRef<
       [value, onValueChange]
     )
 
+    const dropzoneState = useDropzone({
+      ...(dropzoneOptions ? dropzoneOptions : { accept, maxFiles, maxSize, multiple }),
+      onDrop: (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {
+        const newValues: File[] = value ? [...value] : []
+
+        if (reSelectAll) {
+          newValues.splice(0, newValues.length)
+        }
+
+        acceptedFiles.forEach((file) => {
+          if (newValues.length < maxFiles) newValues.push(file)
+        })
+
+        onValueChange(newValues)
+
+        if (rejectedFiles.length > 0) {
+          for (const rejected of rejectedFiles) {
+            if (rejected.errors[0]?.code === "file-too-large") {
+              toast.error(`File is too large. Max size is ${maxSize / 1024 / 1024}MB`)
+              break
+            }
+            if (rejected.errors[0]?.message) {
+              toast.error(rejected.errors[0].message)
+              break
+            }
+          }
+        }
+      },
+      onDropRejected: () => setIsFileTooBig(true),
+      onDropAccepted: () => setIsFileTooBig(false),
+    })
+
     const handleKeyDown = useCallback(
       (e: React.KeyboardEvent<HTMLDivElement>) => {
         e.preventDefault()
@@ -134,7 +164,7 @@ export const FileUploader = forwardRef<
           movePrev()
         } else if (e.key === "Enter" || e.key === "Space") {
           if (activeIndex === -1) {
-            (dropzoneState.inputRef.current as any)?.click()
+            ;(dropzoneState as typeof dropzoneState & { open?: () => void }).open?.()
           }
         } else if (e.key === "Delete" || e.key === "Backspace") {
           if (activeIndex !== -1) {
@@ -149,74 +179,13 @@ export const FileUploader = forwardRef<
           setActiveIndex(-1)
         }
       },
-      [value, activeIndex, removeFileFromSet]
-    )
-
-    const onDrop = useCallback(
-      (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {
-        const files = acceptedFiles
-
-        if (!files) {
-          toast.error("file error , probably too big")
-          return
-        }
-
-        const newValues: File[] = value ? [...value] : []
-
-        if (reSelectAll) {
-          newValues.splice(0, newValues.length)
-        }
-
-        files.forEach((file) => {
-          if (newValues.length < maxFiles) {
-            newValues.push(file)
-          }
-        })
-
-        onValueChange(newValues)
-
-        if (rejectedFiles.length > 0) {
-          for (let i = 0; i < rejectedFiles.length; i++) {
-            if (rejectedFiles[i].errors[0]?.code === "file-too-large") {
-              toast.error(
-                `File is too large. Max size is ${maxSize / 1024 / 1024}MB`
-              )
-              break
-            }
-            if (rejectedFiles[i].errors[0]?.message) {
-              toast.error(rejectedFiles[i].errors[0].message)
-              break
-            }
-          }
-        }
-      },
-      [reSelectAll, value]
+      [value, activeIndex, removeFileFromSet, orientation, direction, dropzoneState]
     )
 
-    useEffect(() => {
-      if (!value) return
-      if (value.length === maxFiles) {
-        setIsLOF(true)
-        return
-      }
-      setIsLOF(false)
-    }, [value, maxFiles])
-
-    const opts = dropzoneOptions
-      ? dropzoneOptions
-      : { accept, maxFiles, maxSize, multiple }
-
-    const dropzoneState = useDropzone({
-      ...opts,
-      onDrop,
-      onDropRejected: () => setIsFileTooBig(true),
-      onDropAccepted: () => setIsFileTooBig(false),
-    })
-
     return (
       <FileUploaderContext.Provider
         value={{
-          dropzoneState,
+          dropzoneState: { ...dropzoneState, inputRef: inputRef as unknown as React.RefObject<HTMLInputElement> },
           isLOF,
           isFileTooBig,
           removeFileFromSet,
@@ -230,13 +199,9 @@ export const FileUploader = forwardRef<
           ref={ref}
           tabIndex={0}
           onKeyDownCapture={handleKeyDown}
-          className={cn(
-            "grid w-full overflow-hidden focus:outline-none ",
-            className,
-            {
-              "gap-2": value && value.length > 0,
-            }
-          )}
+          className={cn("grid w-full overflow-hidden focus:outline-none ", className, {
+            "gap-2": value && value.length > 0,
+          })}
           dir={dir}
           {...props}
         >
@@ -257,11 +222,7 @@ export const FileUploaderContent = forwardRef<
   const containerRef = useRef<HTMLDivElement>(null)
 
   return (
-    <div
-      className={cn("w-full px-1")}
-      ref={containerRef}
-      aria-description="content file holder"
-    >
+    <div className={cn("w-full px-1")} ref={containerRef} aria-description="content file holder">
       <div
         {...props}
         ref={ref}
@@ -301,10 +262,7 @@ export const FileUploaderItem = forwardRef<
       </div>
       <button
         type="button"
-        className={cn(
-          "absolute",
-          direction === "rtl" ? "left-1 top-1" : "right-1 top-1"
-        )}
+        className={cn("absolute", direction === "rtl" ? "left-1 top-1" : "right-1 top-1")}
         onClick={() => removeFileFromSet(index)}
       >
         <span className="sr-only">remove item {index}</span>
@@ -322,12 +280,12 @@ export const FileInput = forwardRef<
 >(({ className, children, ...props }, ref) => {
   const { dropzoneState, isFileTooBig, isLOF } = useFileUpload()
   const rootProps = isLOF ? {} : dropzoneState.getRootProps()
+  const inputProps = dropzoneState.getInputProps()
   return (
     <div
       ref={ref}
       {...props}
-      className={`relative w-full ${isLOF ? "cursor-not-allowed opacity-50 " : "cursor-pointer "
-        }`}
+      className={`relative w-full ${isLOF ? "cursor-not-allowed opacity-50 " : "cursor-pointer "}`}
     >
       <div
         className={cn(
@@ -345,9 +303,8 @@ export const FileInput = forwardRef<
         {children}
       </div>
       <Input
-        ref={dropzoneState.inputRef}
         disabled={isLOF}
-        {...dropzoneState.getInputProps()}
+        {...inputProps}
         className={`${isLOF ? "cursor-not-allowed" : ""}`}
       />
     </div>
diff --git a/components/ui/spinning-number.tsx b/components/ui/spinning-number.tsx
index a114359..519a2b5 100644
--- a/components/ui/spinning-number.tsx
+++ b/components/ui/spinning-number.tsx
@@ -1,6 +1,6 @@
 "use client"
 
-import { useEffect, useRef, useState } from "react"
+import { useMemo, useRef } from "react"
 import { motion } from "framer-motion"
 
 type SpinningNumberProps = React.DetailedHTMLProps<
@@ -18,28 +18,8 @@ export const SpinningNumber = ({
   ...props
 }: SpinningNumberProps) => {
   const ref = useRef<HTMLDivElement>(null)
-
-  const [splitted, setSplitted] = useState(value.toString().split(""))
-  const [lineHeight, setLineHeight] = useState(0)
-
-  useEffect(() => {
-    const element = ref.current
-    if (element) {
-      const tempElement = (globalThis as any).document.createElement("span")
-      tempElement.style.fontSize = (globalThis as any).window.getComputedStyle(element).fontSize
-      tempElement.style.fontFamily = (globalThis as any).window.getComputedStyle(element).fontFamily
-      tempElement.style.lineHeight = (globalThis as any).window.getComputedStyle(element).lineHeight;
-      tempElement.textContent = "dummy";
-      (element as any).appendChild(tempElement)
-      const height = tempElement.offsetHeight
-        (element as any).removeChild(tempElement)
-      setLineHeight(height)
-    }
-  }, [lineHeight])
-
-  useEffect(() => {
-    setSplitted(value.toString().split(""))
-  }, [value])
+  const splitted = useMemo(() => value.toString().split(""), [value])
+  const lineHeight = 24
 
   return (
     <div className={className} {...props}>
@@ -56,7 +36,7 @@ export const SpinningNumber = ({
             <SingleNumber
               key={i}
               index={i}
-              number={+num}
+              number={Number(num)}
               lineHeight={lineHeight}
               animationDuration={animationDuration}
             />
@@ -80,12 +60,8 @@ export const SingleNumber = ({
   lineHeight,
   animationDuration,
 }: SingleNumberProps) => {
-  const nums = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
-  const [y, setY] = useState(-1 * nums.indexOf(number) * lineHeight)
-
-  useEffect(() => {
-    setY(-1 * nums.indexOf(number) * lineHeight)
-  }, [number, lineHeight])
+  const nums = useMemo(() => [0, 1, 2, 3, 4, 5, 6, 7, 8, 9], [])
+  const y = -1 * nums.indexOf(number) * lineHeight
 
   return (
     <motion.div
diff --git a/eslint.config.mjs b/eslint.config.mjs
new file mode 100644
index 0000000..58323f8
--- /dev/null
+++ b/eslint.config.mjs
@@ -0,0 +1,58 @@
+import js from "@eslint/js"
+import nextPlugin from "@next/eslint-plugin-next"
+import reactHooks from "eslint-plugin-react-hooks"
+import tseslint from "typescript-eslint"
+
+export default [
+  {
+    ignores: [
+      "**/.next/**",
+      "**/node_modules/**",
+      "**/dist/**",
+      "**/coverage/**",
+      "**/removerized/**",
+      "**/tailwind.config.cjs",
+      "**/postcss.config.js",
+      "**/postcss.config.mjs",
+    ],
+  },
+  js.configs.recommended,
+  ...tseslint.configs.recommended,
+  {
+    files: ["**/*.{js,jsx,mjs,ts,tsx}"],
+    languageOptions: {
+      parser: tseslint.parser,
+      parserOptions: {
+        ecmaFeatures: { jsx: true },
+        ecmaVersion: 2022,
+        sourceType: "module",
+      },
+      globals: {
+        window: "readonly",
+        document: "readonly",
+        navigator: "readonly",
+        File: "readonly",
+        Blob: "readonly",
+        HTMLImageElement: "readonly",
+      },
+    },
+    plugins: {
+      "@next/next": nextPlugin,
+      "react-hooks": reactHooks,
+    },
+    rules: {
+      ...nextPlugin.configs.recommended.rules,
+      ...nextPlugin.configs["core-web-vitals"].rules,
+      ...reactHooks.configs.recommended.rules,
+      "@next/next/no-html-link-for-pages": "off",
+      "react-hooks/exhaustive-deps": "warn",
+    },
+  },
+  {
+    files: ["**/*.cjs"],
+    languageOptions: {
+      ecmaVersion: 2022,
+      sourceType: "commonjs",
+    },
+  },
+]
diff --git a/package.json b/package.json
index ff06da2..5b4462f 100644
--- a/package.json
+++ b/package.json
@@ -6,8 +6,8 @@
     "dev": "next dev",
     "build": "next build --webpack",
     "start": "next start",
-    "lint": "next lint",
-    "lint:fix": "next lint --fix",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
     "preview": "next build && next start",
     "typecheck": "tsc --noEmit",
     "format:write": "prettier --write \"**/*.{ts,tsx,mdx}\" --cache",
@@ -32,7 +32,6 @@
     "@serwist/next": "^9.5.7",
     "@vercel/analytics": "^2.0.1",
     "@vercel/speed-insights": "^2.0.0",
-    "cheerio": "^1.0.0-rc.12",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
     "embla-carousel-react": "^8.0.0",
@@ -59,32 +58,40 @@
     "tailwindcss-animate": "^1.0.6"
   },
   "devDependencies": {
+    "@eslint/eslintrc": "^3.3.5",
+    "@eslint/js": "^9.39.4",
     "@ianvs/prettier-plugin-sort-imports": "^3.7.2",
+    "@next/eslint-plugin-next": "^16.2.6",
     "@serwist/turbopack": "^9.5.7",
-    "@types/cheerio": "^0.22.35",
     "@types/luxon": "^3.4.2",
     "@types/node": "^17.0.45",
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
-    "@typescript-eslint/parser": "^5.61.0",
+    "@typescript-eslint/eslint-plugin": "^8.60.0",
+    "@typescript-eslint/parser": "^8.60.0",
     "autoprefixer": "^10.4.14",
     "esbuild": "^0.28.0",
-    "eslint": "^8.44.0",
+    "eslint": "^9.39.4",
     "eslint-config-next": "16.2.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-react": "^7.32.2",
-    "eslint-plugin-tailwindcss": "^3.13.0",
+    "eslint-plugin-react-hooks": "^7.1.1",
     "postcss": "^8.4.24",
     "prettier": "^2.8.8",
+    "update-browserslist-db": "^1.2.3",
     "serwist": "^9.5.7",
     "tailwindcss": "^3.3.2",
     "ts-node": "^10.9.2",
     "typescript": "^5.4.3",
+    "typescript-eslint": "^8.60.0",
     "webpack": "^5.91.0"
   },
   "packageManager": "yarn@4.7.0",
   "resolutions": {
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3"
+  },
+  "overrides": {
+    "browserslist": "4.28.2"
   }
 }
diff --git a/postcss.config.js b/postcss.config.js
deleted file mode 100644
index 33ad091..0000000
--- a/postcss.config.js
+++ /dev/null
@@ -1,6 +0,0 @@
-module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-}
diff --git a/postcss.config.mjs b/postcss.config.mjs
new file mode 100644
index 0000000..e69de29
diff --git a/tailwind.config.js b/tailwind.config.cjs
similarity index 97%
rename from tailwind.config.js
rename to tailwind.config.cjs
index 3fbe0d9..0321eba 100644
--- a/tailwind.config.js
+++ b/tailwind.config.cjs
@@ -1,5 +1,5 @@
 const { fontFamily } = require("tailwindcss/defaultTheme")
-import animations from '@midudev/tailwind-animations'
+const animations = require("@midudev/tailwind-animations")
 
 /** @type {import('tailwindcss').Config} */
 module.exports = {