diff --git a/src/components/dashboard/Recovery/index.tsx b/src/components/dashboard/Recovery/index.tsx
index 2213e74acc..00c1fa9a1f 100644
--- a/src/components/dashboard/Recovery/index.tsx
+++ b/src/components/dashboard/Recovery/index.tsx
@@ -6,18 +6,31 @@ import RecoveryLogo from '@/public/images/common/recovery.svg'
 import { WidgetBody, WidgetContainer } from '@/components/dashboard/styled'
 import { Chip } from '@/components/common/Chip'
 import { TxModalContext } from '@/components/tx-flow'
-import { EnableRecoveryFlow } from '@/components/tx-flow/flows/EnableRecovery'
-import { useIsRecoveryEnabled } from '@/hooks/useIsRecoveryEnabled'
+import { UpsertRecoveryFlow } from '@/components/tx-flow/flows/UpsertRecovery'
+import { useRecovery } from '@/components/recovery/RecoveryContext'
+import { useRouter } from 'next/router'
+import { AppRoutes } from '@/config/routes'
 import CheckWallet from '@/components/common/CheckWallet'
+import { useHasFeature } from '@/hooks/useChains'
+import { FEATURES } from '@/utils/chains'
 
 import css from './styles.module.css'
 
 export function Recovery(): ReactElement {
-  const isRecoveryEnabled = useIsRecoveryEnabled()
+  const router = useRouter()
   const { setTxFlow } = useContext(TxModalContext)
+  const [recovery] = useRecovery()
+  const supportsRecovery = useHasFeature(FEATURES.RECOVERY)
 
-  const onClick = () => {
-    setTxFlow(<EnableRecoveryFlow />)
+  const onEnable = () => {
+    setTxFlow(<UpsertRecoveryFlow />)
+  }
+
+  const onEdit = () => {
+    router.push({
+      pathname: AppRoutes.settings.recovery,
+      query: router.query,
+    })
   }
 
   return (
@@ -42,14 +55,23 @@ export function Recovery(): ReactElement {
               <Typography mt={1} mb={3}>
                 Ensure that you never lose access to your funds by choosing a guardian to recover your account.
               </Typography>
-
-              {isRecoveryEnabled && (
+              {supportsRecovery && (
                 <CheckWallet>
-                  {(isOk) => (
-                    <Button variant="contained" disabled={!isOk} onClick={onClick}>
-                      Set up recovery
-                    </Button>
-                  )}
+                  {(isOk) => {
+                    if (!recovery || recovery.length === 0) {
+                      return (
+                        <Button variant="contained" disabled={!isOk} onClick={onEnable}>
+                          Set up recovery
+                        </Button>
+                      )
+                    }
+
+                    return (
+                      <Button variant="contained" disabled={!isOk} onClick={onEdit}>
+                        Edit recovery
+                      </Button>
+                    )
+                  }}
                 </CheckWallet>
               )}
             </Grid>
diff --git a/src/components/dashboard/RecoveryHeader/index.test.tsx b/src/components/dashboard/RecoveryHeader/index.test.tsx
index c1dc830935..5e82d231f9 100644
--- a/src/components/dashboard/RecoveryHeader/index.test.tsx
+++ b/src/components/dashboard/RecoveryHeader/index.test.tsx
@@ -2,56 +2,65 @@ import { BigNumber } from 'ethers'
 
 import { _RecoveryHeader } from '.'
 import { render } from '@/tests/test-utils'
-import type { RecoveryQueueItem } from '@/components/recovery/RecoveryContext'
+import { RecoveryContext } from '@/components/recovery/RecoveryContext'
 
 describe('RecoveryHeader', () => {
   it('should not render a widget if the chain does not support recovery', () => {
+    const queue = [{ validFrom: BigNumber.from(0) }] as any
+
     const { container } = render(
-      <_RecoveryHeader
-        isOwner
-        isGuardian
-        queue={[{ validFrom: BigNumber.from(0) } as RecoveryQueueItem]}
-        supportsRecovery={false}
-      />,
+      <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+        <_RecoveryHeader isOwner isGuardian queue={queue} supportsRecovery={false} />
+      </RecoveryContext.Provider>,
     )
 
     expect(container).toBeEmptyDOMElement()
   })
 
   it('should render the in-progress widget if there is a queue for guardians', () => {
+    const queue = [{ validFrom: BigNumber.from(0) }] as any
+
     const { queryByText } = render(
-      <_RecoveryHeader
-        isOwner={false}
-        isGuardian
-        queue={[{ validFrom: BigNumber.from(0) } as RecoveryQueueItem]}
-        supportsRecovery
-      />,
+      <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+        <_RecoveryHeader isOwner={false} isGuardian queue={queue} supportsRecovery />
+      </RecoveryContext.Provider>,
     )
 
     expect(queryByText('Account recovery in progress')).toBeTruthy()
   })
 
   it('should render the in-progress widget if there is a queue for owners', () => {
+    const queue = [{ validFrom: BigNumber.from(0) }] as any
+
     const { queryByText } = render(
-      <_RecoveryHeader
-        isOwner
-        isGuardian={false}
-        queue={[{ validFrom: BigNumber.from(0) } as RecoveryQueueItem]}
-        supportsRecovery
-      />,
+      <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+        <_RecoveryHeader isOwner isGuardian={false} queue={queue} supportsRecovery />
+      </RecoveryContext.Provider>,
     )
 
     expect(queryByText('Account recovery in progress')).toBeTruthy()
   })
 
   it('should render the proposal widget when there is no queue for guardians', () => {
-    const { queryByText } = render(<_RecoveryHeader isOwner={false} isGuardian queue={[]} supportsRecovery />)
+    const queue = [] as any
+
+    const { queryByText } = render(
+      <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+        <_RecoveryHeader isOwner={false} isGuardian queue={queue} supportsRecovery />
+      </RecoveryContext.Provider>,
+    )
 
     expect(queryByText('Recover this Account')).toBeTruthy()
   })
 
   it('should not render the proposal widget when there is no queue for owners', () => {
-    const { container } = render(<_RecoveryHeader isOwner isGuardian={false} queue={[]} supportsRecovery />)
+    const queue = [] as any
+
+    const { container } = render(
+      <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+        <_RecoveryHeader isOwner isGuardian={false} queue={queue} supportsRecovery />
+      </RecoveryContext.Provider>,
+    )
 
     expect(container).toBeEmptyDOMElement()
   })
diff --git a/src/components/recovery/RecoveryModal/index.test.tsx b/src/components/recovery/RecoveryModal/index.test.tsx
index c17a10f27d..5e82d54aad 100644
--- a/src/components/recovery/RecoveryModal/index.test.tsx
+++ b/src/components/recovery/RecoveryModal/index.test.tsx
@@ -8,6 +8,7 @@ import { safeInfoBuilder } from '@/tests/builders/safe'
 import { connectedWalletBuilder } from '@/tests/builders/wallet'
 import * as safeInfo from '@/hooks/useSafeInfo'
 import { _useDidDismissProposal } from './index'
+import { RecoveryContext } from '@/components/recovery/RecoveryContext'
 import type { RecoveryQueueItem } from '@/components/recovery/RecoveryContext'
 
 describe('RecoveryModal', () => {
@@ -27,9 +28,11 @@ describe('RecoveryModal', () => {
       const queue = [{ validFrom: BigNumber.from(0) } as RecoveryQueueItem]
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner={false} isGuardian={false} queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner={false} isGuardian={false} queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
@@ -41,9 +44,11 @@ describe('RecoveryModal', () => {
       const queue = [] as Array<RecoveryQueueItem>
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner={false} isGuardian queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner={false} isGuardian queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
@@ -55,9 +60,11 @@ describe('RecoveryModal', () => {
       const queue = [] as Array<RecoveryQueueItem>
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
@@ -69,9 +76,11 @@ describe('RecoveryModal', () => {
       const queue = [{ validFrom: BigNumber.from(0) } as RecoveryQueueItem]
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner={false} isGuardian queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner={false} isGuardian queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
@@ -83,9 +92,11 @@ describe('RecoveryModal', () => {
       const queue = [{ validFrom: BigNumber.from(0) } as RecoveryQueueItem]
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
@@ -97,9 +108,11 @@ describe('RecoveryModal', () => {
       const queue = [] as Array<RecoveryQueueItem>
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner={false} isGuardian queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner={false} isGuardian queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
@@ -111,9 +124,11 @@ describe('RecoveryModal', () => {
       const queue = [] as Array<RecoveryQueueItem>
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
@@ -136,9 +151,11 @@ describe('RecoveryModal', () => {
       const queue = [{ validFrom: BigNumber.from(0), transactionHash: faker.string.hexadecimal() } as RecoveryQueueItem]
 
       const { queryByText } = render(
-        <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
-          Test
-        </_RecoveryModal>,
+        <RecoveryContext.Provider value={{ state: [[{ queue }]] } as any}>
+          <_RecoveryModal wallet={wallet} isOwner isGuardian={false} queue={queue}>
+            Test
+          </_RecoveryModal>
+        </RecoveryContext.Provider>,
       )
 
       expect(queryByText('Test')).toBeTruthy()
diff --git a/src/components/settings/Recovery/DelayModifierRow.tsx b/src/components/settings/Recovery/DelayModifierRow.tsx
index 44a7c205ed..9a0e77c98d 100644
--- a/src/components/settings/Recovery/DelayModifierRow.tsx
+++ b/src/components/settings/Recovery/DelayModifierRow.tsx
@@ -8,6 +8,7 @@ import DeleteIcon from '@/public/images/common/delete.svg'
 import EditIcon from '@/public/images/common/edit.svg'
 import CheckWallet from '@/components/common/CheckWallet'
 import { ConfirmRemoveRecoveryModal } from './ConfirmRemoveRecoveryModal'
+import { UpsertRecoveryFlow } from '@/components/tx-flow/flows/UpsertRecovery'
 import type { RecoveryStateItem } from '@/components/recovery/RecoveryContext'
 
 export function DelayModifierRow({ delayModifier }: { delayModifier: RecoveryStateItem }): ReactElement | null {
@@ -20,8 +21,7 @@ export function DelayModifierRow({ delayModifier }: { delayModifier: RecoverySta
   }
 
   const onEdit = () => {
-    // TODO: Display flow
-    setTxFlow(undefined)
+    setTxFlow(<UpsertRecoveryFlow delayModifier={delayModifier} />)
   }
 
   const onDelete = () => {
diff --git a/src/components/settings/Recovery/index.tsx b/src/components/settings/Recovery/index.tsx
index 76811a9fc5..e26432a0be 100644
--- a/src/components/settings/Recovery/index.tsx
+++ b/src/components/settings/Recovery/index.tsx
@@ -2,7 +2,7 @@ import { Alert, Box, Button, Grid, Paper, SvgIcon, Tooltip, Typography } from '@
 import { useContext, useMemo } from 'react'
 import type { ReactElement } from 'react'
 
-import { EnableRecoveryFlow } from '@/components/tx-flow/flows/EnableRecovery'
+import { UpsertRecoveryFlow } from '@/components/tx-flow/flows/UpsertRecovery'
 import { TxModalContext } from '@/components/tx-flow'
 import { Chip } from '@/components/common/Chip'
 import ExternalLink from '@/components/common/ExternalLink'
@@ -65,6 +65,7 @@ const headCells = [
   { id: HeadCells.Actions, label: '', sticky: true },
 ]
 
+// TODO: Combine section with spending limits under "Security & Login" as per design
 export function Recovery(): ReactElement {
   const { setTxFlow } = useContext(TxModalContext)
   const [recovery] = useRecovery()
@@ -148,7 +149,7 @@ export function Recovery(): ReactElement {
                   <Button
                     variant="contained"
                     disabled={!isOk}
-                    onClick={() => setTxFlow(<EnableRecoveryFlow />)}
+                    onClick={() => setTxFlow(<UpsertRecoveryFlow />)}
                     sx={{ mt: 2 }}
                   >
                     Set up recovery
diff --git a/src/components/settings/SafeModules/index.tsx b/src/components/settings/SafeModules/index.tsx
index 77e6ff8d1d..e2b7dc9909 100644
--- a/src/components/settings/SafeModules/index.tsx
+++ b/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, useState } from 'react'
 import { TxModalContext } from '@/components/tx-flow'
-import { useRecovery } from '@/components/recovery/RecoveryContext'
 import { selectDelayModifierByAddress } from '@/services/recovery/selectors'
 import { ConfirmRemoveRecoveryModal } from '../Recovery/ConfirmRemoveRecoveryModal'
+import { useRecovery } from '@/components/recovery/RecoveryContext'
 
 import css from '../TransactionGuards/styles.module.css'
 
diff --git a/src/components/tx-flow/common/TxLayout/index.tsx b/src/components/tx-flow/common/TxLayout/index.tsx
index a4647d68e8..1f0d2210d8 100644
--- a/src/components/tx-flow/common/TxLayout/index.tsx
+++ b/src/components/tx-flow/common/TxLayout/index.tsx
@@ -13,7 +13,7 @@ import SafeLogo from '@/public/images/logo-no-text.svg'
 import { TxSecurityProvider } from '@/components/tx/security/shared/TxSecurityContext'
 import ChainIndicator from '@/components/common/ChainIndicator'
 import SecurityWarnings from '@/components/tx/security/SecurityWarnings'
-import { EnableRecoveryFlowEmailHint } from '../../flows/EnableRecovery/EnableRecoveryFlowEmailHint'
+import { UpsertRecoveryFlowEmailHint } from '../../flows/UpsertRecovery/UpsertRecoveryFlowEmailHint'
 
 const TxLayoutHeader = ({
   hideNonce,
@@ -169,7 +169,7 @@ const TxLayout = ({
                   <Box className={css.sticky}>
                     <SecurityWarnings />
 
-                    {isRecovery && <EnableRecoveryFlowEmailHint />}
+                    {isRecovery && <UpsertRecoveryFlowEmailHint />}
                   </Box>
                 </Grid>
               </Grid>
diff --git a/src/components/tx-flow/flows/EnableRecovery/index.tsx b/src/components/tx-flow/flows/EnableRecovery/index.tsx
deleted file mode 100644
index 18a5ea88ef..0000000000
--- a/src/components/tx-flow/flows/EnableRecovery/index.tsx
+++ /dev/null
@@ -1,91 +0,0 @@
-import type { ReactElement } from 'react'
-
-import TxLayout from '@/components/tx-flow/common/TxLayout'
-import RecoveryPlus from '@/public/images/common/recovery-plus.svg'
-import useTxStepper from '../../useTxStepper'
-import { EnableRecoveryFlowReview } from './EnableRecoveryFlowReview'
-import { EnableRecoveryFlowSettings } from './EnableRecoveryFlowSettings'
-import { EnableRecoveryFlowIntro } from './EnableRecoveryFlowIntro'
-
-const DAY_SECONDS = 60 * 60 * 24
-
-export const RecoveryDelayPeriods = [
-  {
-    label: '2 days',
-    value: `${DAY_SECONDS}`,
-  },
-  {
-    label: '7 days',
-    value: `${DAY_SECONDS * 7}`,
-  },
-  {
-    label: '14 days',
-    value: `${DAY_SECONDS * 14}`,
-  },
-  {
-    label: '28 days',
-    value: `${DAY_SECONDS * 28}`,
-  },
-  {
-    label: '56 days',
-    value: `${DAY_SECONDS * 56}`,
-  },
-] as const
-
-export const RecoveryExpirationPeriods = [
-  {
-    label: 'Never',
-    value: '0',
-  },
-  ...RecoveryDelayPeriods,
-] as const
-
-const Subtitles = ['How does recovery work?', 'Set up recovery settings', 'Set up account recovery']
-
-export enum EnableRecoveryFlowFields {
-  guardians = 'guardians',
-  txCooldown = 'txCooldown',
-  txExpiration = 'txExpiration',
-  emailAddress = 'emailAddress',
-}
-
-export type EnableRecoveryFlowProps = {
-  [EnableRecoveryFlowFields.guardians]: string
-  [EnableRecoveryFlowFields.txCooldown]: string
-  [EnableRecoveryFlowFields.txExpiration]: string
-  [EnableRecoveryFlowFields.emailAddress]: string
-}
-
-export function EnableRecoveryFlow(): ReactElement {
-  const { data, step, nextStep, prevStep } = useTxStepper<EnableRecoveryFlowProps>({
-    [EnableRecoveryFlowFields.guardians]: '',
-    [EnableRecoveryFlowFields.txCooldown]: `${DAY_SECONDS * 28}`, // 28 days in seconds
-    [EnableRecoveryFlowFields.txExpiration]: '0',
-    [EnableRecoveryFlowFields.emailAddress]: '',
-  })
-
-  const steps = [
-    <EnableRecoveryFlowIntro key={0} onSubmit={() => nextStep(data)} />,
-    <EnableRecoveryFlowSettings key={1} params={data} onSubmit={(formData) => nextStep({ ...data, ...formData })} />,
-    <EnableRecoveryFlowReview key={2} params={data} />,
-  ]
-
-  const isIntro = step === 0
-
-  const icon = isIntro ? undefined : RecoveryPlus
-
-  return (
-    <TxLayout
-      title="Account recovery"
-      subtitle={Subtitles[step]}
-      icon={icon}
-      step={step}
-      onBack={prevStep}
-      hideNonce={isIntro}
-      hideProgress={isIntro}
-      isRecovery={!isIntro}
-    >
-      {steps}
-    </TxLayout>
-  )
-}
diff --git a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowEmailHint.tsx b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowEmailHint.tsx
similarity index 93%
rename from src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowEmailHint.tsx
rename to src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowEmailHint.tsx
index 4f5c81551e..114ba5c3e6 100644
--- a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowEmailHint.tsx
+++ b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowEmailHint.tsx
@@ -5,7 +5,7 @@ import LightbulbIcon from '@/public/images/common/lightbulb.svg'
 
 import infoWidgetCss from '@/components/new-safe/create/InfoWidget/styles.module.css'
 
-export function EnableRecoveryFlowEmailHint(): ReactElement {
+export function UpsertRecoveryFlowEmailHint(): ReactElement {
   return (
     <Alert severity="info" sx={{ border: 'unset', p: 3 }} icon={false}>
       <Box className={infoWidgetCss.title} sx={{ backgroundColor: ({ palette }) => palette.info.main }}>
diff --git a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowIntro.tsx b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowIntro.tsx
similarity index 97%
rename from src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowIntro.tsx
rename to src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowIntro.tsx
index ef28ee30b3..06dc16f392 100644
--- a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowIntro.tsx
+++ b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowIntro.tsx
@@ -40,7 +40,7 @@ const RecoverySteps = [
   },
 ]
 
-export function EnableRecoveryFlowIntro({ onSubmit }: { onSubmit: () => void }): ReactElement {
+export function UpsertRecoveryFlowIntro({ onSubmit }: { onSubmit: () => void }): ReactElement {
   return (
     <TxCard>
       <Grid container display="flex" gap={4} className={css.connector}>
diff --git a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowReview.tsx b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowReview.tsx
similarity index 66%
rename from src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowReview.tsx
rename to src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowReview.tsx
index 6b9d75e9b3..283f8eef6c 100644
--- a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowReview.tsx
+++ b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowReview.tsx
@@ -3,45 +3,55 @@ import type { ReactElement } from 'react'
 
 import SignOrExecuteForm from '@/components/tx/SignOrExecuteForm'
 import { Errors, logError } from '@/services/exceptions'
-import { createMultiSendCallOnlyTx } from '@/services/tx/tx-sender'
+import { createMultiSendCallOnlyTx, createTx } from '@/services/tx/tx-sender'
 import { SafeTxContext } from '@/components/tx-flow/SafeTxProvider'
-import { getRecoverySetup } from '@/services/recovery/setup'
+import { getRecoveryUpsertTransactions } from '@/services/recovery/setup'
 import { useWeb3 } from '@/hooks/wallets/web3'
 import useSafeInfo from '@/hooks/useSafeInfo'
 import { SvgIcon, Tooltip, Typography } from '@mui/material'
-import { EnableRecoveryFlowFields, RecoveryDelayPeriods, RecoveryExpirationPeriods } from '.'
+import { useRecoveryPeriods } from './useRecoveryPeriods'
 import { TxDataRow } from '@/components/transactions/TxDetails/Summary/TxDataRow'
 import InfoIcon from '@/public/images/notifications/info.svg'
 import EthHashInfo from '@/components/common/EthHashInfo'
-import type { EnableRecoveryFlowProps } from '.'
+import { UpsertRecoveryFlowFields } from '.'
+import type { UpsertRecoveryFlowProps } from '.'
 
-export function EnableRecoveryFlowReview({ params }: { params: EnableRecoveryFlowProps }): ReactElement {
+export function UpsertRecoveryFlowReview({
+  params,
+  moduleAddress,
+}: {
+  params: UpsertRecoveryFlowProps
+  moduleAddress?: string
+}): ReactElement {
   const web3 = useWeb3()
   const { safe, safeAddress } = useSafeInfo()
   const { setSafeTx, safeTxError, setSafeTxError } = useContext(SafeTxContext)
 
-  const guardian = params[EnableRecoveryFlowFields.guardians]
-  const delay = RecoveryDelayPeriods.find(({ value }) => value === params[EnableRecoveryFlowFields.txCooldown])!.label
-  const expiration = RecoveryExpirationPeriods.find(
-    ({ value }) => value === params[EnableRecoveryFlowFields.txExpiration],
+  const periods = useRecoveryPeriods()
+  const guardian = params[UpsertRecoveryFlowFields.guardian]
+  const delay = periods.delay.find(({ value }) => value === params[UpsertRecoveryFlowFields.txCooldown])!.label
+  const expiration = periods.expiration.find(
+    ({ value }) => value === params[UpsertRecoveryFlowFields.txExpiration],
   )!.label
-  const emailAddress = params[EnableRecoveryFlowFields.emailAddress]
+  const emailAddress = params[UpsertRecoveryFlowFields.emailAddress]
 
   useEffect(() => {
     if (!web3) {
       return
     }
 
-    const { transactions } = getRecoverySetup({
+    getRecoveryUpsertTransactions({
       ...params,
-      guardians: [guardian],
+      provider: web3,
       chainId: safe.chainId,
       safeAddress,
-      provider: web3,
-    })
+      moduleAddress,
+    }).then((transactions) => {
+      const promise = transactions.length > 1 ? createMultiSendCallOnlyTx(transactions) : createTx(transactions[0])
 
-    createMultiSendCallOnlyTx(transactions).then(setSafeTx).catch(setSafeTxError)
-  }, [guardian, params, safe.chainId, safeAddress, setSafeTx, setSafeTxError, web3])
+      promise.then(setSafeTx).catch(setSafeTxError)
+    })
+  }, [guardian, moduleAddress, params, safe.chainId, safeAddress, setSafeTx, setSafeTxError, web3])
 
   useEffect(() => {
     if (safeTxError) {
@@ -51,7 +61,9 @@ export function EnableRecoveryFlowReview({ params }: { params: EnableRecoveryFlo
 
   return (
     <SignOrExecuteForm onSubmit={() => null}>
-      <Typography>This transaction will enable the Account recovery feature once executed.</Typography>
+      <Typography>
+        This transaction will {moduleAddress ? 'update' : 'enable'} the Account recovery feature once executed.
+      </Typography>
 
       <TxDataRow title="Trusted guardian">
         <EthHashInfo address={guardian} showName={false} hasExplorer showCopyButton avatarSize={24} />
diff --git a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowSettings.tsx b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowSettings.tsx
similarity index 75%
rename from src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowSettings.tsx
rename to src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowSettings.tsx
index 8ea926cf03..108aad401e 100644
--- a/src/components/tx-flow/flows/EnableRecovery/EnableRecoveryFlowSettings.tsx
+++ b/src/components/tx-flow/flows/UpsertRecovery/UpsertRecoveryFlowSettings.tsx
@@ -9,6 +9,7 @@ import {
   Collapse,
   Checkbox,
   FormControlLabel,
+  Tooltip,
 } from '@mui/material'
 import ExpandLessIcon from '@mui/icons-material/ExpandLess'
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
@@ -18,32 +19,44 @@ import type { TextFieldProps } from '@mui/material'
 import type { ReactElement } from 'react'
 
 import TxCard from '../../common/TxCard'
-import { EnableRecoveryFlowFields, RecoveryDelayPeriods, RecoveryExpirationPeriods } from '.'
+import { UpsertRecoveryFlowFields } from '.'
+import { useRecoveryPeriods } from './useRecoveryPeriods'
 import AddressBookInput from '@/components/common/AddressBookInput'
 import CircleCheckIcon from '@/public/images/common/circle-check.svg'
 import { useDarkMode } from '@/hooks/useDarkMode'
-import type { EnableRecoveryFlowProps } from '.'
+import { sameAddress } from '@/utils/addresses'
+import useSafeInfo from '@/hooks/useSafeInfo'
+import InfoIcon from '@/public/images/notifications/info.svg'
+import type { UpsertRecoveryFlowProps } from '.'
 
 import commonCss from '@/components/tx-flow/common/styles.module.css'
 import css from './styles.module.css'
 
-export function EnableRecoveryFlowSettings({
+export function UpsertRecoveryFlowSettings({
   params,
   onSubmit,
 }: {
-  params: EnableRecoveryFlowProps
-  onSubmit: (formData: EnableRecoveryFlowProps) => void
+  params: UpsertRecoveryFlowProps
+  onSubmit: (formData: UpsertRecoveryFlowProps) => void
 }): ReactElement {
-  const [showAdvanced, setShowAdvanced] = useState(params[EnableRecoveryFlowFields.txExpiration] !== '0')
+  const { safeAddress } = useSafeInfo()
+  const [showAdvanced, setShowAdvanced] = useState(params[UpsertRecoveryFlowFields.txExpiration] !== '0')
   const [understandsRisk, setUnderstandsRisk] = useState(false)
   const isDarkMode = useDarkMode()
+  const periods = useRecoveryPeriods()
 
-  const formMethods = useForm<EnableRecoveryFlowProps>({
+  const formMethods = useForm<UpsertRecoveryFlowProps>({
     defaultValues: params,
     mode: 'onChange',
   })
 
-  const emailAddress = formMethods.watch(EnableRecoveryFlowFields.emailAddress)
+  const validateGuardian = (guardian: string) => {
+    if (sameAddress(guardian, safeAddress)) {
+      return 'The Safe Account cannot be a guardian of itself'
+    }
+  }
+
+  const emailAddress = formMethods.watch(UpsertRecoveryFlowFields.emailAddress)
 
   const onShowAdvanced = () => setShowAdvanced((prev) => !prev)
 
@@ -63,11 +76,32 @@ export function EnableRecoveryFlowSettings({
               </Typography>
             </div>
 
-            <AddressBookInput label="Guardian address" name={EnableRecoveryFlowFields.guardians} required fullWidth />
+            <AddressBookInput
+              label="Guardian address"
+              name={UpsertRecoveryFlowFields.guardian}
+              required
+              fullWidth
+              validate={validateGuardian}
+            />
 
             <div>
               <Typography variant="h5" gutterBottom>
                 Recovery delay
+                <Tooltip
+                  placement="top"
+                  arrow
+                  title="The recovery delay begins after the recovery attempt is initiated"
+                >
+                  <span>
+                    <SvgIcon
+                      component={InfoIcon}
+                      inheritViewBox
+                      fontSize="small"
+                      color="border"
+                      sx={{ verticalAlign: 'middle', ml: 0.5 }}
+                    />
+                  </span>
+                </Tooltip>
               </Typography>
 
               <Typography variant="body2">
@@ -77,10 +111,10 @@ export function EnableRecoveryFlowSettings({
 
             <Controller
               control={formMethods.control}
-              name={EnableRecoveryFlowFields.txCooldown}
+              name={UpsertRecoveryFlowFields.txCooldown}
               render={({ field }) => (
                 <SelectField label="Recovery delay" fullWidth {...field}>
-                  {RecoveryDelayPeriods.map(({ label, value }, index) => (
+                  {periods.delay.map(({ label, value }, index) => (
                     <MenuItem key={index} value={value}>
                       {label}
                     </MenuItem>
@@ -100,12 +134,12 @@ export function EnableRecoveryFlowSettings({
 
               <Controller
                 control={formMethods.control}
-                name={EnableRecoveryFlowFields.txExpiration}
+                name={UpsertRecoveryFlowFields.txExpiration}
                 // Don't reset value if advanced section is collapsed
                 shouldUnregister={false}
                 render={({ field }) => (
                   <SelectField label="Transaction expiry" fullWidth {...field}>
-                    {RecoveryExpirationPeriods.map(({ label, value }, index) => (
+                    {periods.expiration.map(({ label, value }, index) => (
                       <MenuItem key={index} value={value}>
                         {label}
                       </MenuItem>
@@ -134,7 +168,7 @@ export function EnableRecoveryFlowSettings({
 
             <Controller
               control={formMethods.control}
-              name={EnableRecoveryFlowFields.emailAddress}
+              name={UpsertRecoveryFlowFields.emailAddress}
               render={({ field }) => (
                 <TextField
                   label="Enter email address"
diff --git a/src/components/tx-flow/flows/UpsertRecovery/index.tsx b/src/components/tx-flow/flows/UpsertRecovery/index.tsx
new file mode 100644
index 0000000000..aeb49f7daa
--- /dev/null
+++ b/src/components/tx-flow/flows/UpsertRecovery/index.tsx
@@ -0,0 +1,60 @@
+import type { ReactElement } from 'react'
+
+import TxLayout from '@/components/tx-flow/common/TxLayout'
+import RecoveryPlus from '@/public/images/common/recovery-plus.svg'
+import useTxStepper from '../../useTxStepper'
+import { UpsertRecoveryFlowReview as UpsertRecoveryFlowReview } from './UpsertRecoveryFlowReview'
+import { UpsertRecoveryFlowSettings as UpsertRecoveryFlowSettings } from './UpsertRecoveryFlowSettings'
+import { UpsertRecoveryFlowIntro as UpsertRecoveryFlowIntro } from './UpsertRecoveryFlowIntro'
+import { DAY_IN_SECONDS } from './useRecoveryPeriods'
+import type { RecoveryState } from '@/components/recovery/RecoveryContext'
+
+const Subtitles = ['How does recovery work?', 'Set up recovery settings', 'Set up account recovery']
+
+export enum UpsertRecoveryFlowFields {
+  guardian = 'guardian',
+  txCooldown = 'txCooldown',
+  txExpiration = 'txExpiration',
+  emailAddress = 'emailAddress',
+}
+
+export type UpsertRecoveryFlowProps = {
+  [UpsertRecoveryFlowFields.guardian]: string
+  [UpsertRecoveryFlowFields.txCooldown]: string
+  [UpsertRecoveryFlowFields.txExpiration]: string
+  [UpsertRecoveryFlowFields.emailAddress]: string
+}
+
+export function UpsertRecoveryFlow({ delayModifier }: { delayModifier?: RecoveryState[number] }): ReactElement {
+  const { data, step, nextStep, prevStep } = useTxStepper<UpsertRecoveryFlowProps>({
+    [UpsertRecoveryFlowFields.guardian]: delayModifier?.guardians?.[0] ?? '',
+    [UpsertRecoveryFlowFields.txCooldown]: delayModifier?.txCooldown?.toString() ?? `${DAY_IN_SECONDS * 28}`, // 28 days in seconds
+    [UpsertRecoveryFlowFields.txExpiration]: delayModifier?.txExpiration?.toString() ?? '0',
+    [UpsertRecoveryFlowFields.emailAddress]: '',
+  })
+
+  const steps = [
+    <UpsertRecoveryFlowIntro key={0} onSubmit={() => nextStep(data)} />,
+    <UpsertRecoveryFlowSettings key={1} params={data} onSubmit={(formData) => nextStep({ ...data, ...formData })} />,
+    <UpsertRecoveryFlowReview key={2} params={data} moduleAddress={delayModifier?.address} />,
+  ]
+
+  const isIntro = step === 0
+
+  const icon = isIntro ? undefined : RecoveryPlus
+
+  return (
+    <TxLayout
+      title="Account recovery"
+      subtitle={Subtitles[step]}
+      icon={icon}
+      step={step}
+      onBack={prevStep}
+      hideNonce={isIntro}
+      hideProgress={isIntro}
+      isRecovery={!isIntro}
+    >
+      {steps}
+    </TxLayout>
+  )
+}
diff --git a/src/components/tx-flow/flows/EnableRecovery/styles.module.css b/src/components/tx-flow/flows/UpsertRecovery/styles.module.css
similarity index 100%
rename from src/components/tx-flow/flows/EnableRecovery/styles.module.css
rename to src/components/tx-flow/flows/UpsertRecovery/styles.module.css
diff --git a/src/components/tx-flow/flows/UpsertRecovery/useRecoveryPeriods.ts b/src/components/tx-flow/flows/UpsertRecovery/useRecoveryPeriods.ts
new file mode 100644
index 0000000000..bf6d22212d
--- /dev/null
+++ b/src/components/tx-flow/flows/UpsertRecovery/useRecoveryPeriods.ts
@@ -0,0 +1,75 @@
+import chains from '@/config/chains'
+import { useCurrentChain } from '@/hooks/useChains'
+
+export const DAY_IN_SECONDS = 60 * 60 * 24
+
+const DefaultRecoveryDelayPeriods = [
+  {
+    label: '2 days',
+    value: `${DAY_IN_SECONDS * 2}`,
+  },
+  {
+    label: '7 days',
+    value: `${DAY_IN_SECONDS * 7}`,
+  },
+  {
+    label: '14 days',
+    value: `${DAY_IN_SECONDS * 14}`,
+  },
+  {
+    label: '28 days',
+    value: `${DAY_IN_SECONDS * 28}`,
+  },
+  {
+    label: '56 days',
+    value: `${DAY_IN_SECONDS * 56}`,
+  },
+]
+
+const DefaultRecoveryExpirationPeriods = [
+  {
+    label: 'Never',
+    value: '0',
+  },
+  ...DefaultRecoveryDelayPeriods,
+]
+
+const TestRecoveryDelayPeriods = [
+  {
+    label: '1 minute',
+    value: 60,
+  },
+  {
+    label: '5 minutes',
+    value: 60 * 5,
+  },
+  {
+    label: '1 hour',
+    value: DAY_IN_SECONDS,
+  },
+  ...DefaultRecoveryDelayPeriods,
+]
+
+const TestRecoveryExpirationPeriods = [
+  {
+    label: 'Never',
+    value: '0',
+  },
+  ...TestRecoveryDelayPeriods,
+]
+
+export function useRecoveryPeriods() {
+  const chain = useCurrentChain()
+
+  if (!chain || [chains.gor, chains.sep].includes(chain.chainId)) {
+    return {
+      delay: TestRecoveryDelayPeriods,
+      expiration: TestRecoveryExpirationPeriods,
+    }
+  }
+
+  return {
+    delay: DefaultRecoveryDelayPeriods,
+    expiration: DefaultRecoveryExpirationPeriods,
+  }
+}
diff --git a/src/services/recovery/__tests__/selectors.test.ts b/src/services/recovery/__tests__/selectors.test.ts
index 65967c6efd..1db00f65e2 100644
--- a/src/services/recovery/__tests__/selectors.test.ts
+++ b/src/services/recovery/__tests__/selectors.test.ts
@@ -99,4 +99,24 @@ describe('selectors', () => {
       expect(selectDelayModifierByAddress(data, delayModifier3.address)).toStrictEqual(delayModifier3)
     })
   })
+
+  describe('selectDelayModifierByAddress', () => {
+    it('should return the Delay Modifier for the given txHash', () => {
+      const delayModifier1 = {
+        address: faker.finance.ethereumAddress(),
+      } as unknown as RecoveryStateItem
+
+      const delayModifier2 = {
+        address: faker.finance.ethereumAddress(),
+      } as unknown as RecoveryStateItem
+
+      const delayModifier3 = {
+        address: faker.finance.ethereumAddress(),
+      } as unknown as RecoveryStateItem
+
+      const data = [delayModifier1, delayModifier2, delayModifier3]
+
+      expect(selectDelayModifierByAddress(data, delayModifier2.address)).toStrictEqual(delayModifier2)
+    })
+  })
 })
diff --git a/src/services/recovery/__tests__/setup.test.ts b/src/services/recovery/__tests__/setup.test.ts
index 3b2ea34373..03fd408b43 100644
--- a/src/services/recovery/__tests__/setup.test.ts
+++ b/src/services/recovery/__tests__/setup.test.ts
@@ -1,9 +1,11 @@
 import { getModuleInstance, KnownContracts, deployAndSetUpModule } from '@gnosis.pm/zodiac'
 import { faker } from '@faker-js/faker'
 import { BigNumber } from 'ethers'
+import { OperationType } from '@safe-global/safe-core-sdk-types'
+import { SENTINEL_ADDRESS } from '@safe-global/safe-core-sdk/dist/src/utils/constants'
 import type { Web3Provider } from '@ethersproject/providers'
 
-import { getRecoverySetup } from '@/services/recovery/setup'
+import { _getEditRecoveryTransactions, _getRecoverySetupTransactions } from '@/services/recovery/setup'
 
 jest.mock('@gnosis.pm/zodiac', () => ({
   ...jest.requireActual('@gnosis.pm/zodiac'),
@@ -14,7 +16,7 @@ jest.mock('@gnosis.pm/zodiac', () => ({
 const mockGetModuleInstance = getModuleInstance as jest.MockedFunction<typeof getModuleInstance>
 const mockDeployAndSetUpModule = deployAndSetUpModule as jest.MockedFunction<typeof deployAndSetUpModule>
 
-describe('getRecoverySetup', () => {
+describe('getRecoverySetupTransactions', () => {
   beforeEach(() => {
     jest.clearAllMocks()
   })
@@ -43,7 +45,7 @@ describe('getRecoverySetup', () => {
       transaction: deployDelayModifierTx,
     })
 
-    const result = getRecoverySetup({
+    const result = _getRecoverySetupTransactions({
       txCooldown,
       txExpiration,
       guardians,
@@ -92,3 +94,283 @@ describe('getRecoverySetup', () => {
     })
   })
 })
+
+describe('getEditRecoveryTransactions', () => {
+  it('should return a setTxExpiration transaction if a new txExpiration is provided', async () => {
+    const moduleAddress = faker.finance.ethereumAddress()
+
+    const txCooldown = faker.string.numeric()
+    const txExpiration = faker.string.numeric()
+    const guardians = [faker.finance.ethereumAddress()]
+
+    const newTxExpiration = faker.string.numeric({ exclude: txExpiration })
+
+    const mockEncodeFunctionData = jest.fn()
+    mockGetModuleInstance.mockReturnValue({
+      txCooldown: () => Promise.resolve(BigNumber.from(txCooldown)),
+      txExpiration: () => Promise.resolve(BigNumber.from(txExpiration)),
+      getModulesPaginated: () => Promise.resolve([guardians]),
+      interface: {
+        encodeFunctionData: mockEncodeFunctionData.mockReturnValue('0x'),
+      },
+    } as any)
+
+    const transactions = await _getEditRecoveryTransactions({
+      provider: {} as Web3Provider,
+      newTxCooldown: txCooldown,
+      newTxExpiration,
+      newGuardians: guardians,
+      moduleAddress,
+    })
+
+    expect(transactions).toHaveLength(1)
+
+    expect(mockEncodeFunctionData).toHaveBeenCalledTimes(1)
+    expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(1, 'setTxExpiration', [newTxExpiration])
+
+    expect(transactions[0]).toEqual({
+      to: moduleAddress,
+      value: '0',
+      data: expect.any(String),
+      operation: OperationType.Call,
+    })
+  })
+
+  it('should return a setTxCooldown transaction if a new txCooldown is provided', async () => {
+    const moduleAddress = faker.finance.ethereumAddress()
+
+    const txCooldown = faker.string.numeric()
+    const txExpiration = faker.string.numeric()
+    const guardians = [faker.finance.ethereumAddress()]
+
+    const newTxCooldown = faker.string.numeric({ exclude: txCooldown })
+
+    const mockEncodeFunctionData = jest.fn()
+    mockGetModuleInstance.mockReturnValue({
+      txCooldown: () => Promise.resolve(BigNumber.from(txCooldown)),
+      txExpiration: () => Promise.resolve(BigNumber.from(txExpiration)),
+      getModulesPaginated: () => Promise.resolve([guardians]),
+      interface: {
+        encodeFunctionData: mockEncodeFunctionData.mockReturnValue('0x'),
+      },
+    } as any)
+
+    const transactions = await _getEditRecoveryTransactions({
+      provider: {} as Web3Provider,
+      newTxCooldown,
+      newTxExpiration: txExpiration,
+      newGuardians: guardians,
+      moduleAddress,
+    })
+
+    expect(transactions).toHaveLength(1)
+
+    expect(mockEncodeFunctionData).toHaveBeenCalledTimes(1)
+    expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(1, 'setTxCooldown', [newTxCooldown])
+
+    expect(transactions[0]).toEqual({
+      to: moduleAddress,
+      value: '0',
+      data: expect.any(String),
+      operation: OperationType.Call,
+    })
+  })
+
+  it('should return an enableModule transaction if a new guardian is provided', async () => {
+    const moduleAddress = faker.finance.ethereumAddress()
+
+    const txCooldown = faker.string.numeric()
+    const txExpiration = faker.string.numeric()
+    const guardians = [faker.finance.ethereumAddress()]
+
+    const newGuardians = [guardians[0], faker.finance.ethereumAddress(), faker.finance.ethereumAddress()]
+
+    const mockEncodeFunctionData = jest.fn()
+    mockGetModuleInstance.mockReturnValue({
+      txCooldown: () => Promise.resolve(BigNumber.from(txCooldown)),
+      txExpiration: () => Promise.resolve(BigNumber.from(txExpiration)),
+      getModulesPaginated: () => Promise.resolve([guardians]),
+      interface: {
+        encodeFunctionData: mockEncodeFunctionData.mockReturnValue('0x'),
+      },
+    } as any)
+
+    const transactions = await _getEditRecoveryTransactions({
+      provider: {} as Web3Provider,
+      newTxCooldown: txCooldown,
+      newTxExpiration: txExpiration,
+      newGuardians,
+      moduleAddress,
+    })
+
+    expect(transactions).toHaveLength(2)
+
+    expect(mockEncodeFunctionData).toHaveBeenCalledTimes(2)
+
+    expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(1, 'enableModule', [newGuardians[1]])
+    expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(2, 'enableModule', [newGuardians[2]])
+
+    expect(transactions[0]).toEqual({
+      to: moduleAddress,
+      value: '0',
+      data: expect.any(String),
+      operation: OperationType.Call,
+    })
+    expect(transactions[1]).toEqual({
+      to: moduleAddress,
+      value: '0',
+      data: expect.any(String),
+      operation: OperationType.Call,
+    })
+  })
+
+  it('should return a disableModule transaction if an existing guardian is provided', async () => {
+    const moduleAddress = faker.finance.ethereumAddress()
+
+    const txCooldown = faker.string.numeric()
+    const txExpiration = faker.string.numeric()
+    const guardians = [faker.finance.ethereumAddress()]
+
+    const mockEncodeFunctionData = jest.fn()
+    mockGetModuleInstance.mockReturnValue({
+      txCooldown: () => Promise.resolve(BigNumber.from(txCooldown)),
+      txExpiration: () => Promise.resolve(BigNumber.from(txExpiration)),
+      getModulesPaginated: () => Promise.resolve([guardians]),
+      interface: {
+        encodeFunctionData: mockEncodeFunctionData.mockReturnValue('0x'),
+      },
+    } as any)
+
+    const transactions = await _getEditRecoveryTransactions({
+      provider: {} as Web3Provider,
+      newTxCooldown: txCooldown,
+      newTxExpiration: txExpiration,
+      newGuardians: [],
+      moduleAddress,
+    })
+
+    expect(transactions).toHaveLength(1)
+
+    expect(mockEncodeFunctionData).toHaveBeenCalledTimes(1)
+
+    expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(1, 'disableModule', [SENTINEL_ADDRESS, guardians[0]])
+
+    expect(transactions[0]).toEqual({
+      to: moduleAddress,
+      value: '0',
+      data: expect.any(String),
+      operation: OperationType.Call,
+    })
+  })
+
+  describe('existing guardians', () => {
+    it('should skip existing guardians provided', async () => {
+      const moduleAddress = faker.finance.ethereumAddress()
+
+      const txCooldown = faker.string.numeric()
+      const txExpiration = faker.string.numeric()
+      const guardians = [faker.finance.ethereumAddress()]
+
+      const newTxCooldown = faker.string.numeric({ exclude: txCooldown })
+      const newTxExpiration = faker.string.numeric({ exclude: txExpiration })
+      const newGuardians = [guardians[0], faker.finance.ethereumAddress()]
+
+      const mockEncodeFunctionData = jest.fn()
+      mockGetModuleInstance.mockReturnValue({
+        txCooldown: () => Promise.resolve(BigNumber.from(txCooldown)),
+        txExpiration: () => Promise.resolve(BigNumber.from(txExpiration)),
+        getModulesPaginated: () => Promise.resolve([guardians]),
+        interface: {
+          encodeFunctionData: mockEncodeFunctionData.mockReturnValue('0x'),
+        },
+      } as any)
+
+      const transactions = await _getEditRecoveryTransactions({
+        provider: {} as Web3Provider,
+        newTxCooldown,
+        newTxExpiration,
+        newGuardians,
+        moduleAddress,
+      })
+
+      expect(transactions).toHaveLength(3)
+
+      expect(mockEncodeFunctionData).toHaveBeenCalledTimes(3)
+
+      expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(1, 'setTxCooldown', [newTxCooldown])
+      expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(2, 'setTxExpiration', [newTxExpiration])
+      expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(3, 'enableModule', [newGuardians[1]]) // Skip existing guardian
+
+      expect(transactions[0]).toEqual({
+        to: moduleAddress,
+        value: '0',
+        data: expect.any(String),
+        operation: OperationType.Call,
+      })
+      expect(transactions[1]).toEqual({
+        to: moduleAddress,
+        value: '0',
+        data: expect.any(String),
+        operation: OperationType.Call,
+      })
+      expect(transactions[2]).toEqual({
+        to: moduleAddress,
+        value: '0',
+        data: expect.any(String),
+        operation: OperationType.Call,
+      })
+    })
+
+    it('should handle complex guardian mappings', async () => {
+      const moduleAddress = faker.finance.ethereumAddress()
+
+      const txCooldown = faker.string.numeric()
+      const txExpiration = faker.string.numeric()
+      const guardians = [
+        faker.finance.ethereumAddress(),
+        faker.finance.ethereumAddress(),
+        faker.finance.ethereumAddress(),
+      ]
+
+      const newGuardians = [guardians[0], faker.finance.ethereumAddress(), guardians[1]]
+
+      const mockEncodeFunctionData = jest.fn()
+      mockGetModuleInstance.mockReturnValue({
+        txCooldown: () => Promise.resolve(BigNumber.from(txCooldown)),
+        txExpiration: () => Promise.resolve(BigNumber.from(txExpiration)),
+        getModulesPaginated: () => Promise.resolve([guardians]),
+        interface: {
+          encodeFunctionData: mockEncodeFunctionData.mockReturnValue('0x'),
+        },
+      } as any)
+
+      const transactions = await _getEditRecoveryTransactions({
+        provider: {} as Web3Provider,
+        newTxCooldown: txCooldown,
+        newTxExpiration: txExpiration,
+        newGuardians,
+        moduleAddress,
+      })
+
+      expect(transactions).toHaveLength(2)
+
+      expect(mockEncodeFunctionData).toHaveBeenCalledTimes(2)
+
+      expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(1, 'enableModule', [newGuardians[1]])
+      expect(mockEncodeFunctionData).toHaveBeenNthCalledWith(2, 'disableModule', [guardians[1], guardians[2]])
+
+      expect(transactions[0]).toEqual({
+        to: moduleAddress,
+        value: '0',
+        data: expect.any(String),
+        operation: OperationType.Call,
+      })
+      expect(transactions[1]).toEqual({
+        to: moduleAddress,
+        value: '0',
+        data: expect.any(String),
+        operation: OperationType.Call,
+      })
+    })
+  })
+})
diff --git a/src/services/recovery/recovery-state.ts b/src/services/recovery/recovery-state.ts
index 919c60fcc3..d557609293 100644
--- a/src/services/recovery/recovery-state.ts
+++ b/src/services/recovery/recovery-state.ts
@@ -15,7 +15,7 @@ import { isMultiSendCalldata } from '@/utils/transaction-calldata'
 import { decodeMultiSendTxs } from '@/utils/transactions'
 import type { RecoveryQueueItem, RecoveryState, RecoveryStateItem } from '@/components/recovery/RecoveryContext'
 
-const MAX_PAGE_SIZE = 100
+export const MAX_GUARDIAN_PAGE_SIZE = 100
 
 export function _isMaliciousRecovery({
   chainId,
@@ -189,7 +189,7 @@ export const _getRecoveryStateItem = async ({
   version: SafeInfo['version']
 }): Promise<RecoveryStateItem> => {
   const [[guardians], txExpiration, txCooldown, txNonce, queueNonce] = await Promise.all([
-    delayModifier.getModulesPaginated(SENTINEL_ADDRESS, MAX_PAGE_SIZE),
+    delayModifier.getModulesPaginated(SENTINEL_ADDRESS, MAX_GUARDIAN_PAGE_SIZE),
     delayModifier.txExpiration(),
     delayModifier.txCooldown(),
     delayModifier.txNonce(),
diff --git a/src/services/recovery/setup.ts b/src/services/recovery/setup.ts
index 643b3708e9..936a9abada 100644
--- a/src/services/recovery/setup.ts
+++ b/src/services/recovery/setup.ts
@@ -1,9 +1,15 @@
+import { OperationType } from '@safe-global/safe-core-sdk-types'
+import { SENTINEL_ADDRESS } from '@safe-global/safe-core-sdk/dist/src/utils/constants'
 import { getModuleInstance, KnownContracts, deployAndSetUpModule } from '@gnosis.pm/zodiac'
 import { Interface } from 'ethers/lib/utils'
 import type { Web3Provider } from '@ethersproject/providers'
 import type { MetaTransactionData } from '@safe-global/safe-core-sdk-types'
 
-export function getRecoverySetup({
+import { sameAddress } from '@/utils/addresses'
+import { MAX_GUARDIAN_PAGE_SIZE } from './recovery-state'
+import type { UpsertRecoveryFlowProps } from '@/components/tx-flow/flows/UpsertRecovery'
+
+export function _getRecoverySetupTransactions({
   txCooldown,
   txExpiration,
   guardians,
@@ -82,3 +88,116 @@ export function getRecoverySetup({
     transactions,
   }
 }
+
+export async function _getEditRecoveryTransactions({
+  newTxCooldown,
+  newTxExpiration,
+  newGuardians,
+  moduleAddress,
+  provider,
+}: {
+  newTxCooldown: string
+  newTxExpiration: string
+  newGuardians: Array<string>
+  moduleAddress: string
+  provider: Web3Provider
+}): Promise<Array<MetaTransactionData>> {
+  const delayModifierContract = getModuleInstance(KnownContracts.DELAY, moduleAddress, provider)
+
+  const [txExpiration, txCooldown, [guardians]] = await Promise.all([
+    delayModifierContract.txExpiration(),
+    delayModifierContract.txCooldown(),
+    delayModifierContract.getModulesPaginated(SENTINEL_ADDRESS, MAX_GUARDIAN_PAGE_SIZE),
+  ])
+
+  // Recovery management transaction data
+  const txData: Array<string> = []
+
+  // Update cooldown
+  if (!txCooldown.eq(newTxCooldown)) {
+    const setTxCooldown = delayModifierContract.interface.encodeFunctionData('setTxCooldown', [newTxCooldown])
+    txData.push(setTxCooldown)
+  }
+
+  // Update expiration
+  if (!txExpiration.eq(newTxExpiration)) {
+    const setTxExpiration = delayModifierContract.interface.encodeFunctionData('setTxExpiration', [newTxExpiration])
+    txData.push(setTxExpiration)
+  }
+
+  // Cache guardian changes to determine prevModule
+  let _guardians = [...guardians]
+
+  // Don't add/remove same owners
+  const guardiansToAdd = newGuardians.filter(
+    (newGuardian) => !_guardians.some((oldGuardian) => sameAddress(oldGuardian, newGuardian)),
+  )
+  const guardiansToRemove = _guardians.filter(
+    (oldGuardian) => !newGuardians.some((newGuardian) => sameAddress(newGuardian, oldGuardian)),
+  )
+
+  for (const guardianToAdd of guardiansToAdd) {
+    const enableModule = delayModifierContract.interface.encodeFunctionData('enableModule', [guardianToAdd])
+    txData.push(enableModule)
+
+    // Need not add guardian to cache as not relevant for prevModule
+  }
+
+  for (const guardianToRemove of guardiansToRemove) {
+    const prevModule = (() => {
+      const guardianIndex = _guardians.findIndex((guardian) => sameAddress(guardian, guardianToRemove))
+      return guardianIndex === 0 ? SENTINEL_ADDRESS : _guardians[guardianIndex - 1]
+    })()
+    const disableModule = delayModifierContract.interface.encodeFunctionData('disableModule', [
+      prevModule,
+      guardianToRemove,
+    ])
+    txData.push(disableModule)
+
+    // Remove guardian from cache
+    _guardians = _guardians.filter((guardian) => !sameAddress(guardian, guardianToRemove))
+  }
+
+  return txData.map((data) => ({
+    to: moduleAddress,
+    value: '0',
+    operation: OperationType.Call,
+    data,
+  }))
+}
+
+export async function getRecoveryUpsertTransactions({
+  txCooldown,
+  txExpiration,
+  guardian,
+  provider,
+  moduleAddress,
+  chainId,
+  safeAddress,
+}: UpsertRecoveryFlowProps & {
+  moduleAddress?: string
+  provider: Web3Provider
+  chainId: string
+  safeAddress: string
+}): Promise<Array<MetaTransactionData>> {
+  if (moduleAddress) {
+    return _getEditRecoveryTransactions({
+      moduleAddress,
+      newTxCooldown: txCooldown,
+      newTxExpiration: txExpiration,
+      newGuardians: [guardian],
+      provider,
+    })
+  }
+
+  const { transactions } = _getRecoverySetupTransactions({
+    txCooldown,
+    txExpiration,
+    guardians: [guardian],
+    chainId,
+    safeAddress,
+    provider,
+  })
+
+  return transactions
+}