diff --git a/src/hooks/usePrescribedNames.ts b/src/hooks/usePrescribedNames.ts new file mode 100644 index 00000000..477737da --- /dev/null +++ b/src/hooks/usePrescribedNames.ts @@ -0,0 +1,32 @@ +import { useGlobalState } from '@src/store'; +import { useQuery } from '@tanstack/react-query'; + +const DEFAULT_NAMES = ['dapp_ardrive', 'arns']; + +const usePrescribedNames = () => { + const arIOReadSDK = useGlobalState((state) => state.arIOReadSDK); + + const currentEpoch = useGlobalState((state) => state.currentEpoch); + + const queryResults = useQuery({ + queryKey: ['prescribedNames', currentEpoch?.epochIndex || -1], + queryFn: () => { + if (arIOReadSDK && currentEpoch) { + return arIOReadSDK.getPrescribedNames(currentEpoch).catch((e) => { + // log error + console.error('Failed to fetch prescribed names', { + message: e.message, + }); + // fallback to defaults + return DEFAULT_NAMES; + }); + } + // log error + throw new Error('arIOReadSDK or currentEpoch not available'); + }, + }); + + return queryResults; +}; + +export default usePrescribedNames; diff --git a/src/pages/Observe/ObserveHeader.tsx b/src/pages/Observe/ObserveHeader.tsx index 9ab2b55b..bf8504ce 100644 --- a/src/pages/Observe/ObserveHeader.tsx +++ b/src/pages/Observe/ObserveHeader.tsx @@ -8,10 +8,11 @@ import { HeaderSeparatorIcon, } from '@src/components/icons'; import { log } from '@src/constants'; +import usePrescribedNames from '@src/hooks/usePrescribedNames'; import db from '@src/store/db'; import { Assessment } from '@src/types'; import { performAssessment } from '@src/utils/observations'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import { Link, useParams } from 'react-router-dom'; const isSearchStringValid = (searchString: string) => { @@ -32,11 +33,17 @@ const ObserveHeader = ({ }) => { const params = useParams(); const ownerId = params?.ownerId; - - const [arnsNamesToSearch, setArnsNamesToSearch] = - useState('dapp_ardrive, arns'); + const [runningObservation, setRunningObservation] = useState(false); + // fetch current prescribed names, fallback to defaults + const { data: prescribedNames = [], isLoading: loadingPrescribedNames } = + usePrescribedNames(); + + const [arnsNamesToSearch, setArnsNamesToSearch] = useState( + prescribedNames.join(', '), + ); + const runObservation = async () => { setRunningObservation(true); const assessment = await performAssessment( @@ -61,6 +68,11 @@ const ObserveHeader = ({ setRunningObservation(false); }; + // update prescribed names after loading + useEffect(() => { + setArnsNamesToSearch(prescribedNames.join(',')); + }, [prescribedNames]); + return (
@@ -94,8 +106,8 @@ const ObserveHeader = ({ 'h-7 w-[12.5rem] rounded-md border border-grey-700 bg-grey-1000 p-3 text-sm text-mid outline-none placeholder:text-grey-400 focus:text-high' } type="text" - disabled={!gateway} - readOnly={!gateway} + disabled={!gateway || loadingPrescribedNames} + readOnly={!gateway || loadingPrescribedNames} value={arnsNamesToSearch} onChange={(e) => { setArnsNamesToSearch(e.target.value);