feat(collections): don't load all collection types at once

This commit is contained in:
Elian Doran 2025-11-22 09:45:08 +02:00
parent be2e82788f
commit 135ce2285d
No known key found for this signature in database

View File

@ -2,20 +2,12 @@ import { allViewTypes, ViewModeMedia, ViewModeProps, ViewTypeOptions } from "./i
import { useNoteContext, useNoteLabel, useNoteLabelBoolean, useTriliumEvent } from "../react/hooks"; import { useNoteContext, useNoteLabel, useNoteLabelBoolean, useTriliumEvent } from "../react/hooks";
import FNote from "../../entities/fnote"; import FNote from "../../entities/fnote";
import "./NoteList.css"; import "./NoteList.css";
import { ListView, GridView } from "./legacy/ListOrGridView";
import { useEffect, useRef, useState } from "preact/hooks"; import { useEffect, useRef, useState } from "preact/hooks";
import GeoView from "./geomap";
import ViewModeStorage from "./view_mode_storage"; import ViewModeStorage from "./view_mode_storage";
import CalendarView from "./calendar";
import TableView from "./table";
import BoardView from "./board";
import { subscribeToMessages, unsubscribeToMessage as unsubscribeFromMessage } from "../../services/ws"; import { subscribeToMessages, unsubscribeToMessage as unsubscribeFromMessage } from "../../services/ws";
import { WebSocketMessage } from "@triliumnext/commons"; import { WebSocketMessage } from "@triliumnext/commons";
import froca from "../../services/froca"; import froca from "../../services/froca";
import PresentationView from "./presentation"; import { lazy, Suspense } from "preact/compat";
import { ListPrintView } from "./legacy/ListPrintView";
import TablePrintView from "./table/TablePrintView";
interface NoteListProps { interface NoteListProps {
note: FNote | null | undefined; note: FNote | null | undefined;
notePath: string | null | undefined; notePath: string | null | undefined;
@ -94,11 +86,15 @@ export function CustomNoteList({ note, viewType, isEnabled: shouldEnable, notePa
} }
} }
const ComponentToRender = viewType && props && isEnabled && getComponentByViewType(viewType, props);
return ( return (
<div ref={widgetRef} className={`note-list-widget component ${isFullHeight && isEnabled ? "full-height" : ""}`}> <div ref={widgetRef} className={`note-list-widget component ${isFullHeight && isEnabled ? "full-height" : ""}`}>
{props && isEnabled && ( {ComponentToRender && props && (
<div className="note-list-widget-content"> <div className="note-list-widget-content">
{getComponentByViewType(viewType, props)} <Suspense fallback="">
<ComponentToRender {...props} />
</Suspense>
</div> </div>
)} )}
</div> </div>
@ -109,26 +105,26 @@ function getComponentByViewType(viewType: ViewTypeOptions, props: ViewModeProps<
switch (viewType) { switch (viewType) {
case "list": case "list":
if (props.media !== "print") { if (props.media !== "print") {
return <ListView {...props} />; return lazy(() => import("./legacy/ListOrGridView.js").then(i => i.ListView));
} else { } else {
return <ListPrintView {...props} />; return lazy(() => import("./legacy/ListPrintView.js").then(i => i.ListPrintView));
} }
case "grid": case "grid":
return <GridView {...props} />; return lazy(() => import("./legacy/ListOrGridView.js").then(i => i.GridView));
case "geoMap": case "geoMap":
return <GeoView {...props} />; return lazy(() => import("./geomap/index.js"));
case "calendar": case "calendar":
return <CalendarView {...props} />; return lazy(() => import("./calendar/index.js"));
case "table": case "table":
if (props.media !== "print") { if (props.media !== "print") {
return <TableView {...props} />; return lazy(() => import("./table/index.js"));
} else { } else {
return <TablePrintView {...props} />; return lazy(() => import("./table/TablePrintView.js"));
} }
case "board": case "board":
return <BoardView {...props} /> return lazy(() => import("./board/index.js"));
case "presentation": case "presentation":
return <PresentationView {...props} /> return lazy(() => import("./presentation/index.js"));
} }
} }