Merge pull request #31 from shivamg9/develop

Bugs fixes on portal ui/ux improvements

messages/en.json

@@ -127,6 +127,8 @@
   "Search by program name": "Search by program name...",
   "Your Application is still in Progress": "Your Application is still in Progress",
   "Proceed to Application": "Proceed to Application",
+  "how are you doing": "how are you doing?",
+  "I am here to assist you Take a few minutes and lets connect": "I am here to assist you. Take a few minutes and let's connect!",
 
   "Discard application": "Discard Application?",
   "The entered data will not be saved Are you sure you want to discard the form": "The entered data will not be saved. Are you sure you want to discard the form?",

messages/es.json

@@ -127,6 +127,8 @@
   "Search by program name": "Buscar por nombre de programa...",
   "Your Application is still in Progress": "Su solicitud todavía está en progreso",
   "Proceed to Application": "Ir a la solicitud",
+  "how are you doing": "¿Cómo estás?",
+  "I am here to assist you Take a few minutes and lets connect": "Estoy aquí para ayudarte. ¡Tómate unos minutos y conectémonos!",
 
   "Discard application": "¿Descartar solicitud?",
   "The entered data will not be saved Are you sure you want to discard the form": "Los datos ingresados no se guardarán. ¿Está seguro de que desea descartar el formulario?",

messages/fr.json

@@ -127,6 +127,8 @@
   "Search by program name": "Rechercher par nom de programme...",
   "Your Application is still in Progress": "Votre demande est toujours en cours",
   "Proceed to Application": "Passer à la demande",
+  "how are you doing": "Comment ça va?",
+  "I am here to assist you Take a few minutes and lets connect": "Je suis ici pour vous aider. Prenez quelques minutes et connectons-nous!",
 
   "Discard application": "Annuler la demande?",
   "The entered data will not be saved Are you sure you want to discard the form": "Les données saisies ne seront pas enregistrées. Êtes-vous sûr de vouloir annuler le formulaire?",

messages/tl.json

@@ -127,6 +127,8 @@
   "Search by program name": "Maghanap ayon sa pangalan ng programa...",
   "Your Application is still in Progress": "Ang iyong aplikasyon ay patuloy pa ring inaasikaso",
   "Proceed to Application": "Magpatuloy sa Aplikasyon",
+  "how are you doing": "Kamusta ka?",
+  "I am here to assist you Take a few minutes and lets connect": "Nandito ako upang tumulong sa iyo. Maglaan ng ilang minuto at mag-connect tayo!",
 
   "Discard application": "Itapon ang Aplikasyon?",
   "The entered data will not be saved Are you sure you want to discard the form": "Ang mga naipasok na datos ay hindi maiimbak. Sigurado ka bang nais mong itapon ang form?",

src/app/[locale]/aboutus/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/app/[locale]/applications/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/app/[locale]/apply/page.tsx

@@ -17,6 +17,8 @@ export default function Apply() {
   const programid = searchParams.get("programid");
   const t = useTranslations();
 
+  const [showConfirmation, setShowConfirmation] = useState(false);
+
   useEffect(() => {
     const {Formio, Templates} = require("@tsed/react-formio");
     const tailwind = require("@tsed/tailwind-formio");
@@ -58,6 +60,14 @@ export default function Apply() {
   }, [programid, lang, router]);
 
   const handleCancel = () => {
+    // router.back();
+    setShowConfirmation(true);
+  };
+
+  const handleDiscard = () => {
+    // Hide the confirmation popup
+    setShowConfirmation(false);
+    // Navigate back
     router.back();
   };
 
@@ -194,7 +204,7 @@ export default function Apply() {
           <hr className="border-t mx-0 border-gray-300 mt-3" />
           <div id="formio" className="m-4"></div>
         </div>
-        <div className="basis-1/2 mb-80 flex-col flex-wrap justify-between items-center border border-gray-300 bg-brand container pb-10 rounded-lg top-24 shadow-md ">
+        <div className="basis-1/2 flex-col items-center border border-gray-300 bg-brand container rounded-lg top-24 shadow-md ">
           <p
             className=" text-gray-700 pt-4 pl-4 pb-0 font-fontcustom  "
             style={{
@@ -242,6 +252,24 @@ export default function Apply() {
           </div>
         </div>
       </div>
+      {showConfirmation && (
+        <div className="fixed inset-0 flex items-center justify-center z-50 bg-black bg-opacity-50">
+          <div className="bg-white p-8 rounded-lg shadow-lg">
+            <h2 className="text-lg font-bold mb-4">{t("Discard application")}</h2>
+            <p className="mb-4">
+              {t("The entered data will not be saved_ Are you sure you want to discard the form?")}
+            </p>
+            <div className="flex justify-end">
+              <button onClick={handleDiscard} className="px-4 py-2 bg-red-500 text-white rounded-md mr-2">
+                {t("Discard")}
+              </button>
+              <button onClick={() => setShowConfirmation(false)} className="px-4 py-2 bg-gray-300 rounded-md">
+                {t("Cancel")}
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
     </div>
   );
 }

src/app/[locale]/benefits/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/app/[locale]/contactus/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/app/[locale]/home/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/app/[locale]/myprofile/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/app/[locale]/otherpage/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/app/[locale]/programs/layout.tsx

@@ -1,11 +1,13 @@
 import {ReactNode} from "react";
 import {Header, Footer} from "@/components";
+import ChatIcon from "@/components/ChatIcon";
 
 export default function CommonLayout({children}: {children: ReactNode}) {
   return (
     <>
       <Header />
       {children}
+      <ChatIcon />
       <Footer />
     </>
   );

src/commons/styles/globals.css

@@ -121,6 +121,33 @@ body {
   z-index: 9999;
 }
 
+.chat-icon-container {
+  position: relative;
+  right: 0px;
+  left: 1300px;
+  z-index: 1;
+  margin-top: 0px;
+}
+
+.chat-icon-button {
+  background: none;
+  border: none;
+  cursor: pointer;
+}
+
+.chat-popup {
+  position: absolute;
+  bottom: 6px;
+  left: 1px;
+  width: 300px;
+  transform: translateX(-100%);
+  background: white;
+  padding: 16px;
+  border-radius: 8px;
+  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
+  max-width: 800px;
+}
+
 /* @media (min-width: 1024px) {
   footer {
     position: fixed;

src/components/index.ts

@@ -8,6 +8,7 @@ import SearchBar from "./SearchBar";
 import SearchProgram from "./SearchProgram";
 import Search from "./Search";
 import Toast from "./Toast";
+import ChatIcon from "./ChatIcon";
 
 export {
   Card,
@@ -20,4 +21,5 @@ export {
   Search,
   Toast,
   Pagination,
+  ChatIcon,
 };