dnrops
/
open-webui
mirror of https://github.com/open-webui/open-webui
0
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

fix(a11y): add aria-labels and structural elements to workspace components (#21719)

This commit is contained in:
Classic298 2026-02-22 22:24:33 +01:00 committed by GitHub
parent e0087acfb4
commit 5b9efeef4d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
13 changed files with 46 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/components/workspace/Knowledge.svelte
View File

@ -197,12 +197,14 @@
<input <input
class=" w-full text-sm py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
aria-label={$i18n.t('Search Knowledge')}
placeholder={$i18n.t('Search Knowledge')} placeholder={$i18n.t('Search Knowledge')}
/> />
{#if query} {#if query}
<div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent"> <div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent">
<button <button
class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition" class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition"
aria-label={$i18n.t('Clear search')}
on:click={() => { on:click={() => {
query = ''; query = '';
}} }}

1
src/lib/components/workspace/Knowledge/ItemMenu.svelte
View File

@ -38,6 +38,7 @@
><button ><button
class="self-center w-fit text-sm p-1.5 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl" class="self-center w-fit text-sm p-1.5 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
type="button" type="button"
aria-label={$i18n.t('More Options')}
on:click={(e) => { on:click={(e) => {
e.stopPropagation(); e.stopPropagation();
show = true; show = true;

7
src/lib/components/workspace/Knowledge/KnowledgeBase.svelte
View File

@ -856,6 +856,7 @@
type="text" type="text"
class="text-left w-full text-lg bg-transparent outline-hidden flex-1" class="text-left w-full text-lg bg-transparent outline-hidden flex-1"
bind:value={knowledge.name} bind:value={knowledge.name}
aria-label={$i18n.t('Knowledge Name')}
placeholder={$i18n.t('Knowledge Name')} placeholder={$i18n.t('Knowledge Name')}
disabled={!knowledge?.write_access} disabled={!knowledge?.write_access}
on:input={() => { on:input={() => {
@ -903,6 +904,7 @@
type="text" type="text"
class="text-left text-xs w-full text-gray-500 bg-transparent outline-hidden" class="text-left text-xs w-full text-gray-500 bg-transparent outline-hidden"
bind:value={knowledge.description} bind:value={knowledge.description}
aria-label={$i18n.t('Knowledge Description')}
placeholder={$i18n.t('Knowledge Description')} placeholder={$i18n.t('Knowledge Description')}
disabled={!knowledge?.write_access} disabled={!knowledge?.write_access}
on:input={() => { on:input={() => {
@ -925,7 +927,8 @@
<input <input
class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
placeholder={`${$i18n.t('Search Collection')}`} aria-label={$i18n.t('Search Collection')}
placeholder={$i18n.t('Search Collection')}
on:focus={() => { on:focus={() => {
selectedFileId = null; selectedFileId = null;
}} }}
@ -1071,6 +1074,7 @@
<div class="mr-2"> <div class="mr-2">
<button <button
class="w-full text-left text-sm p-1.5 rounded-lg dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-gray-850" class="w-full text-left text-sm p-1.5 rounded-lg dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-gray-850"
aria-label={$i18n.t('Close')}
on:click={() => { on:click={() => {
selectedFileId = null; selectedFileId = null;
selectedFile = null; selectedFile = null;
@ -1108,6 +1112,7 @@
class="w-full h-full text-sm outline-none resize-none px-3 py-2" class="w-full h-full text-sm outline-none resize-none px-3 py-2"
bind:value={selectedFileContent} bind:value={selectedFileContent}
disabled={!knowledge?.write_access} disabled={!knowledge?.write_access}
aria-label={$i18n.t('File content')}
placeholder={$i18n.t('Add content here')} placeholder={$i18n.t('Add content here')}
/> />
{/key} {/key}

4
src/lib/components/workspace/Models.svelte
View File

@ -395,6 +395,7 @@
<input <input
class=" w-full text-sm py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
aria-label={$i18n.t('Search Models')}
placeholder={$i18n.t('Search Models')} placeholder={$i18n.t('Search Models')}
maxlength="500" maxlength="500"
on:input={() => { on:input={() => {
@ -409,6 +410,7 @@
<div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent"> <div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent">
<button <button
class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition" class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition"
aria-label={$i18n.t('Clear search')}
on:click={() => { on:click={() => {
query = ''; query = '';
getModelList(); getModelList();
@ -516,6 +518,7 @@
<button <button
class="self-center w-fit text-sm p-1.5 dark:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl" class="self-center w-fit text-sm p-1.5 dark:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
type="button" type="button"
aria-label={model?.meta?.hidden ? $i18n.t('Show') : $i18n.t('Hide')}
on:click={(e) => { on:click={(e) => {
e.stopPropagation(); e.stopPropagation();
hideModelHandler(model); hideModelHandler(model);
@ -533,6 +536,7 @@
<button <button
class="self-center w-fit text-sm p-1.5 dark:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl" class="self-center w-fit text-sm p-1.5 dark:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
type="button" type="button"
aria-label={$i18n.t('Delete')}
on:click={(e) => { on:click={(e) => {
e.stopPropagation(); e.stopPropagation();
deleteModelHandler(model); deleteModelHandler(model);

1
src/lib/components/workspace/Models/ModelEditor.svelte
View File

@ -475,6 +475,7 @@
? 'bg-transparent' ? 'bg-transparent'
: 'bg-white'} shadow-xl group relative" : 'bg-white'} shadow-xl group relative"
type="button" type="button"
aria-label={$i18n.t('Upload profile image')}
on:click={() => { on:click={() => {
filesInputElement.click(); filesInputElement.click();
}} }}

4
src/lib/components/workspace/Prompts.svelte
View File

@ -331,6 +331,7 @@
<input <input
class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
aria-label={$i18n.t('Search Prompts')}
placeholder={$i18n.t('Search Prompts')} placeholder={$i18n.t('Search Prompts')}
/> />
@ -338,6 +339,7 @@
<div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent"> <div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent">
<button <button
class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition" class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition"
aria-label={$i18n.t('Clear search')}
on:click={() => { on:click={() => {
query = ''; query = '';
}} }}
@ -437,6 +439,7 @@
<button <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" 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" type="button"
aria-label={$i18n.t('Delete')}
on:click={() => { on:click={() => {
deleteHandler(prompt); deleteHandler(prompt);
}} }}
@ -449,6 +452,7 @@
<button <button
class="self-center w-fit text-sm p-1.5 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl" class="self-center w-fit text-sm p-1.5 dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-white/5 rounded-xl"
type="button" type="button"
aria-label={$i18n.t('Copy Prompt')}
on:click={(e) => { on:click={(e) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();

4
src/lib/components/workspace/Prompts/PromptEditor.svelte
View File

@ -302,6 +302,7 @@
<div class="text-lg font-medium">{$i18n.t('Edit Prompt')}</div> <div class="text-lg font-medium">{$i18n.t('Edit Prompt')}</div>
<button <button
class="p-1 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg" class="p-1 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg"
aria-label={$i18n.t('Close')}
on:click={() => (showEditModal = false)} on:click={() => (showEditModal = false)}
> >
<XMark className="size-5" /> <XMark className="size-5" />
@ -319,6 +320,7 @@
className="text-sm w-full bg-transparent outline-hidden overflow-y-hidden resize-none" className="text-sm w-full bg-transparent outline-hidden overflow-y-hidden resize-none"
placeholder={$i18n.t('Write a summary in 50 words that summarizes {{topic}}.')} placeholder={$i18n.t('Write a summary in 50 words that summarizes {{topic}}.')}
bind:value={content} bind:value={content}
aria-label={$i18n.t('Prompt Content')}
rows={6} rows={6}
required required
/> />
@ -331,6 +333,7 @@
<input <input
class="text-sm w-full bg-transparent outline-hidden" class="text-sm w-full bg-transparent outline-hidden"
placeholder={$i18n.t('Describe what changed...')} placeholder={$i18n.t('Describe what changed...')}
aria-label={$i18n.t('Commit Message')}
bind:value={commitMessage} bind:value={commitMessage}
/> />
</div> </div>
@ -502,6 +505,7 @@
<div class="absolute top-2 right-2 z-10"> <div class="absolute top-2 right-2 z-10">
<button <button
class="p-1.5 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition" class="p-1.5 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition"
aria-label={$i18n.t('Copy content')}
on:click={copyContent} on:click={copyContent}
> >
{#if contentCopied} {#if contentCopied}

1
src/lib/components/workspace/Prompts/PromptHistoryMenu.svelte
View File

@ -43,6 +43,7 @@
<slot> <slot>
<button <button
class="p-1 rounded-lg text-gray-500 hover:bg-gray-50 dark:hover:bg-gray-850 transition" class="p-1 rounded-lg text-gray-500 hover:bg-gray-50 dark:hover:bg-gray-850 transition"
aria-label={$i18n.t('More Options')}
> >
<EllipsisHorizontal className="size-5" /> <EllipsisHorizontal className="size-5" />
</button> </button>

3
src/lib/components/workspace/Skills.svelte
View File

@ -321,12 +321,14 @@
<input <input
class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
aria-label={$i18n.t('Search Skills')}
placeholder={$i18n.t('Search Skills')} placeholder={$i18n.t('Search Skills')}
/> />
{#if query} {#if query}
<div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent"> <div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent">
<button <button
class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition" class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition"
aria-label={$i18n.t('Clear search')}
on:click={() => { on:click={() => {
query = ''; query = '';
}} }}
@ -453,6 +455,7 @@
<button <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" 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" type="button"
aria-label={$i18n.t('Delete')}
on:click={() => { on:click={() => {
deleteHandler(skill); deleteHandler(skill);
}} }}

5
src/lib/components/workspace/Skills/SkillEditor.svelte
View File

@ -136,6 +136,7 @@
<Tooltip content={$i18n.t('Back')}> <Tooltip content={$i18n.t('Back')}>
<button <button
class="w-full text-left text-sm py-1.5 px-1 rounded-lg dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-gray-850" class="w-full text-left text-sm py-1.5 px-1 rounded-lg dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-gray-850"
aria-label={$i18n.t('Back')}
on:click={() => { on:click={() => {
goto('/workspace/skills'); goto('/workspace/skills');
}} }}
@ -152,6 +153,7 @@
class="w-full text-2xl bg-transparent outline-hidden" class="w-full text-2xl bg-transparent outline-hidden"
type="text" type="text"
placeholder={$i18n.t('Skill Name')} placeholder={$i18n.t('Skill Name')}
aria-label={$i18n.t('Skill Name')}
bind:value={name} bind:value={name}
on:input={handleNameInput} on:input={handleNameInput}
required required
@ -197,6 +199,7 @@
class="w-full text-sm disabled:text-gray-500 bg-transparent outline-hidden" class="w-full text-sm disabled:text-gray-500 bg-transparent outline-hidden"
type="text" type="text"
placeholder={$i18n.t('Skill ID')} placeholder={$i18n.t('Skill ID')}
aria-label={$i18n.t('Skill ID')}
bind:value={id} bind:value={id}
on:input={handleIdInput} on:input={handleIdInput}
required required
@ -214,6 +217,7 @@
class="w-full text-sm bg-transparent outline-hidden" class="w-full text-sm bg-transparent outline-hidden"
type="text" type="text"
placeholder={$i18n.t('Skill Description')} placeholder={$i18n.t('Skill Description')}
aria-label={$i18n.t('Skill Description')}
bind:value={description} bind:value={description}
on:input={handleDescriptionInput} on:input={handleDescriptionInput}
{disabled} {disabled}
@ -236,6 +240,7 @@
class="w-full flex-1 text-xs bg-transparent outline-hidden resize-none font-mono px-4 py-3" class="w-full flex-1 text-xs bg-transparent outline-hidden resize-none font-mono px-4 py-3"
bind:value={content} bind:value={content}
placeholder={$i18n.t('Enter skill instructions in markdown...')} placeholder={$i18n.t('Enter skill instructions in markdown...')}
aria-label={$i18n.t('Skill Instructions')}
required required
/> />
{/if} {/if}

5
src/lib/components/workspace/Tools.svelte
View File

@ -325,12 +325,14 @@
<input <input
class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent" class=" w-full text-sm pr-4 py-1 rounded-r-xl outline-hidden bg-transparent"
bind:value={query} bind:value={query}
aria-label={$i18n.t('Search Tools')}
placeholder={$i18n.t('Search Tools')} placeholder={$i18n.t('Search Tools')}
/> />
{#if query} {#if query}
<div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent"> <div class="self-center pl-1.5 translate-y-[0.5px] rounded-l-xl bg-transparent">
<button <button
class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition" class="p-0.5 rounded-full hover:bg-gray-100 dark:hover:bg-gray-900 transition"
aria-label={$i18n.t('Clear search')}
on:click={() => { on:click={() => {
query = ''; query = '';
}} }}
@ -457,6 +459,7 @@
<button <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" 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" type="button"
aria-label={$i18n.t('Delete')}
on:click={() => { on:click={() => {
deleteHandler(tool); deleteHandler(tool);
}} }}
@ -470,6 +473,7 @@
<button <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" 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" type="button"
aria-label={$i18n.t('Support')}
on:click={() => { on:click={() => {
selectedTool = tool; selectedTool = tool;
showManifestModal = true; showManifestModal = true;
@ -484,6 +488,7 @@
<button <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" 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" type="button"
aria-label={$i18n.t('Valves')}
on:click={() => { on:click={() => {
selectedTool = tool; selectedTool = tool;
showValvesModal = true; showValvesModal = true;

4
src/lib/components/workspace/Tools/ToolkitEditor.svelte
View File

@ -225,6 +225,7 @@ class Tools:
<Tooltip content={$i18n.t('Back')}> <Tooltip content={$i18n.t('Back')}>
<button <button
class="w-full text-left text-sm py-1.5 px-1 rounded-lg dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-gray-850" class="w-full text-left text-sm py-1.5 px-1 rounded-lg dark:text-gray-300 dark:hover:text-white hover:bg-black/5 dark:hover:bg-gray-850"
aria-label={$i18n.t('Back')}
on:click={() => { on:click={() => {
goto('/workspace/tools'); goto('/workspace/tools');
}} }}
@ -241,6 +242,7 @@ class Tools:
class="w-full text-2xl bg-transparent outline-hidden" class="w-full text-2xl bg-transparent outline-hidden"
type="text" type="text"
placeholder={$i18n.t('Tool Name')} placeholder={$i18n.t('Tool Name')}
aria-label={$i18n.t('Tool Name')}
bind:value={name} bind:value={name}
required required
/> />
@ -275,6 +277,7 @@ class Tools:
class="w-full text-sm disabled:text-gray-500 bg-transparent outline-hidden" class="w-full text-sm disabled:text-gray-500 bg-transparent outline-hidden"
type="text" type="text"
placeholder={$i18n.t('Tool ID')} placeholder={$i18n.t('Tool ID')}
aria-label={$i18n.t('Tool ID')}
bind:value={id} bind:value={id}
required required
disabled={edit} disabled={edit}
@ -291,6 +294,7 @@ class Tools:
class="w-full text-sm bg-transparent outline-hidden" class="w-full text-sm bg-transparent outline-hidden"
type="text" type="text"
placeholder={$i18n.t('Tool Description')} placeholder={$i18n.t('Tool Description')}
aria-label={$i18n.t('Tool Description')}
bind:value={meta.description} bind:value={meta.description}
required required
/> />

6
src/routes/(app)/workspace/+layout.svelte
View File

@ -67,6 +67,7 @@
<button <button
id="sidebar-toggle-button" id="sidebar-toggle-button"
class=" cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition cursor-" class=" cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition cursor-"
aria-label={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
on:click={() => { on:click={() => {
showSidebar.set(!$showSidebar); showSidebar.set(!$showSidebar);
}} }}
@ -86,6 +87,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.models} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.models}
<a <a
draggable="false" draggable="false"
aria-current={$page.url.pathname.includes('/workspace/models') ? 'page' : null}
class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/models') class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/models')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none"
@ -96,6 +98,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.knowledge} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.knowledge}
<a <a
draggable="false" draggable="false"
aria-current={$page.url.pathname.includes('/workspace/knowledge') ? 'page' : null}
class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/knowledge') class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/knowledge')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none"
@ -108,6 +111,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.prompts} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.prompts}
<a <a
draggable="false" draggable="false"
aria-current={$page.url.pathname.includes('/workspace/prompts') ? 'page' : null}
class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/prompts') class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/prompts')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none"
@ -118,6 +122,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.skills} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.skills}
<a <a
draggable="false" draggable="false"
aria-current={$page.url.pathname.includes('/workspace/skills') ? 'page' : null}
class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/skills') class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/skills')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none"
@ -130,6 +135,7 @@
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.tools} {#if $user?.role === 'admin' || $user?.permissions?.workspace?.tools}
<a <a
draggable="false" draggable="false"
aria-current={$page.url.pathname.includes('/workspace/tools') ? 'page' : null}
class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/tools') class="min-w-fit p-1.5 {$page.url.pathname.includes('/workspace/tools')
? '' ? ''
: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none" : 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition select-none"