diff --git a/src/Routers.tsx b/src/Routers.tsx index 30a30e1e09..a786b1fa60 100644 --- a/src/Routers.tsx +++ b/src/Routers.tsx @@ -57,8 +57,8 @@ import ConstitutionalCommitteeDetail from "./pages/ConstitutionalCommitteeDetail import Overview from "./pages/Overview"; import NetworkMonitoring from "./pages/NetworkMonitoring"; import GovernanceActionDetails from "./pages/GovernanceActionDetails"; -import BolnisiLanding from "./pages/BolnisiLanding"; -import Micar from "./pages/Micar"; +import TraceabilityProgramLanding from "./pages/TraceabilityProgramLanding"; +import Sustainability from "./pages/Sustainability"; const StakeAddressRegistration = () => ; const StakeAddressDeregistration = () => ; @@ -130,8 +130,8 @@ const Routes: React.FC = () => { - - + + diff --git a/src/commons/menus.ts b/src/commons/menus.ts index b4f093f6b6..6293572c88 100644 --- a/src/commons/menus.ts +++ b/src/commons/menus.ts @@ -3,11 +3,11 @@ import { IconType } from "react-icons/lib"; import { BlockChainMenuIcon, - BolnisiDashboard, + TraceabilityProgramDashboard, BrowseIcon, DashboardIcon, GovernanceHome, - MicarIcon, + SustainabilityIcon, NetworkMonitoringIcon, OperationalIcon, ProtocolIcon, @@ -136,16 +136,16 @@ export const menus: Menu[] = [ href: routers.NETWORK_MONITORING }, { - title: "Bolnisi", + title: "Traceability Program", key: "glossary.traceability", - icon: BolnisiDashboard, - href: routers.BOLNISI_LANDING + icon: TraceabilityProgramDashboard, + href: routers.TRACEABILITYPROGRAM_LANDING }, { - title: "Micar", - key: "glossary.micar", - icon: MicarIcon, - href: routers.MICAR + title: "Sustainability Indicators", + key: "glossary.sustainabilityindicators", + icon: SustainabilityIcon, + href: routers.SUSTAINABILITY } ]; diff --git a/src/commons/resources/icons/micar.svg b/src/commons/resources/icons/sustainability.svg similarity index 100% rename from src/commons/resources/icons/micar.svg rename to src/commons/resources/icons/sustainability.svg diff --git a/src/commons/resources/icons/bolnisi-dashboard.svg b/src/commons/resources/icons/traceability-dashboard.svg similarity index 100% rename from src/commons/resources/icons/bolnisi-dashboard.svg rename to src/commons/resources/icons/traceability-dashboard.svg diff --git a/src/commons/resources/icons/bolnisi-dropdown.svg b/src/commons/resources/icons/traceability-dropdown.svg similarity index 100% rename from src/commons/resources/icons/bolnisi-dropdown.svg rename to src/commons/resources/icons/traceability-dropdown.svg diff --git a/src/commons/resources/icons/bolsiniAddress.svg b/src/commons/resources/icons/traceabilityAddress.svg similarity index 100% rename from src/commons/resources/icons/bolsiniAddress.svg rename to src/commons/resources/icons/traceabilityAddress.svg diff --git a/src/commons/resources/icons/bolsiniImageDefault.png b/src/commons/resources/icons/traceabilityImageDefault.png similarity index 100% rename from src/commons/resources/icons/bolsiniImageDefault.png rename to src/commons/resources/icons/traceabilityImageDefault.png diff --git a/src/commons/resources/index.ts b/src/commons/resources/index.ts index 24bd3cf140..245d41919d 100644 --- a/src/commons/resources/index.ts +++ b/src/commons/resources/index.ts @@ -62,7 +62,7 @@ import CommunityIconLight from "./icons/community-icon-light.svg"; import CommunityIconDark from "./icons/community-icon-dark.svg"; import FetchDataErrDark from "./icons/fetch-data-err-dark.svg"; import StakingLifecycleIcon from "./icons/menus/stakingLifecycle.svg"; -import BolnisiDashboard from "./icons/bolnisi-dashboard.svg"; +import TraceabilityProgramDashboard from "./icons/traceability-dashboard.svg"; import NetworkMonitoringIcon from "./icons/menus/networkMonitoring.svg"; import ProtocolIcon from "./icons/menus/Protocol.svg"; import PolygonWhiteIconUrl from "./icons/polygon-white.svg"; @@ -280,8 +280,8 @@ import CCDetailVotingParticipation from "./icons/CCVotingParticipation.svg?react import CCDetailLifetimeVotes from "./icons/CCDetailLifetimeVotes.svg?react"; import CCStatusHistory from "./icons/CCStatusHistory.svg?react"; import CCDetailRegistrationInformation from "./icons/CCDetailRegistrationInformation.svg?react"; -import MicarIcon from "./icons/micar.svg"; -import SearchMicarIcon from "./icons/search-icon.svg?react"; +import SustainabilityIcon from "./icons/sustainability.svg"; +import SearchSustainabilityIcon from "./icons/search-icon.svg?react"; // eslint-disable-next-line import/order import TotalOutput from "./icons/totalOutput.svg?react"; @@ -432,7 +432,7 @@ export { DeregistrationLightIcon, RegistrationDarkIcon, RegistrationLightIcon, - BolnisiDashboard, + TraceabilityProgramDashboard, // React component ExchangeIcon, PolygonDarkIcon, @@ -565,8 +565,8 @@ export { GovernanceIcon, PoolVotingIcon, ParticipationIcon, - MicarIcon, - SearchMicarIcon + SustainabilityIcon, + SearchSustainabilityIcon }; import AIcon from "./icons/AIcon.svg?react"; @@ -752,7 +752,7 @@ import NativeStatus from "./icons/NativeStatus.svg?react"; import NativeTimelock from "./icons/NativeTimelock.svg?react"; import NativeType from "./icons/NativeType.svg?react"; import NativeOneMint from "./icons/NativeOneMint.svg?react"; -import BolsiniAddress from "./icons/bolsiniAddress.svg?react"; +import TraceabilityAddress from "./icons/traceabilityAddress.svg?react"; import DrawerClose from "./icons/drawerClose.svg?react"; import CCCurentState from "./icons/CCCurentState.svg?react"; import CCProposalPolicy from "./icons/CCProposalPolicy.svg?react"; @@ -764,7 +764,7 @@ import CCLastChange from "./icons/CCLastChange.svg?react"; import CClistMembers from "./icons/CClistMembers.svg?react"; import CCGorvernanceVote from "./icons/CCGorvernanceVote.svg?react"; import CCHistoryStatus from "./icons/CCHistoryStatus.svg?react"; -import BolnisiDropdown from "./icons/bolnisi-dropdown.svg?react"; +import TraceabilityProgramDropdown from "./icons/traceability-dropdown.svg?react"; import Lighning from "./icons/Lighning.svg?react"; import LighningWhite from "./icons/lighning-white.svg?react"; import Earch from "./icons/Earch.svg?react"; @@ -961,7 +961,7 @@ export { NativeTimelock, NativeType, NativeOneMint, - BolsiniAddress, + TraceabilityAddress, DrawerClose, CCCurentState, CCProposalPolicy, @@ -985,23 +985,23 @@ export { ClockWhite }; -// Bolnisi Landing +// TraceabilityProgram Landing -import bolnisiHeaderBackgroundDark from "./bolnisiLanding/background-header-dark.png"; -import bolnisiHeaderBackgroundLight from "./bolnisiLanding/background-header-light.png"; -import bolnisiHeaderLaptop from "./bolnisiLanding/header-laptop.png"; -import bolnisiHeaderMobile from "./bolnisiLanding/header-mobile.png"; -import bolnisiHeaderTablet from "./bolnisiLanding/header-tablet.png"; -import bodyBackground from "./bolnisiLanding/body-background.png"; -import bolnisiProgress from "./bolnisiLanding/bolnisi-progress.png"; +import traceabilityprogramHeaderBackgroundDark from "./traceabilityLanding/background-header-dark.png"; +import traceabilityprogramHeaderBackgroundLight from "./traceabilityLanding/background-header-light.png"; +import traceabilityprogramHeaderLaptop from "./traceabilityLanding/header-laptop.png"; +import traceabilityprogramHeaderMobile from "./traceabilityLanding/header-mobile.png"; +import traceabilityprogramHeaderTablet from "./traceabilityLanding/header-tablet.png"; +import bodyBackground from "./traceabilityLanding/body-background.png"; +import traceabilityprogramProgress from "./traceabilityLanding/traceability-progress.png"; export { - bolnisiHeaderBackgroundDark, - bolnisiHeaderBackgroundLight, - bolnisiHeaderLaptop, - bolnisiHeaderMobile, - bolnisiHeaderTablet, + traceabilityprogramHeaderBackgroundDark, + traceabilityprogramHeaderBackgroundLight, + traceabilityprogramHeaderLaptop, + traceabilityprogramHeaderMobile, + traceabilityprogramHeaderTablet, bodyBackground, - bolnisiProgress, - BolnisiDropdown + traceabilityprogramProgress, + TraceabilityProgramDropdown }; diff --git a/src/commons/resources/bolnisiLanding/background-header-dark.png b/src/commons/resources/traceabilityLanding/background-header-dark.png similarity index 100% rename from src/commons/resources/bolnisiLanding/background-header-dark.png rename to src/commons/resources/traceabilityLanding/background-header-dark.png diff --git a/src/commons/resources/bolnisiLanding/background-header-light.png b/src/commons/resources/traceabilityLanding/background-header-light.png similarity index 100% rename from src/commons/resources/bolnisiLanding/background-header-light.png rename to src/commons/resources/traceabilityLanding/background-header-light.png diff --git a/src/commons/resources/bolnisiLanding/body-background.png b/src/commons/resources/traceabilityLanding/body-background.png similarity index 100% rename from src/commons/resources/bolnisiLanding/body-background.png rename to src/commons/resources/traceabilityLanding/body-background.png diff --git a/src/commons/resources/bolnisiLanding/header-laptop.png b/src/commons/resources/traceabilityLanding/header-laptop.png similarity index 100% rename from src/commons/resources/bolnisiLanding/header-laptop.png rename to src/commons/resources/traceabilityLanding/header-laptop.png diff --git a/src/commons/resources/bolnisiLanding/header-mobile.png b/src/commons/resources/traceabilityLanding/header-mobile.png similarity index 100% rename from src/commons/resources/bolnisiLanding/header-mobile.png rename to src/commons/resources/traceabilityLanding/header-mobile.png diff --git a/src/commons/resources/bolnisiLanding/header-tablet.png b/src/commons/resources/traceabilityLanding/header-tablet.png similarity index 100% rename from src/commons/resources/bolnisiLanding/header-tablet.png rename to src/commons/resources/traceabilityLanding/header-tablet.png diff --git a/src/commons/resources/bolnisiLanding/bolnisi-dropdown.svg b/src/commons/resources/traceabilityLanding/traceability-dropdown.svg similarity index 100% rename from src/commons/resources/bolnisiLanding/bolnisi-dropdown.svg rename to src/commons/resources/traceabilityLanding/traceability-dropdown.svg diff --git a/src/commons/resources/bolnisiLanding/bolnisi-progress.png b/src/commons/resources/traceabilityLanding/traceability-progress.png similarity index 100% rename from src/commons/resources/bolnisiLanding/bolnisi-progress.png rename to src/commons/resources/traceabilityLanding/traceability-progress.png diff --git a/src/commons/routers.ts b/src/commons/routers.ts index b965ecb3b8..045b12bbee 100644 --- a/src/commons/routers.ts +++ b/src/commons/routers.ts @@ -55,8 +55,8 @@ export const routers = { TERMS_OF_SERVICE: "/terms-of-service", SMARTCONTRACT_DETAIL: "/smartcontract/:id", DREP_DETAILS: "/drep/:drepId", - BOLNISI_LANDING: "/bolnisi", - MICAR: "/micar", + TRACEABILITYPROGRAM_LANDING: "/traceability-program", + SUSTAINABILITY: "/sustainability-indicators", NOT_FOUND: "/*" } as const; diff --git a/src/commons/utils/api.ts b/src/commons/utils/api.ts index e0c50d03d8..1ffceff442 100644 --- a/src/commons/utils/api.ts +++ b/src/commons/utils/api.ts @@ -184,12 +184,12 @@ export const API = { EMISSIONS: { GRAPH: "txs/graph" }, - MICAR: { + SUSTAINABILITY: { CARBON_EMISSION: "MiCAR/carbon-emission", INDICATOR: "/MiCAR/carbon-emission/overview", HISTORYCAL: "/MiCAR/carbon-emission/historical" }, - BOLNISI: { + TRACEABILITYPROGRAM: { OVERVIEW: "bolnisi/overview" } }; diff --git a/src/commons/utils/constants.ts b/src/commons/utils/constants.ts index 8e522e9916..8ba6a0af4c 100644 --- a/src/commons/utils/constants.ts +++ b/src/commons/utils/constants.ts @@ -132,7 +132,8 @@ export const CARDANO_NEWS_URL = process.env.REACT_APP_CARDANO_NEWS_URL || get(wi export const APP_VERSION = process.env.REACT_APP_VERSION || get(window, "env.REACT_APP_VERSION"); export const EXT_ADA_PRICE_URL = process.env.REACT_APP_EXT_ADA_PRICE_URL || get(window, "env.REACT_APP_EXT_ADA_PRICE_URL"); -export const BOLNISI_NAME_API = process.env.REACT_APP_BOLNISI_NAME_API || get(window, "env.REACT_APP_BOLNISI_NAME_API"); +export const TRACEABILITYPROGRAM_NAME_API = + process.env.REACT_APP_BOLNISI_NAME_API || get(window, "env.REACT_APP_BOLNISI_NAME_API"); export const API_GECKO = process.env.REACT_APP_API_URL_COIN_GECKO || get(window, "env.REACT_APP_API_URL_COIN_GECKO"); export const FF_GLOBAL_IS_CONWAY_ERA = (process.env.REACT_APP_FF_GLOBAL_IS_CONWAY_ERA || get(window, "env.REACT_APP_FF_GLOBAL_IS_CONWAY_ERA")) === "true"; @@ -333,6 +334,6 @@ export enum VOTE_TYPE_GOV_ACTIONS { STAKING_POOL_KEY_HASH = "STAKING_POOL_KEY_HASH" } -export const BOLNISI_LANDING_READ_CASE_STUDY = "https://cardanofoundation.org/case-studies/bolnisi"; -export const BOLNISI_LANDING_OIV = "https://www.oiv.int/"; -export const BOLNISI_LANDING_NWA = "https://wine.gov.ge/En/"; +export const TRACEABILITYPROGRAM_LANDING_READ_CASE_STUDY = "https://cardanofoundation.org/case-studies/bolnisi"; +export const TRACEABILITYPROGRAM_LANDING_OIV = "https://www.oiv.int/"; +export const TRACEABILITYPROGRAM_LANDING_NWA = "https://wine.gov.ge/En/"; diff --git a/src/components/AddressDetail/AddressAnalytics/index.tsx b/src/components/AddressDetail/AddressAnalytics/index.tsx index 88c264c383..e38cbe43bd 100644 --- a/src/components/AddressDetail/AddressAnalytics/index.tsx +++ b/src/components/AddressDetail/AddressAnalytics/index.tsx @@ -74,9 +74,20 @@ const AddressAnalytics: React.FC<{ address?: string }> = ({ address }) => { false, blockKey ); + const calculatedHighestAndLowest = useMemo(() => { + if (!data?.data?.length) return { highest: 0, lowest: 0 }; - const maxBalance = BigNumber(data?.highestBalance || 0).toString(); - const minBalance = BigNumber(data?.lowestBalance || 0).toString(); + return data.data.reduce( + (acc, curr) => ({ + highest: Math.max(acc.highest, curr.value), + lowest: Math.min(acc.lowest, curr.value) + }), + { highest: data.data[0].value, lowest: data.data[0].value } + ); + }, [data?.data]); + + const maxBalance = BigNumber(calculatedHighestAndLowest.highest || 0).toString(); + const minBalance = BigNumber(calculatedHighestAndLowest.lowest || 0).toString(); const highest = Number(maxBalance); const lowest = Number(minBalance); @@ -91,28 +102,33 @@ const AddressAnalytics: React.FC<{ address?: string }> = ({ address }) => { })) || []; const customTicks = useMemo(() => { - // Default ticks by recharts - const ticks = getNiceTickValues([0, Math.max(Number(maxBalance), highest)], 5); + const values = data?.data?.map((item) => item.value) || [0]; - // With 14 is font-size (tick label height), 400 is chart height - const labelHeight = 14 / 400; + const minValue = Math.min(...values); + const maxValue = Math.max(...values); - const tickMax = ticks[ticks.length - 1] || 1; + const tickMin = Math.min(0, minValue); + const tickMax = Math.max(maxValue * 1.2, Math.abs(minValue) * 1.2, 0); - // If tick near lowest and highest ( tick / tickMax < labelHeight), hidden it. - const needShowTicks = ticks.filter( - (tick) => - BigNumber(tick).minus(lowest).div(tickMax).abs().gt(labelHeight) && - BigNumber(tick).minus(highest).div(tickMax).abs().gt(labelHeight) - ); - // Ticks add highest - needShowTicks.push(highest); + const ticks = getNiceTickValues([tickMin, tickMax], 5); + const tickMaxValue = Math.max(...ticks.map(Math.abs)); + + const threshold = tickMaxValue * 0.1; + + const filteredTicks = ticks.filter((tick) => { + if (tick === ticks[0] || tick === ticks[ticks.length - 1]) return true; + const distanceToHighest = Math.abs(tick - highest); + const distanceToLowest = Math.abs(tick - lowest); + return distanceToHighest > threshold && distanceToLowest > threshold; + }); - // If lowest equal highest, add it. - if (BigNumber(highest).minus(lowest).div(tickMax).abs().gt(0)) needShowTicks.push(lowest); + filteredTicks.push(highest); + if (BigNumber(highest).minus(lowest).div(tickMaxValue).abs().gt(0)) { + filteredTicks.push(lowest); + } - return needShowTicks.sort((a, b) => a - b); - }, [maxBalance, highest, lowest]); + return [...new Set(filteredTicks)].sort((a, b) => a - b); + }, [data?.data, highest, lowest]); const lowestIndex = customTicks.indexOf(lowest) + 1; const highestIndex = customTicks.indexOf(highest) + 1; @@ -144,6 +160,35 @@ const AddressAnalytics: React.FC<{ address?: string }> = ({ address }) => { ); }; + const getTickOffset = (value: number) => { + if (!customTicks.includes(value)) { + return 0; + } + + const maxAbsValue = Math.max(...customTicks.map(Math.abs)); + const isNearlyEqual = Math.abs(highest - lowest) / maxAbsValue < 0.05; + + if (value === highest) { + if (Math.abs(value) / maxAbsValue > 0.95) { + return -45; + } + if (isNearlyEqual) { + return -20; + } + return -10; + } + + if (value === lowest) { + if (isNearlyEqual) { + return 20; + } + if (Math.abs(highest - lowest) / maxAbsValue < 0.1) { + return 10; + } + } + return 0; + }; + return ( {t("analytics")}}> @@ -176,7 +221,7 @@ const AddressAnalytics: React.FC<{ address?: string }> = ({ address }) => { width={900} height={400} data={convertDataChart} - margin={{ top: 5, right: 5, bottom: 14 }} + margin={{ top: 10, right: 10, bottom: 14, left: 15 }} > {/* Defs for ticks filter background color */} {["lowest", "highest"].map((item) => { @@ -202,9 +247,7 @@ const AddressAnalytics: React.FC<{ address?: string }> = ({ address }) => { tick={{ fill: theme.mode === "light" ? theme.palette.secondary.light : theme.palette.secondary[800] }} - tickLine={{ - stroke: theme.mode === "light" ? theme.palette.secondary.light : theme.palette.secondary[800] - }} + tickLine={false} tickMargin={5} color={theme.palette.secondary.light} stroke={theme.palette.secondary.light} @@ -219,15 +262,27 @@ const AddressAnalytics: React.FC<{ address?: string }> = ({ address }) => { ( + + + {formatPriceValue(payload.value)} + + + )} tickLine={{ stroke: theme.mode === "light" ? theme.palette.secondary.light : theme.palette.secondary[800] }} color={theme.palette.secondary.light} interval={0} ticks={customTicks} + padding={{ top: 10, bottom: 10 }} + width={80} /> diff --git a/src/components/StakeDetail/StakeAnalytics/index.tsx b/src/components/StakeDetail/StakeAnalytics/index.tsx index fbc9b2ad91..5db5f1e289 100644 --- a/src/components/StakeDetail/StakeAnalytics/index.tsx +++ b/src/components/StakeDetail/StakeAnalytics/index.tsx @@ -16,8 +16,8 @@ import { Label, Line } from "recharts"; -import { getNiceTickValues } from "recharts-scale"; import { useSelector } from "react-redux"; +import { getNiceTickValues } from "recharts-scale"; import useFetch from "src/commons/hooks/useFetch"; import { HighestIconComponent, LowestIconComponent } from "src/commons/resources"; @@ -75,18 +75,22 @@ const StakeAnalytics: React.FC<{ stakeAddress?: string }> = ({ stakeAddress }) = { value: OPTIONS_CHART_ANALYTICS.THREE_MONTH, label: t("time.3m") } ]; - const maxBalance = BigNumber(data?.highestBalance || 0).toString(); - const minBalance = BigNumber(data?.lowestBalance || 0).toString(); + const maxBalance = useMemo(() => { + const values = data?.data?.map((item) => BigNumber(item.value || 0)) || []; + return values.length > 0 ? BigNumber.max(...values).toString() : "0"; + }, [data?.data]); - const rewards = dataReward?.map?.((item) => item.value || 0) || []; - const maxReward = rewards.length > 0 ? BigNumber.max(0, ...rewards).toString() : null; - const minReward = rewards.length > 0 ? BigNumber.min(maxReward || 0, ...rewards).toString() : null; + const minBalance = useMemo(() => { + const values = data?.data?.map((item) => BigNumber(item.value || 0)) || []; + return values.length > 0 ? BigNumber.min(...values).toString() : "0"; + }, [data?.data]); - const highest = Number(tab === "BALANCE" ? data?.highestBalance : maxReward) || 0; - const lowest = Number(tab === "BALANCE" ? data?.lowestBalance : minReward) || 0; - const isEqualLine = highest === lowest; + const maxReward = Math.max(...(dataReward || []).map((r) => r.value || 0)); + const minReward = Math.min(...(dataReward || []).map((r) => r.value || 0)); - const maxValue = Math.max(Number(tab === "BALANCE" ? maxBalance : maxReward), highest); + const highest = Number(tab === "BALANCE" ? maxBalance : maxReward) || 0; + const lowest = Number(tab === "BALANCE" ? minBalance : minReward) || 0; + const isEqualLine = highest === lowest; const convertDataChart: AnalyticsBalanceExpanded[] = (data?.data || []).map?.((item) => ({ value: item.value || 0, @@ -101,30 +105,35 @@ const StakeAnalytics: React.FC<{ stakeAddress?: string }> = ({ stakeAddress }) = highest, lowest })); - const customTicks = useMemo(() => { - // Default ticks by recharts - const ticks = getNiceTickValues([0, maxValue], 5); + const values = + tab === "BALANCE" ? data?.data?.map((item) => item.value) || [0] : dataReward?.map((item) => item.value) || [0]; - // With 14 is font-size (tick label height), 400 is chart height - const labelHeight = 14 / 400; + const minValue = Math.min(...values); + const maxValue = Math.max(...values); - const tickMax = ticks[ticks.length - 1] || 1; + const tickMin = Math.min(0, minValue); + const tickMax = Math.max(maxValue * 1.2, Math.abs(minValue) * 1.2, 0); - // If tick near lowest and highest ( tick / tickMax < labelHeight), hidden it. - const needShowTicks = ticks.filter( - (tick) => - BigNumber(tick).minus(lowest).div(tickMax).abs().gt(labelHeight) && - BigNumber(tick).minus(highest).div(tickMax).abs().gt(labelHeight) - ); - // Ticks add highest - needShowTicks.push(highest); + const ticks = getNiceTickValues([tickMin, tickMax], 5); + const tickMaxValue = Math.max(...ticks.map(Math.abs)); - // If lowest equal highest, add it. - if (BigNumber(highest).minus(lowest).div(tickMax).abs().gt(0)) needShowTicks.push(lowest); + const threshold = tickMaxValue * 0.1; - return needShowTicks.sort((a, b) => a - b); - }, [maxValue, highest, lowest]); + const filteredTicks = ticks.filter((tick) => { + if (tick === ticks[0] || tick === ticks[ticks.length - 1]) return true; + const distanceToHighest = Math.abs(tick - highest); + const distanceToLowest = Math.abs(tick - lowest); + return distanceToHighest > threshold && distanceToLowest > threshold; + }); + + filteredTicks.push(highest); + if (BigNumber(highest).minus(lowest).div(tickMaxValue).abs().gt(0)) { + filteredTicks.push(lowest); + } + + return [...new Set(filteredTicks)].sort((a, b) => a - b); + }, [data?.data, dataReward, tab, highest, lowest]); const lowestIndex = customTicks.indexOf(lowest) + 1; const highestIndex = customTicks.indexOf(highest) + 1; @@ -158,6 +167,35 @@ const StakeAnalytics: React.FC<{ stakeAddress?: string }> = ({ stakeAddress }) = ); }; + const getTickOffset = (value: number) => { + if (!customTicks.includes(value)) { + return 0; + } + + const maxAbsValue = Math.max(...customTicks.map(Math.abs)); + const isNearlyEqual = Math.abs(highest - lowest) / maxAbsValue < 0.05; + + if (value === highest) { + if (Math.abs(value) / maxAbsValue > 0.95) { + return -45; + } + if (isNearlyEqual) { + return -20; + } + return -10; + } + + if (value === lowest) { + if (isNearlyEqual) { + return 20; + } + if (Math.abs(highest - lowest) / maxAbsValue < 0.1) { + return 10; + } + } + return 0; + }; + const xAxisProps: XAxisProps = tab === "BALANCE" ? { tickMargin: 5, dx: -15 } : { tickMargin: 5 }; const renderData = () => { @@ -186,7 +224,7 @@ const StakeAnalytics: React.FC<{ stakeAddress?: string }> = ({ stakeAddress }) = width={900} height={400} data={tab === "BALANCE" ? convertDataChart : convertRewardChart} - margin={{ top: 5, right: 10, bottom: 14 }} + margin={{ top: 10, right: 10, bottom: 14, left: 15 }} > {/* Defs for ticks filter background color */} {["lowest", "highest"].map((item) => { @@ -226,12 +264,28 @@ const StakeAnalytics: React.FC<{ stakeAddress?: string }> = ({ stakeAddress }) = )} ( + + + {formatPriceValue(payload.value)} + + + )} + tickLine={{ + stroke: theme.mode === "light" ? theme.palette.secondary.light : theme.palette.secondary[800] + }} + color={theme.palette.secondary.light} interval={0} ticks={customTicks} + padding={{ top: 10, bottom: 10 }} + width={80} /> diff --git a/src/components/SystemLoader/index.tsx b/src/components/SystemLoader/index.tsx index 2b732162e1..0797717cb2 100644 --- a/src/components/SystemLoader/index.tsx +++ b/src/components/SystemLoader/index.tsx @@ -7,7 +7,7 @@ import useFetch from "src/commons/hooks/useFetch"; import { API, USER_API } from "src/commons/utils/api"; import { API_GECKO, - BOLNISI_NAME_API, + TRACEABILITYPROGRAM_NAME_API, EVENT_TYPES, MAX_SLOT_EPOCH, NETWORK, @@ -53,10 +53,10 @@ export const SystemLoader = () => { }, [usdData]); const fetchWineName = () => { - if (BOLNISI_NAME_API) { + if (TRACEABILITYPROGRAM_NAME_API) { setWineryNameLoading(true); axios - .get(BOLNISI_NAME_API) + .get(TRACEABILITYPROGRAM_NAME_API) .then((response) => response.data) .then((data) => setWineryName(data)) .finally(() => setWineryNameLoading(false)); diff --git a/src/components/TokenDetail/TokenTableData/TokenTransaction.tsx b/src/components/TokenDetail/TokenTableData/TokenTransaction.tsx index 91700d13c1..ecfe4e9e28 100644 --- a/src/components/TokenDetail/TokenTableData/TokenTransaction.tsx +++ b/src/components/TokenDetail/TokenTableData/TokenTransaction.tsx @@ -47,6 +47,7 @@ const TokenTransaction: React.FC = ({ tabActive, tokenId }) = } history.push(details.transaction(r.hash)); }; + const columns: Column[] = [ { title: t("glossary.txhash"), diff --git a/src/components/TransactionDetail/TransactionMetadata/Metadata/BolnisiWineDrawer.tsx b/src/components/TransactionDetail/TransactionMetadata/Metadata/TraceabilityProgramWineDrawer.tsx similarity index 94% rename from src/components/TransactionDetail/TransactionMetadata/Metadata/BolnisiWineDrawer.tsx rename to src/components/TransactionDetail/TransactionMetadata/Metadata/TraceabilityProgramWineDrawer.tsx index 655a7c191f..6be5d75aa8 100644 --- a/src/components/TransactionDetail/TransactionMetadata/Metadata/BolnisiWineDrawer.tsx +++ b/src/components/TransactionDetail/TransactionMetadata/Metadata/TraceabilityProgramWineDrawer.tsx @@ -5,7 +5,7 @@ import { IoMdClose } from "react-icons/io"; import { useSelector } from "react-redux"; import { t } from "i18next"; -import { BolsiniAddress, InvalidIcon, SeeMoreIconHome, VerifiedIcon } from "src/commons/resources"; +import { TraceabilityAddress, InvalidIcon, SeeMoreIconHome, VerifiedIcon } from "src/commons/resources"; import { details } from "src/commons/routers"; import useFetch from "src/commons/hooks/useFetch"; import { API } from "src/commons/utils/api"; @@ -22,12 +22,12 @@ import { BadgeContainerVerify } from "./styles"; import { VerifyBadge } from "."; -const BolnisiWineDrawer = () => { +const TraceabilityProgramWineDrawer = () => { const theme = useTheme(); const history = useHistory(); const { wineryId, trxHash } = useParams<{ wineryId: string; trxHash: string }>(); const [openDrawer, setOpenDrawer] = useState(false); - const [selectedWine, setSelectedWine] = useState(null); + const [selectedWine, setSelectedWine] = useState(null); const { hash } = useLocation(); const { data, loading } = useFetch( wineryId && trxHash ? API.TRANSACTION.WINERY_DETAIL(trxHash, wineryId) : "" @@ -142,7 +142,7 @@ const BolnisiWineDrawer = () => { {getWineName(wineryId)} - + {getWineAddress(wineryId)} @@ -185,9 +185,9 @@ const BolnisiWineDrawer = () => { - {t("bolnisi.verifyErrorTooltip")} + {t("traceabilityprogram.verifyErrorTooltip")}
- {t("bolnisi.verifyErrorTooltipTryAgain")} + {t("traceabilityprogram.verifyErrorTooltipTryAgain")} } > @@ -203,7 +203,7 @@ const BolnisiWineDrawer = () => { > - {t("bolnisi.verifyError")} + {t("traceabilityprogram.verifyError")} )} @@ -241,7 +241,7 @@ const BolnisiWineDrawer = () => { ); }; -export default BolnisiWineDrawer; +export default TraceabilityProgramWineDrawer; const CloseButton = styled(IconButton)(({ theme }) => ({ position: "absolute", @@ -298,7 +298,7 @@ const StyledLink = styled(Box)` interface WineDetailModalProps { open: boolean; externalApiAvailable: boolean; - wineData: BolnisiWineLots | null; + wineData: TraceabilityProgramWineLots | null; onClose: () => void; } @@ -371,9 +371,9 @@ const WineDetailModal: React.FC = ({ wineData, externalApi - {t("bolnisi.verifyErrorTooltip")} + {t("traceabilityprogram.verifyErrorTooltip")}
- {t("bolnisi.verifyErrorTooltipTryAgain")} + {t("traceabilityprogram.verifyErrorTooltipTryAgain")} } > @@ -389,7 +389,7 @@ const WineDetailModal: React.FC = ({ wineData, externalApi > - {t("bolnisi.verifyError")} + {t("traceabilityprogram.verifyError")} )} diff --git a/src/components/TransactionDetail/TransactionMetadata/Metadata/BolnisiWineDrawerConformity.tsx b/src/components/TransactionDetail/TransactionMetadata/Metadata/TraceabilityProgramWineDrawerConformity.tsx similarity index 99% rename from src/components/TransactionDetail/TransactionMetadata/Metadata/BolnisiWineDrawerConformity.tsx rename to src/components/TransactionDetail/TransactionMetadata/Metadata/TraceabilityProgramWineDrawerConformity.tsx index 946b0a774e..d6ead6981b 100644 --- a/src/components/TransactionDetail/TransactionMetadata/Metadata/BolnisiWineDrawerConformity.tsx +++ b/src/components/TransactionDetail/TransactionMetadata/Metadata/TraceabilityProgramWineDrawerConformity.tsx @@ -29,7 +29,7 @@ const dataMapping: Array<{ label: string; key: keyof Product }> = [ { label: "Wine Name", key: "wine_name" } ]; -export default function BolnisiWineDrawerConformity({ +export default function TraceabilityProgramWineDrawerConformity({ openDrawer, setOpenDrawer, certNo diff --git a/src/components/TransactionDetail/TransactionMetadata/Metadata/index.tsx b/src/components/TransactionDetail/TransactionMetadata/Metadata/index.tsx index c00e3685c0..a493130c42 100644 --- a/src/components/TransactionDetail/TransactionMetadata/Metadata/index.tsx +++ b/src/components/TransactionDetail/TransactionMetadata/Metadata/index.tsx @@ -12,7 +12,7 @@ import DynamicEllipsisText from "src/components/DynamicEllipsisText"; import ParseScriptModal from "src/components/ParseScriptModal"; import { AvatarIcon, - BolsiniAddress, + TraceabilityAddress, InvalidIcon, RevokedIcon, SeeMoreIconHome, @@ -45,7 +45,7 @@ import { ContentIdentifiers, DecryptButton, Header, - ItemBolnisi, + ItemTraceabilityProgram, MetaDataJSONValue, MetaDataJSONValueText, MetaDataValue, @@ -59,8 +59,8 @@ import { Wrapper } from "./styles"; import DefaultImageWine from "./DefaultImageWine"; -import BolnisiWineDrawer from "./BolnisiWineDrawer"; -import BolnisiWineDrawerConformity from "./BolnisiWineDrawerConformity"; +import TraceabilityProgramWineDrawer from "./TraceabilityProgramWineDrawer"; +import TraceabilityProgramWineDrawerConformity from "./TraceabilityProgramWineDrawerConformity"; interface MetadataProps { data?: Transaction["metadata"]; @@ -222,8 +222,8 @@ const Metadata: React.FC = ({ hash, data }) => { } }; - // Bolnisi Metadata - const renderBolnisi = (data?: Transaction["metadata"][number]["metadataBolnisi"]) => { + // TraceabilityProgram Metadata + const renderTraceabilityProgram = (data?: Transaction["metadata"][number]["metadataTraceabilityProgram"]) => { if (!data) return data not found; return ( @@ -281,9 +281,9 @@ const Metadata: React.FC = ({ hash, data }) => { - {t("bolnisi.verifyErrorTooltip")} + {t("traceabilityprogram.verifyErrorTooltip")}
- {t("bolnisi.verifyErrorTooltipTryAgain")} + {t("traceabilityprogram.verifyErrorTooltipTryAgain")} } > @@ -299,7 +299,7 @@ const Metadata: React.FC = ({ hash, data }) => { > - {t("bolnisi.verifyError")} + {t("traceabilityprogram.verifyError")} )} @@ -480,7 +480,8 @@ const Metadata: React.FC = ({ hash, data }) => { metadata?.metadataCIP83.valid && !textRaw && renderButtonDecrypt(metadata?.metadataCIP83?.requiredProperties)} - {String(metadata.label) === String(CIPLabel1904) && renderBolnisi(metadata?.metadataBolnisi)} + {String(metadata.label) === String(CIPLabel1904) && + renderTraceabilityProgram(metadata?.metadataTraceabilityProgram)} ); })} @@ -586,7 +587,7 @@ export const VerifyBadge = ({ status, type }: { status: boolean; type?: string } }; const Wineries: React.FC<{ - wineryData?: Transaction["metadata"][number]["metadataBolnisi"]["wineryData"]; + wineryData?: Transaction["metadata"][number]["metadataTraceabilityProgram"]["wineryData"]; }> = ({ wineryData }) => { const theme = useTheme(); const history = useHistory(); @@ -646,16 +647,21 @@ const Wineries: React.FC<{ return ( - + {winery.externalApiAvailable && } {!winery.externalApiAvailable && ( - {t("bolnisi.verifyErrorTooltip")} + {t("traceabilityprogram.verifyErrorTooltip")}
- {t("bolnisi.verifyErrorTooltipTryAgain")} + {t("traceabilityprogram.verifyErrorTooltipTryAgain")} } > @@ -671,7 +677,7 @@ const Wineries: React.FC<{ > - {t("bolnisi.verifyError")} + {t("traceabilityprogram.verifyError")} )} @@ -683,7 +689,7 @@ const Wineries: React.FC<{ {getWineName(winery.wineryId)} - + {t("bolsini.viewWineLots")} - + ); })} )} - + ); }; const ConformityCert: React.FC<{ - certData?: Transaction["metadata"][number]["metadataBolnisi"]["certData"]; + certData?: Transaction["metadata"][number]["metadataTraceabilityProgram"]["certData"]; type?: string; }> = ({ certData, type }) => { const theme = useTheme(); @@ -760,7 +766,7 @@ const ConformityCert: React.FC<{ return ( - + @@ -835,12 +841,12 @@ const ConformityCert: React.FC<{ View Certificate )} - - + ); diff --git a/src/components/TransactionDetail/TransactionMetadata/Metadata/styles.ts b/src/components/TransactionDetail/TransactionMetadata/Metadata/styles.ts index abb622b6b8..92cc45ed0a 100644 --- a/src/components/TransactionDetail/TransactionMetadata/Metadata/styles.ts +++ b/src/components/TransactionDetail/TransactionMetadata/Metadata/styles.ts @@ -317,7 +317,7 @@ export const BadgeContainerVerify = styled(Box)<{ type: "Verified" | "Invalid" | }}; `; -export const ItemBolnisi = styled(Card)` +export const ItemTraceabilityProgram = styled(Card)` display: flex; flex-direction: column; justify-content: space-between; diff --git a/src/components/commons/Layout/Header/index.tsx b/src/components/commons/Layout/Header/index.tsx index 8c17e37af4..b312490e15 100644 --- a/src/components/commons/Layout/Header/index.tsx +++ b/src/components/commons/Layout/Header/index.tsx @@ -89,7 +89,7 @@ const Header: React.FC = (props) => { /> - {pathname !== routers.BOLNISI_LANDING && pathname !== routers.MICAR && ( + {pathname !== routers.TRACEABILITYPROGRAM_LANDING && pathname !== routers.SUSTAINABILITY && ( {!pathMatched && } )} diff --git a/src/components/commons/Layout/Sidebar/SidebarMenu/index.tsx b/src/components/commons/Layout/Sidebar/SidebarMenu/index.tsx index 4ab57d260c..5cece4bf11 100644 --- a/src/components/commons/Layout/Sidebar/SidebarMenu/index.tsx +++ b/src/components/commons/Layout/Sidebar/SidebarMenu/index.tsx @@ -100,7 +100,7 @@ const SidebarMenu: React.FC = ({ history }) => { .filter( (i) => !(i.key === "glossary.governance" && !FF_GLOBAL_IS_CONWAY_ERA) && - !(i.key === "glossary.micar" && NETWORK !== "mainnet") + !(i.key === "glossary.sustainability" && NETWORK !== "mainnet") ) .map((item, index) => { const { href, key, children, icon, tooltip } = item; diff --git a/src/components/commons/Layout/index.tsx b/src/components/commons/Layout/index.tsx index a00c4b9128..14559a5727 100644 --- a/src/components/commons/Layout/index.tsx +++ b/src/components/commons/Layout/index.tsx @@ -98,7 +98,8 @@ const CustomLayout: React.FC = ({ children }) => { open={sidebar ? 1 : 0} // To dos bgcolor={ - routers.BOLNISI_LANDING === history.location.pathname || routers.MICAR === history.location.pathname + routers.TRACEABILITYPROGRAM_LANDING === history.location.pathname || + routers.SUSTAINABILITY === history.location.pathname ? theme.isDark ? "#131316" : "#fff" diff --git a/src/locales/en/translation.json b/src/locales/en/translation.json index 5dc4b3b89d..f77b6de33b 100644 --- a/src/locales/en/translation.json +++ b/src/locales/en/translation.json @@ -63,7 +63,7 @@ "glossary.type.updateConstitution": "Update to the Constitution", "glossary.networkMonitoring": "Network Monitoring", "glossary.traceability": "Traceability Program", - "glossary.micar": "Sustainability Indicators", + "glossary.sustainabilityindicators": "Sustainability Indicators", "glossary.menu.overview": "Overview", "cc.currentState": "Current State", "cc.proposalPolicy": "Proposal Policy", @@ -1175,22 +1175,22 @@ "bolsini.wineries": "Wineries", "bolsini.winery": "Winery", "bolsini.viewWineLots": "View Wine Lots", - "bolnisi.wineName": "Wine Name", - "bolnisi.origin": "Origin", - "bolnisi.countryOfOrigin": "Country of Origin", - "bolnisi.producedBy": "Produced By", - "bolnisi.producerAddress": "Producer Address", - "bolnisi.producerLatitude": "Producer Latitude", - "bolnisi.producerLongitude": "Produced Longitude", - "bolnisi.varietalName": "Verietal Name", - "bolnisi.vintageYear": "Vintage Year", - "bolnisi.wineType": "Wine Type", - "bolnisi.wineColor": "Wine Color", - "bolnisi.harvestDate": "Harvest Date", - "bolnisi.titleModal": "Georgian Wine", - "bolnisi.verifyErrorTooltip": "A connection to the verification service could not be established.", - "bolnisi.verifyErrorTooltipTryAgain": "Please, refresh the page to try again.", - "bolnisi.verifyError": "Verification Unavailable", + "traceabilityprogram.wineName": "Wine Name", + "traceabilityprogram.origin": "Origin", + "traceabilityprogram.countryOfOrigin": "Country of Origin", + "traceabilityprogram.producedBy": "Produced By", + "traceabilityprogram.producerAddress": "Producer Address", + "traceabilityprogram.producerLatitude": "Producer Latitude", + "traceabilityprogram.producerLongitude": "Produced Longitude", + "traceabilityprogram.varietalName": "Verietal Name", + "traceabilityprogram.vintageYear": "Vintage Year", + "traceabilityprogram.wineType": "Wine Type", + "traceabilityprogram.wineColor": "Wine Color", + "traceabilityprogram.harvestDate": "Harvest Date", + "traceabilityprogram.titleModal": "Georgian Wine", + "traceabilityprogram.verifyErrorTooltip": "A connection to the verification service could not be established.", + "traceabilityprogram.verifyErrorTooltipTryAgain": "Please, refresh the page to try again.", + "traceabilityprogram.verifyError": "Verification Unavailable", "account.myProfile": "My Profile", "drep.filter.drepId": "DReps ID", "drep.filter.drepIdSearch": "Search ID", @@ -1235,39 +1235,39 @@ "overview.status.accepted": "Accepted", "overview.status.enacted": "Enacted", "overview.status.expired": "Expired", - "bolnisi.landing.header": "Traceability program: Georgian Wine", - "bolnisi.landing.slogan": "Traceability from grape to glass", - "bolnisi.landing.table.txHash": "Tx Hash", - "bolnisi.landing.table.date": "Date", - "bolnisi.landing.table.txType": "Transaction Type", - "bolnisi.landing.table.amount": "Number of bottles", - "bolnisi.landing.menuitem.scm": "SCM", - "bolnisi.landing.menuitem.certificate": "Certificate of Conformity", - "bolnisi.landing.casestudy.title": "Discover the full advantages of a future-proof blockchain to empower businesses", - "bolnisi.landing.casestudy.read": "Read Case Study", - "micar.indicators.enegy": "Energy", - "micar.indicators.enegy.des": "The annual energy consumption, renewable energy use, and energy intensity quantify the total energy, in kilowatt-hours (kWh), necessary for transaction validation and ledger integrity. These metrics emphasize the system’s energy demands, highlighting both overall usage and reliance on renewable resources, while illustrating the energy intensity required for ongoing validation.", - "micar.indicators.enegy.des1": "Energy consumption", - "micar.indicators.enegy.des2": "Non-renewable consumption", - "micar.indicators.enegy.des3": "Energy intensity", - "micar.indicators.emissions": "GHG Emissions", - "micar.indicators.emissions.title": "Historical Data", - "micar.indicators.emissions.des": "Scope 1 GHG emissions, measured in tonnes of CO₂e annually, represent the emissions from transaction validation and ledger maintenance. Average GHG emissions, including Scope 1 and 2, are calculated per transaction in kilograms of CO₂e. ", - "micar.indicators.emissions.des1": "Scope 1 - Controlled", - "micar.indicators.emissions.des2": "Scope 2 - Purchased", - "micar.indicators.emissions.des3": "GHG intensity", - "micar.indicators.waste": "Waste Production", - "micar.indicators.waste.des": "The annual Waste Electrical and Electronic Equipment (WEEE) generated during transaction validation and ledger maintenance is measured in tonnes. The percentage of WEEE not recycled highlights environmental concerns. Additionally, the total hazardous waste from these processes is tracked annually, emphasizing the environmental impact and the importance of effective waste management.", - "micar.indicators.waste.des1": "Generation of waste electrical and electronic equipment (WEEE)³", - "micar.indicators.waste.des2": "Non-recycled WEEE ratio⁴", - "micar.indicators.waste.des3": "Generation of hazardous waste⁵", - "micar.indicators.natural": "Natural Resources", - "micar.indicators.natural.des": "The Natural Resource indicator provides a description of the general impact of the devices of DLT network nodes on natural resources, such as water, fossil fuels, and critical raw materials during the production, use, and disposal phase. Water consumption is heavily driven by the amount of energy consumed by the network as well as the regional water intensity of the electricity consumption. Thus, the electricity consumption, the location of validators as well as regional electricity water footprint may serve as an input to assess the water consumption of a crypto-asset during the use phase.", - "micar.indicators.natural.des1": "Impact of the use of equipment on natural resources", - "micar.indicators.calculator": "Emissions Calculator", - "micar.indicators.caculator.stakeAddress": "Stake Address", - "micar.indicators.caculator.address": "Address", - "micar.indicators.caculator.noTransaction": "No. Transactions", - "micar.indicators.caculator.emissions": "Emissions Per Tx", - "micar.emission.caculator.des": " Discover the environmental impact by entering a Cardano address, you can easily track and measure the carbon footprint generated by transactions, helping you make informed and sustainable choices in the blockchain space." + "traceabilityprogram.landing.header": "Traceability program: Georgian Wine", + "traceabilityprogram.landing.slogan": "Traceability from grape to glass", + "traceabilityprogram.landing.table.txHash": "Tx Hash", + "traceabilityprogram.landing.table.date": "Date", + "traceabilityprogram.landing.table.txType": "Transaction Type", + "traceabilityprogram.landing.table.amount": "Number of bottles", + "traceabilityprogram.landing.menuitem.scm": "SCM", + "traceabilityprogram.landing.menuitem.certificate": "Certificate of Conformity", + "traceabilityprogram.landing.casestudy.title": "Discover the full advantages of a future-proof blockchain to empower businesses", + "traceabilityprogram.landing.casestudy.read": "Read Case Study", + "sustainability.indicators.enegy": "Energy", + "sustainability.indicators.enegy.des": "The annual energy consumption, renewable energy use, and energy intensity quantify the total energy, in kilowatt-hours (kWh), necessary for transaction validation and ledger integrity. These metrics emphasize the system’s energy demands, highlighting both overall usage and reliance on renewable resources, while illustrating the energy intensity required for ongoing validation.", + "sustainability.indicators.enegy.des1": "Energy consumption", + "sustainability.indicators.enegy.des2": "Non-renewable consumption", + "sustainability.indicators.enegy.des3": "Energy intensity", + "sustainability.indicators.emissions": "GHG Emissions", + "sustainability.indicators.emissions.title": "Historical Data", + "sustainability.indicators.emissions.des": "Scope 1 GHG emissions, measured in tonnes of CO₂e annually, represent the emissions from transaction validation and ledger maintenance. Average GHG emissions, including Scope 1 and 2, are calculated per transaction in kilograms of CO₂e. ", + "sustainability.indicators.emissions.des1": "Scope 1 - Controlled", + "sustainability.indicators.emissions.des2": "Scope 2 - Purchased", + "sustainability.indicators.emissions.des3": "GHG intensity", + "sustainability.indicators.waste": "Waste Production", + "sustainability.indicators.waste.des": "The annual Waste Electrical and Electronic Equipment (WEEE) generated during transaction validation and ledger maintenance is measured in tonnes. The percentage of WEEE not recycled highlights environmental concerns. Additionally, the total hazardous waste from these processes is tracked annually, emphasizing the environmental impact and the importance of effective waste management.", + "sustainability.indicators.waste.des1": "Generation of waste electrical and electronic equipment (WEEE)³", + "sustainability.indicators.waste.des2": "Non-recycled WEEE ratio⁴", + "sustainability.indicators.waste.des3": "Generation of hazardous waste⁵", + "sustainability.indicators.natural": "Natural Resources", + "sustainability.indicators.natural.des": "The Natural Resource indicator provides a description of the general impact of the devices of DLT network nodes on natural resources, such as water, fossil fuels, and critical raw materials during the production, use, and disposal phase. Water consumption is heavily driven by the amount of energy consumed by the network as well as the regional water intensity of the electricity consumption. Thus, the electricity consumption, the location of validators as well as regional electricity water footprint may serve as an input to assess the water consumption of a crypto-asset during the use phase.", + "sustainability.indicators.natural.des1": "Impact of the use of equipment on natural resources", + "sustainability.indicators.calculator": "Emissions Calculator", + "sustainability.indicators.caculator.stakeAddress": "Stake Address", + "sustainability.indicators.caculator.address": "Address", + "sustainability.indicators.caculator.noTransaction": "No. Transactions", + "sustainability.indicators.caculator.emissions": "Emissions Per Tx", + "sustainability.emission.caculator.des": " Discover the environmental impact by entering a Cardano address, you can easily track and measure the carbon footprint generated by transactions, helping you make informed and sustainable choices in the blockchain space." } diff --git a/src/pages/Micar/MicarChart/index.tsx b/src/pages/Sustainability/SustainabilityChart/index.tsx similarity index 97% rename from src/pages/Micar/MicarChart/index.tsx rename to src/pages/Sustainability/SustainabilityChart/index.tsx index ab42ff6d15..63f9a1d8f9 100644 --- a/src/pages/Micar/MicarChart/index.tsx +++ b/src/pages/Sustainability/SustainabilityChart/index.tsx @@ -30,7 +30,7 @@ const EmissionsAreaChart = () => { const { t } = useTranslation(); const { isMobile, isGalaxyFoldSmall, isLaptop, isTablet } = useScreen(); const theme = useTheme(); - const { data } = useFetch(`${API.MICAR?.HISTORYCAL}`, undefined, false); + const { data } = useFetch(`${API.SUSTAINABILITY?.HISTORYCAL}`, undefined, false); const dataHistoryChart = data?.entries?.map((it: EmissionsChartIF) => ({ date: it.date, emissions: it.emissions_24h @@ -197,7 +197,7 @@ const EmissionsAreaChart = () => { sx={{ color: theme.isDark ? "#F7F9FF" : "#000000" }} fontSize={isMobile ? "20px" : isLaptop ? "40px" : "48px"} > - {t("micar.indicators.emissions.title")} + {t("sustainability.indicators.emissions.title")} { const fromPath = history.location.pathname as SpecialPath; const { data, loading } = useFetch( - address ? `${API.MICAR?.CARBON_EMISSION}/${address}` : "", + address ? `${API.SUSTAINABILITY?.CARBON_EMISSION}/${address}` : "", undefined, false ); @@ -74,9 +74,9 @@ const EmissionsCalculator = () => { - {t("micar.indicators.calculator")} + {t("sustainability.indicators.calculator")} - {t("micar.emission.caculator.des")} + {t("sustainability.emission.caculator.des")} { > { {data?.stakeAddress - ? t("micar.indicators.caculator.stakeAddress") - : t("micar.indicators.caculator.address")} + ? t("sustainability.indicators.caculator.stakeAddress") + : t("sustainability.indicators.caculator.address")} { - {t("micar.indicators.caculator.noTransaction")} + {t("sustainability.indicators.caculator.noTransaction")} {data?.txCount ? data?.txCount : "N/A"} - {t("micar.indicators.caculator.emissions")} + {t("sustainability.indicators.caculator.emissions")} {data?.carbonEmissionPerTx ? `${data?.carbonEmissionPerTx} kWh` : ""} )} diff --git a/src/pages/Micar/MicarEmissions/styles.ts b/src/pages/Sustainability/SustainabilityEmissions/styles.ts similarity index 100% rename from src/pages/Micar/MicarEmissions/styles.ts rename to src/pages/Sustainability/SustainabilityEmissions/styles.ts diff --git a/src/pages/Micar/MicarIndicator/MapMicar/Resource/topCities.ts b/src/pages/Sustainability/SustainabilityIndicator/MapSustainability/Resource/topCities.ts similarity index 100% rename from src/pages/Micar/MicarIndicator/MapMicar/Resource/topCities.ts rename to src/pages/Sustainability/SustainabilityIndicator/MapSustainability/Resource/topCities.ts diff --git a/src/pages/Micar/MicarIndicator/MapMicar/index.tsx b/src/pages/Sustainability/SustainabilityIndicator/MapSustainability/index.tsx similarity index 100% rename from src/pages/Micar/MicarIndicator/MapMicar/index.tsx rename to src/pages/Sustainability/SustainabilityIndicator/MapSustainability/index.tsx diff --git a/src/pages/Micar/MicarIndicator/MapMicar/mockData.ts b/src/pages/Sustainability/SustainabilityIndicator/MapSustainability/mockData.ts similarity index 100% rename from src/pages/Micar/MicarIndicator/MapMicar/mockData.ts rename to src/pages/Sustainability/SustainabilityIndicator/MapSustainability/mockData.ts diff --git a/src/pages/Micar/MicarIndicator/MapMicar/styles.ts b/src/pages/Sustainability/SustainabilityIndicator/MapSustainability/styles.ts similarity index 100% rename from src/pages/Micar/MicarIndicator/MapMicar/styles.ts rename to src/pages/Sustainability/SustainabilityIndicator/MapSustainability/styles.ts diff --git a/src/pages/Micar/MicarIndicator/MapMicar/type.ts b/src/pages/Sustainability/SustainabilityIndicator/MapSustainability/type.ts similarity index 100% rename from src/pages/Micar/MicarIndicator/MapMicar/type.ts rename to src/pages/Sustainability/SustainabilityIndicator/MapSustainability/type.ts diff --git a/src/pages/Micar/MicarIndicator/index.tsx b/src/pages/Sustainability/SustainabilityIndicator/index.tsx similarity index 93% rename from src/pages/Micar/MicarIndicator/index.tsx rename to src/pages/Sustainability/SustainabilityIndicator/index.tsx index 8a16a60bf9..5bc508e46e 100644 --- a/src/pages/Micar/MicarIndicator/index.tsx +++ b/src/pages/Sustainability/SustainabilityIndicator/index.tsx @@ -5,7 +5,7 @@ import { useScreen } from "src/commons/hooks/useScreen"; import { Content, StyledBox, StyledBoxContent, StyledBoxIcon, Title, Value } from "./styles"; -interface MicarProps { +interface SustainabilityProps { title: string; icon: ReactNode; bgColor: string; @@ -17,7 +17,18 @@ interface MicarProps { value3?: string; content: string; } -const MicarIndicator = ({ title, content, bgColor, des1, des2, des3, icon, value1, value2, value3 }: MicarProps) => { +const SustainabilityIndicator = ({ + title, + content, + bgColor, + des1, + des2, + des3, + icon, + value1, + value2, + value3 +}: SustainabilityProps) => { const { isSmallScreen, isLaptop, isMobile } = useScreen(); const theme = useTheme(); @@ -107,4 +118,4 @@ const MicarIndicator = ({ title, content, bgColor, des1, des2, des3, icon, value ); }; -export default MicarIndicator; +export default SustainabilityIndicator; diff --git a/src/pages/Micar/MicarIndicator/styles.ts b/src/pages/Sustainability/SustainabilityIndicator/styles.ts similarity index 100% rename from src/pages/Micar/MicarIndicator/styles.ts rename to src/pages/Sustainability/SustainabilityIndicator/styles.ts diff --git a/src/pages/Micar/index.tsx b/src/pages/Sustainability/index.tsx similarity index 77% rename from src/pages/Micar/index.tsx rename to src/pages/Sustainability/index.tsx index 111b0593dc..6d308f2431 100644 --- a/src/pages/Micar/index.tsx +++ b/src/pages/Sustainability/index.tsx @@ -9,11 +9,11 @@ import { useScreen } from "src/commons/hooks/useScreen"; import { API } from "src/commons/utils/api"; import { numberWithCommas } from "src/commons/utils/helper"; -import MicarIndicator from "./MicarIndicator"; -import EmissionsChart from "./MicarChart"; -import EmissionsCalculator from "./MicarEmissions"; +import SustainabilityIndicator from "./SustainabilityIndicator"; +import EmissionsChart from "./SustainabilityChart"; +import EmissionsCalculator from "./SustainabilityEmissions"; import { DescriptionText, HeadingPage, WrapHeading } from "./styles"; -import { WorldMap } from "./MicarIndicator/MapMicar"; +import { WorldMap } from "./SustainabilityIndicator/MapSustainability"; interface Indicator { indicator: number; @@ -26,7 +26,7 @@ interface Indicator { }; } -interface MicarIndicatorProps { +interface SustainabilityIndicatorProps { indicator_1: Indicator; indicator_2: Indicator; indicator_3: Indicator; @@ -39,7 +39,7 @@ interface MicarIndicatorProps { indicator_10: Indicator; } -const Micar = () => { +const Sustainability = () => { const { t } = useTranslation(); const { isMobile, isLaptop } = useScreen(); const theme = useTheme(); @@ -48,7 +48,7 @@ const Micar = () => { }, []); const formatPercent = (percent?: number) => `${Math.round((percent || 0) * 100) / 100} %`; - const { data } = useFetch(`${API.MICAR?.INDICATOR}`, undefined, false); + const { data } = useFetch(`${API.SUSTAINABILITY?.INDICATOR}`, undefined, false); return ( @@ -60,31 +60,31 @@ const Micar = () => { - : } - title={t("micar.indicators.enegy")} + title={t("sustainability.indicators.enegy")} des1={data?.indicator_1?.title} des2={data?.indicator_2?.title} des3={data?.indicator_3?.title} value1={`${numberWithCommas(data?.indicator_1?.result?.value)} kWh`} value2={formatPercent(data?.indicator_2?.result?.value)} value3={`${numberWithCommas(data?.indicator_3?.result?.value)} kWh`} - content={t("micar.indicators.enegy.des")} + content={t("sustainability.indicators.enegy.des")} /> - : } - title={t("micar.indicators.emissions")} + title={t("sustainability.indicators.emissions")} des1={data?.indicator_4?.title} des2={data?.indicator_5?.title} des3={data?.indicator_6?.title} value1={`${numberWithCommas(data?.indicator_4?.result?.value)} tCO2e`} value2={`${numberWithCommas(data?.indicator_5?.result?.value)} tCO2e`} value3={`${numberWithCommas(data?.indicator_6?.result?.value)} kgCO2e`} - content={t("micar.indicators.emissions.des")} + content={t("sustainability.indicators.emissions.des")} /> ); }; -export default Micar; +export default Sustainability; diff --git a/src/pages/Micar/styles.ts b/src/pages/Sustainability/styles.ts similarity index 100% rename from src/pages/Micar/styles.ts rename to src/pages/Sustainability/styles.ts diff --git a/src/pages/BolnisiLanding/index.css b/src/pages/TraceabilityProgramLanding/index.css similarity index 94% rename from src/pages/BolnisiLanding/index.css rename to src/pages/TraceabilityProgramLanding/index.css index 43fa389fcd..fe54dc2a41 100644 --- a/src/pages/BolnisiLanding/index.css +++ b/src/pages/TraceabilityProgramLanding/index.css @@ -84,7 +84,7 @@ top: 0; } -.bolnisi-body-background::after { +.traceabilityprogram-body-background::after { content: ""; position: absolute; width: 100%; @@ -95,7 +95,7 @@ border-bottom-right-radius: 32px; } -.bolnisi-body-background::before { +.traceabilityprogram-body-background::before { content: ""; position: absolute; width: 100%; diff --git a/src/pages/BolnisiLanding/index.tsx b/src/pages/TraceabilityProgramLanding/index.tsx similarity index 82% rename from src/pages/BolnisiLanding/index.tsx rename to src/pages/TraceabilityProgramLanding/index.tsx index ffaf70fe79..7710cf3b02 100644 --- a/src/pages/BolnisiLanding/index.tsx +++ b/src/pages/TraceabilityProgramLanding/index.tsx @@ -9,12 +9,12 @@ import { useHistory } from "react-router-dom"; import "./index.css"; import { bodyBackground, - BolnisiDropdown, - bolnisiHeaderBackgroundDark, - bolnisiHeaderBackgroundLight, - bolnisiHeaderLaptop, - bolnisiHeaderMobile, - bolnisiHeaderTablet + TraceabilityProgramDropdown, + traceabilityprogramHeaderBackgroundDark, + traceabilityprogramHeaderBackgroundLight, + traceabilityprogramHeaderLaptop, + traceabilityprogramHeaderMobile, + traceabilityprogramHeaderTablet } from "src/commons/resources"; import { Column } from "src/types/table"; import Table from "src/components/commons/Table"; @@ -22,20 +22,24 @@ import { MotionDiv } from "src/commons/animation/motion-div"; import { getShortHash } from "src/commons/utils/helper"; import { useScreen } from "src/commons/hooks/useScreen"; import { details } from "src/commons/routers"; -import { BOLNISI_LANDING_NWA, BOLNISI_LANDING_OIV, BOLNISI_LANDING_READ_CASE_STUDY } from "src/commons/utils/constants"; +import { + TRACEABILITYPROGRAM_LANDING_NWA, + TRACEABILITYPROGRAM_LANDING_OIV, + TRACEABILITYPROGRAM_LANDING_READ_CASE_STUDY +} from "src/commons/utils/constants"; import useFetch from "src/commons/hooks/useFetch"; import { API } from "src/commons/utils/api"; -import Bolnisi_Animation_Light_Mode from "./resource/Bolnisi_Animation_Light_Mode.json"; -import Bolnisi_Animation_Dark_Mode from "./resource/Bolnisi_Animation_Dark_Mode.json"; -import bolnisiAnimationmobileLightMode from "./resource/Bolnisi_Animation_mobile_Light_Mode.png"; +import TraceabilityProgram_Animation_Light_Mode from "./resource/TraceabilityProgram_Animation_Light_Mode.json"; +import TraceabilityProgram_Animation_Dark_Mode from "./resource/TraceabilityProgram_Animation_Dark_Mode.json"; +import traceabilityprogramAnimationmobileLightMode from "./resource/TraceabilityProgram_Animation_mobile_Light_Mode.png"; -interface BolnisiNumbers { +interface TraceabilityProgramNumbers { numberOfBottles: number | null; numberOfCertificates: number | null; numberOfWineries: number | null; } -const BolnisiLanding = () => { +const TraceabilityProgramLanding = () => { useEffect(() => { document.title = `Traceability Program | Cardano Blockchain Explorer`; }, []); @@ -44,12 +48,12 @@ const BolnisiLanding = () => {
- + ); }; -export default BolnisiLanding; +export default TraceabilityProgramLanding; const Header = () => { const topRef = useRef(); @@ -65,7 +69,9 @@ const Header = () => { { } }} > - {t("bolnisi.landing.header")} + {t("traceabilityprogram.landing.header")} @@ -114,9 +120,15 @@ const Header = () => { }} > bolnisi @@ -131,7 +143,7 @@ const ProgressSession = () => { const defaultOptions = { loop: true, autoplay: true, - animationData: theme.isDark ? Bolnisi_Animation_Dark_Mode : Bolnisi_Animation_Light_Mode, + animationData: theme.isDark ? TraceabilityProgram_Animation_Dark_Mode : TraceabilityProgram_Animation_Light_Mode, rendererSettings: { preserveAspectRatio: "xMidYMid slice" } @@ -151,7 +163,7 @@ const ProgressSession = () => { fontSize={"clamp(2.25rem, 3vw, 2.5rem);"} fontWeight={"bold"} > - {t("bolnisi.landing.slogan")} + {t("traceabilityprogram.landing.slogan")} { Georgian wines, ensuring they comply with the commercial industry standard set by the{" "} { (OIV). All the while increasing consumer engagement and trust. - The pilot for the Bolnisi region includes more than 30 wineries with several thousand wine bottles - already registered on the Cardano blockchain. This innovative track and trace solution creates - verifiable on-chain records for the detailed supply chain data provided by the wineries, plus the - certificates of conformity issued by Georgia’s{" "} + The pilot for the Traceability Program region includes more than 30 wineries with several thousand + wine bottles already registered on the Cardano blockchain. This innovative track and trace solution + creates verifiable on-chain records for the detailed supply chain data provided by the wineries, + plus the certificates of conformity issued by Georgia’s{" "} { {!isMobile ? ( ) : ( - bolnisi + TraceabilityProgram )} { ); }; -interface BolnisiTx { +interface TraceabilityProgramTx { txHash: string; date: string; cert: string; amount: number; } -const BolnisiTrx = () => { +const TraceabilityProgramTrx = () => { const theme = useTheme(); const history = useHistory(); const [cert, setCert] = useState("SCM"); const [open, setOpen] = useState(false); - const { data: bolnisiData } = useFetch(API.BOLNISI.OVERVIEW, undefined, false); + const { data: traceabilityprogramData } = useFetch( + API.TRACEABILITYPROGRAM.OVERVIEW, + undefined, + false + ); - const columns: Column[] = [ + const columns: Column[] = [ { - title: {t("bolnisi.landing.table.txHash")}, + title: ( + + {t("traceabilityprogram.landing.table.txHash")} + + ), key: "no", render: (r) => ( { ) }, { - title: {t("bolnisi.landing.table.date")}, + title: ( + {t("traceabilityprogram.landing.table.date")} + ), key: "no", render: (r) => {r.date} }, { title: ( - - {t("bolnisi.landing.table.txType")} + + {t("traceabilityprogram.landing.table.txType")} ), key: "value", @@ -311,8 +333,8 @@ const BolnisiTrx = () => { }, { title: ( - - {t("bolnisi.landing.table.amount")} + + {t("traceabilityprogram.landing.table.amount")} ), key: "fees", @@ -408,21 +430,21 @@ const BolnisiTrx = () => { - + - + - + @@ -477,7 +499,7 @@ const BolnisiTrx = () => { onChange={(e) => setCert(e.target?.value)} inputProps={{ style: { border: "transparent" }, id: "" }} IconComponent={() => ( - { @@ -488,10 +510,10 @@ const BolnisiTrx = () => { MenuProps={{ MenuListProps: { style: { background: theme.palette.secondary[0] } } }} > - {t("bolnisi.landing.menuitem.scm")} + {t("traceabilityprogram.landing.menuitem.scm")} - {t("bolnisi.landing.menuitem.certificate")} + {t("traceabilityprogram.landing.menuitem.certificate")} @@ -512,7 +534,7 @@ const BolnisiTrx = () => { lineHeight={"2.625rem"} fontWeight={"bold"} > - {t("bolnisi.landing.casestudy.title")} + {t("traceabilityprogram.landing.casestudy.title")} { color={theme.isDark ? "#24262E !important" : "#fff !important"} textTransform={"capitalize"} sx={{ ":hover": { color: theme.isDark ? "#24262E !important" : "#fff !important" }, cursor: "pointer" }} - href={BOLNISI_LANDING_READ_CASE_STUDY} + href={TRACEABILITYPROGRAM_LANDING_READ_CASE_STUDY} target="_blank" > - {t("bolnisi.landing.casestudy.read")} + {t("traceabilityprogram.landing.casestudy.read")} @@ -541,7 +563,7 @@ const BolnisiTrx = () => {