Merge branch 'main' into feature/f-167-accordions-redesign-fcs-ipc

next-sitemap.config.js

@@ -0,0 +1,7 @@
+/** @type {import('next-sitemap').IConfig} */
+module.exports = {
+  siteUrl: 'https://localhost:3000', // local temporary
+  generateRobotsTxt: true,
+  changefreq: 'daily',
+  priority: 0.7,
+};

package.json

@@ -10,15 +10,18 @@
     "lint:fix": "eslint . --ext .ts,.tsx -c .eslintrc.json --fix",
     "format": "prettier --write .",
     "format:fix": "prettier .",
-    "prepare": "husky"
+    "prepare": "husky",
+    "postbuild": "next-sitemap"
   },
   "dependencies": {
     "@internationalized/date": "^3.6.0",
     "@nextui-org/accordion": "^2.0.40",
+    "@nextui-org/alert": "^2.2.7",
     "@nextui-org/button": "^2.0.38",
     "@nextui-org/card": "^2.0.34",
     "@nextui-org/chip": "^2.0.33",
     "@nextui-org/code": "2.0.33",
+    "pdfjs-dist": "3.11.174",
     "@nextui-org/dropdown": "^2.1.31",
     "@nextui-org/image": "^2.0.32",
     "@nextui-org/input": "2.2.5",
@@ -36,7 +39,7 @@
     "@nextui-org/switch": "^2.0.34",
     "@nextui-org/system": "2.2.6",
     "@nextui-org/table": "^2.0.40",
-    "@nextui-org/theme": "2.2.11",
+    "@nextui-org/theme": "^2.3.0",
     "@nextui-org/tooltip": "^2.0.41",
     "@react-aria/ssr": "3.9.4",
     "@react-aria/visually-hidden": "3.8.12",
@@ -60,6 +63,7 @@
     "leaflet-geosearch": "^4.0.0",
     "lucide-react": "^0.454.0",
     "next": "14.2.10",
+    "next-sitemap": "^4.2.3",
     "next-themes": "^0.2.1",
     "nextui-cli": "^0.3.4",
     "react": "18.3.1",
@@ -72,6 +76,7 @@
     "react-pdf": "^9.1.1",
     "rehype-sanitize": "^6.0.0",
     "remark-gfm": "^4.0.0",
+    "sharp": "^0.33.5",
     "tailwind-variants": "0.1.20",
     "uuid": "^11.0.3"
   },

public/robots.txt

@@ -0,0 +1,9 @@
+# *
+User-agent: *
+Allow: /
+
+# Host
+Host: https://localhost:3000
+
+# Sitemaps
+Sitemap: https://localhost:3000/sitemap.xml

public/sitemap.xml

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
+<url><loc>https://localhost:3000/about</loc><lastmod>2024-12-17T19:34:24.137Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://localhost:3000/data_sources</loc><lastmod>2024-12-17T19:34:24.138Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://localhost:3000/elements</loc><lastmod>2024-12-17T19:34:24.138Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://localhost:3000/disclaimer</loc><lastmod>2024-12-17T19:34:24.138Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://localhost:3000</loc><lastmod>2024-12-17T19:34:24.138Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://localhost:3000/wiki</loc><lastmod>2024-12-17T19:34:24.138Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://localhost:3000/download-portal</loc><lastmod>2024-12-17T19:34:24.138Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+</urlset>

src/app/about/layout.tsx

@@ -1,15 +1,61 @@
 import { Metadata } from 'next';
 
+import HungerMapChatbot from '@/components/Chatbot/Chatbot';
 import { Topbar } from '@/components/Topbar/Topbar';
+import { siteConfig } from '@/config/site';
 
 export const metadata: Metadata = {
-  title: 'About',
+  title: {
+    default: 'About',
+    template: `%s - ${siteConfig.name}`,
+  },
+  description:
+    'Learn more about the WFP Hunger Map, its mission, and how it provides real-time global hunger data and food insecurity trends.',
+  keywords: siteConfig.keywords,
+  openGraph: {
+    title: `About Us - ${siteConfig.name}`,
+    description:
+      'Discover the mission and purpose behind the WFP Hunger Map, providing real-time global hunger data and insights.',
+    url: `${siteConfig.domain}/about`,
+    images: [
+      {
+        url: '/Images/About-preview.png',
+        width: 1200,
+        height: 630,
+        alt: `About Us - ${siteConfig.name}`,
+      },
+    ],
+    type: 'website',
+  },
+  twitter: {
+    card: 'summary_large_image',
+    title: `About Us - ${siteConfig.name}`,
+    description:
+      'Learn more about how the WFP Hunger Map helps visualize real-time global hunger and food insecurity trends.',
+    images: [
+      {
+        url: '/Images/About-preview.png',
+        width: 1200,
+        height: 630,
+        alt: `About Us - ${siteConfig.name}`,
+      },
+    ],
+    site: '@WFP',
+  },
+  robots: {
+    index: true,
+    follow: true,
+    nocache: false,
+  },
 };
 
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
     <div>
-      <Topbar />
+      <div className="mb-20">
+        <Topbar />
+        <HungerMapChatbot />
+      </div>
       <main className="flex flex-col gap-6 lg:gap-10 p-5 lg:p-10 text-content !pt-1">{children}</main>
     </div>
   );

src/app/comparison-portal/layout.tsx

@@ -0,0 +1,20 @@
+import { Metadata } from 'next';
+
+import HungerMapChatbot from '@/components/Chatbot/Chatbot';
+import { Topbar } from '@/components/Topbar/Topbar';
+
+export const metadata: Metadata = {
+  title: 'Comparison Portal',
+};
+
+export default function Layout({ children }: { children: React.ReactNode }) {
+  return (
+    <div className="min-h-screen flex flex-col">
+      <div className="mb-20">
+        <Topbar />
+        <HungerMapChatbot />
+      </div>
+      <main className="flex flex-col gap-6 lg:gap-10 p-5 lg:p-10 text-content w-full">{children}</main>
+    </div>
+  );
+}

src/app/comparison-portal/page.tsx

@@ -0,0 +1,28 @@
+import { Suspense } from 'react';
+
+import ComparisonAccordionSkeleton from '@/components/ComparisonPortal/ComparisonAccordionSkeleton';
+import CountryComparison from '@/components/ComparisonPortal/CountryComparison';
+import CountrySelectionSkeleton from '@/components/ComparisonPortal/CountrySelectSkeleton';
+import container from '@/container';
+import { GlobalDataRepository } from '@/domain/repositories/GlobalDataRepository';
+
+export default async function ComparisonPortal() {
+  const globalRepo = container.resolve<GlobalDataRepository>('GlobalDataRepository');
+  const countryMapData = await globalRepo.getMapDataForCountries();
+  const globalFcsData = await globalRepo.getFcsData();
+  return (
+    <div>
+      <h1>Comparison Portal</h1>
+      <Suspense
+        fallback={
+          <>
+            <CountrySelectionSkeleton />
+            <ComparisonAccordionSkeleton />
+          </>
+        }
+      >
+        <CountryComparison countryMapData={countryMapData} globalFcsData={globalFcsData} />
+      </Suspense>
+    </div>
+  );
+}

src/app/data_sources/layout.tsx

@@ -1,15 +1,61 @@
 import { Metadata } from 'next';
 
+import HungerMapChatbot from '@/components/Chatbot/Chatbot';
 import { Topbar } from '@/components/Topbar/Topbar';
+import { siteConfig } from '@/config/site';
 
 export const metadata: Metadata = {
-  title: 'Data Sources',
+  title: {
+    default: 'Data Sources',
+    template: `%s - ${siteConfig.name}`,
+  },
+  description:
+    'Explore the data sources behind the WFP Hunger Map, providing insights into global hunger trends and food insecurity statistics.',
+  keywords: siteConfig.keywords,
+  openGraph: {
+    title: `Data Sources - ${siteConfig.name}`,
+    description:
+      'Explore the trusted data sources behind the WFP Hunger Map, offering real-time global hunger trends and food insecurity insights.',
+    url: `${siteConfig.domain}/data_sources`,
+    images: [
+      {
+        url: '/Images/Datasource-preview.png',
+        width: 1200,
+        height: 630,
+        alt: `Data Sources - ${siteConfig.name}`,
+      },
+    ],
+    type: 'website',
+  },
+  twitter: {
+    card: 'summary_large_image',
+    title: `Data Sources - ${siteConfig.name}`,
+    description:
+      'Explore the trusted data sources that power the WFP Hunger Map for real-time hunger and food insecurity statistics.',
+    images: [
+      {
+        url: '/Images/Datasource-preview.png',
+        width: 1200,
+        height: 630,
+        alt: `Data Sources - ${siteConfig.name}`,
+      },
+    ],
+    site: '@WFP',
+  },
+  robots: {
+    index: true,
+    follow: true,
+    nocache: false,
+  },
 };
 
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
     <div>
-      <Topbar />
+      <div className="mb-20">
+        <Topbar />
+        <HungerMapChatbot />
+      </div>
       <main className="flex flex-col gap-6 lg:gap-10 p-5 lg:p-10 text-content !pt-1">{children}</main>
     </div>
   );

src/app/disclaimer/layout.tsx

@@ -1,5 +1,6 @@
 import { Metadata } from 'next';
 
+import HungerMapChatbot from '@/components/Chatbot/Chatbot';
 import { Topbar } from '@/components/Topbar/Topbar';
 
 export const metadata: Metadata = {
@@ -9,7 +10,10 @@ export const metadata: Metadata = {
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
     <div>
-      <Topbar />
+      <div className="mb-20">
+        <Topbar />
+        <HungerMapChatbot />
+      </div>
       <main className="flex flex-col gap-6 lg:gap-10 p-5 lg:p-10 text-content">{children}</main>
     </div>
   );

src/app/download-portal/layout.tsx

@@ -1,15 +1,61 @@
 import { Metadata } from 'next';
 
+import HungerMapChatbot from '@/components/Chatbot/Chatbot';
 import { Topbar } from '@/components/Topbar/Topbar';
+import { siteConfig } from '@/config/site';
 
 export const metadata: Metadata = {
-  title: 'Download Portal',
+  title: {
+    default: 'Download Portal',
+    template: `%s - ${siteConfig.name}`,
+  },
+  description:
+    'Access and download real-time global hunger data as PDF reports or JSON data. Obtain food insecurity statistics from the WFP Hunger Map Download Portal, tailored to different countries and time zones. A valuable resource for humanitarian efforts and research.',
+  keywords: siteConfig.keywords,
+  openGraph: {
+    title: `Download Portal - ${siteConfig.name}`,
+    description:
+      'Download real-time global hunger data as PDF reports or JSON data from the WFP Hunger Map Download Portal, tailored to different countries and time zones. Essential for humanitarian aid and research.',
+    url: `${siteConfig.domain}/download-portal`,
+    images: [
+      {
+        url: '/Images/Download-preview.png',
+        width: 1200,
+        height: 630,
+        alt: `Download Portal - ${siteConfig.name}`,
+      },
+    ],
+    type: 'website',
+  },
+  twitter: {
+    card: 'summary_large_image',
+    title: `Download Portal - ${siteConfig.name}`,
+    description:
+      'Access downloadable global hunger data from the WFP Hunger Map Download Portal, tailored to different countries and time zones.',
+    images: [
+      {
+        url: '/Images/Download-preview.png',
+        width: 1200,
+        height: 630,
+        alt: `Download Portal - ${siteConfig.name}`,
+      },
+    ],
+    site: '@WFP',
+  },
+  robots: {
+    index: true,
+    follow: true,
+    nocache: false,
+  },
 };
 
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
     <div>
-      <Topbar />
+      <div className="mb-20">
+        <Topbar />
+        <HungerMapChatbot />
+      </div>
       <main className="flex flex-col gap-6 lg:gap-10 p-5 lg:p-10 text-content">{children}</main>
     </div>
   );