Refactor: reorganize Recovery feature files (#3042)

* Refactor: reorganize Recovery feature files

* Fix mock paths

src/components/common/PaginatedTxns/index.tsx

@@ -13,7 +13,7 @@ import { isTransactionListItem } from '@/utils/transaction-guards'
 import NoTransactionsIcon from '@/public/images/transactions/no-transactions.svg'
 import { useHasPendingTxs } from '@/hooks/usePendingTxs'
 import useSafeInfo from '@/hooks/useSafeInfo'
-import { useRecoveryQueue } from '@/hooks/useRecoveryQueue'
+import { useRecoveryQueue } from '@/features/recovery/hooks/useRecoveryQueue'
 
 const NoQueuedTxns = () => {
   return <PagePlaceholder img={<NoTransactionsIcon />} text="Queued transactions will appear here" />

src/components/dashboard/PendingTxs/PendingRecoveryListItem.tsx

@@ -5,11 +5,11 @@ import { ChevronRight } from '@mui/icons-material'
 import { Box } from '@mui/material'
 import type { ReactElement } from 'react'
 
-import { RecoveryInfo } from '@/components/recovery/RecoveryInfo'
-import { RecoveryStatus } from '@/components/recovery/RecoveryStatus'
-import { RecoveryType } from '@/components/recovery/RecoveryType'
+import { RecoveryInfo } from '@/features/recovery/components/RecoveryInfo'
+import { RecoveryStatus } from '@/features/recovery/components/RecoveryStatus'
+import { RecoveryType } from '@/features/recovery/components/RecoveryType'
 import { AppRoutes } from '@/config/routes'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 import css from './styles.module.css'
 

src/components/dashboard/PendingTxs/PendingTxList.test.ts

@@ -5,7 +5,7 @@ import type { MultisigExecutionInfo, Transaction } from '@safe-global/safe-gatew
 
 import { safeInfoBuilder } from '@/tests/builders/safe'
 import { _getTransactionsToDisplay } from './PendingTxsList'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 describe('_getTransactionsToDisplay', () => {
   it('should return the recovery queue if it has more than or equal to MAX_TXS items', () => {

src/components/dashboard/PendingTxs/PendingTxsList.tsx

@@ -12,10 +12,10 @@ import css from './styles.module.css'
 import { isSignableBy, isExecutable, isRecoveryQueueItem } from '@/utils/transaction-guards'
 import useWallet from '@/hooks/wallets/useWallet'
 import useSafeInfo from '@/hooks/useSafeInfo'
-import { useRecoveryQueue } from '@/hooks/useRecoveryQueue'
+import { useRecoveryQueue } from '@/features/recovery/hooks/useRecoveryQueue'
 import { PendingRecoveryListItem } from './PendingRecoveryListItem'
 import type { SafeInfo, Transaction } from '@safe-global/safe-gateway-typescript-sdk'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 const MAX_TXS = 4
 

src/components/dashboard/Recovery/index.tsx

@@ -5,7 +5,7 @@ import type { ReactElement } from 'react'
 import RecoveryLogo from '@/public/images/common/recovery.svg'
 import { WidgetBody, WidgetContainer } from '@/components/dashboard/styled'
 import { Chip } from '@/components/common/Chip'
-import { useRecovery } from '@/components/recovery/RecoveryContext'
+import { useRecovery } from '@/features/recovery/components/RecoveryContext'
 import { useHasFeature } from '@/hooks/useChains'
 import { FEATURES } from '@/utils/chains'
 

src/components/dashboard/RecoveryHeader/index.test.tsx

@@ -3,11 +3,11 @@ import { BigNumber } from 'ethers'
 
 import { _RecoveryHeader, _useIsProposalInProgress } from '.'
 import { render, renderHook, waitFor } from '@/tests/test-utils'
-import { RecoveryContext } from '@/components/recovery/RecoveryContext'
-import { RecoveryEvent, recoveryDispatch, RecoveryTxType } from '@/services/recovery/recoveryEvents'
-import { useRecoveryQueue } from '@/hooks/useRecoveryQueue'
+import { RecoveryContext } from '@/features/recovery/components/RecoveryContext'
+import { RecoveryEvent, recoveryDispatch, RecoveryTxType } from '@/features/recovery/services/recoveryEvents'
+import { useRecoveryQueue } from '@/features/recovery/hooks/useRecoveryQueue'
 
-jest.mock('@/hooks/useRecoveryQueue')
+jest.mock('@/features/recovery/hooks/useRecoveryQueue')
 
 const mockUseRecoveryQueue = useRecoveryQueue as jest.MockedFunction<typeof useRecoveryQueue>
 

src/components/dashboard/RecoveryHeader/index.tsx

@@ -2,16 +2,16 @@ import { Grid } from '@mui/material'
 import { useEffect, useState } from 'react'
 import type { ReactElement } from 'react'
 
-import { useRecoveryQueue } from '@/hooks/useRecoveryQueue'
-import { useIsRecoverer } from '@/hooks/useIsRecoverer'
+import { useRecoveryQueue } from '@/features/recovery/hooks/useRecoveryQueue'
+import { useIsRecoverer } from '@/features/recovery/hooks/useIsRecoverer'
 import madProps from '@/utils/mad-props'
 import { FEATURES } from '@/utils/chains'
 import { useHasFeature } from '@/hooks/useChains'
-import { RecoveryProposalCard } from '@/components/recovery/RecoveryCards/RecoveryProposalCard'
-import { RecoveryInProgressCard } from '@/components/recovery/RecoveryCards/RecoveryInProgressCard'
+import { RecoveryProposalCard } from '@/features/recovery/components/RecoveryCards/RecoveryProposalCard'
+import { RecoveryInProgressCard } from '@/features/recovery/components/RecoveryCards/RecoveryInProgressCard'
 import { WidgetContainer, WidgetBody } from '../styled'
-import { RecoveryEvent, RecoveryTxType, recoverySubscribe } from '@/services/recovery/recoveryEvents'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import { RecoveryEvent, RecoveryTxType, recoverySubscribe } from '@/features/recovery/services/recoveryEvents'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 export function _RecoveryHeader({
   isProposalInProgress,

src/components/dashboard/index.tsx

@@ -12,7 +12,7 @@ import { FEATURES } from '@/utils/chains'
 import { useHasFeature } from '@/hooks/useChains'
 import { CREATION_MODAL_QUERY_PARM } from '../new-safe/create/logic'
 import { RecoveryHeader } from './RecoveryHeader'
-import { useRecovery } from '../recovery/RecoveryContext'
+import { useRecovery } from '@/features/recovery/components/RecoveryContext'
 
 function _useShouldShowRecovery(): boolean {
   const supportsRecovery = useHasFeature(FEATURES.RECOVERY)

src/components/settings/Recovery/DelayModifierRow.tsx

@@ -11,7 +11,7 @@ import EditIcon from '@/public/images/common/edit.svg'
 import CheckWallet from '@/components/common/CheckWallet'
 import { RemoveRecoveryFlow } from '@/components/tx-flow/flows/RemoveRecovery'
 import { UpsertRecoveryFlow } from '@/components/tx-flow/flows/UpsertRecovery'
-import type { RecoveryStateItem } from '@/services/recovery/recovery-state'
+import type { RecoveryStateItem } from '@/features/recovery/services/recovery-state'
 
 export function DelayModifierRow({ delayModifier }: { delayModifier: RecoveryStateItem }): ReactElement | null {
   const { setTxFlow } = useContext(TxModalContext)

src/components/settings/Recovery/index.tsx

@@ -7,7 +7,7 @@ import { type ReactElement, useMemo, useState } from 'react'
 import { Chip } from '@/components/common/Chip'
 import ExternalLink from '@/components/common/ExternalLink'
 import { DelayModifierRow } from './DelayModifierRow'
-import { useRecovery } from '@/components/recovery/RecoveryContext'
+import { useRecovery } from '@/features/recovery/components/RecoveryContext'
 import EthHashInfo from '@/components/common/EthHashInfo'
 import EnhancedTable from '@/components/common/EnhancedTable'
 import InfoIcon from '@/public/images/notifications/info.svg'

src/components/settings/SafeModules/index.tsx

@@ -8,9 +8,9 @@ import DeleteIcon from '@/public/images/common/delete.svg'
 import CheckWallet from '@/components/common/CheckWallet'
 import { useContext } from 'react'
 import { TxModalContext } from '@/components/tx-flow'
-import { selectDelayModifierByAddress } from '@/services/recovery/selectors'
+import { selectDelayModifierByAddress } from '@/features/recovery/services/selectors'
 import { RemoveRecoveryFlow } from '@/components/tx-flow/flows/RemoveRecovery'
-import { useRecovery } from '@/components/recovery/RecoveryContext'
+import { useRecovery } from '@/features/recovery/components/RecoveryContext'
 
 import css from '../TransactionGuards/styles.module.css'
 

src/components/tx-flow/flows/CancelRecovery/CancelRecoveryFlowReview.tsx

@@ -7,10 +7,10 @@ import type { ReactElement } from 'react'
 import { SafeTxContext } from '../../SafeTxProvider'
 import SignOrExecuteForm from '@/components/tx/SignOrExecuteForm'
 import { useWeb3ReadOnly } from '@/hooks/wallets/web3'
-import { getRecoverySkipTransaction } from '@/services/recovery/transaction'
+import { getRecoverySkipTransaction } from '@/features/recovery/services/transaction'
 import { createTx } from '@/services/tx/tx-sender'
 import ErrorMessage from '@/components/tx/ErrorMessage'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 const onSubmit = () => {
   trackEvent({ ...RECOVERY_EVENTS.SUBMIT_RECOVERY_CANCEL })

src/components/tx-flow/flows/CancelRecovery/index.tsx

@@ -5,7 +5,7 @@ import TxLayout from '../../common/TxLayout'
 import { CancelRecoveryFlowReview } from './CancelRecoveryFlowReview'
 import { CancelRecoveryOverview } from './CancelRecoveryOverview'
 import useTxStepper from '../../useTxStepper'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 export function CancelRecoveryFlow({ recovery }: { recovery: RecoveryQueueItem }): ReactElement {
   const { step, nextStep, prevStep } = useTxStepper<undefined>(undefined, CANCEL_RECOVERY_CATEGORY)

src/components/tx-flow/flows/RecoverAccount/RecoverAccountFlowReview.tsx

@@ -5,7 +5,7 @@ import { useContext, useEffect, useState } from 'react'
 import type { ReactElement } from 'react'
 
 import useSafeInfo from '@/hooks/useSafeInfo'
-import { getRecoveryProposalTransactions } from '@/services/recovery/transaction'
+import { getRecoveryProposalTransactions } from '@/features/recovery/services/transaction'
 import DecodedTx from '@/components/tx/DecodedTx'
 import ErrorMessage from '@/components/tx/ErrorMessage'
 import { RedefineBalanceChanges } from '@/components/tx/security/redefine/RedefineBalanceChange'
@@ -16,19 +16,19 @@ import useDecodeTx from '@/hooks/useDecodeTx'
 import TxCard from '../../common/TxCard'
 import { SafeTxContext } from '../../SafeTxProvider'
 import CheckWallet from '@/components/common/CheckWallet'
-import { dispatchRecoveryProposal } from '@/services/recovery/recovery-sender'
+import { dispatchRecoveryProposal } from '@/features/recovery/services/recovery-sender'
 import { createMultiSendCallOnlyTx, createTx } from '@/services/tx/tx-sender'
 import { RecoverAccountFlowFields } from '.'
 import { OwnerList } from '../../common/OwnerList'
-import { selectDelayModifierByRecoverer } from '@/services/recovery/selectors'
+import { selectDelayModifierByRecoverer } from '@/features/recovery/services/selectors'
 import useWallet from '@/hooks/wallets/useWallet'
 import useOnboard from '@/hooks/wallets/useOnboard'
 import { TxModalContext } from '../..'
 import { asError } from '@/services/exceptions/utils'
 import { trackError, Errors } from '@/services/exceptions'
 import { getPeriod } from '@/utils/date'
-import { useRecovery } from '@/components/recovery/RecoveryContext'
-import { useIsValidRecoveryExecTransactionFromModule } from '@/hooks/useIsValidRecoveryExecution'
+import { useRecovery } from '@/features/recovery/components/RecoveryContext'
+import { useIsValidRecoveryExecTransactionFromModule } from '@/features/recovery/hooks/useIsValidRecoveryExecution'
 import type { RecoverAccountFlowProps } from '.'
 
 import commonCss from '@/components/tx-flow/common/styles.module.css'

src/components/tx-flow/flows/RemoveRecovery/index.tsx

@@ -6,7 +6,7 @@ import RecoveryPlus from '@/public/images/common/recovery-plus.svg'
 import useTxStepper from '../../useTxStepper'
 import { RemoveRecoveryFlowOverview } from './RemoveRecoveryFlowOverview'
 import { RemoveRecoveryFlowReview } from './RemoveRecoveryFlowReview'
-import type { RecoveryStateItem } from '@/services/recovery/recovery-state'
+import type { RecoveryStateItem } from '@/features/recovery/services/recovery-state'
 
 export type RecoveryFlowProps = {
   delayModifier: RecoveryStateItem

src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowReview.tsx

@@ -12,7 +12,7 @@ import InfoIcon from '@/public/images/notifications/info.svg'
 import { trackEvent } from '@/services/analytics'
 import { RECOVERY_EVENTS } from '@/services/analytics/events/recovery'
 import { Errors, logError } from '@/services/exceptions'
-import { getRecoveryUpsertTransactions } from '@/services/recovery/setup'
+import { getRecoveryUpsertTransactions } from '@/features/recovery/services/setup'
 import { useWeb3ReadOnly } from '@/hooks/wallets/web3'
 import { createMultiSendCallOnlyTx, createTx } from '@/services/tx/tx-sender'
 import { isSmartContractWallet } from '@/utils/wallets'

src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowSettings.tsx

@@ -34,7 +34,7 @@ import { HelpCenterArticle, HelperCenterArticleTitles } from '@/config/constants
 import { TOOLTIP_TITLES } from '../../common/constants'
 import Track from '@/components/common/Track'
 import type { UpsertRecoveryFlowProps } from '.'
-import type { RecoveryStateItem } from '@/services/recovery/recovery-state'
+import type { RecoveryStateItem } from '@/features/recovery/services/recovery-state'
 
 import commonCss from '@/components/tx-flow/common/styles.module.css'
 import css from './styles.module.css'

src/components/tx-flow/flows/UpsertRecovery/index.tsx

@@ -8,7 +8,7 @@ import { UpsertRecoveryFlowReview as UpsertRecoveryFlowReview } from './UpsertRe
 import { UpsertRecoveryFlowSettings as UpsertRecoveryFlowSettings } from './UpsertRecoveryFlowSettings'
 import { UpsertRecoveryFlowIntro as UpsertRecoveryFlowIntro } from './UpsertRecoveryFlowIntro'
 import { DAY_IN_SECONDS } from './useRecoveryPeriods'
-import type { RecoveryState } from '@/services/recovery/recovery-state'
+import type { RecoveryState } from '@/features/recovery/services/recovery-state'
 
 const Subtitles = ['How does recovery work?', 'Set up recovery settings', 'Set up account recovery']
 

src/components/recovery/CancelRecoveryButton/index.tsx → src/features/recovery/components/CancelRecoveryButton/index.tsx

@@ -10,14 +10,14 @@ import CheckWallet from '@/components/common/CheckWallet'
 import { TxModalContext } from '@/components/tx-flow'
 import { CancelRecoveryFlow } from '@/components/tx-flow/flows/CancelRecovery'
 import useIsSafeOwner from '@/hooks/useIsSafeOwner'
-import { dispatchRecoverySkipExpired } from '@/services/recovery/recovery-sender'
+import { dispatchRecoverySkipExpired } from '@/features/recovery/services/recovery-sender'
 import useSafeInfo from '@/hooks/useSafeInfo'
 import useOnboard from '@/hooks/wallets/useOnboard'
 import { trackError, Errors } from '@/services/exceptions'
 import { asError } from '@/services/exceptions/utils'
-import { useRecoveryTxState } from '@/hooks/useRecoveryTxState'
+import { useRecoveryTxState } from '@/features/recovery/hooks/useRecoveryTxState'
 import { RecoveryListItemContext } from '../RecoveryListItem/RecoveryListItemContext'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 export function CancelRecoveryButton({
   recovery,

src/components/recovery/ExecuteRecoveryButton/index.tsx → src/features/recovery/components/ExecuteRecoveryButton/index.tsx

@@ -5,14 +5,14 @@ import type { SyntheticEvent, ReactElement } from 'react'
 import RocketIcon from '@/public/images/transactions/rocket.svg'
 import IconButton from '@mui/material/IconButton'
 import CheckWallet from '@/components/common/CheckWallet'
-import { dispatchRecoveryExecution } from '@/services/recovery/recovery-sender'
+import { dispatchRecoveryExecution } from '@/features/recovery/services/recovery-sender'
 import useOnboard from '@/hooks/wallets/useOnboard'
 import useSafeInfo from '@/hooks/useSafeInfo'
-import { useRecoveryTxState } from '@/hooks/useRecoveryTxState'
+import { useRecoveryTxState } from '@/features/recovery/hooks/useRecoveryTxState'
 import { Errors, trackError } from '@/services/exceptions'
 import { asError } from '@/services/exceptions/utils'
 import { RecoveryListItemContext } from '../RecoveryListItem/RecoveryListItemContext'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 export function ExecuteRecoveryButton({
   recovery,

src/components/recovery/GroupedRecoveryListItems/index.tsx → src/features/recovery/components/GroupedRecoveryListItems/index.tsx

@@ -2,7 +2,7 @@ import Track from '@/components/common/Track'
 import { RECOVERY_EVENTS } from '@/services/analytics/events/recovery'
 import { Box, Paper, Typography } from '@mui/material'
 import { partition } from 'lodash'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 import type { Transaction } from '@safe-global/safe-gateway-typescript-sdk'
 import type { ReactElement } from 'react'
 

src/components/recovery/RecoveryCards/RecoveryInProgressCard.tsx → src/features/recovery/components/RecoveryCards/RecoveryInProgressCard.tsx

@@ -4,13 +4,13 @@ import { Button, Card, Divider, Grid, Typography } from '@mui/material'
 import { useRouter } from 'next/dist/client/router'
 import type { ReactElement } from 'react'
 
-import { useRecoveryTxState } from '@/hooks/useRecoveryTxState'
+import { useRecoveryTxState } from '@/features/recovery/hooks/useRecoveryTxState'
 import { Countdown } from '@/components/common/Countdown'
 import RecoveryPending from '@/public/images/common/recovery-pending.svg'
 import ExternalLink from '@/components/common/ExternalLink'
 import { AppRoutes } from '@/config/routes'
 import { HelpCenterArticle, HelperCenterArticleTitles } from '@/config/constants'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
 import css from './styles.module.css'
 

src/components/recovery/RecoveryCards/__tests__/RecoveryInProgressCard.test.tsx → src/features/recovery/components/RecoveryCards/__tests__/RecoveryInProgressCard.test.tsx

@@ -3,10 +3,10 @@ import { fireEvent, waitFor } from '@testing-library/react'
 
 import { render } from '@/tests/test-utils'
 import { RecoveryInProgressCard } from '../RecoveryInProgressCard'
-import { useRecoveryTxState } from '@/hooks/useRecoveryTxState'
-import type { RecoveryQueueItem } from '@/services/recovery/recovery-state'
+import { useRecoveryTxState } from '@/features/recovery/hooks/useRecoveryTxState'
+import type { RecoveryQueueItem } from '@/features/recovery/services/recovery-state'
 
-jest.mock('@/hooks/useRecoveryTxState')
+jest.mock('@/features/recovery/hooks/useRecoveryTxState')
 
 const mockUseRecoveryTxState = useRecoveryTxState as jest.MockedFunction<typeof useRecoveryTxState>
 

src/components/recovery/RecoveryContext/__tests__/useRecoveryDelayModifiers.test.ts → src/features/recovery/components/RecoveryContext/__tests__/useRecoveryDelayModifiers.test.ts

@@ -2,12 +2,12 @@ import { useHasFeature } from '@/hooks/useChains'
 import useSafeInfo from '@/hooks/useSafeInfo'
 import { useWeb3ReadOnly } from '@/hooks/wallets/web3'
 import { getSpendingLimitModuleAddress } from '@/services/contracts/spendingLimitContracts'
-import { getRecoveryDelayModifiers } from '@/services/recovery/delay-modifier'
+import { getRecoveryDelayModifiers } from '@/features/recovery/services/delay-modifier'
 import { addressExBuilder, safeInfoBuilder } from '@/tests/builders/safe'
 import { act, renderHook } from '@/tests/test-utils'
 import { useRecoveryDelayModifiers } from '../useRecoveryDelayModifiers'
 
-jest.mock('@/services/recovery/delay-modifier')
+jest.mock('@/features/recovery/services/delay-modifier')
 
 const mockGetRecoveryDelayModifiers = getRecoveryDelayModifiers as jest.MockedFunction<typeof getRecoveryDelayModifiers>
 

src/components/recovery/RecoveryContext/__tests__/useRecoveryPendingTxs.test.ts → src/features/recovery/components/RecoveryContext/__tests__/useRecoveryPendingTxs.test.ts

@@ -1,6 +1,6 @@
 import { faker } from '@faker-js/faker'
 
-import { RecoveryEvent, recoveryDispatch, RecoveryTxType } from '@/services/recovery/recoveryEvents'
+import { RecoveryEvent, recoveryDispatch, RecoveryTxType } from '@/features/recovery/services/recoveryEvents'
 import { act, renderHook } from '@/tests/test-utils'
 import { useRecoveryPendingTxs } from '../useRecoveryPendingTxs'