inbuxa/ihasmail-inbuxa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Load the composer, previews, dialogs and other sidebars on demand

Browse Source 
The main chunk carried everything the mail view might open: the file
preview and its Markdown renderer, the composer and its editor, the contact
editor, the filter and share dialogs, and the calendar, contacts and files
sidebars. Each is now loaded when first shown. The composer is also
fetched when the browser is idle after startup, so the first Compose does
not wait on the network.

Import the notification helpers statically where they already were: the
dynamic imports beside those static ones split nothing.
This commit is contained in:
jcoffey-dev
2026-09-16 09:48:04 -07:00
parent e3cd56314b
commit 6139031689
9 changed files with 76 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/views/compose/__tests__/composer-dock.test.tsx
+14 -10
View File
@@ -42,35 +42,39 @@ describe("ComposerDock with a full-screen composer", () => {
useCompose.setState({ drafts: [], activeKey: null });
});
const render = (drafts: Draft[], activeKey: string) => {
// The composer is loaded on demand, so rendering waits for it to arrive.
const render = async (drafts: Draft[], activeKey: string) => {
useCompose.setState({ drafts, activeKey });
act(() => root.render(<ComposerDock />));
await act(async () => {
root.render(<ComposerDock />);
await import("../Composer");
});
};
const dock = () => host.querySelector(".composer-dock")!;
it("marks the dock so the other composers are hidden behind it", () => {
it("marks the dock so the other composers are hidden behind it", async () => {
setWidth(1300);
render([draft("a"), draft("b", { maximized: true }), draft("c")], "b");
await render([draft("a"), draft("b", { maximized: true }), draft("c")], "b");
expect(dock().classList.contains("has-maximized")).toBe(true);
// Every composer stays mounted: the hiding is the stylesheet's, so nothing being typed elsewhere is lost.
expect(host.querySelectorAll(".composer").length).toBe(3);
});
it("leaves the dock alone while nobody is full screen", () => {
it("leaves the dock alone while nobody is full screen", async () => {
setWidth(1300);
render([draft("a"), draft("b")], "b");
await render([draft("a"), draft("b")], "b");
expect(dock().classList.contains("has-maximized")).toBe(false);
});
it("does not count a full-screen composer that has since been minimized", () => {
it("does not count a full-screen composer that has since been minimized", async () => {
setWidth(1300);
render([draft("a"), draft("b", { maximized: true, minimized: true })], "a");
await render([draft("a"), draft("b", { maximized: true, minimized: true })], "a");
expect(dock().classList.contains("has-maximized")).toBe(false);
});
it("is not a phone concern: there the active composer is already the only one open", () => {
it("is not a phone concern: there the active composer is already the only one open", async () => {
setWidth(400);
render([draft("a"), draft("b", { maximized: true })], "b");
await render([draft("a"), draft("b", { maximized: true })], "b");
expect(dock().classList.contains("has-maximized")).toBe(false);
});
});