merged new updates

src/lib/components/layout/Sidebar.svelte

@@ -38,7 +38,7 @@
 	let isEditing = false;
 
 	onMount(async () => {
-		if (window.innerWidth > 1280) {
+		if (window.innerWidth > 1024) {
 			show = true;
 		}
 		await chats.set(await getChatList(localStorage.token));
@@ -388,6 +388,11 @@
 									? 'bg-gray-900'
 									: ''} transition whitespace-nowrap text-ellipsis"
 								href="/c/{chat.id}"
+								on:click={() => {
+									if (window.innerWidth < 1024) {
+										show = false;
+									}
+								}}
 							>
 								<div class=" flex self-center flex-1 w-full">
 									<div
@@ -599,6 +604,32 @@
 										</div>
 										<div class=" self-center font-medium">{$i18n.t('Admin Panel')}</div>
 									</button>
+
+									<button
+										class="flex py-2.5 px-3.5 w-full hover:bg-gray-800 transition"
+										on:click={() => {
+											goto('/playground');
+											showDropdown = false;
+										}}
+									>
+										<div class=" self-center mr-3">
+											<svg
+												xmlns="http://www.w3.org/2000/svg"
+												fill="none"
+												viewBox="0 0 24 24"
+												stroke-width="1.5"
+												stroke="currentColor"
+												class="w-5 h-5"
+											>
+												<path
+													stroke-linecap="round"
+													stroke-linejoin="round"
+													d="m6.75 7.5 3 2.25-3 2.25m4.5 0h3m-9 8.25h13.5A2.25 2.25 0 0 0 21 18V6a2.25 2.25 0 0 0-2.25-2.25H5.25A2.25 2.25 0 0 0 3 6v12a2.25 2.25 0 0 0 2.25 2.25Z"
+												/>
+											</svg>
+										</div>
+										<div class=" self-center font-medium">Playground</div>
+									</button>
 								{/if}
 
 								<button