refac: temp chat button location

This commit is contained in:
Timothy Jaeryang Baek 2025-08-19 02:03:43 +04:00
parent d6f709574e
commit 47ec443728
5 changed files with 80 additions and 20 deletions

View file

@ -58,10 +58,6 @@
label: model.name,
model: model
}))}
showTemporaryChatControl={$user?.role === 'user'
? ($user?.permissions?.chat?.temporary ?? true) &&
!($user?.permissions?.chat?.temporary_enforced ?? false)
: true}
{pinModelHandler}
bind:value={selectedModel}
/>

View file

@ -30,6 +30,12 @@
import Banner from '../common/Banner.svelte';
import Sidebar from '../icons/Sidebar.svelte';
import ChatBubbleDotted from '../icons/ChatBubbleDotted.svelte';
import ChatBubbleDottedChecked from '../icons/ChatBubbleDottedChecked.svelte';
import EllipsisHorizontal from '../icons/EllipsisHorizontal.svelte';
import { goto } from '$app/navigation';
const i18n = getContext('i18n');
export let initNewChat: Function;
@ -98,6 +104,34 @@
<div class="self-start flex flex-none items-center text-gray-600 dark:text-gray-400">
<!-- <div class="md:hidden flex self-center w-[1px] h-5 mx-2 bg-gray-300 dark:bg-stone-700" /> -->
{#if !chat?.id && ($user?.role === 'user' ? ($user?.permissions?.chat?.temporary ?? true) && !($user?.permissions?.chat?.temporary_enforced ?? false) : true)}
<Tooltip content={$i18n.t(`Temporary Chat`)}>
<button
class="flex cursor-pointer px-2 py-2 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-850 transition"
id="temporary-chat-button"
on:click={async () => {
temporaryChatEnabled.set(!$temporaryChatEnabled);
await goto('/');
// add 'temporary-chat=true' to the URL
if ($temporaryChatEnabled) {
window.history.replaceState(null, '', '?temporary-chat=true');
} else {
window.history.replaceState(null, '', location.pathname);
}
}}
>
<div class=" m-auto self-center">
{#if $temporaryChatEnabled}
<ChatBubbleDottedChecked className=" size-4.5" strokeWidth="1.5" />
{:else}
<ChatBubbleDotted className=" size-4.5" strokeWidth="1.5" />
{/if}
</div>
</button>
</Tooltip>
{/if}
{#if shareEnabled && chat && (chat.id || $temporaryChatEnabled)}
<Menu
{chat}
@ -114,20 +148,7 @@
id="chat-context-menu-button"
>
<div class=" m-auto self-center">
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="size-5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M6.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM12.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM18.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z"
/>
</svg>
<EllipsisHorizontal className=" size-5" strokeWidth="1.5" />
</div>
</button>
</Menu>
@ -143,7 +164,7 @@
aria-label="Controls"
>
<div class=" m-auto self-center">
<AdjustmentsHorizontal className=" size-5" strokeWidth="0.5" />
<AdjustmentsHorizontal className=" size-5" strokeWidth="1" />
</div>
</button>
</Tooltip>

View file

@ -12,6 +12,8 @@
stroke-width={strokeWidth}
>
<path
d="M18.75 12.75h1.5a.75.75 0 0 0 0-1.5h-1.5a.75.75 0 0 0 0 1.5ZM12 6a.75.75 0 0 1 .75-.75h7.5a.75.75 0 0 1 0 1.5h-7.5A.75.75 0 0 1 12 6ZM12 18a.75.75 0 0 1 .75-.75h7.5a.75.75 0 0 1 0 1.5h-7.5A.75.75 0 0 1 12 18ZM3.75 6.75h1.5a.75.75 0 1 0 0-1.5h-1.5a.75.75 0 0 0 0 1.5ZM5.25 18.75h-1.5a.75.75 0 0 1 0-1.5h1.5a.75.75 0 0 1 0 1.5ZM3 12a.75.75 0 0 1 .75-.75h7.5a.75.75 0 0 1 0 1.5h-7.5A.75.75 0 0 1 3 12ZM9 3.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5ZM12.75 12a2.25 2.25 0 1 1 4.5 0 2.25 2.25 0 0 1-4.5 0ZM9 15.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z"
stroke-linecap="round"
stroke-linejoin="round"
d="M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75"
/>
</svg>

View file

@ -0,0 +1,20 @@
<script lang="ts">
export let className = 'size-4';
export let strokeWidth = '1.5';
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width={strokeWidth}
stroke="currentColor"
class={className}
>
<path
d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 13.8214 2.48697 15.5291 3.33782 17L2.5 21.5L7 20.6622C8.47087 21.513 10.1786 22 12 22Z"
stroke-linecap="round"
stroke-linejoin="round"
stroke-dasharray="2.5 3.5"
></path>
</svg>

View file

@ -0,0 +1,21 @@
<script lang="ts">
export let className = 'size-4';
export let strokeWidth = '1.5';
</script>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width={strokeWidth}
stroke="currentColor"
class={className}
>
<path d="M8 12L11 15L16 10" stroke-linecap="round" stroke-linejoin="round"></path>
<path
d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 13.8214 2.48697 15.5291 3.33782 17L2.5 21.5L7 20.6622C8.47087 21.513 10.1786 22 12 22Z"
stroke-linecap="round"
stroke-linejoin="round"
stroke-dasharray="2.5 3.5"
></path>
</svg>