Merge pull request #33 from akirachix/feature/ci-cd

Feature/ci cd

Author: hunterachieng

tesfa/src/app/dashboard/components/ChatBot/index.test.tsx

@@ -20,42 +20,41 @@ describe('ChatWidget', () => {
     });
   });
 
-  test('should send a message and display bot response', async () => {
-    submitQueryMock.mockResolvedValueOnce({ response: 'Bot response' });
+ test('should send a message and display bot response', async () => {
+  submitQueryMock.mockResolvedValueOnce({ response: 'Bot response' });
 
-    render(<ChatWidget />);
-    fireEvent.click(screen.getByLabelText(/open chat/i));
+  render(<ChatWidget />);
 
-    const input = screen.getByLabelText(/chat input/i);
-    const sendButton = screen.getByLabelText(/send message/i);
+  const input = screen.getByLabelText(/chat input/i);
+  const sendButton = screen.getByLabelText(/send message/i);
 
-    fireEvent.change(input, { target: { value: 'Hello' } });
-    expect(sendButton).not.toBeDisabled();
+  fireEvent.change(input, { target: { value: 'Hello' } });
+  expect(sendButton).not.toBeDisabled();
 
-    fireEvent.click(sendButton);
+  fireEvent.click(sendButton);
 
-    const dots = await screen.findAllByText('.', { selector: '.dot' });
-    expect(dots.length).toBeGreaterThan(0);
-    const responseText = await screen.findByText('Bot response');
-    expect(responseText).toBeInTheDocument();
-  });
+  const dots = await screen.findAllByText('.', { selector: '.dot' });
+  expect(dots.length).toBeGreaterThan(0);
 
-  test('should handle submitQuery failure gracefully', async () => {
-    submitQueryMock.mockRejectedValueOnce(new Error('Failed to load response'));
+  const responseText = await screen.findByText('Bot response');
+  expect(responseText).toBeInTheDocument();
+});
 
-    render(<ChatWidget />);
-    fireEvent.click(screen.getByLabelText(/open chat/i));
+test('should handle submitQuery failure gracefully', async () => {
+  submitQueryMock.mockRejectedValueOnce(new Error('Failed to load response'));
 
-    const input = screen.getByLabelText(/chat input/i);
-    const sendButton = screen.getByLabelText(/send message/i);
+  render(<ChatWidget />);
 
-    fireEvent.change(input, { target: { value: 'Hi' } });
-    fireEvent.click(sendButton);
+  const input = screen.getByLabelText(/chat input/i);
+  const sendButton = screen.getByLabelText(/send message/i);
 
-    const dots = await screen.findAllByText('.', { selector: '.dot' });
-    expect(dots.length).toBeGreaterThan(0);
+  fireEvent.change(input, { target: { value: 'Hi' } });
+  fireEvent.click(sendButton);
 
-    const errorText = await screen.findByText('Failed to load response');
-    expect(errorText).toBeInTheDocument();
-  });
+  const dots = await screen.findAllByText('.', { selector: '.dot' });
+  expect(dots.length).toBeGreaterThan(0);
+
+  const errorText = await screen.findByText('Failed to load response');
+  expect(errorText).toBeInTheDocument();
+});
 });

tesfa/src/app/dashboard/components/ChatBot/index.tsx

@@ -45,7 +45,7 @@ function BouncingDots() {
 export default function ChatWidget() {
   const { submitQuery } = useQueryLog();
   const [input, setInput] = useState<string>("");
-  const [open, setOpen] = useState<boolean>(false);
+  const [open, setOpen] = useState<boolean>(true);
   const [sending, setSending] = useState<boolean>(false);
   const [localLogs, setLocalLogs] = useState<Message[]>([]);
   const [greeted, setGreeted] = useState<boolean>(false);

tesfa/src/app/dashboard/components/Map/index.tsx

@@ -94,7 +94,7 @@ const MapClient = () => {
           type: 'FeatureCollection',
           features: valid.map(country => ({
             type: 'Feature',
-            properties: { ...country, color: country.is_affected ? '#BA6D58' : '#164E63' },
+            properties: { ...country, color: country.is_affected ? '#BA6D58' : '#386c80ff' },
             geometry: country.geometry!,
           })),
         };
@@ -134,7 +134,7 @@ const MapClient = () => {
           type: 'FeatureCollection',
           features: valid.map(region=> ({
             type: 'Feature',
-            properties: { ...region, color: region.is_affected ? '#0E0202' : '#164E63' },
+            properties: { ...region, color: region.is_affected ? '#0E0202' : '#386c80ff' },
             geometry: region.geometry!,
           })),
         };

tesfa/src/app/dashboard/components/legend/index.tsx

@@ -0,0 +1,20 @@
+export default function MapLegend() {
+  const items = [
+    { color: "bg-[#BA6D58]", label: "Post war Areas" },
+    { color: "bg-[#386c80ff]", label: "No war Areas" },
+    { color: "bg-[#00353D]", label: "Not covered yet" },
+  ];
+  return (
+    <div className="absolute z-[1150] bottom-6 left-6  p-4 rounded-2xl backdrop-blur-md shadow-lg w-52 ">
+      <h3 className="font-semibold mb-3">Key</h3>
+      <div className="space-y-3">
+        {items.map((item, i) => (
+          <div key={i} className="flex items-center gap-3">
+            <span className={`w-6 h-6 rounded-md ${item.color}`}></span>
+            <p>{item.label}</p>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}

tesfa/src/app/dashboard/page.tsx

@@ -5,6 +5,7 @@ import dynamic from 'next/dynamic';
 import Layout from '../sharedComponents/Layout';
 import ChatWidget from './components/ChatBot';
 import ProtectedRoute from '../sharedComponents/ProtectedRoot';
+import MapLegend from './components/legend';
 const MapClient = dynamic(() => import('./components/Map'), {
   ssr: false,
   loading: () => <div className="p-4">Loading map...</div>,
@@ -47,6 +48,7 @@ const DashboardPage = () => {
           <main className="flex-1 relative">
             <MapClient />
             <ChatWidget />
+            <MapLegend/>
           </main>
         </div>
       </Layout>

tesfa/src/app/onboarding/register/components/RegisterForm/index.tsx

@@ -249,10 +249,10 @@ export default function RegisterForm({
             id="terms"
             checked={termsAccepted}
             onChange={(e) => setTermsAccepted(e.target.checked)}
-            className="mt-1 h-5 w-5 text-[#CDA12B] rounded focus:ring-[#CDA12B]"
+            className="mt-1 h-5 w-5 text-[#CDA12B] cursor-pointer rounded focus:ring-[#CDA12B]"
             required
           />
-          <label htmlFor="terms" className="ml-2 text-[#00353D] text-lg">
+          <label htmlFor="terms" className="ml-2 cursor-pointer  text-[#00353D] text-lg">
             I agree to the{" "}
             <Link href="/onboarding/terms" className="text-[#CDA12B] hover:underline">
               Terms and Conditions.

tesfa/src/app/onboarding/splash/page.tsx

@@ -19,7 +19,7 @@ export default function SplashScreen() {
     <div className="flex flex-col items-center justify-center h-screen bg-[#fdf6f6] text-center px-4 py-8">
 
       <Image
-        src="/Images/Group 166.png" 
+        src="/Images/Group66.png" 
         alt="Logo"
         width={400}
         height={200}