diff --git a/.github/workflows/module.yaml b/.github/workflows/module.yaml
index 9eaee5f..c3f19be 100644
--- a/.github/workflows/module.yaml
+++ b/.github/workflows/module.yaml
@@ -19,7 +19,7 @@ jobs:
       - name: Make
         shell: bash
         run: |
-          zip -r "module.zip" * -x ".git" -x "README.md"
+          zip -r "module.zip" * -x ".git" -x "README.md" -x "CHANGELOG.md"
           
       - name: Publish
         uses: softprops/action-gh-release@v1
diff --git a/CHANGELOG.md b/CHANGELOG.md
new file mode 100644
index 0000000..619fc5b
--- /dev/null
+++ b/CHANGELOG.md
@@ -0,0 +1,3 @@
+<divider textAlign="left"><h1>2.2.2</h1></divider>
+
+- Fixed missing components
\ No newline at end of file
diff --git a/module.prop b/module.prop
index ed654c7..5fd7e18 100644
--- a/module.prop
+++ b/module.prop
@@ -1,6 +1,6 @@
 id=mmrl_wpd
 name=WiFi Password Viewer for MMRL
-version=2.2.1
-versionCode=221
+version=2.2.2
+versionCode=222
 author=Der_Googler, veez21 @ xda-developers
 description=View all your WiFi passwords inside MMRL
diff --git a/system/usr/share/mmrl/config/mmrl_wpd/components/CenterBox.jsx b/system/usr/share/mmrl/config/mmrl_wpd/components/CenterBox.jsx
new file mode 100644
index 0000000..50a0fae
--- /dev/null
+++ b/system/usr/share/mmrl/config/mmrl_wpd/components/CenterBox.jsx
@@ -0,0 +1,19 @@
+import React from "react";
+import { Box } from "@mui/material";
+
+export default (props) => {
+  return (
+    <Box
+      component="h4"
+      sx={{
+        position: "absolute",
+        left: "50%",
+        top: "calc(50% - 56px)",
+        textAlign: "center",
+        WebkitTransform: "translate(-50%, -50%)",
+        transform: "translate(-50%, -50%)",
+      }}
+      children={props.children}
+    />
+  );
+};
diff --git a/system/usr/share/mmrl/config/mmrl_wpd/components/RenderToolbar.jsx b/system/usr/share/mmrl/config/mmrl_wpd/components/RenderToolbar.jsx
index ab61c14..c78c3a3 100644
--- a/system/usr/share/mmrl/config/mmrl_wpd/components/RenderToolbar.jsx
+++ b/system/usr/share/mmrl/config/mmrl_wpd/components/RenderToolbar.jsx
@@ -1,5 +1,5 @@
-import React from "react";
 import { Toolbar } from "@mmrl/ui";
+import React from "react";
 
 const useBackHandler = include("hooks/useBackHandler.js")
 
diff --git a/system/usr/share/mmrl/config/mmrl_wpd/index.jsx b/system/usr/share/mmrl/config/mmrl_wpd/index.jsx
index a5affac..4206d24 100644
--- a/system/usr/share/mmrl/config/mmrl_wpd/index.jsx
+++ b/system/usr/share/mmrl/config/mmrl_wpd/index.jsx
@@ -1,10 +1,11 @@
-import React from "react";
-import { Page, CodeBlock } from "@mmrl/ui";
-import { useNativeStorage } from "@mmrl/hooks";
 import { withRequireNewVersion } from "@mmrl/hoc";
-import { List, ListItem, ListSubheader, Switch, ListItemText, Divider, Typography, Stack } from "@mui/material";
+import { useNativeStorage } from "@mmrl/hooks";
+import { CodeBlock, Page } from "@mmrl/ui";
+import { Divider, List, ListItem, ListItemText, ListSubheader, Switch, Typography } from "@mui/material";
+import React from "react";
 
 const RenderToolbar = include("components/RenderToolbar.jsx");
+const CenterBox = include("components/CenterBox.jsx");
 
 const useNetworks = include("hooks/useNetworks.js");
 const useBackHandler = include("hooks/useBackHandler.js")