More dynamic stuff out of main bundle

components/system/Desktop/Wallpapers/useWallpaper.ts

@@ -4,8 +4,6 @@ import {
   cssFit,
   WALLPAPER_WORKERS,
 } from "components/system/Desktop/Wallpapers/constants";
-import hexells from "components/system/Desktop/Wallpapers/hexells";
-import coastalLandscape from "components/system/Desktop/Wallpapers/ShaderToy/CoastalLandscape";
 import { config } from "components/system/Desktop/Wallpapers/vantaWaves/config";
 import { useFileSystem } from "contexts/fileSystem";
 import { useSession } from "contexts/session";
@@ -84,9 +82,15 @@ const useWallpaper = (
             vantaWaves(vantaConfig)(desktopRef.current)
         );
       } else if (wallpaperName === "HEXELLS") {
-        hexells(desktopRef.current);
+        import("components/system/Desktop/Wallpapers/hexells").then(
+          ({ default: hexells }) => hexells(desktopRef.current)
+        );
       } else if (wallpaperName === "COASTAL_LANDSCAPE") {
-        coastalLandscape(desktopRef.current);
+        import(
+          "components/system/Desktop/Wallpapers/ShaderToy/CoastalLandscape"
+        ).then(({ default: coastalLandscape }) =>
+          coastalLandscape(desktopRef.current)
+        );
       } else {
         setWallpaper("VANTA");
       }

components/system/Files/FileEntry/functions.ts

@@ -1,6 +1,5 @@
 import type { FSModule } from "browserfs/dist/node/core/FS";
 import { monacoExtensions } from "components/apps/MonacoEditor/extensions";
-import { extractExeIcon } from "components/system/Files/FileEntry/exeIcons";
 import extensions from "components/system/Files/FileEntry/extensions";
 import type { FileInfo } from "components/system/Files/FileEntry/useFileInfo";
 import type { FileStat } from "components/system/Files/FileManager/functions";
@@ -339,6 +338,9 @@ export const getInfoWithExtension = (
     getInfoByFileExtension("/System/Icons/executable.webp", (signal) =>
       fs.readFile(path, async (error, contents = Buffer.from("")) => {
         if (!error && contents.length > 0 && !signal.aborted) {
+          const { extractExeIcon } = await import(
+            "components/system/Files/FileEntry/exeIcons"
+          );
           const exeIcon = await extractExeIcon(contents);
 
           if (exeIcon && !signal.aborted) {

components/system/Menu/MenuItemEntry.tsx

@@ -1,10 +1,6 @@
 import Menu, { topLeftPosition } from "components/system/Menu";
-import {
-  Checkmark,
-  ChevronRight,
-  Circle,
-} from "components/system/Menu/MenuIcons";
 import type { MenuItem } from "contexts/menu/useMenuContextState";
+import dynamic from "next/dynamic";
 import { useEffect, useLayoutEffect, useRef, useState } from "react";
 import type { Position } from "react-rnd";
 import { useTheme } from "styled-components";
@@ -18,6 +14,18 @@ type MenuItemEntryProps = MenuItem & {
   resetMenu: () => void;
 };
 
+const Checkmark = dynamic(() =>
+  import("components/system/Menu/MenuIcons").then((mod) => mod.Checkmark)
+);
+
+const ChevronRight = dynamic(() =>
+  import("components/system/Menu/MenuIcons").then((mod) => mod.ChevronRight)
+);
+
+const Circle = dynamic(() =>
+  import("components/system/Menu/MenuIcons").then((mod) => mod.Circle)
+);
+
 const MenuItemEntry: FC<MenuItemEntryProps> = ({
   action,
   checked,

components/system/Window/Titlebar/Buttons.ts

@@ -18,15 +18,3 @@ export const RESTORE =
 
 export const RESTORE_DISABLED =
   "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAJElEQVR42mNABaPA09PzPzZMsaFk20x/A2D8gTIAE9Mp+kYBAJPzT5+OMe9rAAAAAElFTkSuQmCC";
-
-export const UP =
-  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAKElEQVR42mOgMRgF6enp/ynSDMMUaEZgsjST5RJsikk2AKc4bcAoAADI7y5FsB5j/QAAAABJRU5ErkJggg==";
-
-export const DOWN =
-  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAK0lEQVR42mOgARgF6enp/0kRZ8KvGMEnyQUwjMwn0xBMzWQZQlmA0h6MAgAuqCnfdOk/ZQAAAABJRU5ErkJggg==";
-
-export const LEFT =
-  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAG0lEQVR42mPAD0ZBenr6fxge4ppHuiGEwSgAAGJiLkXUVlYDAAAAAElFTkSuQmCC";
-
-export const RIGHT =
-  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAG0lEQVR42mPADkZBenr6fxgeZoYMV82Ug1EAAPiTLkWjutmQAAAAAElFTkSuQmCC";

components/system/Window/Titlebar/useTitlebarContextMenu.ts

@@ -1,11 +1,3 @@
-import useWindowActions from "components/system/Window/Titlebar/useWindowActions";
-import { useMenu } from "contexts/menu";
-import type {
-  ContextMenuCapture,
-  MenuItem,
-} from "contexts/menu/useMenuContextState";
-import { useProcesses } from "contexts/process";
-import { useCallback } from "react";
 import {
   CLOSE,
   MAXIMIZE,
@@ -14,7 +6,15 @@ import {
   MINIMIZE_DISABLED,
   RESTORE,
   RESTORE_DISABLED,
-} from "styles/SystemIcons";
+} from "components/system/Window/Titlebar/Buttons";
+import useWindowActions from "components/system/Window/Titlebar/useWindowActions";
+import { useMenu } from "contexts/menu";
+import type {
+  ContextMenuCapture,
+  MenuItem,
+} from "contexts/menu/useMenuContextState";
+import { useProcesses } from "contexts/process";
+import { useCallback } from "react";
 import { MENU_SEPERATOR } from "utils/constants";
 
 const useTitlebarContextMenu = (id: string): ContextMenuCapture => {

styles/ArrowIcons.ts

@@ -0,0 +1,11 @@
+export const UP =
+  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAKElEQVR42mOgMRgF6enp/ynSDMMUaEZgsjST5RJsikk2AKc4bcAoAADI7y5FsB5j/QAAAABJRU5ErkJggg==";
+
+export const DOWN =
+  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAK0lEQVR42mOgARgF6enp/0kRZ8KvGMEnyQUwjMwn0xBMzWQZQlmA0h6MAgAuqCnfdOk/ZQAAAABJRU5ErkJggg==";
+
+export const LEFT =
+  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAG0lEQVR42mPAD0ZBenr6fxge4ppHuiGEwSgAAGJiLkXUVlYDAAAAAElFTkSuQmCC";
+
+export const RIGHT =
+  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAG0lEQVR42mPADkZBenr6fxgeZoYMV82Ug1EAAPiTLkWjutmQAAAAAElFTkSuQmCC";

styles/common/ScrollBars.ts

@@ -1,6 +1,6 @@
 import type { FlattenSimpleInterpolation } from "styled-components";
 import { css } from "styled-components";
-import { DOWN, LEFT, RIGHT, UP } from "styles/SystemIcons";
+import { DOWN, LEFT, RIGHT, UP } from "styles/ArrowIcons";
 
 const ScrollBars = (
   size: number,