diff --git a/src/App.vue b/src/App.vue
index 4295c365..86ed1cdc 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,4 +1,10 @@
diff --git a/src/api/socket.ts b/src/api/socket.ts
new file mode 100644
index 00000000..4ef5ca91
--- /dev/null
+++ b/src/api/socket.ts
@@ -0,0 +1,7 @@
+import env from "./index";
+
+const socket = `${env.API_URI}/backup-socket`;
+
+export default {
+ socket,
+};
diff --git a/src/app.config.ts b/src/app.config.ts
index 777b8846..1bccb568 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -46,6 +46,9 @@ import command from "./api/05_command/api.command";
/** API Webservices*/
import webservices from "./api/06_webservices/api.webservices";
+/** socket */
+import socket from "./api/socket";
+
// environment variables
export const compettitivePanel = import.meta.env.VITE_COMPETITIVE_EXAM_PANEL;
export const qualifyDisableExamPanel = import.meta.env
@@ -117,6 +120,9 @@ const API = {
...command,
/** webservices*/
...webservices,
+
+ /** socket*/
+ ...socket,
};
export default {
diff --git a/src/stores/socket.ts b/src/stores/socket.ts
new file mode 100644
index 00000000..bc857489
--- /dev/null
+++ b/src/stores/socket.ts
@@ -0,0 +1,48 @@
+import { defineStore } from "pinia";
+import { Notify } from "quasar";
+
+import { io, Socket } from "socket.io-client";
+
+import config from "@/app.config";
+import { getToken } from "@/plugins/auth";
+
+interface sockeBackup {
+ message: string;
+ success: boolean;
+}
+
+export const useSocketStore = defineStore("socket", () => {
+ let socket: Socket;
+
+ async function init() {
+ socket = io(new URL(config.API.socket).origin, {
+ auth: { token: await getToken() },
+ path: "/api/v1/backup-socket",
+ });
+ socket.on("backup-notification", (payload) => {
+ let body: sockeBackup = JSON.parse(payload);
+ notifyStatus(body.message, body.success);
+ });
+ }
+
+ function notifyStatus(message: string, success: boolean) {
+ Notify.create({
+ group: false,
+ type: success ? "positive" : "negative",
+ message: `${message}`,
+ position: "top",
+ timeout: 0,
+ actions: [
+ {
+ icon: "close",
+ color: "white",
+ round: true,
+ },
+ ],
+ });
+ }
+
+ init();
+
+ return {};
+});