kamp/IOPaint
1
0
Fork 0
Code Issues Pull Requests Releases 1 Activity

fix build error

Browse Source
This commit is contained in:
Qing 2023-12-29 10:08:21 +08:00
parent 1169e66ccb
commit 0c985a431b
12 changed files with 72 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web_app/package-lock.json generated
View File

@ -57,7 +57,7 @@
"devDependencies": {
"@tanstack/eslint-plugin-query": "^5.8.4",
"@types/axios": "^0.14.0",
"@types/flexsearch": "^0.7.3",
"@types/flexsearch": "^0.7.6",
"@types/lodash": "^4.14.201",
"@types/node": "^20.9.2",
"@types/react": "^18.2.37",

2
web_app/package.json
View File

@ -59,7 +59,7 @@
"devDependencies": {
"@tanstack/eslint-plugin-query": "^5.8.4",
"@types/axios": "^0.14.0",
"@types/flexsearch": "^0.7.3",
"@types/flexsearch": "^0.7.6",
"@types/lodash": "^4.14.201",
"@types/node": "^20.9.2",
"@types/react": "^18.2.37",

8
web_app/src/App.tsx
View File

@ -1,4 +1,4 @@
import { useCallback, useEffect, useMemo, useRef, useState } from "react"
import { useCallback, useEffect, useMemo, useRef } from "react"
import { nanoid } from "nanoid"
import useInputImage from "@/hooks/useInputImage"
@ -56,7 +56,6 @@ function Home() {
return nanoid()
}, [file])
const [isDragging, setIsDragging] = useState(false)
const dragCounter = useRef(0)
const handleDrag = useCallback((event: any) => {
@ -68,9 +67,6 @@ function Home() {
event.preventDefault()
event.stopPropagation()
dragCounter.current += 1
if (event.dataTransfer.items && event.dataTransfer.items.length > 0) {
setIsDragging(true)
}
}, [])
const handleDragOut = useCallback((event: any) => {
@ -78,13 +74,11 @@ function Home() {
event.stopPropagation()
dragCounter.current -= 1
if (dragCounter.current > 0) return
setIsDragging(false)
}, [])
const handleDrop = useCallback((event: any) => {
event.preventDefault()
event.stopPropagation()
setIsDragging(false)
if (event.dataTransfer.files && event.dataTransfer.files.length > 0) {
if (event.dataTransfer.files.length > 1) {
// setToastState({

9
web_app/src/components/Coffee.tsx
View File

@ -1,12 +1,5 @@
import { Coffee as CoffeeIcon } from "lucide-react"
import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "./ui/dialog"
import { Dialog, DialogContent, DialogTitle, DialogTrigger } from "./ui/dialog"
import { IconButton } from "./ui/button"
import { DialogDescription } from "@radix-ui/react-dialog"
import Kofi from "@/assets/kofi_button_black.png"

2
web_app/src/components/Cropper.tsx
View File

@ -214,7 +214,7 @@ const Cropper = (props: Props) => {
}
}
const onPointerDone = (e: PointerEvent) => {
const onPointerDone = () => {
if (isResizing) {
setIsResizing(false)
}

2
web_app/src/components/Editor.tsx
View File

@ -703,7 +703,7 @@ export default function Editor(props: EditorProps) {
doubleClick={{ disabled: true }}
initialScale={minScale}
minScale={minScale * 0.3}
onPanning={(ref) => {
onPanning={() => {
if (!panned) {
setPanned(true)
}

2
web_app/src/components/Extender.tsx
View File

@ -209,7 +209,7 @@ const Extender = (props: Props) => {
}
}
const onPointerDone = (e: PointerEvent) => {
const onPointerDone = () => {
if (isResizing) {
setIsResizing(false)
}

2
web_app/src/components/Header.tsx
View File

@ -1,5 +1,5 @@
import { PlayIcon } from "@radix-ui/react-icons"
import { useCallback, useState } from "react"
import { useState } from "react"
import { IconButton, ImageUploadButton } from "@/components/ui/button"
import Shortcuts from "@/components/Shortcuts"
import { useImage } from "@/hooks/useImage"

5
web_app/src/components/InteractiveSeg.tsx
View File

@ -119,11 +119,6 @@ const InteractiveSegPoints = () => {
}
const InteractiveSeg = () => {
const [interactiveSegState, updateInteractiveSegState] = useStore((state) => [
state.interactiveSegState,
state.updateInteractiveSegState,
])
return (
<div>
<InteractiveSegConfirmActions />

132
web_app/src/components/Settings.tsx
View File

@ -14,9 +14,7 @@ import {
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form"
import { Input } from "@/components/ui/input"
import { Switch } from "./ui/switch"
import { Tabs, TabsContent, TabsList, TabsTrigger } from "./ui/tabs"
import { useEffect, useState } from "react"
@ -44,14 +42,8 @@ import useHotKey from "@/hooks/useHotkey"
const formSchema = z.object({
enableFileManager: z.boolean(),
inputDirectory: z.string().refine(async (id) => {
// verify that ID exists in database
return true
}),
outputDirectory: z.string().refine(async (id) => {
// verify that ID exists in database
return true
}),
inputDirectory: z.string(),
outputDirectory: z.string(),
enableDownloadMask: z.boolean(),
enableManualInpainting: z.boolean(),
enableUploadMask: z.boolean(),
@ -59,7 +51,7 @@ const formSchema = z.object({
const TAB_GENERAL = "General"
const TAB_MODEL = "Model"
const TAB_FILE_MANAGER = "File Manager"
// const TAB_FILE_MANAGER = "File Manager"
const TAB_NAMES = [TAB_MODEL, TAB_GENERAL]
@ -341,68 +333,68 @@ export function SettingsDialog() {
)
}
function renderFileManagerSettings() {
return (
<div className="flex flex-col justify-between rounded-lg gap-4 w-[400px]">
<FormField
control={form.control}
name="enableFileManager"
render={({ field }) => (
<FormItem className="flex items-center justify-between gap-4">
<div className="space-y-0.5">
<FormLabel>Enable file manger</FormLabel>
<FormDescription className="max-w-sm">
Browser images
</FormDescription>
</div>
<FormControl>
<Switch
checked={field.value}
onCheckedChange={field.onChange}
/>
</FormControl>
</FormItem>
)}
/>
// function renderFileManagerSettings() {
// return (
// <div className="flex flex-col justify-between rounded-lg gap-4 w-[400px]">
// <FormField
// control={form.control}
// name="enableFileManager"
// render={({ field }) => (
// <FormItem className="flex items-center justify-between gap-4">
// <div className="space-y-0.5">
// <FormLabel>Enable file manger</FormLabel>
// <FormDescription className="max-w-sm">
// Browser images
// </FormDescription>
// </div>
// <FormControl>
// <Switch
// checked={field.value}
// onCheckedChange={field.onChange}
// />
// </FormControl>
// </FormItem>
// )}
// />
<Separator />
// <Separator />
<FormField
control={form.control}
name="inputDirectory"
render={({ field }) => (
<FormItem>
<FormLabel>Input directory</FormLabel>
<FormControl>
<Input placeholder="" {...field} />
</FormControl>
<FormDescription>
Browser images from this directory.
</FormDescription>
<FormMessage />
</FormItem>
)}
/>
// <FormField
// control={form.control}
// name="inputDirectory"
// render={({ field }) => (
// <FormItem>
// <FormLabel>Input directory</FormLabel>
// <FormControl>
// <Input placeholder="" {...field} />
// </FormControl>
// <FormDescription>
// Browser images from this directory.
// </FormDescription>
// <FormMessage />
// </FormItem>
// )}
// />
<FormField
control={form.control}
name="outputDirectory"
render={({ field }) => (
<FormItem>
<FormLabel>Save directory</FormLabel>
<FormControl>
<Input placeholder="" {...field} />
</FormControl>
<FormDescription>
Result images will be saved to this directory.
</FormDescription>
<FormMessage />
</FormItem>
)}
/>
</div>
)
}
// <FormField
// control={form.control}
// name="outputDirectory"
// render={({ field }) => (
// <FormItem>
// <FormLabel>Save directory</FormLabel>
// <FormControl>
// <Input placeholder="" {...field} />
// </FormControl>
// <FormDescription>
// Result images will be saved to this directory.
// </FormDescription>
// <FormMessage />
// </FormItem>
// )}
// />
// </div>
// )
// }
return (
<>

4
web_app/src/components/Shortcuts.tsx
View File

@ -37,10 +37,6 @@ const isMac = function () {
return /macintosh|mac os x/i.test(navigator.userAgent)
}
const isWindows = function () {
return /windows|win32/i.test(navigator.userAgent)
}
const CmdOrCtrl = () => {
return isMac() ? "Cmd" : "Ctrl"
}

5
web_app/src/components/ui/input.tsx
View File

@ -1,5 +1,4 @@
import * as React from "react"
import { FocusEvent } from "react"
import { cn } from "@/lib/utils"
import { useStore } from "@/lib/states"
@ -11,11 +10,11 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
({ className, type, ...props }, ref) => {
const updateAppState = useStore((state) => state.updateAppState)
const handleOnFocus = (evt: FocusEvent<any>) => {
const handleOnFocus = () => {
updateAppState({ disableShortCuts: true })
}
const handleOnBlur = (evt: FocusEvent<any>) => {
const handleOnBlur = () => {
updateAppState({ disableShortCuts: false })
}
return (