Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix/tm 1375 fixes dashboard learn more #649

Merged
merged 7 commits into from
Nov 11, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/components/extensive/BlurContainer/BlurContainer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@ const BlurContainer = ({ isBlur, textInformation, children, ...props }: BlurCont
return (
<div className="relative w-full text-black">
<div
className={`absolute left-0 top-0 flex h-full w-full items-center justify-center rounded-xl ${
isBlur ? "z-10 bg-[#9d9a9a29] backdrop-blur-sm" : ""
className={`absolute left-0 top-0 flex h-full w-full items-center justify-center rounded-xl ${
isBlur ? "z-[1] bg-[#9d9a9a29] backdrop-blur-sm" : ""
}`}
>
<When condition={isBlur && textInformation}>
Expand Down
1 change: 1 addition & 0 deletions src/components/extensive/PageElements/Card/PageCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,7 @@ const PageCard = ({
<When condition={!!tooltip}>
&nbsp;
<ToolTip
className="normal-case"
content={tooltip || ""}
width={widthTooltip || "w-44 lg:w-52"}
title={title}
Expand Down
212 changes: 0 additions & 212 deletions src/pages/dashboard/[id].page.tsx

This file was deleted.

13 changes: 12 additions & 1 deletion src/pages/dashboard/about-us/index.page.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import { useT } from "@transifex/react";
import { useEffect, useRef } from "react";

import Button from "@/components/elements/Button/Button";
import Text from "@/components/elements/Text/Text";
import Icon, { IconNames } from "@/components/extensive/Icon/Icon";

Expand All @@ -10,6 +12,8 @@ const Homepage = () => {
const second = useRef<HTMLDivElement>(null);
const third = useRef<HTMLDivElement>(null);

const t = useT();

useEffect(() => {
const elements = [first, second, third];

Expand Down Expand Up @@ -70,7 +74,7 @@ const Homepage = () => {
organizations that grow trees, their financial and government partners, and the wider public – can
access data and insights about projects that are tracked through&nbsp;
<a
href="https://www.terramatch.org/"
href="https://terramatchsupport.zendesk.com/hc/en-us/articles/21178354112539-The-TerraFund-Monitoring-Reporting-and-Verification-Framework"
target="_blank"
className="text-14-bold underline underline-offset-4"
rel="noreferrer"
Expand All @@ -95,6 +99,13 @@ const Homepage = () => {
Please note that the dashboard is pre-filtered upon page load to display only projects from the
TerraFund Landscapes programme. Each project reports 12 times over six years.
</Text>
<Button
variant="about-us"
className="mt-6"
onClick={() => (window.location.href = "/dashboard?programmes=terrafund-landscapes")}
>
{t("Access the Dashboards")}
</Button>
</div>
</div>
<div className="w-2/5 pr-5">
Expand Down
4 changes: 1 addition & 3 deletions src/pages/dashboard/components/ContentOverview.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ import { DashboardGetProjectsData } from "@/generated/apiSchemas";
import { HectaresUnderRestorationData } from "@/utils/dashboardUtils";

import {
HECTARES_UNDER_RESTORATION_SECTION_TOOLTIP,
MAP_TOOLTIP,
RESTORATION_STRATEGIES_REPRESENTED_TOOLTIP,
TARGET_LAND_USE_TYPES_REPRESENTED_TOOLTIP,
Expand Down Expand Up @@ -233,9 +232,8 @@ const ContentOverview = (props: ContentOverviewProps<RowData>) => {
gap={8}
isUserAllowed={isUserAllowed}
subtitleMore={true}
title={t("Hectares Under Restoration")}
title={t("HECTARES UNDER RESTORATION")}
variantSubTitle="text-14-light"
tooltip={t(HECTARES_UNDER_RESTORATION_SECTION_TOOLTIP)}
iconClassName="h-3.5 w-3.5 text-darkCustom lg:h-5 lg:w-5"
subtitle={t(
`The numbers and reports below display data related to Indicator 2: Hectares Under Restoration described in <span class="underline">TerraFund’s MRV framework</span>. Please refer to the linked MRV framework for details on how these numbers are sourced and verified.`
Expand Down
27 changes: 26 additions & 1 deletion src/pages/dashboard/components/ObjectiveSec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,32 @@ import { When } from "react-if";

import Text from "@/components/elements/Text/Text";

import { DashboardDataProps } from "../project/index.page";
export interface DashboardTableDataProps {
label: string;
valueText: string;
value: number;
}

export interface GraphicLegendProps {
label: string;
value: string;
color: string;
}
export interface DashboardDataProps {
value?: number;
unit?: string;
secondValue?: string;
graphic?: string;
tableData?: DashboardTableDataProps[];
maxValue?: number;
totalSection?: { numberOfSites: number; totalHectaresRestored: number };
graphicLegend?: GraphicLegendProps[];
graphicTargetLandUseTypes?: DashboardTableDataProps[];
objetiveText?: string;
preferredLanguage?: string;
landTenure?: string;
totalValue?: number;
}

const ObjectiveSec = ({ data }: { data: DashboardDataProps }) => {
const t = useT();
Expand Down
4 changes: 2 additions & 2 deletions src/pages/dashboard/components/SecDashboard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,9 @@ import GroupedBarChart from "../charts/GroupedBarChart";
import HorizontalStackedBarChart from "../charts/HorizontalStackedBarChart";
import MultiLineChart from "../charts/MultiLineChart";
import SimpleBarChart from "../charts/SimpleBarChart";
import { DashboardDataProps } from "../project/index.page";
import GraphicDashboard from "./GraphicDashboard";
import GraphicIconDashboard from "./GraphicIconDashboard";
import { DashboardDataProps } from "./ObjectiveSec";
import ObjectiveSec from "./ObjectiveSec";
import ValueNumberDashboard from "./ValueNumberDashboard";

Expand Down Expand Up @@ -262,7 +262,7 @@ const SecDashboard = ({
/>
<Text
variant="text-14"
className="mt-1 cursor-pointer pt-2 pl-4 text-primary underline"
className="mt-1 cursor-pointer pl-4 pt-2 text-primary underline"
onClick={handleViewAllClick}
>
{t("VIEW ALL PROJECTS")}
Expand Down
11 changes: 2 additions & 9 deletions src/pages/dashboard/index.page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,15 +36,10 @@ import {
NUMBER_OF_TREES_PLANTED_BY_YEAR_TOOLTIP,
TOP_5_PROJECTS_WITH_MOST_PLANTED_TREES_TOOLTIP,
TOTAL_VOLUNTEERS_TOOLTIP,
TREES_RESTORED_SECTION_TOOLTIP,
VOLUNTEERS_CREATED_BY_AGE_TOOLTIP,
VOLUNTEERS_CREATED_BY_GENDER_TOOLTIP
} from "./constants/tooltips";
import {
JOBS_CREATED_SECTION_TOOLTIP,
NO_DATA_PRESENT_ACTIVE_PROJECT_TOOLTIPS,
NUMBER_OF_TREES_PLANTED_TOOLTIP
} from "./constants/tooltips";
import { NO_DATA_PRESENT_ACTIVE_PROJECT_TOOLTIPS, NUMBER_OF_TREES_PLANTED_TOOLTIP } from "./constants/tooltips";
import { useDashboardData } from "./hooks/useDashboardData";
import { LABEL_LEGEND } from "./mockedData/dashboard";

Expand Down Expand Up @@ -352,8 +347,7 @@ const Dashboard = () => {
gap={8}
subtitleMore={true}
isUserAllowed={isUserAllowed?.allowed}
title={t("Trees Restored")}
tooltip={t(TREES_RESTORED_SECTION_TOOLTIP)}
title={t("TREES RESTORED")}
widthTooltip="w-52 lg:w-64"
iconClassName="h-3.5 w-3.5 text-darkCustom lg:h-5 lg:w-5"
variantSubTitle="text-14-light"
Expand Down Expand Up @@ -403,7 +397,6 @@ const Dashboard = () => {
tooltipTrigger="click"
widthTooltip="w-80 lg:w-96"
iconClassName="h-3.5 w-3.5 text-darkCustom lg:h-5 lg:w-5"
tooltip={t(JOBS_CREATED_SECTION_TOOLTIP)}
subtitle={t(
`The numbers and reports below display data related to Indicator 3: Jobs Created described in <span class="underline">TerraFund's MRV framework</span>. TerraFund defines a job as a set of tasks and duties performed by one person aged 18 or over in exchange for monetary pay in line with living wage standards. All indicators in the Jobs Created category are disaggregated by number of women, number of men, and number of youths. Restoration Champions are required to report on jobs and volunteers every 6 months and provide additional documentation to verify employment. Please refer to the linked MRV framework for additional details on how these numbers are sourced and verified.`
)}
Expand Down
Loading