diff --git a/src/lib/organisms/Category/Category.svelte b/src/lib/organisms/Category/Category.svelte index 075a01a..d70a6d3 100644 --- a/src/lib/organisms/Category/Category.svelte +++ b/src/lib/organisms/Category/Category.svelte @@ -12,6 +12,7 @@ interface Props { info: CategoryInfo; onFileClick: (file: SelectedFile) => void; + onFileRemoveClick: (file: SelectedFile) => void; onSubCategoryClick: (subCategory: SelectedCategory) => void; onSubCategoryCreateClick: () => void; onSubCategoryMenuClick: (subCategory: SelectedCategory) => void; @@ -20,6 +21,7 @@ let { info, onFileClick, + onFileRemoveClick, onSubCategoryClick, onSubCategoryCreateClick, onSubCategoryMenuClick, @@ -53,7 +55,7 @@
{#key info} {#each files as file} - + {:else}

이 카테고리에 추가된 파일이 없어요.

{/each} diff --git a/src/lib/organisms/Category/File.svelte b/src/lib/organisms/Category/File.svelte index c3b9b97..f15f9b0 100644 --- a/src/lib/organisms/Category/File.svelte +++ b/src/lib/organisms/Category/File.svelte @@ -4,14 +4,15 @@ import type { SelectedFile } from "./service"; import IconDraft from "~icons/material-symbols/draft"; - import IconMoreVert from "~icons/material-symbols/more-vert"; + import IconClose from "~icons/material-symbols/close"; interface Props { info: Writable; onclick: (selectedFile: SelectedFile) => void; + onRemoveClick: (selectedFile: SelectedFile) => void; } - let { info, onclick }: Props = $props(); + let { info, onclick, onRemoveClick }: Props = $props(); const openFile = () => { const { id, dataKey, dataKeyVersion, name } = $info as FileInfo; @@ -22,10 +23,15 @@ }, 100); }; - const openMenu = (e: Event) => { + const removeFile = (e: Event) => { e.stopPropagation(); - // TODO + const { id, dataKey, dataKeyVersion, name } = $info as FileInfo; + if (!dataKey || !dataKeyVersion) return; // TODO: Error handling + + setTimeout(() => { + onRemoveClick({ id, dataKey, dataKeyVersion, name }); + }, 100); }; @@ -41,21 +47,21 @@ {$info.name}

{/if} diff --git a/src/lib/services/category.ts b/src/lib/services/category.ts index c2018ed..ab574f5 100644 --- a/src/lib/services/category.ts +++ b/src/lib/services/category.ts @@ -1,6 +1,6 @@ import { callPostApi } from "$lib/hooks"; import { generateDataKey, wrapDataKey, encryptString } from "$lib/modules/crypto"; -import type { CategoryCreateRequest } from "$lib/server/schemas"; +import type { CategoryCreateRequest, CategoryFileRemoveRequest } from "$lib/server/schemas"; import type { MasterKey } from "$lib/stores"; export const requestCategoryCreation = async ( @@ -19,3 +19,11 @@ export const requestCategoryCreation = async ( nameIv: nameEncrypted.iv, }); }; + +export const requestFileRemovalFromCategory = async (fileId: number, categoryId: number) => { + const res = await callPostApi( + `/api/category/${categoryId}/file/remove`, + { file: fileId }, + ); + return res.ok; +}; diff --git a/src/routes/(fullscreen)/file/[id]/+page.svelte b/src/routes/(fullscreen)/file/[id]/+page.svelte index 7097078..902d09e 100644 --- a/src/routes/(fullscreen)/file/[id]/+page.svelte +++ b/src/routes/(fullscreen)/file/[id]/+page.svelte @@ -16,9 +16,9 @@ import AddToCategoryBottomSheet from "./AddToCategoryBottomSheet.svelte"; import DownloadStatus from "./DownloadStatus.svelte"; import { + requestFileRemovalFromCategory, requestFileDownload, requestFileAdditionToCategory, - requestFileRemovalFromCategory, } from "./service"; import IconClose from "~icons/material-symbols/close"; diff --git a/src/routes/(fullscreen)/file/[id]/service.ts b/src/routes/(fullscreen)/file/[id]/service.ts index e45a108..43f0134 100644 --- a/src/routes/(fullscreen)/file/[id]/service.ts +++ b/src/routes/(fullscreen)/file/[id]/service.ts @@ -1,8 +1,8 @@ import { callPostApi } from "$lib/hooks"; import { getFileCache, storeFileCache, downloadFile } from "$lib/modules/file"; -import type { CategoryFileAddRequest, CategoryFileRemoveRequest } from "$lib/server/schemas"; +import type { CategoryFileAddRequest } from "$lib/server/schemas"; -export { requestCategoryCreation } from "$lib/services/category"; +export { requestCategoryCreation, requestFileRemovalFromCategory } from "$lib/services/category"; export const requestFileDownload = async ( fileId: number, @@ -23,11 +23,3 @@ export const requestFileAdditionToCategory = async (fileId: number, categoryId: }); return res.ok; }; - -export const requestFileRemovalFromCategory = async (fileId: number, categoryId: number) => { - const res = await callPostApi( - `/api/category/${categoryId}/file/remove`, - { file: fileId }, - ); - return res.ok; -}; diff --git a/src/routes/(main)/category/[[id]]/+page.svelte b/src/routes/(main)/category/[[id]]/+page.svelte index cbd0e2e..163b890 100644 --- a/src/routes/(main)/category/[[id]]/+page.svelte +++ b/src/routes/(main)/category/[[id]]/+page.svelte @@ -12,6 +12,7 @@ import RenameCategoryModal from "./RenameCategoryModal.svelte"; import { requestCategoryCreation, + requestFileRemovalFromCategory, requestCategoryRename, requestCategoryDeletion, } from "./service"; @@ -49,13 +50,17 @@ {#if $info} goto(`/file/${id}`)} + onFileRemoveClick={({ id }) => { + requestFileRemovalFromCategory(id, data.id as number); + info = getCategoryInfo(data.id, $masterKeyStore?.get(1)?.key!); // TODO: FIXME + }} onSubCategoryClick={({ id }) => goto(`/category/${id}`)} onSubCategoryCreateClick={() => (isCreateCategoryModalOpen = true)} onSubCategoryMenuClick={(subCategory) => { selectedSubCategory = subCategory; isSubCategoryMenuBottomSheetOpen = true; }} - onFileClick={({ id }) => goto(`/file/${id}`)} /> {/if} diff --git a/src/routes/(main)/category/[[id]]/service.ts b/src/routes/(main)/category/[[id]]/service.ts index 8a5d9f8..a4ebe57 100644 --- a/src/routes/(main)/category/[[id]]/service.ts +++ b/src/routes/(main)/category/[[id]]/service.ts @@ -3,7 +3,7 @@ import { encryptString } from "$lib/modules/crypto"; import type { SelectedCategory } from "$lib/molecules/Categories"; import type { CategoryRenameRequest } from "$lib/server/schemas"; -export { requestCategoryCreation } from "$lib/services/category"; +export { requestCategoryCreation, requestFileRemovalFromCategory } from "$lib/services/category"; export const requestCategoryRename = async (category: SelectedCategory, newName: string) => { const newNameEncrypted = await encryptString(newName, category.dataKey);