From 8daf17d139823c833f63d012e6391c0b969463a1 Mon Sep 17 00:00:00 2001 From: tylerapfledderer Date: Wed, 21 Aug 2024 22:26:40 -0400 Subject: [PATCH] refactor: replace Chakra `useBreakpointValue` with local export --- src/components/EnergyConsumptionChart/index.tsx | 2 +- src/components/Morpher.tsx | 3 ++- src/components/Simulator/WalletHome/NFTList.tsx | 10 +++------- 3 files changed, 6 insertions(+), 9 deletions(-) diff --git a/src/components/EnergyConsumptionChart/index.tsx b/src/components/EnergyConsumptionChart/index.tsx index a14ba629fa6..43936c43655 100644 --- a/src/components/EnergyConsumptionChart/index.tsx +++ b/src/components/EnergyConsumptionChart/index.tsx @@ -12,7 +12,6 @@ import ChartDataLabels from "chartjs-plugin-datalabels" import { useRouter } from "next/router" import { useTranslation } from "next-i18next" import { Bar } from "react-chartjs-2" -import { useBreakpointValue } from "@chakra-ui/react" import type { Lang } from "@/lib/types" @@ -21,6 +20,7 @@ import { Center } from "@/components/ui/flex" import { wrapLabel } from "@/lib/utils/charts" import { isLangRightToLeft } from "@/lib/utils/translations" +import { useBreakpointValue } from "@/hooks/useBreakpointValue" import useColorModeValue from "@/hooks/useColorModeValue" import { useIsClient } from "@/hooks/useIsClient" diff --git a/src/components/Morpher.tsx b/src/components/Morpher.tsx index 36e157bad76..1a084796890 100644 --- a/src/components/Morpher.tsx +++ b/src/components/Morpher.tsx @@ -1,5 +1,4 @@ import { useEffect, useState } from "react" -import { useBreakpointValue } from "@chakra-ui/react" import { Button } from "@/components/Buttons" @@ -9,6 +8,8 @@ import { MOBILE_LANGUAGE_BUTTON_NAME, } from "@/lib/constants" +import { useBreakpointValue } from "@/hooks/useBreakpointValue" + const Morpher = () => { const [state, setState] = useState({ text: "Ethereum", diff --git a/src/components/Simulator/WalletHome/NFTList.tsx b/src/components/Simulator/WalletHome/NFTList.tsx index add4e623ea3..29c072b4f4d 100644 --- a/src/components/Simulator/WalletHome/NFTList.tsx +++ b/src/components/Simulator/WalletHome/NFTList.tsx @@ -1,16 +1,12 @@ import React from "react" -import { - Box, - Flex, - type FlexProps, - Text, - useBreakpointValue, -} from "@chakra-ui/react" +import { Box, Flex, type FlexProps, Text } from "@chakra-ui/react" import { Image } from "@/components/Image" import type { NFT } from "./interfaces" +import { useBreakpointValue } from "@/hooks/useBreakpointValue" + type NFTListProps = FlexProps & { nfts: Array }