fix: collapsible space toggle issue

This commit is contained in:
Timothy J. Baek 2024-10-16 22:36:44 -07:00
parent 7b97d7a718
commit 29c39d44e1
4 changed files with 76 additions and 17 deletions

View File

@ -101,6 +101,10 @@ class FolderTable:
try:
with get_db() as db:
folder = db.query(Folder).filter_by(id=id, user_id=user_id).first()
if not folder:
return None
return FolderModel.model_validate(folder)
except Exception:
return None
@ -119,12 +123,16 @@ class FolderTable:
with get_db() as db:
folder = (
db.query(Folder)
.filter_by(parent_id=parent_id, user_id=user_id, name=name)
.filter_by(parent_id=parent_id, user_id=user_id, name=name.lower())
.first()
)
if not folder:
return None
return FolderModel.model_validate(folder)
except Exception as e:
log.error(f"get_folder_by_name_and_user_id: {e}")
log.error(f"get_folder_by_parent_id_and_user_id_and_name: {e}")
return None
def get_folders_by_parent_id_and_user_id(
@ -147,6 +155,10 @@ class FolderTable:
try:
with get_db() as db:
folder = db.query(Folder).filter_by(id=id, user_id=user_id).first()
if not folder:
return None
folder.parent_id = parent_id
folder.updated_at = int(time.time())
@ -164,6 +176,9 @@ class FolderTable:
with get_db() as db:
folder = db.query(Folder).filter_by(id=id, user_id=user_id).first()
if not folder:
return None
existing_folder = (
db.query(Folder)
.filter_by(name=name, parent_id=folder.parent_id, user_id=user_id)
@ -190,6 +205,9 @@ class FolderTable:
with get_db() as db:
folder = db.query(Folder).filter_by(id=id, user_id=user_id).first()
if not folder:
return None
folder.items = items.model_dump()
folder.updated_at = int(time.time())

View File

@ -215,7 +215,18 @@ async def delete_folder_by_id(id: str, user=Depends(get_verified_user)):
if folder:
try:
result = Folders.delete_folder_by_id_and_user_id(id, user.id)
return result
if result:
# Delete all chats in the folder
chats = Chats.get_chats_by_folder_id_and_user_id(id, user.id)
for chat in chats:
Chats.delete_chat_by_id(chat.id, user.id)
return result
else:
raise HTTPException(
status_code=status.HTTP_400_BAD_REQUEST,
detail=ERROR_MESSAGES.DEFAULT("Error deleting folder"),
)
except Exception as e:
log.exception(e)
log.error(f"Error deleting folder: {id}")

View File

@ -18,7 +18,9 @@
<div class={className}>
{#if title !== null}
<button class={buttonClassName} on:click={() => (open = !open)}>
<!-- svelte-ignore a11y-no-static-element-interactions -->
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class={buttonClassName} on:pointerup={() => (open = !open)}>
<div class=" w-fit font-medium transition flex items-center justify-between gap-2">
<div>
{title}
@ -32,15 +34,17 @@
{/if}
</div>
</div>
</button>
</div>
{:else}
<button class={buttonClassName} on:click={() => (open = !open)}>
<!-- svelte-ignore a11y-no-static-element-interactions -->
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class={buttonClassName} on:pointerup={() => (open = !open)}>
<div
class="flex items-center gap-2 text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 transition"
>
<slot />
</div>
</button>
</div>
{/if}
{#if open}

View File

@ -11,6 +11,8 @@
import FolderOpen from '$lib/components/icons/FolderOpen.svelte';
import EllipsisHorizontal from '$lib/components/icons/EllipsisHorizontal.svelte';
import { updateFolderNameById } from '$lib/apis/folders';
import { toast } from 'svelte-sonner';
export let open = true;
@ -136,6 +138,29 @@
folderElement.removeEventListener('dragend', onDragEnd);
}
});
const nameUpdateHandler = async () => {
name = name.trim();
if (name === '') {
toast.error("Folder name can't be empty");
return;
}
if (name === folders[folderId].name) {
edit = false;
return;
}
const res = await updateFolderNameById(localStorage.token, folderId, name).catch((error) => {
toast.error(error);
return null;
});
if (res) {
folders[folderId].name = name;
}
};
</script>
{#if dragged && x && y}
@ -194,17 +219,18 @@
<input
id="folder-{folderId}-input"
type="text"
bind:value={folders[folderId].name}
on:input={(e) => {
folders[folderId].name = e.target.value;
}}
bind:value={name}
on:blur={() => {
edit = false;
nameUpdateHandler();
}}
on:keydown={(e) => {
if (e.key === 'Enter') {
edit = false;
}
on:click={(e) => {
// Prevent accidental collapse toggling when clicking inside input
e.stopPropagation();
}}
on:mousedown={(e) => {
// Prevent accidental collapse toggling when clicking inside input
e.stopPropagation();
}}
class="w-full h-full bg-transparent text-gray-500 dark:text-gray-500 outline-none"
/>
@ -213,14 +239,14 @@
{/if}
</div>
<div class=" hidden group-hover:flex">
<div class=" hidden group-hover:flex dark:text-gray-300">
<button
on:click={(e) => {
e.stopPropagation();
console.log('clicked');
}}
>
<EllipsisHorizontal className="size-3.5" strokeWidth="2.5" />
<EllipsisHorizontal className="size-4" strokeWidth="2.5" />
</button>
</div>
</button>