diff --git a/bun.lockb b/bun.lockb
index 0c2a68e..e89c538 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index 3b495b6..2b3b22d 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
"react-hook-form": "^7.51.0",
"react-native": "0.73.4",
"react-native-circular-progress": "^1.3.9",
+ "react-native-modal": "^13.0.1",
"react-native-safe-area-context": "4.8.2",
"react-native-screens": "~3.29.0",
"react-native-svg": "14.1.0",
diff --git a/src/app/_layout.tsx b/src/app/_layout.tsx
index 9d7b989..8cc3d12 100644
--- a/src/app/_layout.tsx
+++ b/src/app/_layout.tsx
@@ -11,6 +11,7 @@ import Toast from "react-native-toast-notifications";
import { useStore } from "zustand";
import authStore from "@/stores/authStore";
import { toastStore } from "@/stores/toastStore";
+import Dialog from "@ui/Dialog";
const RootLayout = () => {
const insets = useSafeAreaInsets();
@@ -46,6 +47,7 @@ const RootLayout = () => {
toastStore.setState(ref);
}}
/>
+
);
};
diff --git a/src/app/index/_sections/Apps.tsx b/src/app/index/_sections/Apps.tsx
index 0fce11b..38ead77 100644
--- a/src/app/index/_sections/Apps.tsx
+++ b/src/app/index/_sections/Apps.tsx
@@ -6,6 +6,7 @@ import { HStack } from "@ui/Stack";
import Button from "@ui/Button";
import { useNavigation } from "expo-router";
import { wakePcUp } from "@/app/apps/lib";
+import { showDialog } from "@/stores/dialogStore";
type Props = ComponentProps;
@@ -21,7 +22,12 @@ const Apps = (props: Props) => {
{
name: "Turn on PC",
icon: ,
- action: wakePcUp,
+ action: () =>
+ showDialog(
+ "Turn on PC",
+ "Are you sure wanna turn on the PC?",
+ wakePcUp
+ ),
},
];
diff --git a/src/app/index/index.tsx b/src/app/index/index.tsx
index 5221dc9..37fb8c0 100644
--- a/src/app/index/index.tsx
+++ b/src/app/index/index.tsx
@@ -34,6 +34,7 @@ const HomePage = () => {
+
diff --git a/src/components/ui/Dialog.tsx b/src/components/ui/Dialog.tsx
new file mode 100644
index 0000000..7c661fc
--- /dev/null
+++ b/src/components/ui/Dialog.tsx
@@ -0,0 +1,42 @@
+import React from "react";
+import Modal from "react-native-modal";
+import Container from "./Container";
+import Text from "./Text";
+import { HStack } from "./Stack";
+import Button from "./Button";
+import { useStore } from "zustand";
+import { dialogStore } from "@/stores/dialogStore";
+
+const Dialog = () => {
+ const { isVisible, title, message, onConfirm, close } = useStore(dialogStore);
+
+ return (
+
+
+ {title}
+ {message}
+
+
+
+
+
+
+
+ );
+};
+
+export default React.memo(Dialog);
diff --git a/src/stores/dialogStore.ts b/src/stores/dialogStore.ts
new file mode 100644
index 0000000..e9f33af
--- /dev/null
+++ b/src/stores/dialogStore.ts
@@ -0,0 +1,31 @@
+import { createStore } from "zustand";
+
+type DialogStore = {
+ isVisible: boolean;
+ title: string;
+ message: string;
+ onConfirm: () => void;
+ open: (title: string, message: string, onConfirm: () => void) => void;
+ close: () => void;
+};
+
+export const dialogStore = createStore((set) => ({
+ isVisible: false,
+ title: "",
+ message: "",
+ onConfirm: () => {},
+ open(title, message, onConfirm) {
+ set({ title, message, onConfirm });
+ },
+ close() {
+ set({ isVisible: false });
+ },
+}));
+
+export const showDialog = (
+ title: string,
+ message: string,
+ onConfirm: () => void
+) => {
+ dialogStore.setState({ title, message, onConfirm, isVisible: true });
+};