feat: check hotkey/coldkey validation on those pages

src/hooks/useAddressInfo.ts

@@ -10,19 +10,23 @@ import { rawAmountToDecimal } from "../utils/number";
 export function useAddressInfo(address: string) {
 	const rollbar = useRollbar();
 
-	const [data, setData] = useState<{ isHotkey: boolean; isValidator: boolean }>(
-		{ isHotkey: false, isValidator: false }
-	);
+	const [data, setData] = useState<{
+		loading: boolean;
+		isHotkey: boolean;
+		isValidator: boolean;
+		isColdkey: boolean;
+	}>({ loading: true, isHotkey: false, isValidator: false, isColdkey: false });
 	const [loading, setLoading] = useState<boolean>(true);
 	const [error, setError] = useState<DataError>();
 
 	const fetchData = useCallback(async () => {
 		try {
 			const result: ItemsResponse<NeuronMetagraph> = await getNeuronMetagraph(
 				{
-					hotkey: {
-						equalTo: address,
-					},
+					or: [
+						{ hotkey: { equalTo: address } },
+						{ coldkey: { equalTo: address } },
+					],
 					netUid: {
 						notEqualTo: 0,
 					},
@@ -32,14 +36,18 @@ export function useAddressInfo(address: string) {
 					limit: 1024,
 				}
 			);
+
+			const hotkeys = result.data.filter((x) => x.hotkey === address);
+			const coldkeys = result.data.filter((x) => x.coldkey === address);
 			const isValidator =
-				result.data.find(
+				hotkeys.find(
 					(cur) =>
 						cur.dividends > 0 &&
 						rawAmountToDecimal(cur.stake.toString()).gt(1000)
 				) != undefined;
-			const isHotkey = result.data.length > 0;
-			setData({ isHotkey, isValidator });
+			const isHotkey = hotkeys.length > 0;
+			const isColdkey = coldkeys.length > 0;
+			setData({ loading: false, isHotkey, isValidator, isColdkey });
 		} catch (e) {
 			if (e instanceof DataError) {
 				rollbar.error(e);
@@ -53,7 +61,12 @@ export function useAddressInfo(address: string) {
 	}, []);
 
 	useEffect(() => {
-		setData({ isHotkey: false, isValidator: false });
+		setData({
+			loading: true,
+			isHotkey: false,
+			isValidator: false,
+			isColdkey: false,
+		});
 		setError(undefined);
 		setLoading(true);
 		fetchData();

src/screens/account.tsx

@@ -96,7 +96,7 @@ export const AccountPage = () => {
 	const verifiedDelegates = useVerifiedDelegates();
 
 	const {
-		data: { isHotkey, isValidator },
+		data: { isHotkey, isValidator, isColdkey },
 	} = useAddressInfo(address);
 
 	const blockHeight =
@@ -245,6 +245,9 @@ export const AccountPage = () => {
 	if (isHotkey) {
 		return <Navigate to={`/hotkey/${address}`} replace />;
 	}
+	if (isColdkey) {
+		return <Navigate to={`/coldkey/${address}`} replace />;
+	}
 
 	return account.error ? (
 		<CardRow css={infoSection}>

src/screens/coldkey.tsx

@@ -1,12 +1,13 @@
 /** @jsxImportSource @emotion/react */
 import { useDOMEventTrigger } from "../hooks/useDOMEventTrigger";
-import { useParams } from "react-router-dom";
+import { Navigate, useParams } from "react-router-dom";
 import { css } from "@emotion/react";
 import Certification from "../assets/certification.svg";
 import { useColdKeySubnets } from "../hooks/useColdKeySubnets";
 import { ColdkeySubnets } from "../components/subnets/ColdkeySubnets";
 import { useColdKeyInfo } from "../hooks/useColdKeyInfo";
 import { ColdkeyInfoTable } from "../components/subnets/ColdkeyInfoTable";
+import { useAddressInfo } from "../hooks/useAddressInfo";
 
 const metagraphComment = () => css`
 	font-size: 13px;
@@ -37,6 +38,13 @@ export const ColdkeyPage = () => {
 	const subnetIds = useColdKeySubnets(coldkey);
 	const coldkeyInfo = useColdKeyInfo(coldkey);
 
+	const {
+		data: { loading, isColdkey },
+	} = useAddressInfo(coldkey);
+	if (!loading && !isColdkey) {
+		return <Navigate to={`/account/${coldkey}`} replace />;
+	}
+
 	useDOMEventTrigger("data-loaded", !subnetIds.loading);
 
 	return (

src/screens/hotkey.tsx

@@ -2,15 +2,15 @@
 import { Navigate, useLocation, useParams } from "react-router-dom";
 import { css } from "@emotion/react";
 import { useHotkeyNet } from "../hooks/useHotkeyNet";
-import { rawAmountToDecimal } from "../utils/number";
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 import { Card } from "../components/Card";
 import { HotkeyInfoTable } from "../components/hotkey/HotkeyInfoTable";
 import { HotkeyPerformanceChart } from "../components/hotkey/HotkeyPerformanceChart";
 import HotkeyMetagraphTable from "../components/hotkey/HotkeyMetagraphTable";
 import { useExtrinsics } from "../hooks/useExtrinsics";
 import { TabbedContent, TabPane } from "../components/TabbedContent";
 import ExtrinsicsTable from "../components/extrinsics/ExtrinsicsTable";
+import { useAddressInfo } from "../hooks/useAddressInfo";
 
 const perfContainer = css`
 	margin-top: 50px;
@@ -47,15 +47,10 @@ export const HotkeyPage = () => {
 	);
 
 	const neuronMetagraph = useHotkeyNet(hkey);
-	const isValidator = useMemo(() => {
-		if (neuronMetagraph.loading) return false;
-		return (
-			neuronMetagraph.data.find(
-				(cur) =>
-					cur.dividends > 0 && rawAmountToDecimal(cur.stake.toString()).gt(1000)
-			) != undefined
-		);
-	}, [neuronMetagraph]);
+
+	const {
+		data: { loading, isHotkey, isValidator },
+	} = useAddressInfo(hkey);
 
 	const [activeSubnet, setActiveSubnet] = useState(-1);
 	useEffect(() => {
@@ -77,6 +72,10 @@ export const HotkeyPage = () => {
 		return <Navigate to={`/validator/${hkey}`} replace />;
 	}
 
+	if (!loading && !isHotkey) {
+		return <Navigate to={`/account/${hkey}`} replace />;
+	}
+
 	return (
 		<>
 			<Card>