diff --git a/lama_cleaner/app/package.json b/lama_cleaner/app/package.json
index dfddaeb..024166b 100644
--- a/lama_cleaner/app/package.json
+++ b/lama_cleaner/app/package.json
@@ -18,6 +18,7 @@
"@types/react": "^17.0.30",
"@types/react-dom": "^17.0.9",
"cross-env": "7.x",
+ "nanoid": "^4.0.0",
"npm-run-all": "4.x",
"react": "^17.0.2",
"react-dom": "^17.0.2",
diff --git a/lama_cleaner/app/src/App.tsx b/lama_cleaner/app/src/App.tsx
index a80506b..012dd7f 100644
--- a/lama_cleaner/app/src/App.tsx
+++ b/lama_cleaner/app/src/App.tsx
@@ -1,6 +1,7 @@
-import React, { useEffect } from 'react'
+import React, { useCallback, useEffect, useState } from 'react'
import { useKeyPressEvent } from 'react-use'
import { useRecoilState } from 'recoil'
+import { nanoid } from 'nanoid'
import useInputImage from './hooks/useInputImage'
import LandingPage from './components/LandingPage/LandingPage'
import { themeState } from './components/Header/ThemeChanger'
@@ -33,10 +34,18 @@ function App() {
document.body.setAttribute('data-theme', theme)
}, [theme])
+ const getWorkspaceKey = useCallback(() => {
+ return nanoid()
+ }, [file])
+
return (
- {file ? : }
+ {file ? (
+
+ ) : (
+
+ )}
)
}
diff --git a/lama_cleaner/app/src/components/Editor/Editor.tsx b/lama_cleaner/app/src/components/Editor/Editor.tsx
index d3a6047..412a36d 100644
--- a/lama_cleaner/app/src/components/Editor/Editor.tsx
+++ b/lama_cleaner/app/src/components/Editor/Editor.tsx
@@ -295,7 +295,7 @@ export default function Editor(props: EditorProps) {
// Zoom reset
const resetZoom = useCallback(() => {
- if (!minScale) {
+ if (!minScale || !original || !windowSize) {
return
}
const viewport = viewportRef.current
@@ -304,12 +304,19 @@ export default function Editor(props: EditorProps) {
}
const offsetX = (windowSize.width - original.width * minScale) / 2
const offsetY = (windowSize.height - original.height * minScale) / 2
- viewport.setTransform(offsetX, offsetY, minScale, 0, 'easeOutQuad')
+ viewport.setTransform(offsetX, offsetY, minScale, 200, 'easeOutQuad')
viewport.state.scale = minScale
setScale(minScale)
setPanned(false)
- }, [viewportRef, windowSize, original.width, windowSize.height, minScale])
+ }, [
+ viewportRef,
+ windowSize,
+ original,
+ original.width,
+ windowSize.height,
+ minScale,
+ ])
const resetRedoState = () => {
setRedoCurLines([])
@@ -317,18 +324,6 @@ export default function Editor(props: EditorProps) {
setRedoRenders([])
}
- useEffect(() => {
- setLineGroups([])
- setCurLineGroup([])
- setRenders([])
-
- resetRedoState()
-
- resetZoom()
- const imageSizeLimit = Math.max(original.width, original.height)
- setSizeLimit(imageSizeLimit)
- }, [resetZoom, file, original])
-
useEffect(() => {
window.addEventListener('resize', () => {
resetZoom()
diff --git a/lama_cleaner/app/src/components/Editor/SizeSelector.tsx b/lama_cleaner/app/src/components/Editor/SizeSelector.tsx
index 933c1b5..3d08e5b 100644
--- a/lama_cleaner/app/src/components/Editor/SizeSelector.tsx
+++ b/lama_cleaner/app/src/components/Editor/SizeSelector.tsx
@@ -14,10 +14,6 @@ export default function SizeSelector(props: SizeSelectorProps) {
const [activeSize, setActiveSize] = useState('Original')
const longSide: number = Math.max(originalWidth, originalHeight)
- useEffect(() => {
- setActiveSize('Original')
- }, [originalHeight, originalWidth])
-
const getSizeShowName = useCallback(
(size: string) => {
if (size === 'Original') {
diff --git a/lama_cleaner/app/yarn.lock b/lama_cleaner/app/yarn.lock
index 3944d70..0bf8b8b 100644
--- a/lama_cleaner/app/yarn.lock
+++ b/lama_cleaner/app/yarn.lock
@@ -8174,6 +8174,11 @@ nanoid@^3.1.28:
resolved "https://registry.npmjs.org/nanoid/-/nanoid-3.1.30.tgz"
integrity sha512-zJpuPDwOv8D2zq2WRoMe1HsfZthVewpel9CAvTfc/2mBD1uUT/agc5f7GHGWXlYkFvi1mVxe4IjvP2HNrop7nQ==
+nanoid@^4.0.0:
+ version "4.0.0"
+ resolved "https://registry.npmmirror.com/nanoid/-/nanoid-4.0.0.tgz#6e144dee117609232c3f415c34b0e550e64999a5"
+ integrity sha512-IgBP8piMxe/gf73RTQx7hmnhwz0aaEXYakvqZyE302IXW3HyVNhdNGC+O2MwMAVhLEnvXlvKtGbtJf6wvHihCg==
+
nanomatch@^1.2.9:
version "1.2.13"
resolved "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz"