Skip to content

Commit a384f76

Browse files
committed
Merge branch 'dev' into removeComponentsFromTsconfig
2 parents 5bce2ee + 2be6e65 commit a384f76

File tree

77 files changed

+1546
-783
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

77 files changed

+1546
-783
lines changed

netlify.toml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919

2020
[functions]
2121
included_files = [
22-
"!./src/data/**/*",
22+
"./src/intl/**/*",
2323
"!./public/**/*",
24-
24+
"!./node_modules/@swc/core-linux-x64-musl/**/*",
2525
]

src/components/CalloutBanner.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@ import Text from "@/components/OldText"
1010
export type CalloutBannerProps = FlexProps & {
1111
children?: React.ReactNode
1212
image: ImageProps["src"]
13-
imageWidth?: ImageProps["width"]
14-
maxImageWidth?: number
13+
imageWidth?: number
14+
maxImageWidth?: ImageProps["width"]
1515
titleKey: TranslationKey
1616
descriptionKey: TranslationKey
1717
alt: string
@@ -43,7 +43,8 @@ const CalloutBanner = ({
4343
<Image
4444
src={image}
4545
alt={alt}
46-
w={imageWidth}
46+
width={imageWidth}
47+
maxW={{ base: "auto", md: maxImageWidth }}
4748
style={{
4849
objectFit: "contain",
4950
}}

src/components/CardList.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ export type CardListItem = {
2424
link?: string
2525
id?: string
2626
image?: ImageProps["src"]
27+
imageWidth?: number
2728
alt?: string
2829
}
2930

@@ -51,6 +52,7 @@ const Card = ({
5152
caption,
5253
link,
5354
image,
55+
imageWidth = 20, // Set 20px as default image width, can be overrided if needed
5456
alt,
5557
...props
5658
}: CardProps) => {
@@ -62,7 +64,7 @@ const Card = ({
6264

6365
return (
6466
<CardContainer {...props}>
65-
{image && <Image src={image} alt={alt ?? ""} width={20} />}
67+
{image && <Image src={image} alt={alt ?? ""} width={imageWidth} />}
6668
<Flex flex="1 1 75%" direction="column">
6769
{isLink ? (
6870
<LinkOverlay
@@ -97,11 +99,13 @@ const Card = ({
9799

98100
export type CardListProps = BoxProps & {
99101
items: CardProps[]
102+
imageWidth?: number
100103
clickHandler?: (idx: string | number) => void
101104
}
102105

103106
const CardList = ({
104107
items,
108+
imageWidth,
105109
clickHandler = () => null,
106110
...props
107111
}: CardListProps) => (
@@ -112,7 +116,7 @@ const CardList = ({
112116

113117
return isLink ? (
114118
<LinkBox key={id || idx}>
115-
<Card {...listItem} />
119+
<Card {...listItem} imageWidth={imageWidth} />
116120
</LinkBox>
117121
) : (
118122
<Card

src/components/Contributors.tsx

Lines changed: 2 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,10 @@
1-
import { useEffect, useState } from "react"
21
import { shuffle } from "lodash"
32
import { Box, Flex, Image, LinkBox, LinkOverlay } from "@chakra-ui/react"
43

54
import InlineLink from "@/components/Link"
65
import Text from "@/components/OldText"
76

8-
// TODO: Re-import once Crowdin scripts are functional and data available
9-
// import data from "../data/contributors.json"
7+
import data from "!!raw-loader!@/../.all-contributorsrc"
108

119
export interface Contributor {
1210
login: string
@@ -17,15 +15,7 @@ export interface Contributor {
1715
}
1816

1917
const Contributors = () => {
20-
const [contributorsList, setContributorsList] = useState<Array<Contributor>>(
21-
[]
22-
)
23-
24-
// TODO: Re-enable once Crowdin scripts are functional and data available
25-
// useEffect(() => {
26-
// const list = shuffle(data.contributors)
27-
// setContributorsList(list)
28-
// }, [])
18+
const contributorsList = shuffle(JSON.parse(data).contributors)
2919

3020
return (
3121
<>

src/components/DataProductCard.tsx

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
import React from "react"
2+
import { StaticImageData } from "next/image"
3+
import {
4+
Box,
5+
Flex,
6+
Heading,
7+
LinkBox,
8+
LinkOverlay,
9+
useColorModeValue,
10+
} from "@chakra-ui/react"
11+
12+
import { Image } from "@/components/Image"
13+
14+
import Text from "./OldText"
15+
16+
export interface DataRow {
17+
logo: StaticImageData
18+
coin: string
19+
apy: string
20+
}
21+
22+
export interface IProps {
23+
url: string
24+
background: string
25+
image: StaticImageData
26+
imgWidth: string
27+
alt?: string
28+
name: string
29+
description?: string
30+
data?: Array<DataRow>
31+
}
32+
33+
const DataProductCard: React.FC<IProps> = ({
34+
url,
35+
background,
36+
image,
37+
imgWidth,
38+
alt,
39+
name,
40+
description,
41+
data,
42+
}) => {
43+
const boxShadow = useColorModeValue("tableBox.light", "tableBox.dark")
44+
45+
return (
46+
<LinkBox
47+
color="text"
48+
background="searchBackground"
49+
border="1px solid"
50+
borderColor="lightBorder"
51+
borderRadius="base"
52+
overflow="hidden"
53+
boxShadow={boxShadow}
54+
display="flex"
55+
flexDirection="column"
56+
_hover={{
57+
background: "tableBackgroundHover",
58+
boxShadow: boxShadow,
59+
transition: "transform 0.1s ease 0s",
60+
transform: "scale(1.02)",
61+
}}
62+
>
63+
<Flex
64+
alignItems="center"
65+
justifyContent="center"
66+
boxShadow="rgb(0 0 0 / 10%) 0px -1px 0px inset;"
67+
minH="200px"
68+
bg={background}
69+
>
70+
<Image
71+
src={image}
72+
objectFit="cover"
73+
alt={alt ? alt : `${name} logo`}
74+
w={imgWidth}
75+
alignSelf="center"
76+
maxWidth={{ base: "311px", sm: "372px" }}
77+
maxHeight="257px"
78+
/>
79+
</Flex>
80+
<Flex
81+
textAlign="start"
82+
flexDirection="column"
83+
justifyContent="space-between"
84+
>
85+
<Box>
86+
<Heading
87+
as="h3"
88+
size="lg"
89+
fontSize="2xl"
90+
fontWeight="600"
91+
lineHeight="1.4"
92+
my={8}
93+
mx={4}
94+
mb={4}
95+
>
96+
<LinkOverlay href={url} isExternal>
97+
{name}
98+
</LinkOverlay>
99+
</Heading>
100+
<Text fontSize="sm" opacity="0.8" mx={4} mb={4} lineHeight="140%">
101+
{description}
102+
</Text>
103+
</Box>
104+
{data && (
105+
<Box
106+
overflowY="scroll"
107+
maxHeight="160px"
108+
mb={4}
109+
borderTop="1px solid"
110+
borderColor="lightBorder"
111+
>
112+
{data.map(({ logo, coin, apy }, idx) => (
113+
<Flex
114+
key={idx}
115+
color="text300"
116+
fontSize="sm"
117+
justify="space-between"
118+
p={4}
119+
textTransform="uppercase"
120+
border="1px solid"
121+
borderColor="lightBorder"
122+
borderInlineStart="0"
123+
borderInlineEnd="0"
124+
>
125+
<Flex alignItems="center">
126+
{logo && (
127+
<Image
128+
src={logo}
129+
objectFit="cover"
130+
alt=""
131+
minWidth="24px"
132+
me="0.5rem"
133+
/>
134+
)}
135+
{coin}
136+
</Flex>
137+
<Flex alignItems="center">{apy}% APY</Flex>
138+
</Flex>
139+
))}
140+
</Box>
141+
)}
142+
</Flex>
143+
</LinkBox>
144+
)
145+
}
146+
147+
export default DataProductCard

src/components/StablecoinAccordion/AccordionCustomItem.tsx

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
import React, { ReactNode } from "react"
1+
import { ReactNode } from "react"
2+
import { useTranslation } from "next-i18next"
23
import {
34
AccordionButton,
45
AccordionItem,
@@ -12,7 +13,6 @@ import {
1213

1314
import Emoji from "../Emoji"
1415
import Pill from "../Pill"
15-
import Translation from "../Translation"
1616

1717
import { accordionButtonContent, CategoryNameType } from "./utils"
1818
import { ChildOnlyType } from "."
@@ -26,13 +26,13 @@ export const RightColumnPanel = (props: ChildOnlyType) => (
2626
)
2727

2828
const MoreOrLessLink = ({ isOpen }: { isOpen: boolean }) => {
29+
const { t } = useTranslation("page-stablecoins")
30+
2931
return (
3032
<Box me={6} color="primary.base">
31-
{isOpen ? (
32-
<Translation id="page-stablecoins-accordion-less" />
33-
) : (
34-
<Translation id="page-stablecoins-accordion-more" />
35-
)}
33+
{isOpen
34+
? t("page-stablecoins-accordion-less")
35+
: t("page-stablecoins-accordion-more")}
3636
</Box>
3737
)
3838
}
@@ -47,6 +47,7 @@ interface AccordionCustomItemProps {
4747

4848
export const AccordionCustomItem = (props: AccordionCustomItemProps) => {
4949
const { category, children } = props
50+
const { t } = useTranslation("page-stablecoins")
5051

5152
const contentObj = accordionButtonContent[category]
5253

@@ -80,16 +81,16 @@ export const AccordionCustomItem = (props: AccordionCustomItemProps) => {
8081
fontSize={{ base: "1.25rem", md: "1.5rem" }}
8182
lineHeight={1.4}
8283
>
83-
<Translation id={contentObj.title} />
84+
{t(contentObj.title)}
8485
</Heading>
8586
{!!contentObj.pill && (
8687
<Pill ms={4} background={contentObj.pill.color}>
87-
<Translation id={contentObj.pill.name} />
88+
{t(contentObj.pill.name)}
8889
</Pill>
8990
)}
9091
</Flex>
9192
<Text color="text200" textAlign="start">
92-
<Translation id={contentObj.textPreview} />
93+
{t(contentObj.textPreview)}
9394
</Text>
9495
</Box>
9596
</Flex>

0 commit comments

Comments
 (0)