diff --git a/eslint.config.js b/eslint.config.js index c052e3e..1994a63 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -13,6 +13,20 @@ const svelteConfig = (await loadConfig("./", { traverse: false }))?.config; const gitignorePath = fileURLToPath(new URL("./.gitignore", import.meta.url)); +// Restricts the direction of dependencies between modules +const defineImportBoundaries = (boundaries) => + Object.entries(boundaries).map(([files, regex]) => ({ + files: [files], + rules: { + "no-restricted-imports": [ + "error", + { + patterns: [{ regex, message: "Violates the dependency direction between modules." }], + }, + ], + }, + })); + export default defineConfig( includeIgnoreFile(gitignorePath), js.configs.recommended, @@ -37,6 +51,17 @@ export default defineConfig( "no-undef": "off", }, }, + ...defineImportBoundaries({ + // Pure code shared by the server, the client, and the service worker + "src/lib/shared/**": "^(#lib/(?!shared/)|#trpc/|#workers/|\\$app/|svelte($|/))", + "src/lib/server/**": "^(#lib/(client|features|ui)/|#trpc/)", + // Infrastructure of the browser + "src/lib/client/**": "^#lib/(server|features|ui)/", + // Domain-agnostic components + "src/lib/ui/**": "^(#lib/(server|client|features)/|#trpc/)", + "src/lib/features/**": "^#lib/server/", + "src/service-worker/**": "^(#lib/(?!shared/|client/storage/opfs\\.js$)|#trpc/|#workers/)", + }), { files: ["**/*.svelte", "**/*.svelte.ts", "**/*.svelte.js"], languageOptions: { diff --git a/src/lib/client/cache/thumbnailCache.svelte.ts b/src/lib/client/cache/thumbnailCache.svelte.ts index 5a36e3d..cc45213 100644 --- a/src/lib/client/cache/thumbnailCache.svelte.ts +++ b/src/lib/client/cache/thumbnailCache.svelte.ts @@ -1,7 +1,6 @@ /* eslint-disable svelte/prefer-svelte-reactivity -- Lookup tables of reactive entries */ import { LRUCache } from "lru-cache"; import { deleteDirectory, deleteFile, readFile, writeFile } from "#lib/client/storage/opfs.js"; -import type { SummarizedFileInfo } from "#lib/features/filesystem/index.js"; import { decryptChunk, encodeToBase64 } from "#lib/shared/crypto/index.js"; export interface Thumbnail { @@ -33,7 +32,11 @@ const fetchFromServer = async (fileId: number, dataKey: CryptoKey) => { return getThumbnailUrl(thumbnailBuffer); }; -export const getFileThumbnail = (file: SummarizedFileInfo) => { +export const getFileThumbnail = (file: { + id: number; + contentType: string; + dataKey?: { key: CryptoKey }; +}) => { if (!(file.contentType.startsWith("image/") || file.contentType.startsWith("video/"))) { return undefined; } diff --git a/src/lib/components/atoms/buttons/index.ts b/src/lib/components/atoms/buttons/index.ts deleted file mode 100644 index 4ed77f2..0000000 --- a/src/lib/components/atoms/buttons/index.ts +++ /dev/null @@ -1,6 +0,0 @@ -export { default as ActionEntryButton } from "./ActionEntryButton.svelte"; -export { default as Button } from "./Button.svelte"; -export { default as EntryButton } from "./EntryButton.svelte"; -export { default as FileThumbnailButton } from "./FileThumbnailButton.svelte"; -export { default as FloatingButton } from "./FloatingButton.svelte"; -export { default as TextButton } from "./TextButton.svelte"; diff --git a/src/lib/components/atoms/divs/index.ts b/src/lib/components/atoms/divs/index.ts deleted file mode 100644 index 561bbde..0000000 --- a/src/lib/components/atoms/divs/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -export { default as AdaptiveDiv } from "./AdaptiveDiv.svelte"; -export { default as BottomDiv } from "./BottomDiv.svelte"; -export { default as FullscreenDiv } from "./FullscreenDiv.svelte"; diff --git a/src/lib/components/atoms/index.ts b/src/lib/components/atoms/index.ts deleted file mode 100644 index 1ba53f7..0000000 --- a/src/lib/components/atoms/index.ts +++ /dev/null @@ -1,8 +0,0 @@ -export { default as BottomSheet } from "./BottomSheet.svelte"; -export * from "./buttons"; -export { default as Chip } from "./Chip.svelte"; -export * from "./divs"; -export * from "./inputs"; -export { default as Modal } from "./Modal.svelte"; -export { default as RowVirtualizer } from "./RowVirtualizer.svelte"; -export { default as Toasts } from "./Toasts.svelte"; diff --git a/src/lib/components/atoms/inputs/index.ts b/src/lib/components/atoms/inputs/index.ts deleted file mode 100644 index 47cb929..0000000 --- a/src/lib/components/atoms/inputs/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export { default as CheckBox } from "./CheckBox.svelte"; -export { default as TextInput } from "./TextInput.svelte"; diff --git a/src/lib/components/molecules/index.ts b/src/lib/components/molecules/index.ts deleted file mode 100644 index a36afcd..0000000 --- a/src/lib/components/molecules/index.ts +++ /dev/null @@ -1,9 +0,0 @@ -export * from "./ActionModal.svelte"; -export { default as ActionModal } from "./ActionModal.svelte"; -export * from "./Categories.svelte"; -export { default as Categories } from "./Categories.svelte"; -export { default as IconEntryButton } from "./IconEntryButton.svelte"; -export * from "./labels"; -export { default as SubCategories } from "./SubCategories.svelte"; -export { default as TitledDiv } from "./TitledDiv.svelte"; -export { default as TopBar } from "./TopBar.svelte"; diff --git a/src/lib/components/molecules/labels/index.ts b/src/lib/components/molecules/labels/index.ts deleted file mode 100644 index af8f40b..0000000 --- a/src/lib/components/molecules/labels/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -export { default as CategoryLabel } from "./CategoryLabel.svelte"; -export { default as DirectoryEntryLabel } from "./DirectoryEntryLabel.svelte"; -export { default as IconLabel } from "./IconLabel.svelte"; -export { default as TitleLabel } from "./TitleLabel.svelte"; diff --git a/src/lib/components/organisms/index.ts b/src/lib/components/organisms/index.ts deleted file mode 100644 index fa02317..0000000 --- a/src/lib/components/organisms/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./modals"; diff --git a/src/lib/components/organisms/modals/index.ts b/src/lib/components/organisms/modals/index.ts deleted file mode 100644 index 56c64a1..0000000 --- a/src/lib/components/organisms/modals/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -export { default as CategoryCreateModal } from "./CategoryCreateModal.svelte"; -export { default as ForceLoginModal } from "./ForceLoginModal.svelte"; -export { default as RenameModal } from "./RenameModal.svelte"; -export { default as TextInputModal } from "./TextInputModal.svelte"; diff --git a/src/lib/components/organisms/modals/ForceLoginModal.svelte b/src/lib/features/auth/components/ForceLoginModal.svelte similarity index 88% rename from src/lib/components/organisms/modals/ForceLoginModal.svelte rename to src/lib/features/auth/components/ForceLoginModal.svelte index 010f5f2..259e9b0 100644 --- a/src/lib/components/organisms/modals/ForceLoginModal.svelte +++ b/src/lib/features/auth/components/ForceLoginModal.svelte @@ -1,5 +1,5 @@ + + + + diff --git a/src/lib/features/filesystem/components/FileEntry.svelte b/src/lib/features/filesystem/components/FileEntry.svelte new file mode 100644 index 0000000..3af2dca --- /dev/null +++ b/src/lib/features/filesystem/components/FileEntry.svelte @@ -0,0 +1,40 @@ + + + + + diff --git a/src/lib/components/atoms/buttons/FileThumbnailButton.svelte b/src/lib/features/filesystem/components/FileThumbnailButton.svelte similarity index 100% rename from src/lib/components/atoms/buttons/FileThumbnailButton.svelte rename to src/lib/features/filesystem/components/FileThumbnailButton.svelte diff --git a/src/lib/components/molecules/SubCategories.svelte b/src/lib/features/filesystem/components/SubCategories.svelte similarity index 91% rename from src/lib/components/molecules/SubCategories.svelte rename to src/lib/features/filesystem/components/SubCategories.svelte index 820f960..243a627 100644 --- a/src/lib/components/molecules/SubCategories.svelte +++ b/src/lib/features/filesystem/components/SubCategories.svelte @@ -1,12 +1,9 @@
diff --git a/src/lib/ui/overlays/overlayGroup.svelte.ts b/src/lib/ui/overlays/overlayGroup.svelte.ts new file mode 100644 index 0000000..35ee002 --- /dev/null +++ b/src/lib/ui/overlays/overlayGroup.svelte.ts @@ -0,0 +1,27 @@ +// Manages overlays (modals and bottom sheets) of which at most one is open at a time +export class OverlayGroup { + current: T | undefined = $state(); + + open(name: T) { + this.current = name; + } + + close() { + this.current = undefined; + } + + // Getter and setter for `bind:isOpen={getter, setter}` + getter(name: T) { + return () => this.current === name; + } + + setter(name: T) { + return (isOpen: boolean) => { + if (isOpen) { + this.current = name; + } else if (this.current === name) { + this.current = undefined; + } + }; + } +} diff --git a/src/lib/ui/overlays/toast.svelte.ts b/src/lib/ui/overlays/toast.svelte.ts new file mode 100644 index 0000000..9fe4fbd --- /dev/null +++ b/src/lib/ui/overlays/toast.svelte.ts @@ -0,0 +1,19 @@ +export interface Toast { + id: number; + message: string; +} + +const TOAST_DURATION = 3000; + +let toasts: Toast[] = $state([]); +let nextId = 0; + +export const getToasts = () => toasts; + +export const showToast = (message: string) => { + const toast = { id: nextId++, message }; + toasts.push(toast); + setTimeout(() => { + toasts = toasts.filter(({ id }) => id !== toast.id); + }, TOAST_DURATION); +}; diff --git a/src/routes/(fullscreen)/+layout.svelte b/src/routes/(fullscreen)/+layout.svelte index 78ad275..13711d7 100644 --- a/src/routes/(fullscreen)/+layout.svelte +++ b/src/routes/(fullscreen)/+layout.svelte @@ -1,5 +1,5 @@ diff --git a/src/routes/(fullscreen)/auth/changePassword/+page.svelte b/src/routes/(fullscreen)/auth/changePassword/+page.svelte index bd5e43f..be11553 100644 --- a/src/routes/(fullscreen)/auth/changePassword/+page.svelte +++ b/src/routes/(fullscreen)/auth/changePassword/+page.svelte @@ -1,9 +1,16 @@ - - - - diff --git a/src/routes/(fullscreen)/search/File.svelte b/src/routes/(fullscreen)/search/File.svelte deleted file mode 100644 index d87b708..0000000 --- a/src/routes/(fullscreen)/search/File.svelte +++ /dev/null @@ -1,26 +0,0 @@ - - - - - diff --git a/src/routes/(fullscreen)/search/SelectCategoryBottomSheet.svelte b/src/routes/(fullscreen)/search/SelectCategoryBottomSheet.svelte index d07aa84..4c237ff 100644 --- a/src/routes/(fullscreen)/search/SelectCategoryBottomSheet.svelte +++ b/src/routes/(fullscreen)/search/SelectCategoryBottomSheet.svelte @@ -1,7 +1,7 @@ - - - - onclick(info)} - actionButtonIcon={!status || status === "error" ? IconCamera : undefined} - onActionButtonClick={() => onGenerateThumbnailClick(info)} - actionButtonClass="text-gray-800" -> - {@const subtext = status - ? subtexts[status] - : formatDateTime(info.createdAt ?? info.lastModifiedAt)} - - diff --git a/src/routes/(main)/+layout.svelte b/src/routes/(main)/+layout.svelte index 8a4e406..c81c8ce 100644 --- a/src/routes/(main)/+layout.svelte +++ b/src/routes/(main)/+layout.svelte @@ -1,5 +1,5 @@ - - onclick(info)} - actionButtonIcon={onRemoveClick && IconClose} - onActionButtonClick={() => onRemoveClick?.(info)} -> - - diff --git a/src/routes/(main)/category/[[id]]/service.svelte.ts b/src/routes/(main)/category/[[id]]/service.svelte.ts index 7b3d105..3a9c3ad 100644 --- a/src/routes/(main)/category/[[id]]/service.svelte.ts +++ b/src/routes/(main)/category/[[id]]/service.svelte.ts @@ -1,18 +1,20 @@ -import { getContext, setContext } from "svelte"; -import type { SelectedCategory } from "#lib/components/molecules/index.js"; +import { createContext as createSvelteContext } from "svelte"; +import type { SelectedCategory } from "#lib/features/filesystem/components/index.js"; export interface SelectedFile { id: number; name: string; } +interface Context { + selectedCategory?: SelectedCategory; +} + +const [getContext, setContext] = createSvelteContext(); + export const createContext = () => { - const context = $state({ - selectedCategory: undefined as SelectedCategory | undefined, - }); - return setContext("context", context); + const context: Context = $state({}); + return setContext(context); }; -export const useContext = () => { - return getContext>("context"); -}; +export const useContext = getContext; diff --git a/src/routes/(main)/directory/[[id]]/+page.svelte b/src/routes/(main)/directory/[[id]]/+page.svelte index 1a0c95a..8787785 100644 --- a/src/routes/(main)/directory/[[id]]/+page.svelte +++ b/src/routes/(main)/directory/[[id]]/+page.svelte @@ -1,10 +1,9 @@ - - action(onclick)} - actionButtonIcon={IconMoreVert} - onActionButtonClick={() => action(onOpenMenuClick)} -> - - diff --git a/src/routes/(main)/directory/[[id]]/DirectoryEntries/SubDirectory.svelte b/src/routes/(main)/directory/[[id]]/DirectoryEntries/SubDirectory.svelte deleted file mode 100644 index 5f5ff0e..0000000 --- a/src/routes/(main)/directory/[[id]]/DirectoryEntries/SubDirectory.svelte +++ /dev/null @@ -1,36 +0,0 @@ - - - action(onclick)} - actionButtonIcon={IconMoreVert} - onActionButtonClick={() => action(onOpenMenuClick)} -> - - diff --git a/src/routes/(main)/directory/[[id]]/DuplicateFileModal.svelte b/src/routes/(main)/directory/[[id]]/DuplicateFileModal.svelte index e535dcc..9912944 100644 --- a/src/routes/(main)/directory/[[id]]/DuplicateFileModal.svelte +++ b/src/routes/(main)/directory/[[id]]/DuplicateFileModal.svelte @@ -1,5 +1,5 @@ - - - - diff --git a/src/routes/(main)/favorites/File.svelte b/src/routes/(main)/favorites/File.svelte deleted file mode 100644 index cb4a1e4..0000000 --- a/src/routes/(main)/favorites/File.svelte +++ /dev/null @@ -1,34 +0,0 @@ - - - - - diff --git a/src/routes/(main)/home/+page.svelte b/src/routes/(main)/home/+page.svelte index b441377..3d6be43 100644 --- a/src/routes/(main)/home/+page.svelte +++ b/src/routes/(main)/home/+page.svelte @@ -1,8 +1,9 @@