From 31a00813e00643af86c6f06aafd45332e1cbb212 Mon Sep 17 00:00:00 2001
From: Sanster <cwq1913@gmail.com>
Date: Sun, 6 Feb 2022 11:00:53 +0800
Subject: [PATCH] make Esc reset zoom work

---
 lama_cleaner/app/src/App.tsx    |  4 +---
 lama_cleaner/app/src/Editor.tsx | 14 ++++++++++----
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/lama_cleaner/app/src/App.tsx b/lama_cleaner/app/src/App.tsx
index 7fd03c1..493ce84 100644
--- a/lama_cleaner/app/src/App.tsx
+++ b/lama_cleaner/app/src/App.tsx
@@ -11,7 +11,7 @@ function App() {
 
   return (
     <div className="h-full full-visible-h-safari flex flex-col">
-      <header className="relative z-10 flex px-5 pt-3 justify-center sm:justify-between items-center sm:items-start">
+      <header className="absolute z-10 flex px-5 pt-3 justify-center sm:justify-between items-center sm:items-start">
         {file ? (
           <Button
             icon={<ArrowLeftIcon className="w-6 h-6" />}
@@ -29,9 +29,7 @@ function App() {
       <main
         className={[
           'h-full flex flex-1 flex-col sm:items-center sm:justify-center overflow-hidden',
-          // file ? 'items-center justify-center' : '', // center on mobile
           'items-center justify-center',
-          'pb-20',
         ].join(' ')}
       >
         {file ? (
diff --git a/lama_cleaner/app/src/Editor.tsx b/lama_cleaner/app/src/Editor.tsx
index af8e088..aa26632 100644
--- a/lama_cleaner/app/src/Editor.tsx
+++ b/lama_cleaner/app/src/Editor.tsx
@@ -11,7 +11,12 @@ import {
   TransformComponent,
   TransformWrapper,
 } from 'react-zoom-pan-pinch'
-import { useWindowSize, useLocalStorage, useKey } from 'react-use'
+import {
+  useWindowSize,
+  useLocalStorage,
+  useKey,
+  useKeyPressEvent,
+} from 'react-use'
 import inpaint from './adapters/inpainting'
 import Button from './components/Button'
 import Slider from './components/Slider'
@@ -211,7 +216,10 @@ 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, 200, 'easeOutQuad')
-  }, [minScale, original, windowSize, isOriginalLoaded])
+    setScale(minScale)
+  }, [minScale, original, windowSize])
+
+  useKeyPressEvent('Escape', resetZoom)
 
   const onPaint = (px: number, py: number) => {
     const currShowLine = lines4Show[lines4Show.length - 1]
@@ -343,7 +351,6 @@ export default function Editor(props: EditorProps) {
     <div
       className="flex flex-col items-center"
       style={{
-        // height: minScale !== 1 ? original.naturalHeight * minScale : undefined,
         height: '100%',
         width: '100%',
       }}
@@ -373,7 +380,6 @@ export default function Editor(props: EditorProps) {
           wrapperStyle={{
             width: '100%',
             height: '100%',
-            marginBottom: '36px',
           }}
           contentClass={
             isInpaintingLoading