From 2a98acfa970cdcc247ddec69de9600ca831c075b Mon Sep 17 00:00:00 2001 From: Dustin Brett Date: Wed, 7 Sep 2022 19:54:32 -0700 Subject: [PATCH] More dynamic stuff out of main bundle --- .../system/Desktop/Wallpapers/useWallpaper.ts | 12 ++++++++---- components/system/Files/FileEntry/functions.ts | 4 +++- components/system/Menu/MenuItemEntry.tsx | 18 +++++++++++++----- .../system/Window/Titlebar/Buttons.ts | 12 ------------ .../Window/Titlebar/useTitlebarContextMenu.ts | 18 +++++++++--------- styles/ArrowIcons.ts | 11 +++++++++++ styles/common/ScrollBars.ts | 2 +- 7 files changed, 45 insertions(+), 32 deletions(-) rename styles/SystemIcons.ts => components/system/Window/Titlebar/Buttons.ts (66%) create mode 100644 styles/ArrowIcons.ts diff --git a/components/system/Desktop/Wallpapers/useWallpaper.ts b/components/system/Desktop/Wallpapers/useWallpaper.ts index e5a3cac4..7d21006b 100644 --- a/components/system/Desktop/Wallpapers/useWallpaper.ts +++ b/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"); } diff --git a/components/system/Files/FileEntry/functions.ts b/components/system/Files/FileEntry/functions.ts index 47425118..371e38c5 100644 --- a/components/system/Files/FileEntry/functions.ts +++ b/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) { diff --git a/components/system/Menu/MenuItemEntry.tsx b/components/system/Menu/MenuItemEntry.tsx index ffaab073..ce4df86b 100644 --- a/components/system/Menu/MenuItemEntry.tsx +++ b/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 = ({ action, checked, diff --git a/styles/SystemIcons.ts b/components/system/Window/Titlebar/Buttons.ts similarity index 66% rename from styles/SystemIcons.ts rename to components/system/Window/Titlebar/Buttons.ts index 94deb237..40b66ad7 100644 --- a/styles/SystemIcons.ts +++ b/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"; diff --git a/components/system/Window/Titlebar/useTitlebarContextMenu.ts b/components/system/Window/Titlebar/useTitlebarContextMenu.ts index c2de8958..cfa29bb5 100644 --- a/components/system/Window/Titlebar/useTitlebarContextMenu.ts +++ b/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 => { diff --git a/styles/ArrowIcons.ts b/styles/ArrowIcons.ts new file mode 100644 index 00000000..15ede797 --- /dev/null +++ b/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"; diff --git a/styles/common/ScrollBars.ts b/styles/common/ScrollBars.ts index e9049325..8c446a41 100644 --- a/styles/common/ScrollBars.ts +++ b/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,