Allow bluring bg for loading

components/system/Window/StyledWindow.ts

@@ -1,7 +1,9 @@
 import { m as motion } from "motion/react";
 import styled from "styled-components";
+import StyledLoading from "components/system/Files/FileManager/StyledLoading";
 
 type StyledWindowProps = {
+  $backgroundBlur?: string;
   $backgroundColor?: string;
   $isForeground: boolean;
 };
@@ -28,6 +30,11 @@ const StyledWindow = styled(motion.section)<StyledWindowProps>`
   header + * {
     height: ${({ theme }) => `calc(100% - ${theme.sizes.titleBar.height}px)`};
   }
+
+  ${StyledLoading} {
+    backdrop-filter: ${({ $backgroundBlur }) =>
+      $backgroundBlur ? `blur(${$backgroundBlur})` : undefined};
+  }
 `;
 
 export default StyledWindow;

components/system/Window/index.tsx

@@ -14,8 +14,13 @@ const Window: FC<ComponentProcessProps> = ({ children, id }) => {
     linkElement,
     processes: { [id]: process },
   } = useProcesses();
-  const { backgroundColor, Component, hideTitlebar, peekElement } =
-    process || {};
+  const {
+    backgroundBlur,
+    backgroundColor,
+    Component,
+    hideTitlebar,
+    peekElement,
+  } = process || {};
   const { foregroundId } = useSession();
   const isForeground = id === foregroundId;
   const { zIndex, ...focusableProps } = useFocusable(id);
@@ -32,6 +37,7 @@ const Window: FC<ComponentProcessProps> = ({ children, id }) => {
   return (
     <RndWindow id={id} zIndex={zIndex}>
       <StyledWindow
+        $backgroundBlur={backgroundBlur}
         $backgroundColor={backgroundColor}
         $isForeground={isForeground}
         {...focusableProps}

contexts/process/directory.ts

@@ -287,6 +287,7 @@ const directory: Processes = {
   },
   Terminal: {
     Component: dynamic(() => import("components/apps/Terminal")),
+    backgroundBlur: "8px",
     backgroundColor: "rgba(12, 12, 12, 0.5)",
     defaultSize: {
       height: 374,

contexts/process/types.ts

@@ -49,6 +49,7 @@ export type RelativePosition = {
 type BaseProcessArguments = {
   allowResizing?: boolean;
   autoSizing?: boolean;
+  backgroundBlur?: string;
   backgroundColor?: string;
   dependantLibs?: string[];
   hideMaximizeButton?: boolean;