diff --git a/.github/actions/diffs/action.yml b/.github/actions/diffs/action.yml index 7b092777866..4e6922ba60f 100644 --- a/.github/actions/diffs/action.yml +++ b/.github/actions/diffs/action.yml @@ -40,6 +40,7 @@ runs: - "Cargo.toml" - "Cargo.lock" - ".config/nextest.toml" + - "rust-toolchain.toml" isDoc: - "docs/content/**" - "docs/site/**" diff --git a/.github/workflows/_rust.yml b/.github/workflows/_rust.yml index 806466ae426..da0c28dc2da 100644 --- a/.github/workflows/_rust.yml +++ b/.github/workflows/_rust.yml @@ -5,11 +5,6 @@ on: inputs: isRust: type: boolean - secrets: - SSH_PRIVATE_KEY_IOTA_CI: - required: true - SSH_GITHUB_KNOWN_HOSTS: - required: true env: CARGO_TERM_COLOR: always diff --git a/.github/workflows/hierarchy.yml b/.github/workflows/hierarchy.yml index 309d1e93e72..88862232da1 100644 --- a/.github/workflows/hierarchy.yml +++ b/.github/workflows/hierarchy.yml @@ -75,33 +75,6 @@ jobs: if: (!cancelled() && needs.diff.outputs.isDoc == 'true') uses: ./.github/workflows/_docs_lint.yml - release-notes-description-check: - name: release-notes-check - concurrency: - group: release-notes-${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }} - cancel-in-progress: true - needs: diff - if: (!cancelled() && needs.diff.outputs.isReleaseNotesEligible == 'true') - runs-on: [self-hosted] - steps: - - uses: actions/checkout@eef61447b9ff4aafe5dcd4e0bbf5d482be7e7871 # pin@v4 - - name: Check Pull Request Description - shell: bash - run: | - export PR_NUMBER=$(jq --raw-output .pull_request.number "$GITHUB_EVENT_PATH") - export DESCRIPTION=$(curl -s -H "Authorization: Bearer ${{ secrets.GITHUB_TOKEN }}" \ - "https://api.github.com/repos/iotaledger/iota/pulls/${PR_NUMBER}" \ - | jq --raw-output .body) - - if [[ "${DESCRIPTION}" == *"[x]"* ]]; then - if [[ "${DESCRIPTION}" =~ Release[[:space:]]notes[[:space:]]+.* ]]; then - exit 0 - else - echo "At least one '[x]' was checked under 'Type of Change (Check all that apply)', you need to add a blob under the 'Release Notes' section." - exit 1 - fi - fi - turborepo: needs: - dprint-format diff --git a/.typos.toml b/.typos.toml index 37b1921004d..73f51059184 100644 --- a/.typos.toml +++ b/.typos.toml @@ -29,7 +29,10 @@ strat = "strat" mistic = "mistic" # Identity AAS = "AAS" -# actual typos purposedly used in tests +# actual typos purposely used in tests assing = "assing" tring = "tring" Thi = "Thi" + +[files] +extend-exclude = ["pnpm-lock.yaml", "external-crates/*"] diff --git a/apps/core/src/components/Inputs/SendTokenFormInput.tsx b/apps/core/src/components/Inputs/SendTokenFormInput.tsx index 5c49038945b..3e97b41c707 100644 --- a/apps/core/src/components/Inputs/SendTokenFormInput.tsx +++ b/apps/core/src/components/Inputs/SendTokenFormInput.tsx @@ -19,6 +19,7 @@ export interface SendTokenInputProps { onActionClick: () => Promise; isMaxActionDisabled?: boolean; name: string; + isPayAllIota: boolean; } export function SendTokenFormInput({ @@ -30,6 +31,7 @@ export function SendTokenFormInput({ onActionClick, isMaxActionDisabled, name, + isPayAllIota, }: SendTokenInputProps) { const { values, setFieldValue, isSubmitting, validateField } = useFormikContext(); const { data: gasBudgetEstimation } = useGasBudgetEstimation({ @@ -38,7 +40,7 @@ export function SendTokenFormInput({ activeAddress, to: to, amount: values.amount, - isPayAllIota: values.isPayAllIota, + isPayAllIota, }); const [formattedGasBudgetEstimation, gasToken] = useFormatCoin( gasBudgetEstimation, @@ -61,8 +63,8 @@ export function SendTokenFormInput({ // gasBudgetEstimation should change when the amount above changes useEffect(() => { - setFieldValue('gasBudgetEst', formattedGasBudgetEstimation, false); - }, [formattedGasBudgetEstimation, setFieldValue, values.amount]); + setFieldValue('gasBudgetEst', gasBudgetEstimation, false); + }, [gasBudgetEstimation, setFieldValue, values.amount]); return ( +
-
+
diff --git a/apps/core/src/components/coin/CoinItem.tsx b/apps/core/src/components/coin/CoinItem.tsx index a7d82afe1ba..8e2062efa26 100644 --- a/apps/core/src/components/coin/CoinItem.tsx +++ b/apps/core/src/components/coin/CoinItem.tsx @@ -39,13 +39,8 @@ export function CoinItem({ return ( -
- +
+
- + {isIota ? (coinMeta?.name || '').toUpperCase() : coinMeta?.name || symbol}
diff --git a/apps/core/src/components/icon/ImageIcon.tsx b/apps/core/src/components/icon/ImageIcon.tsx index 6b58dbf715a..3f1e76a6d31 100644 --- a/apps/core/src/components/icon/ImageIcon.tsx +++ b/apps/core/src/components/icon/ImageIcon.tsx @@ -42,9 +42,8 @@ function FallBackAvatar({ str, rounded, size = ImageIconSize.Large }: FallBackAv return (
diff --git a/apps/core/src/components/index.ts b/apps/core/src/components/index.ts index 0a8093eeadb..a2aa837dfc6 100644 --- a/apps/core/src/components/index.ts +++ b/apps/core/src/components/index.ts @@ -1,9 +1,9 @@ // Copyright (c) 2024 IOTA Stiftung // SPDX-License-Identifier: Apache-2.0 -export * from './KioskClientProvider'; - export * from './coin'; export * from './icon'; export * from './Inputs'; export * from './QR'; + +export * from './providers'; diff --git a/apps/core/src/components/KioskClientProvider.tsx b/apps/core/src/components/providers/KioskClientProvider.tsx similarity index 100% rename from apps/core/src/components/KioskClientProvider.tsx rename to apps/core/src/components/providers/KioskClientProvider.tsx diff --git a/apps/core/src/components/providers/ThemeProvider.tsx b/apps/core/src/components/providers/ThemeProvider.tsx new file mode 100644 index 00000000000..43a65cfa558 --- /dev/null +++ b/apps/core/src/components/providers/ThemeProvider.tsx @@ -0,0 +1,51 @@ +// Copyright (c) 2024 IOTA Stiftung +// SPDX-License-Identifier: Apache-2.0 + +import { PropsWithChildren, useState, useEffect, useCallback } from 'react'; +import { Theme } from '../../enums'; +import { ThemeContext } from '../../contexts'; + +interface ThemeProviderProps { + appId: string; +} + +export function ThemeProvider({ children, appId }: PropsWithChildren) { + const storageKey = `theme_${appId}`; + + const getSystemTheme = () => + window.matchMedia('(prefers-color-scheme: dark)').matches ? Theme.Dark : Theme.Light; + + const getInitialTheme = () => { + if (typeof window === 'undefined') { + return Theme.System; + } else { + const storedTheme = localStorage?.getItem(storageKey); + return storedTheme ? (storedTheme as Theme) : Theme.System; + } + }; + + const [theme, setTheme] = useState(getInitialTheme); + + const applyTheme = useCallback((currentTheme: Theme) => { + const selectedTheme = currentTheme === Theme.System ? getSystemTheme() : currentTheme; + const documentElement = document.documentElement.classList; + documentElement.toggle(Theme.Dark, selectedTheme === Theme.Dark); + documentElement.toggle(Theme.Light, selectedTheme === Theme.Light); + }, []); + + useEffect(() => { + if (typeof window === 'undefined') return; + + localStorage.setItem(storageKey, theme); + applyTheme(theme); + + if (theme === Theme.System) { + const systemTheme = window.matchMedia('(prefers-color-scheme: dark)'); + const handleSystemThemeChange = () => applyTheme(Theme.System); + systemTheme.addEventListener('change', handleSystemThemeChange); + return () => systemTheme.removeEventListener('change', handleSystemThemeChange); + } + }, [theme, applyTheme, storageKey]); + + return {children}; +} diff --git a/apps/wallet-dashboard/components/Dialogs/StakeDetails/index.ts b/apps/core/src/components/providers/index.ts similarity index 51% rename from apps/wallet-dashboard/components/Dialogs/StakeDetails/index.ts rename to apps/core/src/components/providers/index.ts index be500ac73c8..5bbf1329e64 100644 --- a/apps/wallet-dashboard/components/Dialogs/StakeDetails/index.ts +++ b/apps/core/src/components/providers/index.ts @@ -1,4 +1,5 @@ // Copyright (c) 2024 IOTA Stiftung // SPDX-License-Identifier: Apache-2.0 -export * from './StakeDetailsDialog'; +export * from './KioskClientProvider'; +export * from './ThemeProvider'; diff --git a/apps/core/src/constants/staking.constants.ts b/apps/core/src/constants/staking.constants.ts index e79939eee60..5c1a2ea2b7e 100644 --- a/apps/core/src/constants/staking.constants.ts +++ b/apps/core/src/constants/staking.constants.ts @@ -6,3 +6,6 @@ export const UNSTAKING_REQUEST_EVENT = '0x3::validator::UnstakingRequestEvent'; export const DELEGATED_STAKES_QUERY_STALE_TIME = 10_000; export const DELEGATED_STAKES_QUERY_REFETCH_INTERVAL = 30_000; + +export const NUM_OF_EPOCH_BEFORE_STAKING_REWARDS_REDEEMABLE = 2; +export const NUM_OF_EPOCH_BEFORE_STAKING_REWARDS_STARTS = 1; diff --git a/apps/core/src/contexts/ThemeContext.tsx b/apps/core/src/contexts/ThemeContext.tsx new file mode 100644 index 00000000000..3406e50d5c1 --- /dev/null +++ b/apps/core/src/contexts/ThemeContext.tsx @@ -0,0 +1,15 @@ +// Copyright (c) 2024 IOTA Stiftung +// SPDX-License-Identifier: Apache-2.0 + +import { createContext } from 'react'; +import { Theme } from '../enums'; + +export interface ThemeContextType { + theme: Theme; + setTheme: (theme: Theme) => void; +} + +export const ThemeContext = createContext({ + theme: Theme.Light, + setTheme: () => {}, +}); diff --git a/apps/wallet-dashboard/components/Dialogs/Unstake/index.ts b/apps/core/src/contexts/index.ts similarity index 70% rename from apps/wallet-dashboard/components/Dialogs/Unstake/index.ts rename to apps/core/src/contexts/index.ts index 4a9444c3b5b..c592171afa8 100644 --- a/apps/wallet-dashboard/components/Dialogs/Unstake/index.ts +++ b/apps/core/src/contexts/index.ts @@ -1,4 +1,4 @@ // Copyright (c) 2024 IOTA Stiftung // SPDX-License-Identifier: Apache-2.0 -export * from './views'; +export * from './ThemeContext'; diff --git a/apps/core/src/enums/ExplorerLinkType.ts b/apps/core/src/enums/explorer-link-type.enums.ts similarity index 100% rename from apps/core/src/enums/ExplorerLinkType.ts rename to apps/core/src/enums/explorer-link-type.enums.ts diff --git a/apps/core/src/enums/index.ts b/apps/core/src/enums/index.ts index 6dcfd1bcf7b..7c01aed335d 100644 --- a/apps/core/src/enums/index.ts +++ b/apps/core/src/enums/index.ts @@ -1,4 +1,5 @@ // Copyright (c) 2024 IOTA Stiftung // SPDX-License-Identifier: Apache-2.0 -export * from './ExplorerLinkType'; +export * from './theme.enums'; +export * from './explorer-link-type.enums'; diff --git a/apps/core/src/enums/theme.enums.ts b/apps/core/src/enums/theme.enums.ts new file mode 100644 index 00000000000..2df40a61af4 --- /dev/null +++ b/apps/core/src/enums/theme.enums.ts @@ -0,0 +1,8 @@ +// Copyright (c) 2024 IOTA Stiftung +// SPDX-License-Identifier: Apache-2.0 + +export enum Theme { + Light = 'light', + Dark = 'dark', + System = 'system', +} diff --git a/apps/core/src/forms/token.ts b/apps/core/src/forms/token.ts index abad79c1100..264c74b87f1 100644 --- a/apps/core/src/forms/token.ts +++ b/apps/core/src/forms/token.ts @@ -4,6 +4,5 @@ export type TokenForm = { amount: string; to: string; - isPayAllIota: boolean; gasBudgetEst: string; }; diff --git a/apps/core/src/hooks/index.ts b/apps/core/src/hooks/index.ts index 544c59c8a30..2ffa7f95688 100644 --- a/apps/core/src/hooks/index.ts +++ b/apps/core/src/hooks/index.ts @@ -41,5 +41,6 @@ export * from './useGasBudgetEstimation'; export * from './useTransactionData'; export * from './useGetStakingValidatorDetails'; export * from './useCursorPagination'; +export * from './useTheme'; export * from './stake'; diff --git a/apps/core/src/hooks/stake/index.ts b/apps/core/src/hooks/stake/index.ts index 53e1fc44806..2477e671351 100644 --- a/apps/core/src/hooks/stake/index.ts +++ b/apps/core/src/hooks/stake/index.ts @@ -4,3 +4,5 @@ export * from './useGetDelegatedStake'; export * from './useTotalDelegatedRewards'; export * from './useTotalDelegatedStake'; +export * from './useValidatorInfo'; +export * from './useStakeTxnInfo'; diff --git a/apps/core/src/hooks/stake/useStakeTxnInfo.ts b/apps/core/src/hooks/stake/useStakeTxnInfo.ts new file mode 100644 index 00000000000..a1ea1fcd53a --- /dev/null +++ b/apps/core/src/hooks/stake/useStakeTxnInfo.ts @@ -0,0 +1,52 @@ +// Copyright (c) 2024 IOTA Stiftung +// SPDX-License-Identifier: Apache-2.0 +import { + useGetTimeBeforeEpochNumber, + useTimeAgo, + TimeUnit, + NUM_OF_EPOCH_BEFORE_STAKING_REWARDS_REDEEMABLE, + NUM_OF_EPOCH_BEFORE_STAKING_REWARDS_STARTS, +} from '../../'; + +export function useStakeTxnInfo(startEpoch?: string | number) { + const startEarningRewardsEpoch = + Number(startEpoch || 0) + NUM_OF_EPOCH_BEFORE_STAKING_REWARDS_STARTS; + + const redeemableRewardsEpoch = + Number(startEpoch || 0) + NUM_OF_EPOCH_BEFORE_STAKING_REWARDS_REDEEMABLE; + + const { data: timeBeforeStakeRewardsStarts } = + useGetTimeBeforeEpochNumber(startEarningRewardsEpoch); + const timeBeforeStakeRewardsStartsAgo = useTimeAgo({ + timeFrom: timeBeforeStakeRewardsStarts, + shortedTimeLabel: false, + shouldEnd: true, + maxTimeUnit: TimeUnit.ONE_HOUR, + }); + const stakedRewardsStartEpoch = + timeBeforeStakeRewardsStarts > 0 + ? `in ${timeBeforeStakeRewardsStartsAgo}` + : startEpoch + ? `Epoch #${Number(startEarningRewardsEpoch)}` + : '--'; + + const { data: timeBeforeStakeRewardsRedeemable } = + useGetTimeBeforeEpochNumber(redeemableRewardsEpoch); + const timeBeforeStakeRewardsRedeemableAgo = useTimeAgo({ + timeFrom: timeBeforeStakeRewardsRedeemable, + shortedTimeLabel: false, + shouldEnd: true, + maxTimeUnit: TimeUnit.ONE_HOUR, + }); + const timeBeforeStakeRewardsRedeemableAgoDisplay = + timeBeforeStakeRewardsRedeemable > 0 + ? `in ${timeBeforeStakeRewardsRedeemableAgo}` + : startEpoch + ? `Epoch #${Number(redeemableRewardsEpoch)}` + : '--'; + + return { + stakedRewardsStartEpoch, + timeBeforeStakeRewardsRedeemableAgoDisplay, + }; +} diff --git a/apps/core/src/hooks/stake/useValidatorInfo.tsx b/apps/core/src/hooks/stake/useValidatorInfo.tsx new file mode 100644 index 00000000000..2ae4d23c933 --- /dev/null +++ b/apps/core/src/hooks/stake/useValidatorInfo.tsx @@ -0,0 +1,50 @@ +// Copyright (c) 2024 IOTA Stiftung +// SPDX-License-Identifier: Apache-2.0 +import { useIotaClientQuery } from '@iota/dapp-kit'; +import { useGetValidatorsApy } from '../'; + +export function useValidatorInfo({ validatorAddress }: { validatorAddress: string }) { + const { + data: system, + isPending: isPendingValidators, + isError: errorValidators, + } = useIotaClientQuery('getLatestIotaSystemState'); + const { data: rollingAverageApys } = useGetValidatorsApy(); + + const validatorSummary = + system?.activeValidators.find((validator) => validator.iotaAddress === validatorAddress) || + null; + + const currentEpoch = Number(system?.epoch || 0); + + const stakingPoolActivationEpoch = Number(validatorSummary?.stakingPoolActivationEpoch || 0); + + // flag as new validator if the validator was activated in the last epoch + // for genesis validators, this will be false + const newValidator = currentEpoch - stakingPoolActivationEpoch <= 1 && currentEpoch !== 0; + + // flag if the validator is at risk of being removed from the active set + const isAtRisk = system?.atRiskValidators.some((item) => item[0] === validatorAddress); + + const { apy, isApyApproxZero } = rollingAverageApys?.[validatorAddress] ?? { + apy: null, + }; + + const commission = validatorSummary ? Number(validatorSummary.commissionRate) / 100 : 0; + + return { + system, + isPendingValidators, + errorValidators, + + currentEpoch, + validatorSummary, + name: validatorSummary?.name || '', + stakingPoolActivationEpoch, + commission, + newValidator, + isAtRisk, + apy, + isApyApproxZero, + }; +} diff --git a/apps/core/src/hooks/useGetStakingValidatorDetails.ts b/apps/core/src/hooks/useGetStakingValidatorDetails.ts index 70a6fe36b74..f77ee897e53 100644 --- a/apps/core/src/hooks/useGetStakingValidatorDetails.ts +++ b/apps/core/src/hooks/useGetStakingValidatorDetails.ts @@ -75,6 +75,7 @@ export function useGetStakingValidatorDetails({ return { epoch: Number(system?.epoch) || 0, totalStake: totalStakeFormatted, + totalStakeOriginal: totalStake, totalValidatorsStake: totalValidatorsStakeFormatted, totalStakePercentage, validatorApy, diff --git a/apps/core/src/hooks/useTheme.ts b/apps/core/src/hooks/useTheme.ts new file mode 100644 index 00000000000..72cddc121c3 --- /dev/null +++ b/apps/core/src/hooks/useTheme.ts @@ -0,0 +1,12 @@ +// Copyright (c) 2024 IOTA Stiftung +// SPDX-License-Identifier: Apache-2.0 +import { useContext } from 'react'; +import { ThemeContext, ThemeContextType } from '../contexts'; + +export const useTheme = (): ThemeContextType => { + const context = useContext(ThemeContext); + if (!context) { + throw new Error('useTheme must be used within a ThemeProvider'); + } + return context; +}; diff --git a/apps/core/src/index.ts b/apps/core/src/index.ts index 6d113bf483b..a9aadd0b1e5 100644 --- a/apps/core/src/index.ts +++ b/apps/core/src/index.ts @@ -8,4 +8,6 @@ export * from './components'; export * from './utils'; export * from './hooks'; export * from './constants'; +export * from './contexts'; +export * from './enums'; export * from './forms'; diff --git a/apps/wallet/src/ui/app/staking/stake/utils/validation.ts b/apps/core/src/utils/stake/createValidationSchema.ts similarity index 97% rename from apps/wallet/src/ui/app/staking/stake/utils/validation.ts rename to apps/core/src/utils/stake/createValidationSchema.ts index 198efb8a941..b051585f943 100644 --- a/apps/wallet/src/ui/app/staking/stake/utils/validation.ts +++ b/apps/core/src/utils/stake/createValidationSchema.ts @@ -2,7 +2,7 @@ // Modifications Copyright (c) 2024 IOTA Stiftung // SPDX-License-Identifier: Apache-2.0 -import { CoinFormat, formatBalance } from '@iota/core'; +import { CoinFormat, formatBalance } from '../../'; import BigNumber from 'bignumber.js'; import { mixed, object } from 'yup'; diff --git a/apps/core/src/utils/stake/index.ts b/apps/core/src/utils/stake/index.ts index 5f7d694c839..6ecca7353f6 100644 --- a/apps/core/src/utils/stake/index.ts +++ b/apps/core/src/utils/stake/index.ts @@ -6,3 +6,4 @@ export * from './formatDelegatedStake'; export * from './createStakeTransaction'; export * from './createTimelockedUnstakeTransaction'; export * from './createTimelockedStakeTransaction'; +export * from './createValidationSchema'; diff --git a/apps/explorer/src/components/AddressesCardGraph.tsx b/apps/explorer/src/components/AddressesCardGraph.tsx index 3258b556573..0c5ba23db08 100644 --- a/apps/explorer/src/components/AddressesCardGraph.tsx +++ b/apps/explorer/src/components/AddressesCardGraph.tsx @@ -8,7 +8,8 @@ import { useMemo } from 'react'; import { useGetAddressMetrics } from '~/hooks/useGetAddressMetrics'; import { useGetAllEpochAddressMetrics } from '~/hooks/useGetAllEpochAddressMetrics'; import { LabelTextSize, TooltipPosition } from '@iota/apps-ui-kit'; -import { StatisticsPanel, GraphTooltip } from './StatisticsPanel'; +import { StatisticsPanel } from './StatisticsPanel'; +import { GraphTooltipContent } from './GraphTooltipContent'; const GRAPH_DATA_FIELD = 'cumulativeAddresses'; const GRAPH_DATA_TEXT = 'Total addresses'; @@ -18,7 +19,13 @@ function TooltipContent({ data }: { data: AllEpochsAddressMetrics[number] }): JS const totalFormatted = formatAmount(data[GRAPH_DATA_FIELD]); const overline = `${dateFormatted}, Epoch ${data.epoch}`; - return ; + return ( + + ); } const FALLBACK = '--'; diff --git a/apps/explorer/src/components/AreaGraph.tsx b/apps/explorer/src/components/AreaGraph.tsx index ebfc5f690f5..dd3723c03d0 100644 --- a/apps/explorer/src/components/AreaGraph.tsx +++ b/apps/explorer/src/components/AreaGraph.tsx @@ -13,7 +13,7 @@ import { bisector, extent } from 'd3-array'; import { useCallback, useEffect, useMemo, useRef, useState, type ReactNode } from 'react'; import { throttle } from 'throttle-debounce'; -import { GraphTooltipContent } from './GraphTooltipContent'; +import { GraphTooltipContainer } from './GraphTooltipContent'; let idCounter = 0; @@ -129,21 +129,33 @@ export function AreaGraph({ offsetTop={0} left={tooltipLeft} top={tooltipTopAdj} - className="pointer-events-none absolute z-10 h-0 w-max overflow-visible" + className="pointer-events-none absolute z-10 h-0 w-max overflow-visible bg-black" unstyled detectBounds > - {tooltipContent(tooltipContentProps)} + + {tooltipContent(tooltipContentProps)} + ) : null} - - + + - + diff --git a/apps/explorer/src/components/GraphTooltipContent.tsx b/apps/explorer/src/components/GraphTooltipContent.tsx index ddceab1776c..515c04990b7 100644 --- a/apps/explorer/src/components/GraphTooltipContent.tsx +++ b/apps/explorer/src/components/GraphTooltipContent.tsx @@ -4,18 +4,13 @@ import { useTooltipPosition } from '@visx/tooltip'; import clsx from 'clsx'; -import { type ReactNode } from 'react'; -type GraphTooltipContentProps = { - children: ReactNode; -}; - -export function GraphTooltipContent({ children }: GraphTooltipContentProps): JSX.Element { +export function GraphTooltipContainer({ children }: React.PropsWithChildren): JSX.Element { const { isFlippedHorizontally } = useTooltipPosition(); return (
); } + +interface GraphTooltipContentProps { + title: string; + overline: string; + subtitle: string; +} +export function GraphTooltipContent({ title, overline, subtitle }: GraphTooltipContentProps) { + return ( +
+ {overline} + {title} + {subtitle} +
+ ); +} diff --git a/apps/explorer/src/components/StatisticsPanel.tsx b/apps/explorer/src/components/StatisticsPanel.tsx index b2701d4b6d6..b30be733170 100644 --- a/apps/explorer/src/components/StatisticsPanel.tsx +++ b/apps/explorer/src/components/StatisticsPanel.tsx @@ -69,18 +69,3 @@ export function StatisticsPanel({ ); } - -interface GraphTooltipProps { - title: string; - overline: string; - subtitle: string; -} -export function GraphTooltip({ title, overline, subtitle }: GraphTooltipProps) { - return ( -
- {overline} - {title} - {subtitle} -
- ); -} diff --git a/apps/explorer/src/components/ThemedIotaLogo.tsx b/apps/explorer/src/components/ThemedIotaLogo.tsx new file mode 100644 index 00000000000..71a42a49a8d --- /dev/null +++ b/apps/explorer/src/components/ThemedIotaLogo.tsx @@ -0,0 +1,8 @@ +// Copyright (c) 2024 IOTA Stiftung +// SPDX-License-Identifier: Apache-2.0 + +import { IotaLogoWeb } from '@iota/ui-icons'; + +export function ThemedIotaLogo(): React.JSX.Element { + return ; +} diff --git a/apps/explorer/src/components/TransactionsCardGraph.tsx b/apps/explorer/src/components/TransactionsCardGraph.tsx index 510f5785b7c..ee9f1a8679a 100644 --- a/apps/explorer/src/components/TransactionsCardGraph.tsx +++ b/apps/explorer/src/components/TransactionsCardGraph.tsx @@ -5,7 +5,8 @@ import { CoinFormat, formatAmount, formatBalance, formatDate } from '@iota/core'; import { useIotaClientQuery } from '@iota/dapp-kit'; import { LabelTextSize, TooltipPosition } from '@iota/apps-ui-kit'; -import { GraphTooltip, StatisticsPanel } from './StatisticsPanel'; +import { StatisticsPanel } from './StatisticsPanel'; +import { GraphTooltipContent } from './GraphTooltipContent'; interface TooltipContentProps { data: { @@ -24,7 +25,11 @@ function TooltipContent({ const overline = `${dateFormatted}, Epoch ${epoch}`; return ( - + ); } diff --git a/apps/explorer/src/components/footer/Footer.tsx b/apps/explorer/src/components/footer/Footer.tsx index e5f17ca794f..d4f43153c63 100644 --- a/apps/explorer/src/components/footer/Footer.tsx +++ b/apps/explorer/src/components/footer/Footer.tsx @@ -4,9 +4,9 @@ import { Divider } from '@iota/apps-ui-kit'; import { LegalLinks, LegalText } from './Legal'; -import { IotaLogoWeb } from '@iota/ui-icons'; import { Link } from '~/components/ui'; import { FOOTER_LINKS } from '~/lib/constants'; +import { ThemedIotaLogo } from '../ThemedIotaLogo'; function FooterLinks(): JSX.Element { return ( @@ -14,7 +14,11 @@ function FooterLinks(): JSX.Element {
    {FOOTER_LINKS.map(({ title, href }) => (
  • - + {title}
    • @@ -26,11 +30,11 @@ function FooterLinks(): JSX.Element { function Footer(): JSX.Element { return ( -