diff --git a/app/_components/_rhs/BetterIDEa.tsx b/app/_components/_rhs/BetterIDEa.tsx
index 0344dce..653f867 100644
--- a/app/_components/_rhs/BetterIDEa.tsx
+++ b/app/_components/_rhs/BetterIDEa.tsx
@@ -1,6 +1,7 @@
"use client";
import React, { useEffect, useState } from "react";
import {
+ useAlertStore,
useCodeStore,
useMessagesArrayStore,
usePidStore,
@@ -13,6 +14,7 @@ const BetterIDEa = () => {
const curCode = useCodeStore((state) => state.curCode);
const setMessArr = useMessagesArrayStore((state) => state.setMessArr);
const setCurPid = usePidStore((state) => state.setCurPid);
+ const setAlert = useAlertStore((state) => state.setAlert);
const [newMes, setNewMes] = useState("");
useEffect(() => {
@@ -61,6 +63,7 @@ const BetterIDEa = () => {
console.log("message new", "test\n", m);
// setNewMes(m);
if (m[0].Output.print) {
+ setAlert(true);
alert("You have new Message!");
}
}}
diff --git a/app/_components/_rhs/MessagesDD.tsx b/app/_components/_rhs/MessagesDD.tsx
index 09646e3..b8573fd 100644
--- a/app/_components/_rhs/MessagesDD.tsx
+++ b/app/_components/_rhs/MessagesDD.tsx
@@ -3,12 +3,37 @@ import React, { useState, useEffect } from "react";
import { brandLightText } from "../../_utils/colors";
import { getInbox } from "@betteridea/codecell";
import Image from "next/image";
-import { useMessagesArrayStore, usePidStore } from "../../_store/store";
+import {
+ useAlertStore,
+ useMessagesArrayStore,
+ usePidStore,
+} from "../../_store/store";
const MessagesDD = () => {
const [mesToggle, setMesToggle] = useState(false);
+ const [notif, setNotif] = useState(false);
const messArr = useMessagesArrayStore((state) => state.messArr);
const curPid = usePidStore((state) => state.curPid);
+ const alert = useAlertStore((state) => state.alert);
+ const setAlert = useAlertStore((state) => state.setAlert);
+
+ useEffect(() => {
+ getInbox("1", true);
+ }, []);
+
+ useEffect(() => {
+ console.log("alert effecvt triggere", alert);
+ if (!mesToggle && alert) {
+ getInbox("1", true);
+ setNotif(true);
+ }
+ }, [alert]);
+
+ useEffect(() => {
+ if (mesToggle) {
+ setAlert(false);
+ }
+ }, [mesToggle]);
const stripAnsiCodes = (str: string) => {
return str?.replace(
@@ -55,6 +80,15 @@ const MessagesDD = () => {
className={`${mesToggle ? "rotate-180" : "rotate-0"}`}
/>
)}
+ {notif && (
+
+ )}
{curPid && (
void;
}
+interface AlertState {
+ alert: boolean;
+ setAlert: (newAlert: boolean) => void;
+}
+
export const useTutorialStore = create()((set) => ({
curTutorial: "GET Request",
// increasePopulation: () => set((state) => ({ bears: state.bears + 1 })),
@@ -39,3 +44,7 @@ export const usePidStore = create()((set) => ({
curPid: "",
setCurPid: (newPid) => set({ curPid: newPid }),
}));
+export const useAlertStore = create()((set) => ({
+ alert: false,
+ setAlert: (newAlert) => set({ alert: newAlert }),
+}));
diff --git a/public/alert.png b/public/alert.png
new file mode 100644
index 0000000..4ae6394
Binary files /dev/null and b/public/alert.png differ