- 
United Nations
@@ -62,14 +65,14 @@ const Layout = ({ children, title = "", countries = [] }: Props) => {
target="_blank"
rel="noopener noreferrer"
>
- 
- 
{
{/* Remove {label} */}
-
-
{
- © 2024 United Nations Development Programme + © {currentYear} United Nations Development Programme
{ target="_blank" rel="noopener noreferrer" > -
-
{
- let url = `/api/digital-right-indicators`;
- let params = { country, pillar };
- let stringifiedParams = new URLSearchParams(params).toString();
- // @ts-ignore
- const res = await fetch(`${url}?${stringifiedParams}`);
- return await res.json();
+const fetchIndicators = async (_: string, country: string, pillar: string) => {
+ // using ssr api
+ // let url = `/api/digital-right-indicators`;
+ // let params = { country, pillar };
+ // let stringifiedParams = new URLSearchParams(params).toString();
+ // // @ts-ignore
+ // const res = await fetch(`${url}?${stringifiedParams}`);
+ // return await res.json();
+
+ // direct query
+ if (!country || !pillar) {
+ return;
+ }
+
+ let indices = db.digital_right_scores.filter((score) => {
+ return (
+ score["Country Name"] === country &&
+ score["Pillar"] === pillar &&
+ Boolean(score["Indicator"])
+ );
+
+ });
+
+ let indicesWithSources = indices.map((index) => {
+ return {
+ ...index,
+ sources: db.digital_right_scores.filter((score) => {
+ return (
+ score["Country Name"] === country &&
+ score["Pillar"] === pillar &&
+ score["Indicator"] === index["Indicator"] &&
+ score["Source Name"]
+ );
+ }),
+ };
+ });
+ return indicesWithSources;
};
export function DigitalRightIndicatorList(props: IndicatorListProps) {
@@ -90,12 +123,26 @@ const fetchIndicatorsForPillar = async (
country: string,
pillar: string
) => {
- let url = `/api/digital-right-indicators-for-pillar`;
- let params = { country, pillar };
- let stringifiedParams = new URLSearchParams(params).toString();
- // @ts-ignore
- const res = await fetch(`${url}?${stringifiedParams}`);
- return await res.json();
+ // using ssr api
+
+ // let url = `/api/digital-right-indicators-for-pillar`;
+ // let params = { country, pillar };
+ // let stringifiedParams = new URLSearchParams(params).toString();
+ // // @ts-ignore
+ // const res = await fetch(`${url}?${stringifiedParams}`);
+ // return await res.json();
+
+ if (!country || !pillar) {
+ return;
+ }
+
+ const allIndicators = db.digital_right_scores.filter(
+ (score) =>
+ score["Pillar"] === pillar &&
+ Boolean(score["Indicator"])
+ );
+ const uniqueIndicators = uniqBy(allIndicators, "Indicator");
+ return uniqueIndicators;
};
const MissingIndicators = ({
filledIndicators,
@@ -306,15 +353,15 @@ const Indicator = ({
onMouseLeave={() => setIconIsHovered(false)}
>
{isIconHovered ? (
- Digital Development Compass
@@ -57,9 +57,9 @@ export function Header(props: { countries: CountryNameAndAlpha[] }) { setIsScrolled(window.scrollY > 0); }; - window.addEventListener('scroll', handleScroll); + window.addEventListener("scroll", handleScroll); return () => { - window.removeEventListener('scroll', handleScroll); + window.removeEventListener("scroll", handleScroll); }; }, []); @@ -71,21 +71,24 @@ export function Header(props: { countries: CountryNameAndAlpha[] }) {
-
-
-
-
+
@@ -95,9 +98,11 @@ export function Header(props: { countries: CountryNameAndAlpha[] }) {
>
{mobileMenuOpen ? (
- 
) : (
- 
)}
@@ -112,14 +117,19 @@ export function Header(props: { countries: CountryNameAndAlpha[] }) {
) : (
-
)}
@@ -112,14 +117,19 @@ export function Header(props: { countries: CountryNameAndAlpha[] }) {
-
-
+ 
@@ -141,40 +151,40 @@ export function Header(props: { countries: CountryNameAndAlpha[] }) {
{process.env.SITE_CONFIG === "dev" ? (
-
-
- {dropdownOpen && (
-
- ) : (
+
-
-
- Digital Development Compass
-
-
-
-
- Digital Rights Dashboard
-
-
-
- )}
-
+
+ {dropdownOpen && (
+
+ ) : (
-
- Methodology
-
-
+
+ Methodology
+
+
)}
+
+
+ Digital Development Compass
+
+
+
+
+ Digital Rights Dashboard
+
+
+
+ )}
+
diff --git a/ui/components/indicator-list.tsx b/ui/components/indicator-list.tsx
index dc75c81ec..3cfaabced 100644
--- a/ui/components/indicator-list.tsx
+++ b/ui/components/indicator-list.tsx
@@ -3,9 +3,12 @@ import { Score } from "database/processed/db";
import { roundNumber } from "lib";
import { useState } from "react";
import useSWR from "swr";
-import ExternalDefault from "../public/external-default.svg";
-import ExternalDefaultHover from "../public/external-hover.svg";
-import Image from "next/image";
+//import ExternalDefault from "../public/external-default.svg";
+//import ExternalDefaultHover from "../public/external-hover.svg";
+//import Image from "next/image";
+import { db } from "database";
+import { uniqBy } from "lodash";
+import { prefix } from "lib/prefix";
interface IndicatorListProps {
country: string;
@@ -23,12 +26,43 @@ const fetchIndicators = async (
pillar: string,
subpillar: string
) => {
- let url = `/api/indicators`;
- let params = { country, pillar, subpillar };
- let stringifiedParams = new URLSearchParams(params).toString();
- // @ts-ignore
- const res = await fetch(`${url}?${stringifiedParams}`);
- return await res.json();
+ // using ssr api
+ // let url = `/api/indicators`;
+ // let params = { country, pillar, subpillar };
+ // let stringifiedParams = new URLSearchParams(params).toString();
+ // // @ts-ignore
+ // const res = await fetch(`${url}?${stringifiedParams}`);
+ // return await res.json();
+
+ if (!country || !pillar || !subpillar) {
+ return;
+ }
+
+ let indices = db.scores.filter((score) => {
+ return (
+ score["Country Name"] === country &&
+ score["Pillar"] === pillar &&
+ score["Sub-Pillar"] === subpillar &&
+ Boolean(score["Indicator"])
+ );
+
+ });
+
+ let indicesWithSources = indices.map((index) => {
+ return {
+ ...index,
+ sources: db.scores.filter((score) => {
+ return (
+ score["Country Name"] === country &&
+ score["Pillar"] === pillar &&
+ score["Sub-Pillar"] === subpillar &&
+ score["Indicator"] === index["Indicator"] &&
+ score["Source Name"]
+ );
+ }),
+ };
+ });
+ return indicesWithSources;
};
export function IndicatorList(props: IndicatorListProps) {
@@ -103,13 +137,29 @@ const fetchIndicatorsForSubpillar = async (
pillar: string,
subpillar: string
) => {
- let url = `/api/indicators-for-subpillar`;
- let params = { country, pillar, subpillar };
- let stringifiedParams = new URLSearchParams(params).toString();
- // @ts-ignore
- const res = await fetch(`${url}?${stringifiedParams}`);
- return await res.json();
+ // using ssr api
+ // let url = `/api/indicators-for-subpillar`;
+ // let params = { country, pillar, subpillar };
+ // let stringifiedParams = new URLSearchParams(params).toString();
+ // // @ts-ignore
+ // const res = await fetch(`${url}?${stringifiedParams}`);
+ // return await res.json();
+
+ if (!country || !pillar || !subpillar) {
+ return;
+ }
+
+ const allIndicators = db.scores.filter(
+ (score) =>
+ score["Pillar"] === pillar &&
+ score["Sub-Pillar"] === subpillar &&
+ Boolean(score["Indicator"])
+ );
+ const uniqueIndicators = uniqBy(allIndicators, "Indicator");
+
+ return uniqueIndicators;
};
+
const MissingIndicators = ({
filledIndicators,
country,
@@ -319,25 +369,21 @@ const Indicator = ({
onMouseLeave={() => setIconIsHovered(false)}
>
{isIconHovered ? (
- 
Back
- 
) : (
@@ -144,7 +145,7 @@ export function MobileMenuSideView({ onClose }: MobileMenuSideViewProps) {
className="flex items-center cursor-pointer pt-[33px]"
onClick={handleClose}
>
-
Back
diff --git a/ui/components/search-dialog.tsx b/ui/components/search-dialog.tsx
index dc0cffba3..891fb42be 100644
--- a/ui/components/search-dialog.tsx
+++ b/ui/components/search-dialog.tsx
@@ -7,8 +7,9 @@ import React, { useCallback, useMemo, useState } from "react";
import { useHotkeys } from "react-hotkeys-hook";
import { useLocalStorage } from "react-use";
import { matchSorter } from "match-sorter";
-import SearchIcon from "../public/search.svg"
-import Image from "next/image";
+//import SearchIcon from "../public/search.svg"
+//import Image from "next/image";
+import { prefix } from "lib/prefix";
interface SearchDialogProps {
countries: CountryNameAndAlpha[];
@@ -179,7 +180,8 @@ export function SearchDialog(props: SearchDialogProps) {
onClick={() => setOpen(true)}
className={`header-nav-bg-color font-semibold hover:header-nav-bg-color hover:text-white ${props.isOpen ? 'py-5' : 'py-4'} text-xs uppercase tracking-wide text-brand-blue-dark flex-shrink-0 flex items-center`}
>
- 
-
-
+ 
@@ -449,8 +452,10 @@ export default function About(
isHovered ? "translate-x-0" : "-translate-x-2"
}`}
>
-
- 
+ 
)}
diff --git a/ui/pages/methodology.tsx b/ui/pages/methodology.tsx
index 1b9365e35..e9eeadd8a 100644
--- a/ui/pages/methodology.tsx
+++ b/ui/pages/methodology.tsx
@@ -1,14 +1,14 @@
import { db } from "database";
import { groupBy } from "lodash";
import { InferGetStaticPropsType } from "next";
-import Image from "next/image";
+//import Image from "next/image";
import Script from "next/script";
import { isMemberState } from "lib";
-import githubUNDPdiagram from "../public/undp-diagram.png";
-import overviewofTDTF from "../public/OverviewofTDTF.png";
-import fiveStage from "../public/fiveStage.png";
-import transformation from "../public/transformation.png";
-import MinMaxScale from "../public/MinMaxScale.png";
+//import githubUNDPdiagram from "../public/undp-diagram.png";
+//import overviewofTDTF from "../public/OverviewofTDTF.png";
+//import fiveStage from "../public/fiveStage.png";
+//import transformation from "../public/transformation.png";
+//import MinMaxScale from "../public/MinMaxScale.png";
import Layout from "components/Layout";
import Link from "next/link";
import React, { useState } from "react";
@@ -18,10 +18,11 @@ import {
dimensionsTable,
} from "database/methodologyTableData";
import { ancillary } from "database/ancillary";
-import chevronRight from "../public/chevron-right.svg";
-import downloadDefault from "../public/download-default.svg";
+//import chevronRight from "../public/chevron-right.svg";
+//import downloadDefault from "../public/download-default.svg";
//import arrowBase from "../../public/arrow-base.svg";
-import downloadHover from "../public/download-hover.svg";
+//import downloadHover from "../public/download-hover.svg";
+import { prefix } from "../lib/prefix";
const NavBar = () => {
return (
@@ -215,10 +216,10 @@ export default function Methodology(
opportunities they may encounter along the way.
+
-
Figure 1. UNDP’s Digital Transformation Framework @@ -254,8 +255,8 @@ export default function Methodology( encompasses every pillar and sub-pillar.
-
-
-
-
@@ -1277,15 +1278,15 @@ export default function Methodology(
onMouseLeave={() => setDownloadHovered(false)}
>
{isDownloadHovered ? (
-
-
Figure 1. UNDP’s Digital Transformation Framework @@ -259,8 +260,8 @@ export default function DIGITAL_DEVELOPMENT_COMPASS( encompasses every pillar and sub-pillar.
-
-
diff --git a/ui/scripts/prepare-data.js b/ui/scripts/prepare-data.js
index ddcda9cd0..bd336b7a6 100644
--- a/ui/scripts/prepare-data.js
+++ b/ui/scripts/prepare-data.js
@@ -121,8 +121,8 @@ async function main() {
const definition =
definitions.find(
(d) =>
- d["Pillar"] === pillar &&
- (!subpillar || d["Sub-Pillar"] === subpillar)
+ d["Pillar"].toLowerCase() === pillar.toLowerCase() &&
+ (!subpillar || d["Sub-Pillar"].toLowerCase() === subpillar.toLowerCase())
) || "";
const stageInfo = definition[stageName];
if (!stageInfo){
@@ -158,8 +158,8 @@ async function main() {
function getPillarRank(name, pillar) {
let match = scores.find((score) => {
return (
- score["Country Name"] === name &&
- score["Pillar"] === pillar &&
+ score["Country Name"].toLowerCase() === name.toLowerCase() &&
+ score["Pillar"].toLowerCase() === pillar.toLowerCase() &&
!score["Sub-Pillar"]
);
});
@@ -170,8 +170,8 @@ async function main() {
function getDigitalRightPillarRank(name, pillar) {
let match = digital_right_scores.find((score) => {
return (
- score["Country Name"] === name &&
- score["Pillar"] === pillar
+ score["Country Name"].toLowerCase() === name.toLowerCase() &&
+ score["Pillar"].toLowerCase() === pillar.toLowerCase()
);
});
@@ -181,9 +181,9 @@ async function main() {
function getSubpillarRank(name, pillar, subpillar) {
let match = scores.find((score) => {
return (
- score["Country Name"] === name &&
- score["Pillar"] === pillar &&
- score["Sub-Pillar"] === subpillar
+ score["Country Name"].toLowerCase() === name.toLowerCase() &&
+ score["Pillar"].toLowerCase() === pillar.toLowerCase() &&
+ score["Sub-Pillar"].toLowerCase() === subpillar.toLowerCase()
);
});
@@ -193,8 +193,8 @@ async function main() {
function getPillarScore(country, pillar) {
let match = scores.find((score) => {
return (
- score["Country Name"] === country &&
- score["Pillar"] === pillar &&
+ score["Country Name"].toLowerCase() === country.toLowerCase() &&
+ score["Pillar"] === pillar.toLowerCase() &&
!score["Sub-Pillar"]
);
});
@@ -205,8 +205,8 @@ async function main() {
function getDigitalRightPillarScore(country, pillar) {
let match = digital_right_scores.find((score) => {
return (
- score["Country Name"] === country &&
- score["Pillar"] === pillar
+ score["Country Name"].toLowerCase() === country.toLowerCase() &&
+ score["Pillar"].toLowerCase() === pillar.toLowerCase()
);
});
return match && match["new_rank_score"] ? match["new_rank_score"] : null;
@@ -215,7 +215,7 @@ async function main() {
function checkCountryIsAvailable(country) {
let match = digital_right_scores.find((score) => {
return (
- score["Country Name"] === country
+ score["Country Name"].toLowerCase() === country.toLowerCase()
);
});
return match ? true : false;
@@ -224,9 +224,9 @@ async function main() {
function getSubpillarScore(country, pillar, subpillar) {
let match = scores.find((score) => {
return (
- score["Country Name"] === country &&
- score["Pillar"] === pillar &&
- score["Sub-Pillar"] === subpillar &&
+ score["Country Name"].toLowerCase() === country.toLowerCase() &&
+ score["Pillar"].toLowerCase() === pillar.toLowerCase() &&
+ score["Sub-Pillar"].toLowerCase() === subpillar.toLowerCase() &&
// Probably unnecessary, but helps clarify where the score is coming from
!Boolean(score["Indicator"])
);
@@ -237,7 +237,7 @@ async function main() {
function getPillarConfidence(country, pillar) {
let match = scores.find((score) => {
- return score["Country Name"] === country && score["Pillar"] === pillar;
+ return score["Country Name"].toLowerCase() === country.toLowerCase() && score["Pillar"].toLowerCase() === pillar.toLowerCase();
});
return match ? match["data_availability"] : null;
@@ -246,7 +246,7 @@ async function main() {
function getSubpillarConfidence(country, subpillar) {
let match = scores.find((score) => {
return (
- score["Country Name"] === country && score["Sub-Pillar"] === subpillar
+ score["Country Name"].toLowerCase() === country.toLowerCase() && score["Sub-Pillar"].toLowerCase() === subpillar.toLowerCase()
);
});
@@ -255,7 +255,7 @@ async function main() {
function getDigitalRightPillarConfidence(country, pillar) {
let match = digital_right_scores.find((score) => {
- return score["Country Name"] === country && score["Pillar"] === pillar;
+ return score["Country Name"] === country.toLowerCase() && score["Pillar"] === pillar.toLowerCase();
});
return match ? match["data_availability"] : null;
@@ -264,7 +264,7 @@ async function main() {
function getOverallScore(country) {
let match = scores.find((score) => {
return (
- score["Country Name"] === country &&
+ score["Country Name"].toLowerCase() === country.toLowerCase() &&
!Boolean(score["Sub-Pillar"]) &&
!Boolean(score["Pillar"])
);
@@ -304,7 +304,7 @@ async function main() {
const getOverallConfidence = (country) => {
let match = scores.find((score) => {
return (
- score["Country Name"] === country &&
+ score["Country Name"].toLowerCase() === country.toLowerCase() &&
!Boolean(score["Sub-Pillar"]) &&
!Boolean(score["Pillar"])
);
@@ -404,7 +404,6 @@ async function main() {
},
};
});
-
const db = {
definitions,
boundingBoxes,
-
-
@@ -1282,15 +1283,15 @@ export default function DIGITAL_DEVELOPMENT_COMPASS(
onMouseLeave={() => setDownloadHovered(false)}
>
{isDownloadHovered ? (
- 