chunzhi/comfyui-deploy
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Nickkao/volume improvemnts v3 (#4)

Browse Source 
* fix: attempt fixing timeout

* be validation work

* arbitrary model input, BE validation, error record creation with error logs during potential failure points

* remove unused type

---------

Co-authored-by: bennykok <[email protected]>
This commit is contained in:
Nick Kao
2024-01-28 11:09:00 +08:00
committed by GitHub
co-authored by bennykok
parent 852d889397
commit 42aaf1acb9
11 changed files with 2810 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/components/ModelList.tsx
+19 -14
View File
@@ -32,8 +32,8 @@ import {
} from "@tanstack/react-table";
import { ArrowUpDown } from "lucide-react";
import * as React from "react";
import { addCivitaiModel } from "@/server/curdModel";
import { addCivitaiModelSchema } from "@/server/addCivitaiModelSchema";
import { addModel } from "@/server/curdModel";
import { downloadUrlModelSchema } from "@/server/addCivitaiModelSchema";
import { modelEnumType } from "@/db/schema";
export type ModelItemList = NonNullable<
@@ -89,9 +89,7 @@ export const columns: ColumnDef<ModelItemList>[] = [
{row.original.model_name}
</span>
{model.is_public
? <></>
: <Badge variant="orange">Private</Badge>}
{model.is_public ? <></> : <Badge variant="orange">Private</Badge>}
</>
);
},
@@ -298,16 +296,14 @@ export function ModelList({ data }: { data: ModelItemList[] }) {
<InsertModal
dialogClassName="sm:max-w-[600px]"
disabled={
false
// TODO: limitations based on plan
false // TODO: limitations based on plan
}
tooltip={"Add models using their civitai url!"}
title="Add a Civitai Model"
description="Pick a model from civitai"
serverAction={addCivitaiModel}
formSchema={addCivitaiModelSchema}
title="Add a Model"
description="using a link to a model"
serverAction={addModel}
formSchema={downloadUrlModelSchema}
fieldConfig={{
civitai_url: {
url: {
fieldType: "fallback",
inputProps: { required: true },
description: (
@@ -320,10 +316,19 @@ export function ModelList({ data }: { data: ModelItemList[] }) {
>
civitai.com
</a>{" "}
and place it's url here
or a url we can download a model from
</>
),
},
model_type: {
fieldType: "select",
inputProps: { required: true },
description: (
<>
We'll figure this out if you pick a civitai model
</>
),
},
}}
/>
</div>
web/src/components/custom-form/model-input.tsx
-86
View File
@@ -1,86 +0,0 @@
// NOTE: this is WIP for doing client side validation for civitai model downloading
import type { AutoFormInputComponentProps } from "../ui/auto-form/types";
import { FormControl, FormItem, FormLabel } from "../ui/form";
import { LoadingIcon } from "@/components/LoadingIcon";
import * as React from "react";
import AutoFormInput from "../ui/auto-form/fields/input";
import { useDebouncedCallback } from "use-debounce";
import { CivitaiModelResponse } from "@/types/civitai";
import { z } from "zod";
import { insertCivitaiModelSchema } from "@/db/schema";
function getUrl(civitai_url: string) {
// expect to be a URL to be https://civitai.com/models/36520
// possiblity with slugged name and query-param modelVersionId
const baseUrl = "https://civitai.com/api/v1/models/";
const url = new URL(civitai_url);
const pathSegments = url.pathname.split("/");
const modelId = pathSegments[pathSegments.indexOf("models") + 1];
const modelVersionId = url.searchParams.get("modelVersionId");
return { url: baseUrl + modelId, modelVersionId };
}
export default function AutoFormCheckpointInput(
props: AutoFormInputComponentProps
) {
const [loading, setLoading] = React.useState(false);
const [modelRes, setModelRes] =
React.useState<z.infer<typeof CivitaiModelResponse>>();
const [modelVersionid, setModelVersionId] = React.useState<string | null>();
const { label, isRequired, fieldProps, zodItem, fieldConfigItem } = props;
const handleSearch = useDebouncedCallback((search) => {
const validationResult =
insertCivitaiModelSchema.shape.civitai_url.safeParse(search);
if (!validationResult.success) {
console.error(validationResult.error);
// Optionally set an error state here
return;
}
setLoading(true);
const controller = new AbortController();
const { url, modelVersionId: versionId } = getUrl(search);
setModelVersionId(versionId);
fetch(url, {
signal: controller.signal,
})
.then((x) => x.json())
.then((a) => {
const res = CivitaiModelResponse.parse(a);
console.log(a);
console.log(res);
setModelRes(res);
setLoading(false);
});
return () => {
controller.abort();
setLoading(false);
};
}, 300);
const modifiedField = {
...fieldProps,
// onChange: (event: React.ChangeEvent<HTMLInputElement>) => {
// handleSearch(event.target.value);
// },
};
return (
<FormItem>
{fieldConfigItem.inputProps?.showLabel && (
<FormLabel>
{label}
{isRequired && <span className="text-destructive">*</span>}
</FormLabel>
)}
<FormControl>
<AutoFormInput {...props} fieldProps={modifiedField} />
</FormControl>
</FormItem>
);
}