diff --git a/frontend/components/AgentSelection.tsx b/frontend/components/AgentSelection.tsx index e874d9f2b..263bc7638 100644 --- a/frontend/components/AgentSelection.tsx +++ b/frontend/components/AgentSelection.tsx @@ -5,6 +5,7 @@ import { memo, useCallback } from 'react'; import { AGENT_CONFIG } from '@/config/agents'; import { COLOR } from '@/constants/colors'; +import { SERVICE_TEMPLATES } from '@/constants/serviceTemplates'; import { AgentType } from '@/enums/Agent'; import { Pages } from '@/enums/Pages'; import { SetupScreen } from '@/enums/SetupScreen'; @@ -20,6 +21,18 @@ import { CardFlex } from './styled/CardFlex'; const { Title, Text } = Typography; +const getCardStyle = (isCurrentAgent: boolean) => ({ + padding: 0, + marginBottom: 6, + body: { + padding: '12px 16px', + gap: 6, + borderRadius: 'inherit', + background: isCurrentAgent ? COLOR.GRAY_1 : 'transparent', + opacity: isCurrentAgent ? 0.75 : 1, + }, +}); + type EachAgentProps = { showSelected: boolean; agentType: AgentType; @@ -30,8 +43,14 @@ const EachAgent = memo( ({ showSelected, agentType, agentConfig }: EachAgentProps) => { const { goto: gotoSetup } = useSetup(); const { goto: gotoPage } = usePageState(); - const { selectedAgentType, updateAgentType } = useServices(); - const { masterSafes, isLoading } = useMasterWalletContext(); + const { + isLoading: isServicesLoading, + services, + selectedAgentType, + updateAgentType, + } = useServices(); + const { masterSafes, isLoading: isMasterWalletLoading } = + useMasterWalletContext(); const isCurrentAgent = showSelected ? selectedAgentType === agentType @@ -56,31 +75,47 @@ const EachAgent = memo( return; } - // If safe is NOT created, then go to setup page based on the agent type + const serviceName = SERVICE_TEMPLATES.find( + (service) => service.agentType === agentType, + )?.name; + const isServiceCreated = services?.find( + ({ name }) => name === serviceName, + ); + + // If service is created but safe is NOT, then setup EOA funding + // Eg. This case will happen when the user has created the service and closed the app on/during funding page. + if (isServiceCreated) { + gotoPage(Pages.Setup); + gotoSetup(SetupScreen.SetupEoaFunding); + return; + } + + // Neither service nor safe is created if (agentType === AgentType.Memeooorr) { // if the selected type is Memeooorr - should set up the agent first gotoPage(Pages.Setup); gotoSetup(SetupScreen.SetupYourAgent); - } else if (agentType === AgentType.PredictTrader) { + return; + } + + if (agentType === AgentType.PredictTrader) { gotoPage(Pages.Setup); gotoSetup(SetupScreen.SetupEoaFunding); + return; } - }, [agentType, gotoPage, gotoSetup, masterSafes, updateAgentType]); + + throw new Error('Invalid agent type'); + }, [ + services, + agentType, + gotoPage, + gotoSetup, + masterSafes, + updateAgentType, + ]); return ( - + Select diff --git a/frontend/components/SetupPage/SetupWelcome.tsx b/frontend/components/SetupPage/SetupWelcome.tsx index eab6661bf..8a97a059a 100644 --- a/frontend/components/SetupPage/SetupWelcome.tsx +++ b/frontend/components/SetupPage/SetupWelcome.tsx @@ -24,7 +24,7 @@ import { useServices } from '@/hooks/useServices'; import { useSetup } from '@/hooks/useSetup'; import { useMasterWalletContext } from '@/hooks/useWallet'; import { AccountService } from '@/service/Account'; -import { asEvmChainId } from '@/utils/middlewareHelpers'; +import { asEvmChainId, asMiddlewareChain } from '@/utils/middlewareHelpers'; import { FormFlex } from '../styled/FormFlex'; @@ -135,11 +135,16 @@ export const SetupWelcomeLogin = () => { const { goto } = useSetup(); const { goto: gotoPage } = usePageState(); - const { selectedService, selectedAgentConfig } = useServices(); + const { + selectedService, + selectedAgentConfig, + services, + isFetched: isServicesFetched, + } = useServices(); const { masterSafes, - masterWallets: wallets, masterEoa, + isFetched: isWalletsFetched, } = useMasterWalletContext(); const { isLoaded: isBalanceLoaded, updateBalances } = useBalanceContext(); const { masterWalletBalances } = useMasterBalances(); @@ -148,12 +153,11 @@ export const SetupWelcomeLogin = () => { ? asEvmChainId(selectedService?.home_chain) : selectedAgentConfig.evmHomeChainId; - const masterSafe = - masterSafes?.find( - (safe) => - selectedServiceOrAgentChainId && - safe.evmChainId === selectedServiceOrAgentChainId, - ) ?? null; + const masterSafe = masterSafes?.find( + (safe) => + selectedServiceOrAgentChainId && + safe.evmChainId === selectedServiceOrAgentChainId, + ); const eoaBalanceEth = masterWalletBalances?.find( (balance) => @@ -181,30 +185,60 @@ export const SetupWelcomeLogin = () => { [updateBalances], ); + const isServiceCreatedForAgent = useMemo(() => { + if (!isServicesFetched) return false; + if (!services) return false; + if (!selectedService) return false; + if (!selectedAgentConfig) return false; + + return services.some( + (service) => + service.home_chain === + asMiddlewareChain(selectedAgentConfig.evmHomeChainId), + ); + }, [isServicesFetched, services, selectedService, selectedAgentConfig]); + useEffect(() => { if (!canNavigate) return; - - // Navigate only when wallets and balances are loaded + if (!isServicesFetched) return; + if (!isWalletsFetched) return; if (!isBalanceLoaded) return; setIsLoggingIn(false); + // If no service is created for the selected agent + if (!isServiceCreatedForAgent) { + window.console.log( + `No service created for chain ${selectedServiceOrAgentChainId}`, + ); + goto(SetupScreen.AgentSelection); + return; + } + + // If no balance is loaded, redirect to setup screen if (!eoaBalanceEth) { goto(SetupScreen.SetupEoaFundingIncomplete); - } else if (!masterSafe?.address) { + return; + } + + // if master safe is available + if (masterSafe?.address) { goto(SetupScreen.SetupCreateSafe); - } else { - gotoPage(Pages.Main); + return; } + + gotoPage(Pages.Main); }, [ canNavigate, - eoaBalanceEth, - goto, - gotoPage, + isServicesFetched, + isWalletsFetched, isBalanceLoaded, + isServiceCreatedForAgent, + eoaBalanceEth, masterSafe?.address, selectedServiceOrAgentChainId, - wallets?.length, + goto, + gotoPage, ]); return (