Skip to content

Commit 2ff48dd

Browse files
alexcambosealexcambose
authored
Merge pull request #3098 from pyth-network/feat/price-tag
feat(component-library): add symbol pair tag
2 parents de0d661 + 6e529a8 commit 2ff48dd

File tree

15 files changed

+80
-33
lines changed

15 files changed

+80
-33
lines changed

‎apps/insights/src/components/PriceFeed/header.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { Breadcrumbs } from "@pythnetwork/component-library/Breadcrumbs";
33
import { Button } from "@pythnetwork/component-library/Button";
44
import { Skeleton } from "@pythnetwork/component-library/Skeleton";
55
import { StatCard } from "@pythnetwork/component-library/StatCard";
6+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
67
import { Suspense } from "react";
78

89
import { Cluster } from "../../services/pyth";
@@ -16,7 +17,6 @@ import {
1617
YesterdaysPricesProvider,
1718
} from "../PriceFeedChangePercent";
1819
import { PriceFeedIcon } from "../PriceFeedIcon";
19-
import { PriceFeedTag } from "../PriceFeedTag";
2020
import { PriceName } from "../PriceName";
2121
import { getFeed } from "./get-feed";
2222
import styles from "./header.module.scss";
@@ -93,7 +93,7 @@ const PriceFeedHeaderImpl = (props: PriceFeedHeaderImplProps) => (
9393
})),
9494
})}
9595
>
96-
<PriceFeedTag
96+
<SymbolPairTag
9797
{...(props.isLoading
9898
? { isLoading: true }
9999
: {
@@ -108,7 +108,7 @@ const PriceFeedHeaderImpl = (props: PriceFeedHeaderImplProps) => (
108108
})}
109109
/>
110110
</PriceFeedSelect>
111-
<PriceFeedTag
111+
<SymbolPairTag
112112
className={styles.priceFeedTag}
113113
{...(props.isLoading
114114
? { isLoading: true }

‎apps/insights/src/components/PriceFeed/price-feed-select.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
"use client";
22

33
import { DropdownCaretDown } from "@pythnetwork/component-library/DropdownCaretDown";
4+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
45
import {
5-
Virtualizer,
66
ListLayout,
7+
Virtualizer,
78
} from "@pythnetwork/component-library/Virtualizer";
89
import { Button } from "@pythnetwork/component-library/unstyled/Button";
910
import { Dialog } from "@pythnetwork/component-library/unstyled/Dialog";
@@ -20,9 +21,8 @@ import { matchSorter } from "match-sorter";
2021
import type { ReactNode } from "react";
2122
import { useMemo, useState } from "react";
2223

23-
import styles from "./price-feed-select.module.scss";
2424
import { AssetClassBadge } from "../AssetClassBadge";
25-
import { PriceFeedTag } from "../PriceFeedTag";
25+
import styles from "./price-feed-select.module.scss";
2626

2727
type Props = {
2828
className: string | undefined;
@@ -111,7 +111,7 @@ const ResolvedPriceFeedSelect = ({
111111
}
112112
prefetch={false}
113113
>
114-
<PriceFeedTag
114+
<SymbolPairTag
115115
displaySymbol={displaySymbol}
116116
description={description}
117117
icon={icon}

‎apps/insights/src/components/PriceFeeds/coming-soon-list.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,14 @@
33
import { NoResults } from "@pythnetwork/component-library/NoResults";
44
import { SearchInput } from "@pythnetwork/component-library/SearchInput";
55
import { Select } from "@pythnetwork/component-library/Select";
6+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
67
import { Table } from "@pythnetwork/component-library/Table";
78
import type { ReactNode } from "react";
89
import { useMemo, useState } from "react";
910
import { useCollator, useFilter } from "react-aria";
1011

1112
import styles from "./coming-soon-list.module.scss";
1213
import { AssetClassBadge } from "../AssetClassBadge";
13-
import { PriceFeedTag } from "../PriceFeedTag";
1414

1515
type Props = {
1616
comingSoonFeeds: {
@@ -65,7 +65,7 @@ export const ComingSoonList = ({ comingSoonFeeds }: Props) => {
6565
href: `/price-feeds/${encodeURIComponent(symbol)}`,
6666
data: {
6767
priceFeedName: (
68-
<PriceFeedTag
68+
<SymbolPairTag
6969
description={description}
7070
displaySymbol={displaySymbol}
7171
icon={icon}

‎apps/insights/src/components/PriceFeeds/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { Button } from "@pythnetwork/component-library/Button";
88
import type { Props as CardProps } from "@pythnetwork/component-library/Card";
99
import { Card } from "@pythnetwork/component-library/Card";
1010
import { StatCard } from "@pythnetwork/component-library/StatCard";
11+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
1112
import { TabList } from "@pythnetwork/component-library/TabList";
1213
import {
1314
TabPanel as UnstyledTabPanel,
@@ -30,7 +31,6 @@ import {
3031
PriceFeedChangePercent,
3132
} from "../PriceFeedChangePercent";
3233
import { PriceFeedIcon } from "../PriceFeedIcon";
33-
import { PriceFeedTag } from "../PriceFeedTag";
3434

3535
const PRICE_FEEDS_ANCHOR = "priceFeeds";
3636

@@ -260,7 +260,7 @@ const FeaturedFeedsCard = <T extends ElementType>({
260260
href={`/price-feeds/${encodeURIComponent(feed.symbol)}`}
261261
>
262262
<div className={styles.feedCardContents}>
263-
<PriceFeedTag
263+
<SymbolPairTag
264264
displaySymbol={feed.product.display_symbol}
265265
description={feed.product.description}
266266
icon={

‎apps/insights/src/components/PriceFeeds/price-feeds-card.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { NoResults } from "@pythnetwork/component-library/NoResults";
88
import { Paginator } from "@pythnetwork/component-library/Paginator";
99
import { SearchInput } from "@pythnetwork/component-library/SearchInput";
1010
import { Select } from "@pythnetwork/component-library/Select";
11+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
1112
import type {
1213
RowConfig,
1314
SortDescriptor,
@@ -30,7 +31,6 @@ import {
3031
LiveValue,
3132
SKELETON_WIDTH,
3233
} from "../LivePrices";
33-
import { PriceFeedTag } from "../PriceFeedTag";
3434
import { PriceName } from "../PriceName";
3535
import styles from "./price-feeds-card.module.scss";
3636

@@ -137,7 +137,7 @@ const ResolvedPriceFeedsCard = ({ priceFeeds, ...props }: Props) => {
137137
<LiveConfidence feedKey={key} cluster={Cluster.Pythnet} />
138138
),
139139
priceFeedName: (
140-
<PriceFeedTag
140+
<SymbolPairTag
141141
description={description}
142142
displaySymbol={displaySymbol}
143143
icon={icon}
@@ -296,7 +296,7 @@ const PriceFeedsCardContents = ({ id, ...props }: PriceFeedsCardContents) => (
296296
<EntityList
297297
label="Price Feeds"
298298
className={styles.entityList ?? ""}
299-
headerLoadingSkeleton={<PriceFeedTag isLoading />}
299+
headerLoadingSkeleton={<SymbolPairTag isLoading />}
300300
fields={[
301301
{ id: "assetClass", name: "Asset Class" },
302302
{ id: "priceFeedId", name: "Price Feed ID" },
@@ -331,7 +331,7 @@ const PriceFeedsCardContents = ({ id, ...props }: PriceFeedsCardContents) => (
331331
name: "PRICE FEED",
332332
isRowHeader: true,
333333
alignment: "left",
334-
loadingSkeleton: <PriceFeedTag isLoading />,
334+
loadingSkeleton: <SymbolPairTag isLoading />,
335335
allowsSorting: true,
336336
},
337337
{

‎apps/insights/src/components/Publisher/performance.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { EntityList } from "@pythnetwork/component-library/EntityList";
77
import { Link } from "@pythnetwork/component-library/Link";
88
import type { Variant as NoResultsVariant } from "@pythnetwork/component-library/NoResults";
99
import { NoResults } from "@pythnetwork/component-library/NoResults";
10+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
1011
import { Table } from "@pythnetwork/component-library/Table";
1112
import { lookup } from "@pythnetwork/known-publishers";
1213
import { notFound } from "next/navigation";
@@ -25,7 +26,6 @@ import {
2526
ExplainAverage,
2627
} from "../Explanations";
2728
import { PriceFeedIcon } from "../PriceFeedIcon";
28-
import { PriceFeedTag } from "../PriceFeedTag";
2929
import { PublisherIcon } from "../PublisherIcon";
3030
import { PublisherTag } from "../PublisherTag";
3131
import { Ranking } from "../Ranking";
@@ -365,7 +365,7 @@ const TopFeedsCard = ({
365365
<TopFeedsTable
366366
label={`${title} Feeds`}
367367
publisherScoreWidth={PUBLISHER_SCORE_WIDTH}
368-
nameLoadingSkeleton={<PriceFeedTag isLoading />}
368+
nameLoadingSkeleton={<SymbolPairTag isLoading />}
369369
{...(props.isLoading
370370
? { isLoading: true }
371371
: {

‎apps/insights/src/components/Publisher/price-feeds.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
12
import { notFound } from "next/navigation";
23

34
import { getPriceFeeds } from "./get-price-feeds";
@@ -7,7 +8,6 @@ import { AssetClassBadge } from "../AssetClassBadge";
78
import type { PriceComponent } from "../PriceComponentsCard";
89
import { PriceComponentsCard } from "../PriceComponentsCard";
910
import { PriceFeedIcon } from "../PriceFeedIcon";
10-
import { PriceFeedTag } from "../PriceFeedTag";
1111

1212
type Props = {
1313
params: Promise<{
@@ -36,7 +36,7 @@ export const PriceFeeds = async ({ params }: Props) => {
3636
priceFeeds={feeds.map(({ ranking, feed, status }) => ({
3737
symbol: feed.symbol,
3838
name: (
39-
<PriceFeedTag
39+
<SymbolPairTag
4040
displaySymbol={feed.product.display_symbol}
4141
description={feed.product.description}
4242
icon={
@@ -80,7 +80,7 @@ const PriceFeedsCard = (props: PriceFeedsCardProps) => (
8080
<PriceComponentsCard
8181
label="Price Feeds"
8282
searchPlaceholder="Feed symbol"
83-
nameLoadingSkeleton={<PriceFeedTag isLoading />}
83+
nameLoadingSkeleton={<SymbolPairTag isLoading />}
8484
extraColumns={[
8585
{
8686
id: "assetClassBadge",

‎apps/insights/src/components/Publisher/top-feeds-table.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
"use client";
22

33
import { EntityList } from "@pythnetwork/component-library/EntityList";
4+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
45
import type { RowConfig } from "@pythnetwork/component-library/Table";
56
import { Table } from "@pythnetwork/component-library/Table";
67
import type { ReactNode } from "react";
@@ -11,7 +12,6 @@ import type { Cluster } from "../../services/pyth";
1112
import type { Status } from "../../status";
1213
import { AssetClassBadge } from "../AssetClassBadge";
1314
import { usePriceComponentDrawer } from "../PriceComponentDrawer";
14-
import { PriceFeedTag } from "../PriceFeedTag";
1515
import { Score } from "../Score";
1616

1717
type Props =
@@ -53,7 +53,7 @@ const ResolvedTopFeedsTable = ({
5353
() =>
5454
feeds.map((feed) => ({
5555
name: (
56-
<PriceFeedTag
56+
<SymbolPairTag
5757
displaySymbol={feed.displaySymbol}
5858
description={feed.description}
5959
icon={feed.icon}

‎apps/insights/src/components/Root/search-button.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { NoResults } from "@pythnetwork/component-library/NoResults";
88
import { SearchButton as SearchButtonComponent } from "@pythnetwork/component-library/SearchButton";
99
import { SearchInput } from "@pythnetwork/component-library/SearchInput";
1010
import { SingleToggleGroup } from "@pythnetwork/component-library/SingleToggleGroup";
11+
import { SymbolPairTag } from "@pythnetwork/component-library/SymbolPairTag";
1112
import {
1213
ListLayout,
1314
Virtualizer,
@@ -25,7 +26,6 @@ import { useCallback, useEffect, useMemo, useState } from "react";
2526

2627
import { Cluster, ClusterToName } from "../../services/pyth";
2728
import { AssetClassBadge } from "../AssetClassBadge";
28-
import { PriceFeedTag } from "../PriceFeedTag";
2929
import { PublisherTag } from "../PublisherTag";
3030
import { Score } from "../Score";
3131
import styles from "./search-button.module.scss";
@@ -241,7 +241,7 @@ const SearchDialogContents = ({
241241
>
242242
<div className={styles.smallScreen}>
243243
{result.type === ResultType.PriceFeed ? (
244-
<PriceFeedTag
244+
<SymbolPairTag
245245
className={styles.itemTag}
246246
displaySymbol={result.displaySymbol}
247247
description={result.description}
@@ -316,7 +316,7 @@ const SearchDialogContents = ({
316316
</div>
317317
{result.type === ResultType.PriceFeed ? (
318318
<>
319-
<PriceFeedTag
319+
<SymbolPairTag
320320
displaySymbol={result.displaySymbol}
321321
description={result.description}
322322
icon={result.icon}

‎packages/component-library/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@
7979
"autoprefixer": "catalog:",
8080
"babel-plugin-react-compiler": "catalog:",
8181
"copyfiles": "catalog:",
82+
"cryptocurrency-icons": "catalog:",
8283
"css-loader": "catalog:",
8384
"eslint": "catalog:",
8485
"jest": "catalog:",

0 commit comments

Comments
 (0)