diff --git a/app/(fees)/fees/page.tsx b/app/(fees)/fees/page.tsx
index 19083caf..7c05b584 100644
--- a/app/(fees)/fees/page.tsx
+++ b/app/(fees)/fees/page.tsx
@@ -58,23 +58,23 @@ const getGradientColor = (percentage) => {
const r = Math.floor(
parseInt(lowerBound.color.substring(1, 3), 16) +
- percentDiff *
- (parseInt(upperBound.color.substring(1, 3), 16) -
- parseInt(lowerBound.color.substring(1, 3), 16)),
+ percentDiff *
+ (parseInt(upperBound.color.substring(1, 3), 16) -
+ parseInt(lowerBound.color.substring(1, 3), 16)),
);
const g = Math.floor(
parseInt(lowerBound.color.substring(3, 5), 16) +
- percentDiff *
- (parseInt(upperBound.color.substring(3, 5), 16) -
- parseInt(lowerBound.color.substring(3, 5), 16)),
+ percentDiff *
+ (parseInt(upperBound.color.substring(3, 5), 16) -
+ parseInt(lowerBound.color.substring(3, 5), 16)),
);
const b = Math.floor(
parseInt(lowerBound.color.substring(5, 7), 16) +
- percentDiff *
- (parseInt(upperBound.color.substring(5, 7), 16) -
- parseInt(lowerBound.color.substring(5, 7), 16)),
+ percentDiff *
+ (parseInt(upperBound.color.substring(5, 7), 16) -
+ parseInt(lowerBound.color.substring(5, 7), 16)),
);
return `#${r.toString(16).padStart(2, "0")}${g
@@ -610,8 +610,8 @@ export default function FeesPage() {
chain,
metric: (data as any)["hourly"][selectedQuantitative]?.data[index]
? (data as any)["hourly"][selectedQuantitative]?.data[index][
- quantitativeValueIndex
- ]
+ quantitativeValueIndex
+ ]
: null,
}),
);
@@ -627,7 +627,7 @@ export default function FeesPage() {
return sortedChains.reduce((acc, { chain }) => {
if (
feeData.chain_data[chain]?.["hourly"]?.[selectedQuantitative]?.data?.[
- index
+ index
] !== undefined
) {
acc[chain] =
@@ -658,8 +658,8 @@ export default function FeesPage() {
chain,
metric: data["hourly"][selectedQuantitative]?.data[index]
? data["hourly"][selectedQuantitative]?.data[index][
- quantitativeValueIndex
- ]
+ quantitativeValueIndex
+ ]
: null,
}),
);
@@ -674,7 +674,7 @@ export default function FeesPage() {
const result = sortedChains.reduce((acc, { chain }) => {
if (
feeData.chain_data[chain]?.["hourly"]?.[selectedQuantitative]?.data?.[
- index
+ index
] !== undefined
) {
acc[chain] =
@@ -706,20 +706,20 @@ export default function FeesPage() {
const getGradientColor = useCallback((percentage, weighted = false) => {
const colors = !weighted
? [
- { percent: 0, color: "#1DF7EF" },
- { percent: 20, color: "#76EDA0" },
- { percent: 50, color: "#FFDF27" },
- { percent: 70, color: "#FF9B47" },
- { percent: 100, color: "#FE5468" },
- ]
+ { percent: 0, color: "#1DF7EF" },
+ { percent: 20, color: "#76EDA0" },
+ { percent: 50, color: "#FFDF27" },
+ { percent: 70, color: "#FF9B47" },
+ { percent: 100, color: "#FE5468" },
+ ]
: [
- { percent: 0, color: "#1DF7EF" },
- { percent: 2, color: "#76EDA0" },
- { percent: 10, color: "#FFDF27" },
- { percent: 40, color: "#FF9B47" },
- { percent: 80, color: "#FE5468" },
- { percent: 100, color: "#FE5468" }, // Repeat the final color to ensure upper bound
- ];
+ { percent: 0, color: "#1DF7EF" },
+ { percent: 2, color: "#76EDA0" },
+ { percent: 10, color: "#FFDF27" },
+ { percent: 40, color: "#FF9B47" },
+ { percent: 80, color: "#FE5468" },
+ { percent: 100, color: "#FE5468" }, // Repeat the final color to ensure upper bound
+ ];
let lowerBound = colors[0];
let upperBound = colors[colors.length - 1];
@@ -747,23 +747,23 @@ export default function FeesPage() {
const r = Math.floor(
parseInt(lowerBound.color.substring(1, 3), 16) +
- percentDiff *
- (parseInt(upperBound.color.substring(1, 3), 16) -
- parseInt(lowerBound.color.substring(1, 3), 16)),
+ percentDiff *
+ (parseInt(upperBound.color.substring(1, 3), 16) -
+ parseInt(lowerBound.color.substring(1, 3), 16)),
);
const g = Math.floor(
parseInt(lowerBound.color.substring(3, 5), 16) +
- percentDiff *
- (parseInt(upperBound.color.substring(3, 5), 16) -
- parseInt(lowerBound.color.substring(3, 5), 16)),
+ percentDiff *
+ (parseInt(upperBound.color.substring(3, 5), 16) -
+ parseInt(lowerBound.color.substring(3, 5), 16)),
);
const b = Math.floor(
parseInt(lowerBound.color.substring(5, 7), 16) +
- percentDiff *
- (parseInt(upperBound.color.substring(5, 7), 16) -
- parseInt(lowerBound.color.substring(5, 7), 16)),
+ percentDiff *
+ (parseInt(upperBound.color.substring(5, 7), 16) -
+ parseInt(lowerBound.color.substring(5, 7), 16)),
);
return `#${r.toString(16).padStart(2, "0")}${g
@@ -869,15 +869,15 @@ export default function FeesPage() {
// this should be in reverse order
return getGradientColor(
100 -
- Math.floor(
- (feeIndexSort[optIndex][chain][quantitativeValueIndex] /
- feeIndexSort[optIndex][
- Object.keys(feeIndexSort[optIndex])[
- Object.keys(feeIndexSort[optIndex]).length - 1
- ]
- ][quantitativeValueIndex]) *
- 100,
- ),
+ Math.floor(
+ (feeIndexSort[optIndex][chain][quantitativeValueIndex] /
+ feeIndexSort[optIndex][
+ Object.keys(feeIndexSort[optIndex])[
+ Object.keys(feeIndexSort[optIndex]).length - 1
+ ]
+ ][quantitativeValueIndex]) *
+ 100,
+ ),
true,
);
}
@@ -885,11 +885,11 @@ export default function FeesPage() {
Math.floor(
(feeIndexSort[optIndex][chain][quantitativeValueIndex] /
feeIndexSort[optIndex][
- Object.keys(feeIndexSort[optIndex])[
- Object.keys(feeIndexSort[optIndex]).length - 1
- ]
+ Object.keys(feeIndexSort[optIndex])[
+ Object.keys(feeIndexSort[optIndex]).length - 1
+ ]
][quantitativeValueIndex]) *
- 100,
+ 100,
),
true,
);
@@ -1024,8 +1024,8 @@ export default function FeesPage() {
unitKey === "eth" && showGwei
? 2
: master.fee_metrics[metric].units[unitKey]
- ? master.fee_metrics[metric].units[unitKey].decimals
- : 2;
+ ? master.fee_metrics[metric].units[unitKey].decimals
+ : 2;
if (master.fee_metrics[metric].currency && showUsd && showCents) {
decimals = master.fee_metrics[metric].units["usd"].decimals - 2;
@@ -1069,10 +1069,10 @@ export default function FeesPage() {
{lessThanOverride
? lessThanValue
: Intl.NumberFormat(undefined, {
- notation: "compact",
- maximumFractionDigits: decimals,
- minimumFractionDigits: decimals,
- }).format(multipliedValue)}
+ notation: "compact",
+ maximumFractionDigits: decimals,
+ minimumFractionDigits: decimals,
+ }).format(multipliedValue)}
{master.fee_metrics[metric].currency && showUsd && showCents && (
@@ -1087,11 +1087,10 @@ export default function FeesPage() {
{!master.fee_metrics[metric].currency && (
{master.fee_metrics[metric].units[unitKey].suffix
? master.fee_metrics[metric].units[unitKey].suffix
@@ -1100,11 +1099,10 @@ export default function FeesPage() {
)}
{master.fee_metrics[metric].suffix && (
{master.fee_metrics[metric].units[unitKey].suffix
? master.fee_metrics[metric].units[unitKey].suffix
@@ -1152,10 +1150,10 @@ export default function FeesPage() {
{lessThanOverride
? lessThanValue
: Intl.NumberFormat(undefined, {
- notation: "compact",
- maximumFractionDigits: decimals,
- minimumFractionDigits: decimals,
- }).format(multipliedValue)}
+ notation: "compact",
+ maximumFractionDigits: decimals,
+ minimumFractionDigits: decimals,
+ }).format(multipliedValue)}
{master.fee_metrics[metric].currency && showUsd && showCents && (
@@ -1169,11 +1167,10 @@ export default function FeesPage() {
)}
{!master.fee_metrics[metric].currency && (
{master.fee_metrics[metric].units[unitKey].suffix
? master.fee_metrics[metric].units[unitKey].suffix
@@ -1182,11 +1179,10 @@ export default function FeesPage() {
)}
{master.fee_metrics[metric].suffix && (
{master.fee_metrics[metric].units[unitKey].suffix
? master.fee_metrics[metric].units[unitKey].suffix
@@ -1257,7 +1253,7 @@ export default function FeesPage() {
? `${isMobile ? 313 + 60 : 413 + 60}px`
: `${96 + 60}px`,
}}
- // ref={pageRef}
+ // ref={pageRef}
>
@@ -1318,11 +1314,10 @@ export default function FeesPage() {
Main platform
{
setHoverSettings(true);
}}
@@ -1331,9 +1326,8 @@ export default function FeesPage() {
}}
>
{
@@ -1377,9 +1368,8 @@ export default function FeesPage() {
@@ -1392,9 +1382,8 @@ export default function FeesPage() {
USD Display
@@ -1413,9 +1402,8 @@ export default function FeesPage() {
Full Dollar
US Cents
@@ -1451,7 +1439,7 @@ export default function FeesPage() {
(metricKey) =>
metrics[metricKey] &&
master.fee_metrics[metricKey].category ==
- categoryKey,
+ categoryKey,
)
.sort((a, b) => {
// sort by priority
@@ -1481,9 +1469,8 @@ export default function FeesPage() {
{master.fee_metrics[metric].name}
@@ -1560,10 +1547,9 @@ export default function FeesPage() {
Enabled
Disabled
@@ -1638,11 +1624,10 @@ export default function FeesPage() {
: "formkit:arrowup"
: "formkit:arrowdown"
}
- className={` dark:text-white text-black w-[10px] h-[10px] ${
- selectedQualitative === "chain"
+ className={` dark:text-white text-black w-[10px] h-[10px] ${selectedQualitative === "chain"
? "opacity-100"
: "opacity-20"
- }`}
+ }`}
/>{" "}
Data Availability
:{" "}
@@ -1728,38 +1712,37 @@ export default function FeesPage() {
).length === 1
? undefined
: Object.keys(metrics)
- .filter(
- (metric) =>
- metrics[metric].enabled &&
- master.fee_metrics[metric].category ===
- category,
- )
- .map(
- (metric, i) =>
- // `minmax(${
- // i === 0
- // ? metrics[metric].width - 40
- // : metrics[metric].width
- // }px, 100%)`,
- `minmax(${
- i === 0
- ? metrics[metric].width - 60
- : metrics[metric].width
- }px`,
- )
- .join(" "),
+ .filter(
+ (metric) =>
+ metrics[metric].enabled &&
+ master.fee_metrics[metric].category ===
+ category,
+ )
+ .map(
+ (metric, i) =>
+ // `minmax(${
+ // i === 0
+ // ? metrics[metric].width - 40
+ // : metrics[metric].width
+ // }px, 100%)`,
+ `minmax(${i === 0
+ ? metrics[metric].width - 60
+ : metrics[metric].width
+ }px`,
+ )
+ .join(" "),
}}
>
{Object.keys(metrics).filter(
(metric) => metrics[metric].enabled,
).length > 1 && (
- <>
-
- {category} Metrics
-
-
- >
- )}
+ <>
+
+ {category} Metrics
+
+
+ >
+ )}
{Object.keys(metrics)
.filter(
@@ -1813,13 +1796,13 @@ export default function FeesPage() {
{Object.keys(metrics).filter(
(metric) => metrics[metric].enabled,
).length === 1 && (
-
-
- {category} Metrics
+
+
+ {category} Metrics
+
+
-
-
- )}
+ )}
{
@@ -1831,18 +1814,17 @@ export default function FeesPage() {
@@ -1858,11 +1840,10 @@ export default function FeesPage() {
>
= 18 && selectedBarIndex <= 22
+ className={`absolute right-[5px] w-[29px] h-[12px] text-[8px] transition-all duration-100 ${selectedBarIndex >= 18 && selectedBarIndex <= 22
? "-top-[22px]"
: "-top-2"
- }`}
+ }`}
>
hourly
@@ -1870,13 +1851,12 @@ export default function FeesPage() {
{
setHoverBarIndex(index);
@@ -1889,13 +1869,12 @@ export default function FeesPage() {
}}
>
))}
@@ -1923,13 +1902,12 @@ export default function FeesPage() {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
- className={`w-[18px] h-[18px] ${
- selectedChainOutcomes === 0
+ className={`w-[18px] h-[18px] ${selectedChainOutcomes === 0
? "opacity-0"
: selectedChainOutcomes === 1
- ? "opacity-40"
- : "opacity-0"
- }`}
+ ? "opacity-40"
+ : "opacity-0"
+ }`}
>
@@ -1972,34 +1949,31 @@ export default function FeesPage() {
>
{isMobile
@@ -2048,23 +2022,21 @@ export default function FeesPage() {
>
{avail.label}
@@ -2101,7 +2073,7 @@ export default function FeesPage() {
(metric) =>
metrics[metric].enabled &&
master.fee_metrics[metric].category ===
- category,
+ category,
);
},
)
@@ -2122,26 +2094,25 @@ export default function FeesPage() {
).length === 1
? undefined
: Object.keys(metrics)
- .filter(
- (metric) =>
- metrics[metric].enabled &&
- master.fee_metrics[metric]
- .category === category,
- )
- .map(
- (metric, i) =>
- // `minmax(${
- // i === 0
- // ? metrics[metric].width - 40
- // : metrics[metric].width
- // }px, 100%)`,
- `minmax(${
- i === 0
- ? metrics[metric].width - 60
- : metrics[metric].width
- }px`,
- )
- .join(" "),
+ .filter(
+ (metric) =>
+ metrics[metric].enabled &&
+ master.fee_metrics[metric]
+ .category === category,
+ )
+ .map(
+ (metric, i) =>
+ // `minmax(${
+ // i === 0
+ // ? metrics[metric].width - 40
+ // : metrics[metric].width
+ // }px, 100%)`,
+ `minmax(${i === 0
+ ? metrics[metric].width - 60
+ : metrics[metric].width
+ }px`,
+ )
+ .join(" "),
}}
>
{Object.keys(metrics)
@@ -2210,13 +2181,12 @@ export default function FeesPage() {
}}
>
{
if (selectedQualitative === "availability") {
if (
@@ -2243,7 +2212,7 @@ export default function FeesPage() {
) {
if (
dataAvailByChain[item.chain[1]][0].label ===
- selectedAvailability &&
+ selectedAvailability &&
!manualSelectedChains[item.chain[1]]
) {
setManualSelectedChains(
@@ -2265,7 +2234,7 @@ export default function FeesPage() {
);
} else if (
dataAvailByChain[item.chain[1]][0].label !==
- selectedAvailability &&
+ selectedAvailability &&
manualSelectedChains[item.chain[1]]
) {
setManualSelectedChains(
@@ -2293,7 +2262,7 @@ export default function FeesPage() {
...prevManualSelectedChains,
[item.chain[1]]:
!manualSelectedChains[
- item.chain[1]
+ item.chain[1]
], // Replace newKey and newValue with the key-value pair you want to add
};
},
@@ -2338,11 +2307,10 @@ export default function FeesPage() {
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
- className={`w-[22px] h-[22px] ${
- !selectedChains[item.chain[1]]
+ className={`w-[22px] h-[22px] ${!selectedChains[item.chain[1]]
? "opacity-100"
: "opacity-0"
- }`}
+ }`}
>
metrics[metric].enabled &&
master.fee_metrics[metric].category ===
- category,
+ category,
);
},
)
@@ -2448,26 +2412,25 @@ export default function FeesPage() {
).length === 1
? undefined
: Object.keys(metrics)
- .filter(
- (metric) =>
- metrics[metric].enabled &&
- master.fee_metrics[metric]
- .category === category,
- )
- .map(
- (metric, i) =>
- // `minmax(${
- // i === 0
- // ? metrics[metric].width - 40
- // : metrics[metric].width
- // }px, 100%)`,
- `minmax(${
- i === 0
- ? metrics[metric].width - 60
- : metrics[metric].width
- }px`,
- )
- .join(" "),
+ .filter(
+ (metric) =>
+ metrics[metric].enabled &&
+ master.fee_metrics[metric]
+ .category === category,
+ )
+ .map(
+ (metric, i) =>
+ // `minmax(${
+ // i === 0
+ // ? metrics[metric].width - 40
+ // : metrics[metric].width
+ // }px, 100%)`,
+ `minmax(${i === 0
+ ? metrics[metric].width - 60
+ : metrics[metric].width
+ }px`,
+ )
+ .join(" "),
}}
>
{Object.keys(metrics)
@@ -2535,13 +2498,12 @@ export default function FeesPage() {
}}
>
void;
+ downloadJSON: () => void;
+}) {
const { isMobile } = useUIContext();
+
+ const [showDeploymentTx, setShowDeploymentTx] = useSessionStorage(
+ "labels::showDeploymentTx",
+ false
+ );
+
+ const [showDeployerAddress, setShowDeployerAddress] = useSessionStorage(
+ "labels::showDeployerAddress",
+ false
+ );
+
+ const [labelsNumberFiltered, setLabelsNumberFiltered] =
+ useSessionStorage
("labelsNumberFiltered", 0);
+
return (
@@ -28,21 +49,160 @@ export default function FloatingBar() {
-
-
-
+
+
-
- Settings
+
+
+
+
+
+
+
+ Columns
+
+
+
+ {/*
*/}
+
+ Deployment Tx
+
+
+ {/*
*/}
+
+
{
+ setShowDeployerAddress(!showDeployerAddress);
+ }}
+ >
+
+
+ Enabled
+
+
+ Disabled
+
+
+
+
+ {showDeployerAddress ? "Enabled" : "Disabled"}
+
+
+
+
+
+
+ {/*
*/}
+
+ Deployer Address
+
+
+ {/*
*/}
+
+
{
+ setShowDeploymentTx(!showDeploymentTx);
+ }}
+ >
+
+
+ Enabled
+
+
+ Disabled
+
+
+
+
+ {showDeploymentTx ? "Enabled" : "Disabled"}
+
+
+
+
+
+
+
+ {/*
*/}
+
-
-
-
+
0 && labelsNumberFiltered <= 100 ? "hidden md:block" : "hidden"}`}>
+
0 && labelsNumberFiltered <= 100 ? "hidden md:flex" : "hidden "} items-center bg-[#1F2726] gap-x-[10px] rounded-full p-[10px] pr-0 transition-all duration-300`}
+ >
+
+
+
+
+ Download
+
+
+
+
+
+
+
+
+
+
+ Format
+
+
{
+ downloadJSON();
+ }}>
+
+
+ JSON
+
+
+
{
+ downloadCSV();
+ }}>
+
+
+ CSV
+
+
+
+
+
+
+ {/*
*/}
+
diff --git a/app/(labels)/labels/Footer.tsx b/app/(labels)/labels/Footer.tsx
index 8ce8ad38..e4ce1124 100644
--- a/app/(labels)/labels/Footer.tsx
+++ b/app/(labels)/labels/Footer.tsx
@@ -7,7 +7,13 @@ import Search from "./Search";
import FloatingBar from "./FloatingBar";
import LabelsContainer from "@/components/layout/LabelsContainer";
-export default function Footer() {
+export default function Footer({
+ downloadCSV,
+ downloadJSON,
+}: {
+ downloadCSV: () => void;
+ downloadJSON: () => void;
+}) {
const { isMobile } = useUIContext();
return (
@@ -26,7 +32,7 @@ export default function Footer() {
- {isMobile && }
+ {isMobile && }
diff --git a/app/(labels)/labels/Header.tsx b/app/(labels)/labels/Header.tsx
index 92d7af64..e1571415 100644
--- a/app/(labels)/labels/Header.tsx
+++ b/app/(labels)/labels/Header.tsx
@@ -13,7 +13,13 @@ import Search from "./Search";
import { useUIContext } from "@/contexts/UIContext";
import FloatingBar from "./FloatingBar";
-export default function Header() {
+export default function Header({
+ downloadCSV,
+ downloadJSON,
+}: {
+ downloadCSV: () => void;
+ downloadJSON: () => void;
+}) {
const { isMobile } = useUIContext();
return (
@@ -69,7 +75,7 @@ export default function Header() {
*/}
- {!isMobile && }
+ {!isMobile && }
{/*
setIsOpen(true)}
>
@@ -325,7 +325,7 @@ export default function Search() {
0 ? "w-[63px]" : "flex-1"} pl-[11px] h-full bg-transparent text-white placeholder-[#CDD8D3] border-none outline-none`}
+ className={`${isOpen ? "flex-1" : Filters.length > 0 ? "w-[63px]" : "flex-1"} pl-[11px] h-full bg-transparent text-white placeholder-[#CDD8D3] border-none outline-none overflow-x-clip`}
placeholder="Search"
value={search}
onChange={(e) => setSearch(e.target.value)}
@@ -455,8 +455,8 @@ export default function Search() {
className={`z-[0] absolute flex flex-col-reverse md:flex-col rounded-t-[22px] md:rounded-t-none md:rounded-b-[22px] bg-[#151A19] left-0 right-0 bottom-[calc(100%-22px)] md:bottom-auto md:top-[calc(100%-22px)] shadow-[0px_0px_50px_0px_#000000] transition-all duration-300 ${isOpen ? "max-h-[650px]" : "max-h-0"
} overflow-hidden overflow-y-auto lg:overflow-y-hidden scrollbar-thin scrollbar-thumb-forest-700 scrollbar-track-transparent`}
>
-
-
+
0 ? "max-h-[100px]" : "max-h-[20px] opacity-0 !p-0"} transition-all duration-300 overflow-clip`}>
+
("labelsChainsFilter", []);
@@ -451,7 +466,7 @@ export default function LabelsPage() {
}
if (
- ["owner_project", "address", "name", "category", "subcategory"].includes(
+ ["owner_project", "address", "name", "category", "subcategory", "deployment_tx", "deployer_address"].includes(
sort.metric,
)
) {
@@ -602,6 +617,88 @@ export default function LabelsPage() {
}, []);
+ const gridTemplateColumns = useMemo(() => {
+
+ const cols = ["15px", "minmax(200px,1600px)", "150px", "200px", "105px", "105px", "175px", "192px"];
+
+
+ if (showDeployerAddress) {
+ cols.splice(7, 0, "120px");
+ }
+
+ if (showDeploymentTx) {
+ cols.splice(7, 0, "120px");
+ }
+
+ return cols.join(" ");
+ }, [showDeployerAddress, showDeploymentTx]);
+
+
+ const downloadCSV = useCallback(() => {
+ // compile CSV from data w/ headers
+ const headers = [
+ "Contract Address",
+ "Owner Project",
+ "Contract Name",
+ "Category",
+ "Subcategory",
+ "Deployment Date",
+ "Transaction Count",
+ "Gas Fees",
+ "Active Addresses",
+ "Origin Key",
+ "Deployment Tx",
+ "Deployer Address",
+ ];
+
+ const rows = filteredLabelsData.map((label) => {
+ return [
+ label.address,
+ label.owner_project,
+ label.name,
+ label.category,
+ label.subcategory,
+ label.deployment_date,
+ label.txcount,
+ label.gas_fees_usd,
+ label.daa,
+ label.origin_key,
+ label.deployment_tx,
+ label.deployer_address,
+ ];
+ });
+
+ const csv = [headers, ...rows].map((row) => row.join(",")).join("\n");
+
+ const blob = new Blob([csv], { type: "text/csv" });
+
+ const url = URL.createObjectURL(blob);
+
+ const a = document.createElement
+ ("a");
+ a.href = url;
+ a.download = "labels.csv";
+ a.click();
+ URL.revokeObjectURL(url);
+ }, [filteredLabelsData]);
+
+
+ const downloadJSON = useCallback(() => {
+ const json = JSON.stringify(filteredLabelsData, null, 2);
+
+ const blob = new Blob([json], { type: "application/json" });
+
+ const url = URL.createObjectURL(blob);
+
+ const a = document.createElement("a");
+ a.href = url;
+ a.download = "labels.json";
+ a.click();
+ URL.revokeObjectURL(url);
+ }, [filteredLabelsData]);
+
+
+
return (
<>
@@ -610,7 +707,7 @@ export default function LabelsPage() {
dataValidating={[masterValidating, quickLabelsLoading]}
/>
- {master && }
+ {master && }
{/* */}
@@ -655,7 +752,13 @@ export default function LabelsPage() {
header={
<>
{filteredLabelsData && (
-
+
+
{
@@ -834,6 +938,66 @@ export default function LabelsPage() {
}}
/>
+ {showDeploymentTx && (
+ {
+ setSort({
+ metric: "deployment_tx",
+ sortOrder:
+ sort.metric === "deployment_tx"
+ ? sort.sortOrder === "asc"
+ ? "desc"
+ : "asc"
+ : "desc",
+ });
+ }}
+ >
+ Deployment Tx
+
+
+ )}
+ {showDeployerAddress && (
+ {
+ setSort({
+ metric: "deployer_address",
+ sortOrder:
+ sort.metric === "deployer_address"
+ ? sort.sortOrder === "asc"
+ ? "desc"
+ : "asc"
+ : "desc",
+ });
+ }}
+ >
+ Deployer Address
+
+
+ )}
-
+
{filteredLabelsData[item.index].address.slice(-6)}
-
+
{
handleCopyAddress(filteredLabelsData[item.index].address);
}}
@@ -972,74 +1142,84 @@ export default function LabelsPage() {
{ownerProjectToProjectData[
filteredLabelsData[item.index].owner_project
] && (
-
-
-
- {ownerProjectToProjectData[
- filteredLabelsData[item.index].owner_project
- ][5] && (
-
-
-
-
-
-
- )}
-
-
-
- {ownerProjectToProjectData[
- filteredLabelsData[item.index].owner_project
- ][3] && (
-
-
-
- )}
+
+
+ {
+ handleCopyAddress(filteredLabelsData[item.index].address);
+ }}
+ />
-
+
+
+ {ownerProjectToProjectData[
+ filteredLabelsData[item.index].owner_project
+ ][5] && (
+
+
+
+
+
+
+ )}
+
+
+
+ {ownerProjectToProjectData[
+ filteredLabelsData[item.index].owner_project
+ ][3] && (
+
+
+
+ )}
+
+
+
+ {ownerProjectToProjectData[
+ filteredLabelsData[item.index].owner_project
+ ][4] && (
+
+
+
+ )}
+
- {ownerProjectToProjectData[
- filteredLabelsData[item.index].owner_project
- ][4] && (
-
-
-
- )}
-
)}
@@ -1089,7 +1269,7 @@ export default function LabelsPage() {
}
/>
- {ownerProjectToProjectData[
+ {/* {ownerProjectToProjectData[
filteredLabelsData[item.index].owner_project
] &&
(ownerProjectToProjectData[
@@ -1102,7 +1282,6 @@ export default function LabelsPage() {
filteredLabelsData[item.index].owner_project
][5]) && (
- {/* arrow pointing to the left */}
{ownerProjectToProjectData[
filteredLabelsData[item.index].owner_project
@@ -1175,7 +1354,7 @@ export default function LabelsPage() {
)}
- )}
+ )} */}
) : (
@@ -1283,12 +1462,8 @@ export default function LabelsPage() {
/>
)}
- {/* {filteredLabelsData[item.index].usage_category &&
-
- } leftIconColor="#FFFFFF" rightIcon="heroicons-solid:plus-circle" />} */}
-
{filteredLabelsData[item.index].usage_category && (
{/* {filteredLabelsData[item.index].usage_category && } */}
+
{filteredLabelsData[item.index].deployment_date && (
@@ -1341,144 +1517,92 @@ export default function LabelsPage() {
)}
- {/*
- {sparklineLabelsData && (
-
- {sparklineLabelsData.data[`${filteredLabelsData[item.index].origin_key}_${filteredLabelsData[item.index].address}`] ?
:
Unavailable
}
-
- )}
-
{filteredLabelsData[item.index].txcount.toLocaleString("en-GB")}
-
*/}
-
- {/* {sparklineLabelsData && sparklineLabelsData.data[`${filteredLabelsData[item.index].origin_key}_${filteredLabelsData[item.index].address}`] ? (
-
[d[0], d[sparklineLabelsData.data.types.indexOf(sparklineMetricKeys[metricKeys.indexOf(currentMetric)])]])} change={filteredLabelsData[item.index][`${currentMetric}_change`]}>
-
-
-
- ) : (
-
Unavailable
- )}
-
-
-
{filteredLabelsData[item.index][currentMetric].toLocaleString("en-GB")}
-
0 ? "font-normal" : "text-[#FE5468] font-semibold "}`}>{filteredLabelsData[item.index][`${currentMetric}_change`] > 0 && "+"}{formatNumber(filteredLabelsData[item.index][`${currentMetric}_change`] * 100, true, false)}%
-
*/}
- {/* {isDBLoading ? (
-
- Loading
+ {showDeploymentTx && (
+
{
+ e.preventDefault(); // Prevent default double-click behavior
+ const selection = window.getSelection();
+ const range = document.createRange();
+ range.selectNodeContents(e.currentTarget);
+ selection?.removeAllRanges();
+ selection?.addRange(range);
+ }}
+ >
+ {filteredLabelsData[item.index].deployment_tx && (
+ <>
+
{
+ navigator.clipboard.writeText(filteredLabelsData[item.index].deployment_tx)
+ }}
+ >
+ {filteredLabelsData[item.index].deployment_tx.slice(0, filteredLabelsData[item.index].deployment_tx.length - 6)}
+
+
+ {filteredLabelsData[item.index].deployment_tx.slice(-6)}
+
+
+ {
+ handleCopyAddress(filteredLabelsData[item.index].deployment_tx);
+ }}
+ />
+
+ >
+ )}
- ) : (
-
- {parquetSparklineData &&
- parquetSparklineData[
- `${filteredLabelsData[item.index].origin_key}_${filteredLabelsData[item.index].address
- }`
- ] ? (
-
[d.unix, d[currentMetric]])}
- change={
- filteredLabelsData[item.index][
- `${currentMetric}_change`
- ]
- }
- value={
- filteredLabelsData[item.index][currentMetric]
- }
- valueType={
- currentMetric
- }
- >
-
-
- ) : (
-
[d.unix, d[currentMetric]])}
- change={
- filteredLabelsData[item.index][
- `${currentMetric}_change`
- ]
- }
- value={
- filteredLabelsData[item.index][currentMetric]
- }
- valueType={
- currentMetric
- }
- >
-
-
+ )}
+ {showDeployerAddress && (
+
{
+ e.preventDefault(); // Prevent default double-click behavior
+ const selection = window.getSelection();
+ const range = document.createRange();
+ range.selectNodeContents(e.currentTarget);
+ selection?.removeAllRanges();
+ selection?.addRange(range);
+ }}
+ >
+ {filteredLabelsData[item.index].deployer_address && (
+ <>
+
{
+ navigator.clipboard.writeText(filteredLabelsData[item.index].deployer_address)
+ }}
+ >
+ {filteredLabelsData[item.index].deployer_address.slice(0, filteredLabelsData[item.index].deployer_address.length - 6)}
+
+
+ {filteredLabelsData[item.index].deployer_address.slice(-6)}
+
+
+ {
+ handleCopyAddress(filteredLabelsData[item.index].deployer_address);
+ }}
+ />
+
+ >
)}
- )} */}
+ )}
+
- {/* [d.unix, d[currentMetric]]) : []}
- change={
- filteredLabelsData[item.index][
- `${currentMetric}_change`
- ]
- }
- value={
- filteredLabelsData[item.index][currentMetric]
- }
- valueType={
- currentMetric
- }
- >
-
- */}
- {/* [d.unix, d[currentMetric]]) : []}
- change={
- filteredLabelsData[item.index][
- `${currentMetric}_change`
- ]
- }
- value={
- filteredLabelsData[item.index][currentMetric]
- }
- valueType={
- currentMetric
- }
- >
-
- */}
-
{/*
*/}
- < Footer />
+
>
);
}
type GridTableProps = {
gridDefinitionColumns: string;
+ className?: string;
children: React.ReactNode;
style?: React.CSSProperties;
};
@@ -1535,10 +1660,13 @@ type GridTableProps = {
const GridTableHeader = ({
children,
gridDefinitionColumns,
+ className,
+ style,
}: GridTableProps) => {
return (
{children}
@@ -1550,11 +1678,12 @@ const GridTableHeader = ({
const GridTableRow = ({
children,
gridDefinitionColumns,
+ className,
style,
}: GridTableProps) => {
return (
{children}