{ e.preventDefault(); formLoading = true; errors = []; try { const body = JSON.stringify(editableTool); let response: Response; if (page.params.toolId) { response = await fetch(`${base}/api/tools/${page.params.toolId}`, { method: "PATCH", headers: { "Content-Type": "application/json" }, body, }); } else { response = await fetch(`${base}/api/tools`, { method: "POST", headers: { "Content-Type": "application/json" }, body, }); } if (response.ok) { const { toolId } = await response.json(); goto(`${base}/tools/${toolId}`, { invalidateAll: true }); } else if (response.status === 400) { const data = await response.json(); errors = data.errors; } else { $errorStore = response.statusText; } } catch (e) { $errorStore = (e as Error).message; } finally { formLoading = false; } }} > {#if tool}

{readonly ? "View" : "Edit"} Tool: {tool.displayName}

{#if !readonly}

Modifying an existing tool will propagate the changes to all users.

{/if} {:else}

Create new tool

Create and share your own tools. All tools are public

{/if}
{#key editableTool.color + editableTool.icon} {/key}

Tools allows models that support them to use external application directly via function calling. Tools must use Hugging Face Gradio Spaces as we detect the input and output types automatically from the Gradio API. For GPU intensive tool consider using a ZeroGPU Space.

Functions

{#if editableTool.baseUrl}

Choose functions that can be called in your tool.

{:else}

Start by specifying a Hugging Face Space URL.

{/if} {#if editableTool.baseUrl} {#await getGradioApi(spaceUrl)}

Loading...

{:then api}
{#each Object.keys(api["named_endpoints"] ?? {}) as name} {/each}
{#if editableTool.endpoint && api["named_endpoints"][editableTool.endpoint] && !APIloading} {@const endpoint = api["named_endpoints"][editableTool.endpoint]}
{editableTool.endpoint}

Arguments

Choose parameters that can be passed to your tool.

{getError("inputs")}

{#each editableTool.inputs as input, inputIdx} {@const parameter = endpoint.parameters.find( (parameter) => parameter.parameter_name === input.name )}
{input.name} {parameter?.python_type.type} {#if parameter?.description}

{parameter.description}

{/if}
{#if input.paramType === "required" || input.paramType === "optional"} {/if} {#if input.paramType === "optional" || input.paramType === "fixed"} {@const isOptional = input.paramType === "optional"}
{isOptional ? "Default value" : "Value"}

{#if isOptional} The tool will use this value by default but the model can specify a different one. {:else} The tool will use this value and it cannot be changed. {/if}

{#if input.paramType === "optional"} {:else} {/if}
{/if} {#if input.type === "file"} {/if}
{/each}

Output options

Choose what value your tool will return and how

{:else if APIloading}

Loading API...

{:else if !api["named_endpoints"]}

No endpoints found in this space. Try another one.

{/if} {:catch error}

{error}

{/await} {/if}
{#if !readonly} {/if}