refac: models

This commit is contained in:
Timothy Jaeryang Baek 2024-11-15 18:21:41 -08:00
parent 1c16920dba
commit 9dae7d0572
11 changed files with 186 additions and 119 deletions

View File

@ -12,7 +12,7 @@ from pydantic import BaseModel, ConfigDict
from sqlalchemy import or_, and_, func
from sqlalchemy.dialects import postgresql, sqlite
from sqlalchemy import BigInteger, Column, Text, JSON
from sqlalchemy import BigInteger, Column, Text, JSON, Boolean
from open_webui.utils.utils import has_access
@ -95,6 +95,8 @@ class Model(Base):
# }
# }
is_active = Column(Boolean, default=True)
updated_at = Column(BigInteger)
created_at = Column(BigInteger)
@ -110,6 +112,7 @@ class ModelModel(BaseModel):
access_control: Optional[dict] = None
is_active: bool
updated_at: int # timestamp in epoch
created_at: int # timestamp in epoch
@ -131,6 +134,8 @@ class ModelResponse(BaseModel):
meta: ModelMeta
access_control: Optional[dict] = None
is_active: bool
updated_at: int # timestamp in epoch
created_at: int # timestamp in epoch
@ -141,6 +146,8 @@ class ModelForm(BaseModel):
name: str
meta: ModelMeta
params: ModelParams
access_control: Optional[dict] = None
is_active: bool = True
class ModelsTable:
@ -200,6 +207,23 @@ class ModelsTable:
except Exception:
return None
def toggle_model_by_id(self, id: str) -> Optional[ModelModel]:
with get_db() as db:
try:
is_active = db.query(Model).filter_by(id=id).first().is_active
db.query(Model).filter_by(id=id).update(
{
"is_active": not is_active,
"updated_at": int(time.time()),
}
)
db.commit()
return self.get_model_by_id(id)
except Exception:
return None
def update_model_by_id(self, id: str, model: ModelForm) -> Optional[ModelModel]:
try:
with get_db() as db:

View File

@ -79,6 +79,41 @@ async def get_model_by_id(id: str, user=Depends(get_verified_user)):
)
############################
# ToggelModelById
############################
@router.post("/id/{id}/toggle", response_model=Optional[ModelResponse])
async def toggle_model_by_id(id: str, user=Depends(get_verified_user)):
model = Models.get_model_by_id(id)
if model:
if (
user.role == "admin"
or model.user_id == user.id
or has_access(user.id, "write", model.access_control)
):
model = Models.toggle_model_by_id(id)
if model:
return model
else:
raise HTTPException(
status_code=status.HTTP_400_BAD_REQUEST,
detail=ERROR_MESSAGES.DEFAULT("Error updating function"),
)
else:
raise HTTPException(
status_code=status.HTTP_401_UNAUTHORIZED,
detail=ERROR_MESSAGES.UNAUTHORIZED,
)
else:
raise HTTPException(
status_code=status.HTTP_401_UNAUTHORIZED,
detail=ERROR_MESSAGES.NOT_FOUND,
)
############################
# UpdateModelById
############################

View File

@ -35,6 +35,17 @@ def upgrade():
sa.Column("access_control", sa.JSON(), nullable=True),
)
# Add 'is_active' column to 'model' table
op.add_column(
"model",
sa.Column(
"is_active",
sa.Boolean(),
nullable=False,
server_default=sa.sql.expression.true(),
),
)
# Add 'access_control' column to 'knowledge' table
op.add_column(
"knowledge",
@ -60,6 +71,9 @@ def downgrade():
# Drop 'access_control' column from 'model' table
op.drop_column("model", "access_control")
# Drop 'is_active' column from 'model' table
op.drop_column("model", "is_active")
# Drop 'access_control' column from 'knowledge' table
op.drop_column("knowledge", "access_control")

View File

@ -100,6 +100,43 @@ export const getModelById = async (token: string, id: string) => {
return res;
};
export const toggleModelById = async (token: string, id: string) => {
let error = null;
const searchParams = new URLSearchParams();
searchParams.append('id', id);
const res = await fetch(`${WEBUI_API_BASE_URL}/models/id/${id}/toggle`, {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
authorization: `Bearer ${token}`
}
})
.then(async (res) => {
if (!res.ok) throw await res.json();
return res.json();
})
.then((json) => {
return json;
})
.catch((err) => {
error = err;
console.log(err);
return null;
});
if (error) {
throw error;
}
return res;
};
export const updateModelById = async (token: string, id: string, model: object) => {
let error = null;

View File

@ -39,6 +39,7 @@
import Drawer from '$lib/components/common/Drawer.svelte';
import ChevronLeft from '$lib/components/icons/ChevronLeft.svelte';
import MenuLines from '$lib/components/icons/MenuLines.svelte';
import AccessControl from '../common/AccessControl.svelte';
let largeScreen = true;
@ -687,7 +688,17 @@
/>
</div>
{:else}
<div class="m-auto text-gray-500 text-xs">{$i18n.t('No content found')}</div>
<div
class="m-auto flex flex-col justify-center text-center text-gray-500 text-xs"
>
<div>
{$i18n.t('No content found')}
</div>
<div class="mx-12 mt-2 text-center text-gray-200 dark:text-gray-700">
{$i18n.t('Drag and drop a file to upload or select a file to view')}
</div>
</div>
{/if}
</div>
</div>
@ -753,7 +764,7 @@
</div>
</div>
{:else}
<div class="m-auto pb-32">
<div class="m-auto pb-20">
<div>
<div class=" flex w-full mt-1 mb-3.5">
<div class="flex-1">
@ -784,8 +795,8 @@
</div>
</div>
<div class=" mt-2 text-center text-sm text-gray-200 dark:text-gray-700 w-full">
{$i18n.t('Select a file to view or drag and drop a file to upload')}
<div class="mt-2">
<AccessControl />
</div>
</div>
{/if}

View File

@ -6,6 +6,7 @@
import { createNewKnowledge, getKnowledgeItems } from '$lib/apis/knowledge';
import { toast } from 'svelte-sonner';
import { knowledge } from '$lib/stores';
import AccessControl from '../common/AccessControl.svelte';
let loading = false;
@ -103,6 +104,10 @@
</div>
</div>
<div class="mt-2">
<AccessControl />
</div>
<div class="flex justify-end mt-2">
<div>
<button

View File

@ -16,6 +16,7 @@
createNewModel,
deleteModelById,
getWorkspaceModels,
toggleModelById,
updateModelById
} from '$lib/apis/models';
@ -30,10 +31,10 @@
import Plus from '../icons/Plus.svelte';
import { get } from 'svelte/store';
import ChevronRight from '../icons/ChevronRight.svelte';
import Switch from '../common/Switch.svelte';
let shiftKey = false;
let localModelfiles = [];
let importFiles;
let modelsImportInputElement: HTMLInputElement;
@ -255,13 +256,13 @@
>
<a
class=" flex flex-1 space-x-3.5 cursor-pointer w-full"
href={`/?models=${encodeURIComponent(model.id)}`}
href={`/?models=open-webui.${encodeURIComponent(model.id)}`}
>
<div class=" self-start w-8 pt-0.5">
<div class=" self-center w-8">
<div
class=" rounded-full object-cover {(model?.meta?.hidden ?? false)
? 'brightness-90 dark:brightness-50'
: ''} "
class=" rounded-full object-cover {model.is_active
? ''
: 'opacity-50 dark:opacity-50'} "
>
<img
src={model?.meta?.profile_image_url ?? '/static/favicon.png'}
@ -271,7 +272,7 @@
</div>
</div>
<div class=" flex-1 self-center {(model?.meta?.hidden ?? false) ? 'text-gray-500' : ''}">
<div class=" flex-1 self-center {model.is_active ? '' : 'text-gray-500'}">
<Tooltip
content={marked.parse(model?.meta?.description ?? model.id)}
className=" w-fit"
@ -284,57 +285,8 @@
</div>
</div>
</a>
<div class="flex flex-row gap-0.5 self-center">
{#if $user?.role === 'admin' && shiftKey}
<Tooltip
content={(model?.meta?.hidden ?? false) ? $i18n.t('Show Model') : $i18n.t('Hide Model')}
>
<button
class="self-center w-fit text-sm px-2 py-2 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
type="button"
on:click={() => {
hideModelHandler(model);
}}
>
{#if model?.meta?.hidden ?? false}
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M3.98 8.223A10.477 10.477 0 0 0 1.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.451 10.451 0 0 1 12 4.5c4.756 0 8.773 3.162 10.065 7.498a10.522 10.522 0 0 1-4.293 5.774M6.228 6.228 3 3m3.228 3.228 3.65 3.65m7.894 7.894L21 21m-3.228-3.228-3.65-3.65m0 0a3 3 0 1 0-4.243-4.243m4.242 4.242L9.88 9.88"
/>
</svg>
{:else}
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"
/>
</svg>
{/if}
</button>
</Tooltip>
<div class="flex flex-row gap-0.5 items-center self-center">
{#if shiftKey}
<Tooltip content={$i18n.t('Delete')}>
<button
class="self-center w-fit text-sm px-2 py-2 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
@ -398,6 +350,18 @@
<EllipsisHorizontal className="size-5" />
</button>
</ModelMenu>
<div class="ml-1">
<Tooltip content={model.is_active ? $i18n.t('Enabled') : $i18n.t('Disabled')}>
<Switch
bind:state={model.is_active}
on:change={async (e) => {
toggleModelById(localStorage.token, model.id);
_models.set(await getModels(localStorage.token));
}}
/>
</Tooltip>
</div>
{/if}
</div>
</div>
@ -492,43 +456,6 @@
</div>
</button>
</div>
{#if localModelfiles.length > 0}
<div class="flex">
<div class=" self-center text-sm font-medium mr-4">
{localModelfiles.length} Local Modelfiles Detected
</div>
<div class="flex space-x-1">
<button
class="self-center w-fit text-sm p-1.5 border dark:border-gray-600 rounded-xl flex"
on:click={async () => {
downloadModels(localModelfiles);
localStorage.removeItem('modelfiles');
localModelfiles = JSON.parse(localStorage.getItem('modelfiles') ?? '[]');
}}
>
<div class=" self-center">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-4 h-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0"
/>
</svg>
</div>
</button>
</div>
</div>
{/if}
</div>
{/if}

View File

@ -17,7 +17,7 @@
import { getTools } from '$lib/apis/tools';
import { getFunctions } from '$lib/apis/functions';
import { getKnowledgeItems } from '$lib/apis/knowledge';
import AccessPermissions from '../common/AccessPermissionsModal.svelte';
import AccessControl from '../common/AccessControl.svelte';
const i18n = getContext('i18n');
@ -79,6 +79,8 @@
let filterIds = [];
let actionIds = [];
let accessControl = null;
const addUsage = (base_model_id) => {
const baseModel = $models.find((m) => m.id === base_model_id);
@ -208,6 +210,8 @@
capabilities.usage = false;
}
accessControl = model?.access_control ?? null;
info = {
...info,
...JSON.parse(
@ -641,7 +645,7 @@
</div>
<div class="my-2">
<AccessPermissions />
<AccessControl bind:accessControl />
</div>
<div class="my-2 text-gray-300 dark:text-gray-700">

View File

@ -4,6 +4,7 @@
import Textarea from '$lib/components/common/Textarea.svelte';
import { toast } from 'svelte-sonner';
import Tooltip from '$lib/components/common/Tooltip.svelte';
import AccessControl from '../common/AccessControl.svelte';
export let onSubmit: Function;
export let edit = false;
@ -135,6 +136,10 @@
</div>
</div>
<div class="mt-2">
<AccessControl />
</div>
<div class="my-4 flex justify-end pb-20">
<button
class=" text-sm w-full lg:w-fit px-4 py-2 transition rounded-lg {loading

View File

@ -203,11 +203,11 @@ class Tools:
</div>
<div class="flex-1">
<Tooltip content={$i18n.t('e.g. My ToolKit')} placement="top-start">
<Tooltip content={$i18n.t('e.g. My Tools')} placement="top-start">
<input
class="w-full text-2xl font-medium bg-transparent outline-none"
type="text"
placeholder={$i18n.t('Toolkit Name')}
placeholder={$i18n.t('Tool Name')}
bind:value={name}
required
/>
@ -225,15 +225,11 @@ class Tools:
{id}
</div>
{:else}
<Tooltip
className="w-full"
content={$i18n.t('e.g. my_toolkit')}
placement="top-start"
>
<Tooltip className="w-full" content={$i18n.t('e.g. my_tools')} placement="top-start">
<input
class="w-full text-sm disabled:text-gray-500 bg-transparent outline-none"
type="text"
placeholder={$i18n.t('Toolkit ID')}
placeholder={$i18n.t('Tool ID')}
bind:value={id}
required
disabled={edit}
@ -243,13 +239,13 @@ class Tools:
<Tooltip
className="w-full self-center items-center flex"
content={$i18n.t('e.g. A toolkit for performing various operations')}
content={$i18n.t('e.g. Tools for performing various operations')}
placement="top-start"
>
<input
class="w-full text-sm bg-transparent outline-none"
type="text"
placeholder={$i18n.t('Toolkit Description')}
placeholder={$i18n.t('Tool Description')}
bind:value={meta.description}
required
/>

View File

@ -1,10 +1,19 @@
<script lang="ts">
import { getContext } from 'svelte';
import { getContext, onMount } from 'svelte';
const i18n = getContext('i18n');
export let type = 'private';
export let accessControl = null;
let access = 'private';
let query = '';
onMount(() => {
if (accessControl === null) {
access = 'public';
} else {
access = 'private';
}
});
</script>
<div class=" rounded-lg flex flex-col gap-3">
@ -14,7 +23,7 @@
<div class="flex gap-2.5 items-center">
<div>
<div class=" p-2 bg-gray-50 dark:bg-gray-850 rounded-full">
{#if type === 'private'}
{#if access === 'private'}
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
@ -52,16 +61,16 @@
<select
id="models"
class="outline-none bg-transparent text-sm font-medium rounded-lg block w-fit pr-10 max-w-full placeholder-gray-400"
bind:value={type}
bind:value={access}
>
<option class=" text-gray-700" value="private" selected>Private</option>
<option class=" text-gray-700" value="public" selected>Public</option>
</select>
<div class=" text-xs text-gray-400 font-medium">
{#if type === 'private'}
{#if access === 'private'}
{$i18n.t('Only select users and groups with permission can access')}
{:else if type === 'public'}
{:else if access === 'public'}
{$i18n.t('Accessible to all users')}
{/if}
</div>
@ -69,7 +78,7 @@
</div>
</div>
{#if type === 'private'}
{#if access === 'private'}
<div>
<div class=" text-sm font-semibold mb-0.5">{$i18n.t('People with access')}</div>