yossdotpro · paopaonyapi-creator · May 27, 2026 · May 28, 2026
diff --git a/.eslintignore b/.eslintignore
diff --git a/.eslintrc.json b/.eslintrc.json
diff --git 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
@@ -7,7 +7,6 @@ import {
   forwardRef,
   useCallback,
   useContext,
-  useEffect,
   useRef,
   useState,
 } from "react"
@@ -74,19 +73,18 @@ 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,
     } = dropzoneOptions
 
     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
@@ -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