diff --git a/web/src/App.tsx b/web/src/App.tsx
new file mode 100644
index 0000000..dd9b2e0
--- /dev/null
+++ b/web/src/App.tsx
@@ -0,0 +1,21 @@
+import Notifications from "./features/notifications/NotificationWrapper";
+import CircleProgressbar from "./features/progress/CircleProgressbar";
+import Progressbar from "./features/progress/Progressbar";
+import TextUI from "./features/textui/TextUI";
+import InputDialog from "./features/dialog/InputDialog";
+import ContextMenu from "./features/menu/ContextMenu";
+
+const App: React.FC = () => {
+  return (
+    <>
+      <Progressbar />
+      <CircleProgressbar />
+      <Notifications />
+      <TextUI />
+      <InputDialog />
+      <ContextMenu />
+    </>
+  );
+};
+
+export default App;
diff --git a/web/src/components/App.tsx b/web/src/components/App.tsx
deleted file mode 100644
index 35ba9eb..0000000
--- a/web/src/components/App.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import Notifications from "./Notifications";
-import CircleProgressbar from "./CircleProgressbar";
-import Progressbar from "./Progressbar";
-import TextUI from "./TextUI";
-import InputDialog from "./InputDialog";
-import ContextMenu from "./features/menu/ContextMenu";
-
-const App: React.FC = () => {
-  return (
-    <>
-      <Progressbar />
-      <CircleProgressbar />
-      <Notifications />
-      <TextUI />
-      <InputDialog />
-      <ContextMenu />
-    </>
-  );
-};
-
-export default App;
diff --git a/web/src/components/InputDialog.tsx b/web/src/features/dialog/InputDialog.tsx
similarity index 95%
rename from web/src/components/InputDialog.tsx
rename to web/src/features/dialog/InputDialog.tsx
index 53c77e4..5a039b1 100644
--- a/web/src/components/InputDialog.tsx
+++ b/web/src/features/dialog/InputDialog.tsx
@@ -11,9 +11,9 @@ import {
   Button,
 } from "@chakra-ui/react";
 import React from "react";
-import { useNuiEvent } from "../hooks/useNuiEvent";
+import { useNuiEvent } from "../../hooks/useNuiEvent";
 // import { debugData } from "../utils/debugData";
-import { fetchNui } from "../utils/fetchNui";
+import { fetchNui } from "../../utils/fetchNui";
 
 interface Props {
   heading: string;
diff --git a/web/src/components/features/menu/ContextMenu.tsx b/web/src/features/menu/ContextMenu.tsx
similarity index 93%
rename from web/src/components/features/menu/ContextMenu.tsx
rename to web/src/features/menu/ContextMenu.tsx
index 0b75c23..2bd53af 100644
--- a/web/src/components/features/menu/ContextMenu.tsx
+++ b/web/src/features/menu/ContextMenu.tsx
@@ -1,11 +1,11 @@
-import { useNuiEvent } from "../../../hooks/useNuiEvent";
+import { useNuiEvent } from "../../hooks/useNuiEvent";
 import { Box, Text, Flex, ScaleFade } from "@chakra-ui/react";
-import { debugData } from "../../../utils/debugData";
+import { debugData } from "../../utils/debugData";
 import { useEffect, useState } from "react";
-import { ContextMenuProps } from "../../../interfaces";
+import { ContextMenuProps } from "../../interfaces";
 import Item from "./Item";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { fetchNui } from "../../../utils/fetchNui";
+import { fetchNui } from "../../utils/fetchNui";
 
 debugData<ContextMenuProps>([
   {
diff --git a/web/src/components/features/menu/Item.tsx b/web/src/features/menu/Item.tsx
similarity index 96%
rename from web/src/components/features/menu/Item.tsx
rename to web/src/features/menu/Item.tsx
index 8e52447..a0bc9a2 100644
--- a/web/src/components/features/menu/Item.tsx
+++ b/web/src/features/menu/Item.tsx
@@ -10,8 +10,8 @@ import {
   Spacer,
 } from "@chakra-ui/react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Option, ContextMenuProps } from "../../../interfaces";
-import { fetchNui } from "../../../utils/fetchNui";
+import { Option, ContextMenuProps } from "../../interfaces";
+import { fetchNui } from "../../utils/fetchNui";
 
 interface DataProps {
   event?: string;
diff --git a/web/src/components/Notifications.tsx b/web/src/features/notifications/NotificationWrapper.tsx
similarity index 95%
rename from web/src/components/Notifications.tsx
rename to web/src/features/notifications/NotificationWrapper.tsx
index 022ce93..f34572c 100644
--- a/web/src/components/Notifications.tsx
+++ b/web/src/features/notifications/NotificationWrapper.tsx
@@ -5,8 +5,8 @@ import {
   HStack,
   Text,
 } from "@chakra-ui/react";
-import { useNuiEvent } from "../hooks/useNuiEvent";
-import { debugData } from "../utils/debugData";
+import { useNuiEvent } from "../../hooks/useNuiEvent";
+import { debugData } from "../../utils/debugData";
 import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
diff --git a/web/src/components/CircleProgressbar.tsx b/web/src/features/progress/CircleProgressbar.tsx
similarity index 94%
rename from web/src/components/CircleProgressbar.tsx
rename to web/src/features/progress/CircleProgressbar.tsx
index 4a4b6a6..f13140e 100644
--- a/web/src/components/CircleProgressbar.tsx
+++ b/web/src/features/progress/CircleProgressbar.tsx
@@ -5,9 +5,9 @@ import {
   Flex,
   ScaleFade,
 } from "@chakra-ui/react";
-import { useNuiEvent } from "../hooks/useNuiEvent";
-import { debugData } from "../utils/debugData";
-import { fetchNui } from "../utils/fetchNui";
+import { useNuiEvent } from "../../hooks/useNuiEvent";
+import { debugData } from "../../utils/debugData";
+import { fetchNui } from "../../utils/fetchNui";
 
 interface Props {
   duration: number;
diff --git a/web/src/components/Progressbar.tsx b/web/src/features/progress/Progressbar.tsx
similarity index 93%
rename from web/src/components/Progressbar.tsx
rename to web/src/features/progress/Progressbar.tsx
index b41ee47..f9a12af 100644
--- a/web/src/components/Progressbar.tsx
+++ b/web/src/features/progress/Progressbar.tsx
@@ -6,9 +6,9 @@ import {
   Box,
   ScaleFade,
 } from "@chakra-ui/react";
-import { useNuiEvent } from "../hooks/useNuiEvent";
-import { debugData } from "../utils/debugData";
-import { fetchNui } from "../utils/fetchNui";
+import { useNuiEvent } from "../../hooks/useNuiEvent";
+import { debugData } from "../../utils/debugData";
+import { fetchNui } from "../../utils/fetchNui";
 
 interface Props {
   label: string;
diff --git a/web/src/components/TextUI.tsx b/web/src/features/textui/TextUI.tsx
similarity index 93%
rename from web/src/components/TextUI.tsx
rename to web/src/features/textui/TextUI.tsx
index 44954c4..117673f 100644
--- a/web/src/components/TextUI.tsx
+++ b/web/src/features/textui/TextUI.tsx
@@ -1,7 +1,7 @@
 import React from "react";
-import { useNuiEvent } from "../hooks/useNuiEvent";
+import { useNuiEvent } from "../../hooks/useNuiEvent";
 import { Box, Flex, ScaleFade } from "@chakra-ui/react";
-import { debugData } from "../utils/debugData";
+import { debugData } from "../../utils/debugData";
 import ReactMarkdown from "react-markdown";
 
 interface Props {
diff --git a/web/src/index.tsx b/web/src/index.tsx
index da2a9e9..4d902bb 100644
--- a/web/src/index.tsx
+++ b/web/src/index.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom";
 import "./index.css";
-import App from "./components/App";
+import App from "./App";
 import { VisibilityProvider } from "./providers/VisibilityProvider";
 import { ChakraProvider } from "@chakra-ui/react";
 import { theme } from "./theme";