diff --git a/explorer-nextjs/app/components/ExplorerCard.tsx b/explorer-nextjs/app/components/ExplorerCard.tsx
index 4ca5d45378..c33b510402 100644
--- a/explorer-nextjs/app/components/ExplorerCard.tsx
+++ b/explorer-nextjs/app/components/ExplorerCard.tsx
@@ -1,4 +1,4 @@
-import { Card, CardContent, Typography, Box } from "@mui/material";
+import { Card, CardContent, Typography, Box, IconButton } from "@mui/material";
import React, { FC, ReactElement, ReactEventHandler } from "react";
import { ExplorerLineChart, IExplorerLineChartData } from "./ExplorerLineChart";
import {
@@ -8,6 +8,8 @@ import {
import ArrowDownwardIcon from "@mui/icons-material/ArrowDownward";
import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward";
import { NymTokenSVG } from "../icons/NymTokenSVG";
+import { CopyToClipboard } from "@nymproject/react/clipboard/CopyToClipboard";
+
import Image from "next/image";
import profileImagePlaceholder from "../../public/profileImagePlaceholder.png";
import Flag from "react-world-flags";
@@ -116,6 +118,37 @@ const CardProfileCountry = (props: ICardProfileCountry) => {
);
};
+interface ICardCopyAddressProps {
+ title: string;
+ address: string;
+}
+
+const CardCopyAddress = (props: ICardCopyAddressProps) => {
+ const { title, address } = props;
+ return (
+
+ {title}
+
+ {address}
+
+
+
+
+ );
+};
+
export type ContentCardProps = {
overTitle?: string;
profileImage?: ICardProileImage;
@@ -128,6 +161,8 @@ export type ContentCardProps = {
progressBar?: IExplorerProgressBarProps;
paragraph?: string;
onClick?: ReactEventHandler;
+ nymAddress?: ICardCopyAddressProps;
+ identityKey?: ICardCopyAddressProps;
};
export const ExplorerCard: FC = ({
@@ -142,6 +177,8 @@ export const ExplorerCard: FC = ({
onClick,
profileImage,
profileCountry,
+ nymAddress,
+ identityKey,
}) => (
@@ -159,6 +196,8 @@ export const ExplorerCard: FC = ({
{profileCountry && }
{upDownLine && }
{titlePrice && }
+ {nymAddress && }
+ {identityKey && }
{dataRows && }
{graph && (
diff --git a/explorer-nextjs/app/page.tsx b/explorer-nextjs/app/page.tsx
index 14535bc06f..7911b8f907 100644
--- a/explorer-nextjs/app/page.tsx
+++ b/explorer-nextjs/app/page.tsx
@@ -81,6 +81,14 @@ const explorerCard: ContentCardProps = {
color: "#00CA33",
label: "Label",
},
+ nymAddress: {
+ address: "n1w7tfthyfkhh3au3mqpy294p4dk65dzal2h04su",
+ title: "Nym address",
+ },
+ identityKey: {
+ address: "n1w7tfthyfkhh3au3mqpy294p4dk65dzal2h04su",
+ title: "Nym address",
+ },
paragraph: "Additional line",
};