diff --git a/components/ChainSelector.tsx b/components/ChainSelector.tsx index 830e6c69..a3f047fd 100644 --- a/components/ChainSelector.tsx +++ b/components/ChainSelector.tsx @@ -1,13 +1,12 @@ -import { useContext, useEffect, useMemo, useState, useCallback } from 'react' +import { useContext, useMemo, useState, useCallback } from 'react' -import { useRegisterActions, Action } from 'kbar' +import { useRegisterActions } from 'kbar' import { useRouter } from 'next/router' import Select, { OnChangeValue, components } from 'react-select' import { EthereumContext } from 'context/ethereumContext' import { CURRENT_FORK } from 'util/constants' -import { toKeyIndex } from 'util/string' import { Icon, Label } from 'components/ui' @@ -64,7 +63,9 @@ const ChainOption = (props: any) => { const ChainSelector = () => { const { forks, selectedFork, onForkChange } = useContext(EthereumContext) - const [forkValue, setForkValue] = useState(null) + const [forkValue, setForkValue] = useState(() => { + return forks.find((fork) => fork.name === CURRENT_FORK) || null + }) const router = useRouter() const forkOptions = useMemo( diff --git a/components/KBar/Results.tsx b/components/KBar/Results.tsx index 9ba63fca..1fb705c5 100644 --- a/components/KBar/Results.tsx +++ b/components/KBar/Results.tsx @@ -1,6 +1,7 @@ import { useMemo } from 'react' import { KBarResults, useMatches } from 'kbar' +import type { ActionImpl } from 'kbar' import ResultItem from './ResultItem' @@ -10,20 +11,29 @@ const Results = () => { const { results } = useMatches() const flattened = useMemo(() => { - return results.reduce((acc: any[], curr: any) => { - if (typeof curr === 'string') { - acc.push(curr) - } else { - acc.push(curr.name) - acc.push(...curr.actions) - } - return acc - }, []) + const flattenActions = (actions: (string | ActionImpl)[]) => { + return actions.reduce((acc: any[], curr: string | ActionImpl) => { + if (typeof curr === 'string') { + acc.push(curr) + } else { + acc.push(curr) + + if (curr.children && curr.children.length > 0) { + acc.push(...flattenActions(curr.children)) + } + } + return acc + }, []) + } + + return flattenActions(results) }, [results]) return ( i !== NO_GROUP)} + items={flattened.filter( + (i: any) => typeof i !== 'string' || i !== NO_GROUP, + )} onRender={({ item, active }) => typeof item === 'string' ? (