Added core and file-explorer packages

eslint.config.js

@@ -11,7 +11,7 @@ export default tseslint.config(
 	{
 		languageOptions: {
 			parserOptions: {
-				project: "./tsconfig.json",
+				project: ["./tsconfig.json", "./packages/*/tsconfig.json", "./packages/apps/*/tsconfig.json"],
 				tsconfigRootDir: import.meta.dirname,
 				allowAutomaticSingleRunInference: true,
 			},
@@ -21,7 +21,7 @@ export default tseslint.config(
 		],
 		plugins: {
 			react,
-			"react-refresh": reactRefresh
+			"react-refresh": reactRefresh,
 		},
 		rules: {
 			"quotes": "off",
@@ -65,7 +65,7 @@ export default tseslint.config(
 			"react-refresh/only-export-components": [
 				"warn",
 				{ "allowConstantExport": true }
-			]
+			],
 		},
 	}
 );

package-lock.json

@@ -1,17 +1,22 @@
 {
-	"name": "prozilla-os",
+	"name": "@prozilla-os/prozilla-os",
 	"version": "0.1.0",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
-			"name": "prozilla-os",
+			"name": "@prozilla-os/prozilla-os",
 			"version": "0.1.0",
+			"workspaces": [
+				"packages/core",
+				"packages/apps/file-explorer"
+			],
 			"dependencies": {
 				"@fortawesome/fontawesome-svg-core": "^6.4.0",
 				"@fortawesome/free-regular-svg-icons": "^6.4.0",
 				"@fortawesome/free-solid-svg-icons": "^6.4.0",
 				"@fortawesome/react-fontawesome": "^0.2.0",
+				"@prozilla-os/core": "^1.0.0",
 				"@vitejs/plugin-react-swc": "^3.7.0",
 				"anser": "^2.1.1",
 				"escape-carriage": "^1.3.1",
@@ -897,54 +902,54 @@
 			}
 		},
 		"node_modules/@fortawesome/fontawesome-common-types": {
-			"version": "6.4.0",
+			"version": "6.5.2",
-			"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.4.0.tgz",
+			"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz",
-			"integrity": "sha512-HNii132xfomg5QVZw0HwXXpN22s7VBHQBv9CeOu9tfJnhsWQNd2lmTNi8CSrnw5B+5YOmzu1UoPAyxaXsJ6RgQ==",
+			"integrity": "sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==",
 			"hasInstallScript": true,
 			"engines": {
 				"node": ">=6"
 			}
 		},
 		"node_modules/@fortawesome/fontawesome-svg-core": {
-			"version": "6.4.0",
+			"version": "6.5.2",
-			"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.4.0.tgz",
+			"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz",
-			"integrity": "sha512-Bertv8xOiVELz5raB2FlXDPKt+m94MQ3JgDfsVbrqNpLU9+UE2E18GKjLKw+d3XbeYPqg1pzyQKGsrzbw+pPaw==",
+			"integrity": "sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==",
 			"hasInstallScript": true,
 			"dependencies": {
-				"@fortawesome/fontawesome-common-types": "6.4.0"
+				"@fortawesome/fontawesome-common-types": "6.5.2"
 			},
 			"engines": {
 				"node": ">=6"
 			}
 		},
 		"node_modules/@fortawesome/free-regular-svg-icons": {
-			"version": "6.4.0",
+			"version": "6.5.2",
-			"resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.4.0.tgz",
+			"resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.2.tgz",
-			"integrity": "sha512-ZfycI7D0KWPZtf7wtMFnQxs8qjBXArRzczABuMQqecA/nXohquJ5J/RCR77PmY5qGWkxAZDxpnUFVXKwtY/jPw==",
+			"integrity": "sha512-iabw/f5f8Uy2nTRtJ13XZTS1O5+t+anvlamJ3zJGLEVE2pKsAWhPv2lq01uQlfgCX7VaveT3EVs515cCN9jRbw==",
 			"hasInstallScript": true,
 			"dependencies": {
-				"@fortawesome/fontawesome-common-types": "6.4.0"
+				"@fortawesome/fontawesome-common-types": "6.5.2"
 			},
 			"engines": {
 				"node": ">=6"
 			}
 		},
 		"node_modules/@fortawesome/free-solid-svg-icons": {
-			"version": "6.4.0",
+			"version": "6.5.2",
-			"resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.4.0.tgz",
+			"resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.2.tgz",
-			"integrity": "sha512-kutPeRGWm8V5dltFP1zGjQOEAzaLZj4StdQhWVZnfGFCvAPVvHh8qk5bRrU4KXnRRRNni5tKQI9PBAdI6MP8nQ==",
+			"integrity": "sha512-QWFZYXFE7O1Gr1dTIp+D6UcFUF0qElOnZptpi7PBUMylJh+vFmIedVe1Ir6RM1t2tEQLLSV1k7bR4o92M+uqlw==",
 			"hasInstallScript": true,
 			"dependencies": {
-				"@fortawesome/fontawesome-common-types": "6.4.0"
+				"@fortawesome/fontawesome-common-types": "6.5.2"
 			},
 			"engines": {
 				"node": ">=6"
 			}
 		},
 		"node_modules/@fortawesome/react-fontawesome": {
-			"version": "0.2.0",
+			"version": "0.2.2",
-			"resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.0.tgz",
+			"resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.2.tgz",
-			"integrity": "sha512-uHg75Rb/XORTtVt7OS9WoK8uM276Ufi7gCzshVWkUJbHhh3svsUUeqXerrM96Wm7fRiDzfKRwSoahhMIkGAYHw==",
+			"integrity": "sha512-EnkrprPNqI6SXJl//m29hpaNzOp1bruISWaOiRtkMi/xSvHJlzc2j2JAYS7egxt/EbjSNV/k6Xy0AQI6vB2+1g==",
 			"dependencies": {
 				"prop-types": "^15.8.1"
 			},
@@ -1064,6 +1069,14 @@
 				"node": ">= 8"
 			}
 		},
+		"node_modules/@prozilla-os/core": {
+			"resolved": "packages/core",
+			"link": true
+		},
+		"node_modules/@prozilla-os/file-explorer": {
+			"resolved": "packages/apps/file-explorer",
+			"link": true
+		},
 		"node_modules/@remix-run/router": {
 			"version": "1.16.1",
 			"resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.16.1.tgz",
@@ -1712,13 +1725,13 @@
 			}
 		},
 		"node_modules/@tanem/svg-injector": {
-			"version": "10.1.60",
+			"version": "10.1.68",
-			"resolved": "https://registry.npmjs.org/@tanem/svg-injector/-/svg-injector-10.1.60.tgz",
+			"resolved": "https://registry.npmjs.org/@tanem/svg-injector/-/svg-injector-10.1.68.tgz",
-			"integrity": "sha512-yzdF0f7TZI7MrMieJLu5VYEJuL0WneFCabLvBfpNWDoWikzQPW8V9tpEqHa2A4kKJDiXUzsIoqtPEvGj9xsPgQ==",
+			"integrity": "sha512-UkJajeR44u73ujtr5GVSbIlELDWD/mzjqWe54YMK61ljKxFcJoPd9RBSaO7xj02ISCWUqJW99GjrS+sVF0UnrA==",
 			"dependencies": {
-				"@babel/runtime": "^7.22.5",
+				"@babel/runtime": "^7.23.2",
 				"content-type": "^1.0.5",
-				"tslib": "^2.6.0"
+				"tslib": "^2.6.2"
 			}
 		},
 		"node_modules/@types/eslint": {
@@ -1765,9 +1778,9 @@
 			"peer": true
 		},
 		"node_modules/@types/node": {
-			"version": "20.12.8",
+			"version": "20.14.2",
-			"resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.8.tgz",
+			"resolved": "https://registry.npmjs.org/@types/node/-/node-20.14.2.tgz",
-			"integrity": "sha512-NU0rJLJnshZWdE/097cdCBbyW1h4hEg0xpovcoAQYHl8dnEyp/NAOiE45pvc+Bd1Dt+2r94v2eGFpQJ4R7g+2w==",
+			"integrity": "sha512-xyu6WAMVwv6AKFLB+e/7ySZVr/0zLCzOa7rSpq6jNwpqOrUbcACDWC+53d4n2QHOnDou0fbIsg8wZu/sxrnI4Q==",
 			"devOptional": true,
 			"dependencies": {
 				"undici-types": "~5.26.4"
@@ -1782,9 +1795,9 @@
 			"peer": true
 		},
 		"node_modules/@types/prop-types": {
-			"version": "15.7.5",
+			"version": "15.7.12",
-			"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
+			"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.12.tgz",
-			"integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
+			"integrity": "sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q=="
 		},
 		"node_modules/@types/react": {
 			"version": "18.3.1",
@@ -5766,9 +5779,9 @@
 			}
 		},
 		"node_modules/react": {
-			"version": "18.2.0",
+			"version": "18.3.1",
-			"resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
+			"resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
-			"integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==",
+			"integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
 			"dependencies": {
 				"loose-envify": "^1.1.0"
 			},
@@ -5789,9 +5802,9 @@
 			}
 		},
 		"node_modules/react-draggable": {
-			"version": "4.4.5",
+			"version": "4.4.6",
-			"resolved": "https://registry.npmjs.org/react-draggable/-/react-draggable-4.4.5.tgz",
+			"resolved": "https://registry.npmjs.org/react-draggable/-/react-draggable-4.4.6.tgz",
-			"integrity": "sha512-OMHzJdyJbYTZo4uQE393fHcqqPYsEtkjfMgvCHr6rejT+Ezn4OZbNyGH50vv+SunC1RMvwOTSWkEODQLzw1M9g==",
+			"integrity": "sha512-LtY5Xw1zTPqHkVmtM3X8MUOxNDOUhv/khTgBgrUvwaS064bwVvxT+q5El0uUFNx5IEPKXuRejr7UqLwBIg5pdw==",
 			"dependencies": {
 				"clsx": "^1.1.1",
 				"prop-types": "^15.8.1"
@@ -5848,13 +5861,13 @@
 			}
 		},
 		"node_modules/react-svg": {
-			"version": "16.1.18",
+			"version": "16.1.34",
-			"resolved": "https://registry.npmjs.org/react-svg/-/react-svg-16.1.18.tgz",
+			"resolved": "https://registry.npmjs.org/react-svg/-/react-svg-16.1.34.tgz",
-			"integrity": "sha512-XAnrAfW03GDDD1uLEZFoEu8Ij7CkojIaNeba7KCInWnS9dFSEfFD3VbGSlKFUmkhQimfFmtJoRloowKNVJQ9gw==",
+			"integrity": "sha512-L4ak1qNFLgzVbHm0xQEpHoIOqb3um/B0ybahd3U2TKoGZxb0JaPVI5lsAhvSng2P1kcsYEok2Z7RpcKx7arJGw==",
 			"dependencies": {
-				"@babel/runtime": "^7.22.5",
+				"@babel/runtime": "^7.24.1",
-				"@tanem/svg-injector": "^10.1.59",
+				"@tanem/svg-injector": "^10.1.68",
-				"@types/prop-types": "^15.7.5",
+				"@types/prop-types": "^15.7.12",
 				"prop-types": "^15.8.1"
 			},
 			"peerDependencies": {
@@ -6994,9 +7007,9 @@
 			}
 		},
 		"node_modules/tslib": {
-			"version": "2.6.0",
+			"version": "2.6.3",
-			"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.0.tgz",
+			"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.3.tgz",
-			"integrity": "sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA=="
+			"integrity": "sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ=="
 		},
 		"node_modules/tsx": {
 			"version": "4.15.4",
@@ -8053,6 +8066,42 @@
 			"funding": {
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
+		},
+		"packages/apps/file-explorer": {
+			"name": "@prozilla-os/file-explorer",
+			"version": "1.0.0",
+			"license": "MIT",
+			"dependencies": {
+				"@fortawesome/fontawesome-svg-core": "^6.5.2",
+				"@fortawesome/free-solid-svg-icons": "^6.5.2",
+				"@fortawesome/react-fontawesome": "^0.2.2",
+				"@prozilla-os/core": "^1.0.0",
+				"react": "^18.3.1"
+			},
+			"devDependencies": {
+				"typescript": "^5.4.5"
+			}
+		},
+		"packages/core": {
+			"name": "@prozilla-os/core",
+			"version": "1.0.0",
+			"license": "MIT",
+			"dependencies": {
+				"@fortawesome/fontawesome-svg-core": "^6.5.2",
+				"@fortawesome/free-regular-svg-icons": "^6.5.2",
+				"@fortawesome/free-solid-svg-icons": "^6.5.2",
+				"@fortawesome/react-fontawesome": "^0.2.2",
+				"@prozilla-os/file-explorer": "^1.0.0",
+				"react": "^18.3.1",
+				"react-draggable": "^4.4.6",
+				"react-error-boundary": "^4.0.13",
+				"react-ga4": "^2.1.0",
+				"react-svg": "^16.1.34"
+			},
+			"devDependencies": {
+				"@types/node": "^20.14.2",
+				"typescript": "^5.4.5"
+			}
 		}
 	}
 }

package.json

@@ -1,7 +1,6 @@
 {
-	"name": "prozilla-os",
+	"name": "@prozilla-os/prozilla-os",
 	"version": "0.1.0",
-	"private": false,
 	"author": {
 		"name": "Prozilla",
 		"email": "business@prozilla.dev",
@@ -9,6 +8,10 @@
 	},
 	"homepage": "https://os.prozilla.dev/",
 	"repository": "https://github.com/Prozilla/ProzillaOS",
+	"workspaces": [
+		"packages/core",
+		"packages/apps/file-explorer"
+	],
 	"type": "module",
 	"scripts": {
 		"start": "vite",
@@ -24,6 +27,7 @@
 		"@fortawesome/free-regular-svg-icons": "^6.4.0",
 		"@fortawesome/free-solid-svg-icons": "^6.4.0",
 		"@fortawesome/react-fontawesome": "^0.2.0",
+		"@prozilla-os/core": "^1.0.0",
 		"@vitejs/plugin-react-swc": "^3.7.0",
 		"anser": "^2.1.1",
 		"escape-carriage": "^1.3.1",

packages/apps/file-explorer/README.md

@@ -0,0 +1 @@
+# @ProzillaOS/file-explorer

packages/apps/file-explorer/package.json

@@ -0,0 +1,29 @@
+{
+	"name": "@prozilla-os/file-explorer",
+	"version": "1.0.0",
+	"author": {
+		"name": "Prozilla",
+		"email": "business@prozilla.dev",
+		"url": "https://prozilla.dev/"
+	},
+	"main": "src/index.ts",
+	"type": "module",
+	"scripts": {
+		"test": "tsc --watch"
+	},
+	"repository": "https://github.com/Prozilla/ProzillaOS",
+	"license": "MIT",
+	"dependencies": {
+		"@fortawesome/fontawesome-svg-core": "^6.5.2",
+		"@fortawesome/free-solid-svg-icons": "^6.5.2",
+		"@fortawesome/react-fontawesome": "^0.2.2",
+		"react": "^18.3.1",
+		"@prozilla-os/core": "^1.0.0"
+	},
+	"devDependencies": {
+		"typescript": "^5.4.5"
+	},
+	"files": [
+		"src/index.ts"
+	]
+}

packages/apps/file-explorer/src/components/FileExplorer.tsx

@@ -1,34 +1,12 @@
 import { ChangeEventHandler, FC, KeyboardEventHandler, useCallback, useEffect, useState } from "react";
-import { useVirtualRoot } from "../../../hooks/virtual-drive/virtualRootContext";
 import styles from "./FileExplorer.module.css";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faArrowUp, faCaretLeft, faCaretRight, faCircleInfo, faCog, faDesktop, faFileLines, faHouse, faImage, faPlus, faSearch, faTrash } from "@fortawesome/free-solid-svg-icons";
-import { useWindowsManager } from "../../../hooks/windows/windowsManagerContext";
-import { useContextMenu } from "../../../hooks/modals/contextMenu";
 import { QuickAccessButton } from "./QuickAccessButton";
-import { useWindowedModal } from "../../../hooks/modals/windowedModal";
-import { Vector2 } from "../../../features/math/vector2";
-import { DIALOG_CONTENT_TYPES } from "../../../config/modals.config";
-import { DirectoryList, FileEventHandler, FolderEventHandler, OnSelectionChangeParams } from "./directory-list/DirectoryList";
-import { Actions } from "../../actions/Actions";
-import { ClickAction } from "../../actions/actions/ClickAction";
-import utilStyles from "../../../styles/utils.module.css";
-import { DialogBox } from "../../modals/dialog-box/DialogBox";
-import { AppsManager } from "../../../features/apps/appsManager";
-import { APPS, APP_ICONS, APP_NAMES } from "../../../config/apps.config";
-import { TITLE_SEPARATOR } from "../../../config/windows.config";
-import { FileProperties } from "../../modals/file-properties/FileProperties";
-import { useHistory } from "../../../hooks/_utils/history";
-import { Divider } from "../../actions/actions/Divider";
-import { CODE_FORMATS } from "../../../config/apps/textEditor.config";
-import { SELECTOR_MODE } from "../../../config/apps/fileExplorer.config";
-import { WindowProps } from "../../windows/WindowView";
-import { VirtualFolder } from "../../../features/virtual-drive/folder/virtualFolder";
-import { VirtualFile } from "../../../features/virtual-drive/file";
-import { VirtualFolderLink } from "../../../features/virtual-drive/folder/virtualFolderLink";
 import { ImportButton } from "./ImportButton";
-import { useAlert } from "../../../hooks/modals/alert";
+import { Actions, AppsManager, ClickAction, CODE_EXTENSIONS, DIALOG_CONTENT_TYPES, DialogBox, DirectoryList, Divider, FileEventHandler, FolderEventHandler, OnSelectionChangeParams, useAlert, useContextMenu, useHistory, useSystemManager, useVirtualRoot, useWindowedModal, useWindowsManager, utilStyles, Vector2, VirtualFile, VirtualFolder, VirtualFolderLink, VirtualRoot, WindowProps } from "@prozilla-os/core";
-import { VirtualRoot } from "../../../features/virtual-drive/root/virtualRoot";
+import { SELECTOR_MODE } from "../constants/fileExplorer.const";
+import { FileProperties } from "./modals/file-properties/FileProperties";
 
 interface FileExplorerProps extends WindowProps {
 	path?: string;
@@ -38,13 +16,15 @@ interface FileExplorerProps extends WindowProps {
 	onSelectionFinish: Function;
 }
 
-export function FileExplorer({ path: startPath, selectorMode, Footer, onSelectionChange, onSelectionFinish }: FileExplorerProps) {
+export function FileExplorer({ app, path: startPath, selectorMode, Footer, onSelectionChange, onSelectionFinish }: FileExplorerProps) {
 	const isSelector = (Footer != null && selectorMode != null && selectorMode !== SELECTOR_MODE.NONE);
 
 	const virtualRoot = useVirtualRoot();
+	const windowsManager = useWindowsManager();
+	const { windowsConfig } = useSystemManager();
+
 	const [currentDirectory, setCurrentDirectory] = useState<VirtualFolder>(virtualRoot?.navigate(startPath ?? "~") as VirtualFolder);
 	const [path, setPath] = useState<string>(currentDirectory?.path ?? "");
-	const windowsManager = useWindowsManager();
 	const [showHidden] = useState(true);
 	const { history, stateIndex, pushState, undo, redo, undoAvailable, redoAvailable } = useHistory<string>(currentDirectory.path);
 	const { alert } = useAlert();
@@ -65,7 +45,7 @@ export function FileExplorer({ path: startPath, selectorMode, Footer, onSelectio
 			}}/>
 			<ClickAction label="Properties" icon={faCircleInfo} onTrigger={(event, file) => {
 				openWindowedModal({
-					title: `${(file as VirtualFile).id} ${TITLE_SEPARATOR} Properties`,
+					title: `${(file as VirtualFile).id} ${windowsConfig.titleSeparator} Properties`,
 					iconUrl: (file as VirtualFile).getIconUrl(),
 					size: new Vector2(400, 500),
 					Modal: (props: object) => <FileProperties file={file as VirtualFile} {...props}/>
@@ -78,9 +58,9 @@ export function FileExplorer({ path: startPath, selectorMode, Footer, onSelectio
 			<ClickAction label="Open" onTrigger={(event, folder) => {
 				changeDirectory((folder as VirtualFolderLink).linkedPath ?? (folder as VirtualFolder).name);
 			}}/>
-			<ClickAction label={`Open in ${APP_NAMES.TERMINAL}`} icon={APP_ICONS.TERMINAL} onTrigger={(event, folder) => {
+			{/* <ClickAction label={`Open in ${APP_NAMES.TERMINAL}`} icon={APP_ICONS.TERMINAL} onTrigger={(event, folder) => {
 				windowsManager?.open(APPS.TERMINAL, { startPath: (folder as VirtualFolder).path });
-			}}/>
+			}}/> */}
 			<Divider/>
 			<ClickAction label="Delete" icon={faTrash} onTrigger={(event, folder) => {
 				(folder as VirtualFolder).delete();
@@ -129,7 +109,7 @@ export function FileExplorer({ path: startPath, selectorMode, Footer, onSelectio
 			alert({
 				title: (error as Error).message,
 				text: "You have exceeded the virtual drive capacity. Files and folders will not be saved until more storage is freed.",
-				iconUrl: AppsManager.getAppIconUrl(APPS.FILE_EXPLORER),
+				iconUrl: app?.id != null ? AppsManager.getAppIconUrl(app.id) : undefined,
 				size: new Vector2(300, 200),
 				single: true,
 			});
@@ -158,7 +138,7 @@ export function FileExplorer({ path: startPath, selectorMode, Footer, onSelectio
 			if (directory == null) {
 				openWindowedModal({
 					title: "Error",
-					iconUrl: AppsManager.getAppIconUrl(APPS.FILE_EXPLORER),
+					iconUrl: app?.id != null ? AppsManager.getAppIconUrl(app.id) : undefined,
 					size: new Vector2(300, 150),
 					Modal: (props: {}) =>
 						<DialogBox {...props}>
@@ -267,7 +247,7 @@ export function FileExplorer({ path: startPath, selectorMode, Footer, onSelectio
 						if (isSelector)
 							return void onSelectionFinish?.();
 						const options: Record<string, string> = {};
-						if (file.extension === "md" || (file.extension != null && CODE_FORMATS.includes(file.extension)))
+						if (file.extension === "md" || (file.extension != null && CODE_EXTENSIONS.includes(file.extension)))
 							options.mode = "view";
 						windowsManager?.openFile(file, options);
 					}}

packages/apps/file-explorer/src/components/ImportButton.tsx

@@ -2,8 +2,7 @@ import { FormEventHandler, ReactElement } from "react";
 import styles from "./FileExplorer.module.css";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faDownload } from "@fortawesome/free-solid-svg-icons";
-import { VirtualFile } from "../../../features/virtual-drive/file";
+import { VirtualFolder, VirtualFile } from "@prozilla-os/core";
-import { VirtualFolder } from "../../../features/virtual-drive/folder";
 
 interface ImportButtonProps {
 	directory: VirtualFolder;

packages/apps/file-explorer/src/components/QuickAccessButton.tsx

@@ -1,7 +1,7 @@
 import { FontAwesomeIcon, FontAwesomeIconProps } from "@fortawesome/react-fontawesome";
 import styles from "./FileExplorer.module.css";
-import utilStyles from "../../../styles/utils.module.css";
 import { MouseEventHandler } from "react";
+import { utilStyles } from "@prozilla-os/core";
 
 interface QuickAcessButton {
 	onClick: MouseEventHandler;

packages/apps/file-explorer/src/components/modals/file-properties/FileProperties.tsx

@@ -1,11 +1,6 @@
-import { ImagePreview } from "../../apps/file-explorer/directory-list/ImagePreview";
-import { WindowedModal } from "../_utils/WindowedModal";
 import styles from "./FileProperties.module.css";
 import utilStyles from "../../../styles/utils.module.css";
-import { StorageManager } from "../../../features/storage/storageManager";
+import { AppsManager, ImagePreview, ModalProps, StorageManager, VirtualFile, WindowedModal } from "@prozilla-os/core";
-import { AppsManager } from "../../../features/apps/appsManager";
-import { ModalProps } from "../ModalView.js";
-import { VirtualFile } from "../../../features/virtual-drive/file";
 
 interface FilePropetiesProps extends ModalProps {
 	file: VirtualFile;

packages/apps/file-explorer/src/index.ts

@@ -0,0 +1,2 @@
+export { SELECTOR_MODE } from "./constants/fileExplorer.const";
+export { FileExplorer } from "./components/FileExplorer";

packages/apps/file-explorer/tsconfig.json

@@ -0,0 +1,5 @@
+{
+	"extends": "../../../tsconfig.json",
+	"include": ["src/**/*"],
+	"exclude": ["node_modules"]
+}

packages/apps/logic-sim/core/chips/chip.ts

@@ -1,6 +1,6 @@
 import { CHIP, COLORS, PIN } from "../../../../config/apps/logicSim.config";
 import { Vector2 } from "../../../math/vector2";
-import { Circuit } from "../core/circuit";
+import { Circuit } from "../circuit";
 import { Pin, PinJson } from "../pins/pin";
 import { State } from "../_utils/state";
 

packages/apps/logic-sim/core/chips/chipsManager.ts

@@ -1,6 +1,6 @@
 import { Chip } from "./chip";
 import { State } from "../_utils/state";
-import { Circuit, CircuitJson } from "../core/circuit";
+import { Circuit, CircuitJson } from "../circuit";
 import { VirtualFolder } from "../../../virtual-drive/folder";
 import { ControlledPin } from "../pins/controlledPin";
 import { Vector2 } from "../../../math/vector2";

packages/apps/logic-sim/core/circuit.ts

@@ -1,9 +1,9 @@
 import { BACKGROUND, COLORS, CURSORS, FONT, CONTROLLER, ENABLE_COLOR_CACHING } from "../../../../config/apps/logicSim.config";
 import { Vector2 } from "../../../math/vector2";
-import { Chip, ChipJson } from "../chips/chip";
+import { Chip, ChipJson } from "./chips/chip";
-import { ControlledPin } from "../pins/controlledPin";
+import { ControlledPin } from "./pins/controlledPin";
 import { InputHandler } from "./inputHandler";
-import { Wire, WireJson } from "../wires/wire";
+import { Wire, WireJson } from "./wires/wire";
 import { clamp } from "../../../_utils/math.utils";
 
 export interface CircuitJson extends ChipJson {

packages/apps/logic-sim/core/inputHandler.ts

@@ -1,11 +1,11 @@
 import { CONTROLLER, PIN, WIRE } from "../../../../config/apps/logicSim.config";
 import { Vector2 } from "../../../math/vector2";
-import { Chip } from "../chips/chip";
+import { Chip } from "./chips/chip";
 import { Circuit } from "./circuit";
-import { ControlledPin } from "../pins/controlledPin";
+import { ControlledPin } from "./pins/controlledPin";
-import { Pin } from "../pins/pin";
+import { Pin } from "./pins/pin";
-import { State } from "../_utils/state";
+import { State } from "./_utils/state";
-import { Wire } from "../wires/wire";
+import { Wire } from "./wires/wire";
 
 export class InputHandler {
 	circuit!: Circuit;

packages/apps/logic-sim/core/pins/controlledPin.ts

@@ -1,6 +1,6 @@
 import { COLORS, CONTROLLER, CURSORS } from "../../../../config/apps/logicSim.config";
 import { Vector2 } from "../../../math/vector2";
-import { Circuit } from "../core/circuit";
+import { Circuit } from "../circuit";
 import { Pin } from "./pin";
 
 export class ControlledPin extends Pin {

packages/apps/logic-sim/core/pins/pin.ts

@@ -1,7 +1,7 @@
 import { COLORS, CONTROLLER, CURSORS, PIN } from "../../../../config/apps/logicSim.config";
 import { Vector2 } from "../../../math/vector2";
 import { Chip } from "../chips/chip";
-import { Circuit } from "../core/circuit";
+import { Circuit } from "../circuit";
 import { State } from "../_utils/state";
 import { Wire } from "../wires/wire";
 

packages/apps/logic-sim/core/wires/wire.ts

@@ -1,6 +1,6 @@
 import { WIRE } from "../../../../config/apps/logicSim.config";
 import { Vector2 } from "../../../math/vector2";
-import { Circuit } from "../core/circuit";
+import { Circuit } from "../circuit";
 import { Pin } from "../pins/pin";
 import { State } from "../_utils/state";
 

packages/core/README.md

@@ -0,0 +1 @@
+# @ProzillaOS/core

packages/core/package.json

@@ -0,0 +1,35 @@
+{
+	"name": "@prozilla-os/core",
+	"version": "1.0.0",
+	"author": {
+		"name": "Prozilla",
+		"email": "business@prozilla.dev",
+		"url": "https://prozilla.dev/"
+	},
+	"main": "src/index.ts",
+	"type": "module",
+	"scripts": {
+		"test": "tsc --watch"
+	},
+	"repository": "https://github.com/Prozilla/ProzillaOS",
+	"license": "MIT",
+	"dependencies": {
+		"@fortawesome/fontawesome-svg-core": "^6.5.2",
+		"@fortawesome/free-regular-svg-icons": "^6.5.2",
+		"@fortawesome/free-solid-svg-icons": "^6.5.2",
+		"@fortawesome/react-fontawesome": "^0.2.2",
+		"react": "^18.3.1",
+		"react-draggable": "^4.4.6",
+		"react-error-boundary": "^4.0.13",
+		"react-ga4": "^2.1.0",
+		"react-svg": "^16.1.34",
+		"@prozilla-os/file-explorer": "^1.0.0"
+	},
+	"devDependencies": {
+		"@types/node": "^20.14.2",
+		"typescript": "^5.4.5"
+	},
+	"files": [
+		"src/index.ts"
+	]
+}

packages/core/src/components/_utils/directory-list/DirectoryList.tsx

@@ -1,10 +1,10 @@
 import { MouseEventHandler, ReactElement, useEffect, useRef, useState } from "react";
-import { VirtualFile } from "../../../../features/virtual-drive/file";
-import { VirtualFolder } from "../../../../features/virtual-drive/folder/virtualFolder";
-import { Interactable } from "../../../_utils/interactable/Interactable";
 import styles from "./DirectoryList.module.css";
 import { ImagePreview } from "./ImagePreview";
-import { Vector2 } from "../../../../features/math/vector2";
+import { VirtualFile } from "../../../features/virtual-drive/file";
+import { VirtualFolder } from "../../../features/virtual-drive/folder";
+import { Vector2 } from "../../../features";
+import { Interactable } from "../interactable/Interactable";
 
 export interface OnSelectionChangeParams {
 	files?: string[];

packages/core/src/components/_utils/directory-list/ImagePreview.tsx

@@ -1,8 +1,8 @@
 import { useState } from "react";
 import styles from "./ImagePreview.module.css";
 import { ReactSVG } from "react-svg";
-import { AppsManager } from "../../../../features/apps/appsManager";
+import { AppsManager } from "../../../features";
-import { APPS } from "../../../../config/apps.config";
+import { APPS } from "../../../constants/apps.const";
 
 interface ImagePreviewProps {
 	source: string;