diff --git a/.changeset/orange-falcons-act.md b/.changeset/orange-falcons-act.md
new file mode 100644
index 00000000000..569130177e6
--- /dev/null
+++ b/.changeset/orange-falcons-act.md
@@ -0,0 +1,7 @@
+---
+"@aws-amplify/ui-react-core": patch
+"@aws-amplify/ui-react-native": patch
+"@aws-amplify/ui": patch
+---
+
+fix(Authenticator): update state machine to include onDone in federated sign in flow
diff --git a/examples/react-native/ios/Podfile.lock b/examples/react-native/ios/Podfile.lock
index a27ba1badc6..52299ee9509 100644
--- a/examples/react-native/ios/Podfile.lock
+++ b/examples/react-native/ios/Podfile.lock
@@ -547,4 +547,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: 86255707601fa0f502375c1c40775dbd535ed624
 
-COCOAPODS: 1.12.1
+COCOAPODS: 1.14.3
diff --git a/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/__snapshots__/useAuthenticatorRoute.spec.ts.snap b/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/__snapshots__/useAuthenticatorRoute.spec.ts.snap
index f58fbbfdf12..c8119f221f5 100644
--- a/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/__snapshots__/useAuthenticatorRoute.spec.ts.snap
+++ b/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/__snapshots__/useAuthenticatorRoute.spec.ts.snap
@@ -162,6 +162,7 @@ exports[`useAuthenticatorRoute returns the expected values for the signUp route
     "hasValidationErrors": false,
     "isPending": false,
     "socialProviders": [],
+    "toFederatedSignIn": [MockFunction],
     "toSignIn": [MockFunction],
     "validationErrors": {},
   },
diff --git a/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/utils.spec.ts b/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/utils.spec.ts
index 3c114783f27..30bb7807f36 100644
--- a/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/utils.spec.ts
+++ b/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/__tests__/utils.spec.ts
@@ -115,6 +115,7 @@ describe('getRouteMachineSelector', () => {
         ...commonSelectorProps,
         hasValidationErrors,
         socialProviders,
+        toFederatedSignIn,
         toSignIn,
         validationErrors,
         route,
@@ -186,6 +187,7 @@ describe('props resolver functions', () => {
         hasValidationErrors,
         isPending,
         socialProviders,
+        toFederatedSignIn,
         toSignIn,
         validationErrors,
       },
diff --git a/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/constants.ts b/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/constants.ts
index e882630429c..6999664eb68 100644
--- a/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/constants.ts
+++ b/packages/react-core/src/Authenticator/hooks/useAuthenticatorRoute/constants.ts
@@ -76,6 +76,7 @@ const SIGN_UP_MACHINE_KEYS: SignUpMachineKey[] = [
   ...COMMON_ROUTE_MACHINE_KEYS,
   'hasValidationErrors',
   'socialProviders',
+  'toFederatedSignIn',
   'toSignIn',
   'validationErrors',
 ];
diff --git a/packages/react-native/src/Authenticator/common/DefaultContent/DefaultContent.tsx b/packages/react-native/src/Authenticator/common/DefaultContent/DefaultContent.tsx
index e303315175a..6ed12ad08d9 100644
--- a/packages/react-native/src/Authenticator/common/DefaultContent/DefaultContent.tsx
+++ b/packages/react-native/src/Authenticator/common/DefaultContent/DefaultContent.tsx
@@ -14,7 +14,7 @@ function useThemedStyles<Style>(getStyle: (theme: StrictTheme) => Style) {
 }
 
 export default function DefaultContent<
-  FieldsType extends TextFieldOptionsType | RadioFieldOptions
+  FieldsType extends TextFieldOptionsType | RadioFieldOptions,
 >({
   body,
   buttons: { primary, links, secondary },
diff --git a/packages/react-native/src/Authenticator/common/FederatedProviderButtons/FederatedProviderButtons.tsx b/packages/react-native/src/Authenticator/common/FederatedProviderButtons/FederatedProviderButtons.tsx
index 20e24a838b2..3c6b9e6b66d 100644
--- a/packages/react-native/src/Authenticator/common/FederatedProviderButtons/FederatedProviderButtons.tsx
+++ b/packages/react-native/src/Authenticator/common/FederatedProviderButtons/FederatedProviderButtons.tsx
@@ -1,6 +1,5 @@
 import React, { useMemo } from 'react';
 import { View } from 'react-native';
-import { signInWithRedirect } from 'aws-amplify/auth';
 
 import {
   SocialProvider,
@@ -17,21 +16,13 @@ import { getThemedStyles } from './styles';
 
 const { getSignInWithFederationText, getOrText } = authenticatorTextUtil;
 
-// use `signInWithRedirect` directly instead of `toFederatedSignIn`
-// exposed on `useAuthenticator` for RN. `@aws-amplify/rtn-web-browser`
-// does not emit an event on federated sign in flow cancellation,
-// preventing the `Authenticator` from updating state and leaving the
-// UI in a "pending" state
-const handleSignInWithRedirect = (
-  provider: 'amazon' | 'apple' | 'facebook' | 'google'
-) => signInWithRedirect({ provider: capitalize(provider) });
-
 export default function FederatedProviderButtons({
   buttonStyle,
   dividerLabelStyle,
   route,
   socialProviders,
   style,
+  toFederatedSignIn,
 }: FederatedProviderButtonsProps): JSX.Element | null {
   const theme = useTheme();
   const themedStyle = getThemedStyles(theme);
@@ -42,7 +33,7 @@ export default function FederatedProviderButtons({
         const providerIconSource = icons[`${provider}Logo`];
 
         const handlePress = () => {
-          handleSignInWithRedirect(provider);
+          toFederatedSignIn({ provider: capitalize(provider) });
         };
 
         return (
@@ -56,7 +47,7 @@ export default function FederatedProviderButtons({
           </FederatedProviderButton>
         );
       }),
-    [route, socialProviders, themedStyle, buttonStyle]
+    [route, socialProviders, themedStyle, buttonStyle, toFederatedSignIn]
   );
 
   return providerButtons?.length ? (
diff --git a/packages/react-native/src/Authenticator/common/FederatedProviderButtons/__tests__/FederatedProviderButtons.spec.tsx b/packages/react-native/src/Authenticator/common/FederatedProviderButtons/__tests__/FederatedProviderButtons.spec.tsx
index f22ca51c57a..f3fec58f5aa 100644
--- a/packages/react-native/src/Authenticator/common/FederatedProviderButtons/__tests__/FederatedProviderButtons.spec.tsx
+++ b/packages/react-native/src/Authenticator/common/FederatedProviderButtons/__tests__/FederatedProviderButtons.spec.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import { fireEvent, render } from '@testing-library/react-native';
-import * as AuthModule from 'aws-amplify/auth';
 
 import {
   AuthenticatorRoute,
@@ -44,13 +43,7 @@ describe('FederatedProviderButtons', () => {
     expect(toJSON()).toBe(null);
   });
 
-  it('calls signInWithRedirect with the expected provider on press', () => {
-    const signInWithRedirectSpy = jest
-      .spyOn(AuthModule, 'signInWithRedirect')
-      .mockImplementation((_?: AuthModule.SignInWithRedirectInput) =>
-        Promise.resolve(undefined)
-      );
-
+  it('calls toFederatedSignIn with the expected provider on press', () => {
     const { getByText } = render(
       <FederatedProviderButtons {...defaultProps} />
     );
@@ -62,7 +55,7 @@ describe('FederatedProviderButtons', () => {
 
     fireEvent.press(providerButton);
 
-    expect(signInWithRedirectSpy).toHaveBeenCalledWith({
+    expect(toFederatedSignIn).toHaveBeenCalledWith({
       provider: capitalize(provider),
     });
   });
diff --git a/packages/ui/src/helpers/authenticator/__tests__/getRoute.test.ts b/packages/ui/src/helpers/authenticator/__tests__/getRoute.test.ts
index 44123ef4faa..078de41fee4 100644
--- a/packages/ui/src/helpers/authenticator/__tests__/getRoute.test.ts
+++ b/packages/ui/src/helpers/authenticator/__tests__/getRoute.test.ts
@@ -24,7 +24,7 @@ describe('getRoute', () => {
     } as AuthActorState;
   };
 
-  it(`should return null when the current state is unknown`, () => {
+  it('should return `null` when the current state is unknown', () => {
     const state = getState();
     const actorState = getActorState();
 
@@ -32,7 +32,7 @@ describe('getRoute', () => {
   });
 
   it.each(['idle', 'setup'])(
-    `should return the '%s' route when the current state is '%s'`,
+    "should return the '%s' route when the current state is '%s'",
     (route: string) => {
       const state = getState(route);
       const actorState = getActorState(); // actor state is undefined here
@@ -41,14 +41,14 @@ describe('getRoute', () => {
     }
   );
 
-  it(`should return the 'signOut' route when the current state is 'signOut'`, () => {
+  it("should return the 'signOut' route when the current state is 'signOut'", () => {
     const state = getState('signOut');
     const actorState = getActorState('pending');
 
     expect(getRoute(state, actorState)).toBe('signOut');
   });
 
-  it(`should return the 'authenticated' route when the current state is 'authenticated'`, () => {
+  it("should return the 'authenticated' route when the current state is 'authenticated'", () => {
     const state = getState('authenticated');
     const actorState = getActorState('resolved');
 
@@ -56,7 +56,7 @@ describe('getRoute', () => {
   });
 
   it.each(['confirmSignUp', 'resendSignUpCode'])(
-    `should return the 'confirmSignUp' route when the current actorState is '%s'`,
+    "should return the 'confirmSignUp' route when the current actorState is '%s'",
     (route: string) => {
       const state = getState('signInActor.runActor');
       const actorState = getActorState(route);
@@ -65,7 +65,7 @@ describe('getRoute', () => {
     }
   );
 
-  it(`should return the 'confirmSignIn' route when the current actorState is 'confirmSignIn'`, () => {
+  it("should return the 'confirmSignIn' route when the current actorState is 'confirmSignIn'", () => {
     const state = getState('signInActor.runActor');
     const actorState = getActorState('confirmSignIn');
 
@@ -73,7 +73,7 @@ describe('getRoute', () => {
   });
 
   it.each(['setupTotp.edit', 'setupTotp.submit'])(
-    `should return the 'setupTotp' route when the current actorState is '%s'`,
+    "should return the 'setupTotp' route when the current actorState is '%s'",
     (route: string) => {
       const state = getState('signInActor.runActor');
       const actorState = getActorState(route);
@@ -82,18 +82,25 @@ describe('getRoute', () => {
     }
   );
 
-  it.each(['signIn', 'federatedSignIn'])(
-    `should return the 'signIn' route when actorState is '%s'`,
+  it.each(['signIn', 'signUp'])(
+    "should return the '%s' route when actorState is 'federatedSignIn",
     (route: string) => {
-      const state = getState('signInActor.runActor');
-      const actorState = getActorState(route);
+      const state = getState(`${route}Actor`);
+      const actorState = getActorState('federatedSignIn');
 
-      expect(getRoute(state, actorState)).toBe('signIn');
+      expect(getRoute(state, actorState)).toBe(route);
     }
   );
 
+  it("should return the 'signIn' route when actorState is 'signIn'", () => {
+    const state = getState('signInActor.runActor');
+    const actorState = getActorState('signIn');
+
+    expect(getRoute(state, actorState)).toBe('signIn');
+  });
+
   it.each(['signUp', 'autoSignIn'])(
-    `should return the 'signUp' route when actorState is '%s'`,
+    "should return the 'signUp' route when actorState is '%s'",
     (route: string) => {
       const state = getState('signUpActor.runActor');
       const actorState = getActorState(route);
@@ -102,49 +109,49 @@ describe('getRoute', () => {
     }
   );
 
-  it(`should return the 'forceNewPassword' route when the current actorState is 'forceChangePassword'`, () => {
+  it("should return the 'forceNewPassword' route when the current actorState is 'forceChangePassword'", () => {
     const state = getState('signInActor.runActor');
     const actorState = getActorState('forceChangePassword');
 
     expect(getRoute(state, actorState)).toBe('forceNewPassword');
   });
 
-  it(`should return the 'forgotPassword' route when the current actorState is 'forgotPassword'`, () => {
+  it("should return the 'forgotPassword' route when the current actorState is 'forgotPassword'", () => {
     const state = getState('forgotPasswordActor.runActor');
     const actorState = getActorState('forgotPassword');
 
     expect(getRoute(state, actorState)).toBe('forgotPassword');
   });
 
-  it(`should return the 'confirmResetPassword' route when the current actorState is 'confirmResetPassword'`, () => {
+  it("should return the 'confirmResetPassword' route when the current actorState is 'confirmResetPassword'", () => {
     const state = getState('forgotPasswordActor.runActor');
     const actorState = getActorState('confirmResetPassword');
 
     expect(getRoute(state, actorState)).toBe('confirmResetPassword');
   });
 
-  it(`should return the 'verifyUser' route when the current actorState is 'selectUserAttributes'`, () => {
+  it("should return the 'verifyUser' route when the current actorState is 'selectUserAttributes'", () => {
     const state = getState('verifyUserAttributesActor.runActor');
     const actorState = getActorState('selectUserAttributes');
 
     expect(getRoute(state, actorState)).toBe('verifyUser');
   });
 
-  it(`should return the 'confirmVerifyUser' route when the current actorState is 'confirmVerifyUserAttribute'`, () => {
+  it("should return the 'confirmVerifyUser' route when the current actorState is 'confirmVerifyUserAttribute'", () => {
     const state = getState('verifyUserAttributesActor.runActor');
     const actorState = getActorState('confirmVerifyUserAttribute');
 
     expect(getRoute(state, actorState)).toBe('confirmVerifyUser');
   });
 
-  it(`should return the 'transition' route when the current state is 'getCurrentUser'`, () => {
+  it("should return the 'transition' route when the current state is 'getCurrentUser'", () => {
     const state = getState('getCurrentUser');
     const actorState = getActorState('resolved');
 
     expect(getRoute(state, actorState)).toBe('transition');
   });
 
-  it(`should return the 'transition' route when the current actorState is 'fetchUserAttributes'`, () => {
+  it("should return the 'transition' route when the current actorState is 'fetchUserAttributes'", () => {
     const state = getState('signInActor.runActor');
     const actorState = getActorState('fetchUserAttributes');
 
diff --git a/packages/ui/src/helpers/authenticator/getRoute.ts b/packages/ui/src/helpers/authenticator/getRoute.ts
index c6bc1503cdb..6c37ae56d30 100644
--- a/packages/ui/src/helpers/authenticator/getRoute.ts
+++ b/packages/ui/src/helpers/authenticator/getRoute.ts
@@ -7,6 +7,18 @@ export const getRoute = (
   state: AuthMachineState,
   actorState: AuthActorState
 ) => {
+  // 'federatedSignIn' exists as a state on both the 'signInActor' and 'signUpActor',
+  // match against the `actorState` initially to determine if the federated sign in flow
+  // has begun, then which actor has begun the flow and return the corresponding `route`
+  if (actorState?.matches('federatedSignIn')) {
+    if (state.matches('signUpActor')) {
+      return 'signUp';
+    }
+    if (state.matches('signInActor')) {
+      return 'signIn';
+    }
+  }
+
   switch (true) {
     case state.matches('idle'):
       return 'idle';
@@ -25,7 +37,6 @@ export const getRoute = (
     case actorState?.matches('setupTotp.submit'):
       return 'setupTotp';
     case actorState?.matches('signIn'):
-    case actorState?.matches('federatedSignIn'):
       return 'signIn';
     case actorState?.matches('signUp'):
     case actorState?.matches('autoSignIn'):
diff --git a/packages/ui/src/machines/authenticator/actors/__tests__/__snapshots__/utils.test.ts.snap b/packages/ui/src/machines/authenticator/actors/__tests__/__snapshots__/utils.test.ts.snap
new file mode 100644
index 00000000000..b878f301d7f
--- /dev/null
+++ b/packages/ui/src/machines/authenticator/actors/__tests__/__snapshots__/utils.test.ts.snap
@@ -0,0 +1,39 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`getFederatedSignInState returns the expected 'federatedSignIn\` state values for the 'signIn' route 1`] = `
+{
+  "entry": [
+    "sendUpdate",
+    "clearError",
+  ],
+  "invoke": {
+    "onDone": {
+      "target": "signIn",
+    },
+    "onError": {
+      "actions": "setRemoteError",
+      "target": "signIn",
+    },
+    "src": "signInWithRedirect",
+  },
+}
+`;
+
+exports[`getFederatedSignInState returns the expected 'federatedSignIn\` state values for the 'signUp' route 1`] = `
+{
+  "entry": [
+    "sendUpdate",
+    "clearError",
+  ],
+  "invoke": {
+    "onDone": {
+      "target": "signUp",
+    },
+    "onError": {
+      "actions": "setRemoteError",
+      "target": "signUp",
+    },
+    "src": "signInWithRedirect",
+  },
+}
+`;
diff --git a/packages/ui/src/machines/authenticator/actors/__tests__/utils.test.ts b/packages/ui/src/machines/authenticator/actors/__tests__/utils.test.ts
new file mode 100644
index 00000000000..bc09421826e
--- /dev/null
+++ b/packages/ui/src/machines/authenticator/actors/__tests__/utils.test.ts
@@ -0,0 +1,11 @@
+import { getFederatedSignInState } from '../utils';
+
+describe('getFederatedSignInState', () => {
+  it.each(['signIn', 'signUp'])(
+    "returns the expected 'federatedSignIn` state values for the '%s' route",
+    (route: 'signIn' | 'signUp') => {
+      const output = getFederatedSignInState(route);
+      expect(output).toMatchSnapshot();
+    }
+  );
+});
diff --git a/packages/ui/src/machines/authenticator/actors/signIn.ts b/packages/ui/src/machines/authenticator/actors/signIn.ts
index f292f7709bd..297254dafdc 100644
--- a/packages/ui/src/machines/authenticator/actors/signIn.ts
+++ b/packages/ui/src/machines/authenticator/actors/signIn.ts
@@ -15,6 +15,8 @@ import guards from '../guards';
 
 import { AuthEvent, ActorDoneData, SignInContext } from '../types';
 
+import { getFederatedSignInState } from './utils';
+
 export interface SignInMachineOptions {
   services?: Partial<typeof defaultServices>;
 }
@@ -101,13 +103,7 @@ export function signInActor({ services }: SignInMachineOptions) {
             { target: 'signIn' },
           ],
         },
-        federatedSignIn: {
-          entry: ['sendUpdate', 'clearError'],
-          invoke: {
-            src: 'signInWithRedirect',
-            onError: { actions: 'setRemoteError' },
-          },
-        },
+        federatedSignIn: getFederatedSignInState('signIn'),
         fetchUserAttributes: {
           invoke: {
             src: 'fetchUserAttributes',
diff --git a/packages/ui/src/machines/authenticator/actors/signUp.ts b/packages/ui/src/machines/authenticator/actors/signUp.ts
index 5d2029482bf..7bf68785e64 100644
--- a/packages/ui/src/machines/authenticator/actors/signUp.ts
+++ b/packages/ui/src/machines/authenticator/actors/signUp.ts
@@ -17,6 +17,8 @@ import actions from '../actions';
 import { defaultServices } from '../defaultServices';
 import guards from '../guards';
 
+import { getFederatedSignInState } from './utils';
+
 export type SignUpMachineOptions = {
   services?: Partial<typeof defaultServices>;
 };
@@ -110,6 +112,7 @@ export function signUpActor({ services }: SignUpMachineOptions) {
             ...handleFetchUserAttributesResponse,
           },
         },
+        federatedSignIn: getFederatedSignInState('signUp'),
         resetPassword: {
           invoke: { src: 'resetPassword', ...handleResetPasswordResponse },
         },
@@ -135,6 +138,9 @@ export function signUpActor({ services }: SignUpMachineOptions) {
         signUp: {
           type: 'parallel',
           exit: 'clearTouched',
+          on: {
+            FEDERATED_SIGN_IN: { target: 'federatedSignIn' },
+          },
           states: {
             validation: {
               initial: 'pending',
@@ -153,8 +159,8 @@ export function signUpActor({ services }: SignUpMachineOptions) {
                 invalid: { entry: 'sendUpdate' },
               },
               on: {
-                CHANGE: { actions: 'handleInput', target: '.pending' },
                 BLUR: { actions: 'handleBlur', target: '.pending' },
+                CHANGE: { actions: 'handleInput', target: '.pending' },
               },
             },
             submission: {
@@ -164,14 +170,6 @@ export function signUpActor({ services }: SignUpMachineOptions) {
                   entry: ['sendUpdate'],
                   on: {
                     SUBMIT: { actions: 'handleSubmit', target: 'validate' },
-                    FEDERATED_SIGN_IN: 'federatedSignIn',
-                  },
-                },
-                federatedSignIn: {
-                  entry: ['sendUpdate', 'clearError'],
-                  invoke: {
-                    src: 'federatedSignIn',
-                    onError: { actions: 'setRemoteError' },
                   },
                 },
                 validate: {
@@ -179,13 +177,13 @@ export function signUpActor({ services }: SignUpMachineOptions) {
                   invoke: {
                     src: 'validateSignUp',
                     onDone: {
-                      target: 'signUp',
+                      target: 'handleSignUp',
                       actions: 'clearValidationError',
                     },
                     onError: { actions: 'setFieldErrors', target: 'idle' },
                   },
                 },
-                signUp: {
+                handleSignUp: {
                   tags: 'pending',
                   entry: ['setUsernameSignUp', 'clearError'],
                   exit: 'sendUpdate',
@@ -291,10 +289,10 @@ export function signUpActor({ services }: SignUpMachineOptions) {
         resendSignUpCode({ username }) {
           return resendSignUpCode({ username });
         },
-        async federatedSignIn(_, { data }) {
+        signInWithRedirect(_, { data }) {
           return signInWithRedirect(data);
         },
-        async handleSignUp(context) {
+        handleSignUp(context) {
           const { formValues, loginMechanisms, username } = context;
           const loginMechanism = loginMechanisms[0];
           const input = getSignUpInput(username, formValues, loginMechanism);
diff --git a/packages/ui/src/machines/authenticator/actors/utils.ts b/packages/ui/src/machines/authenticator/actors/utils.ts
new file mode 100644
index 00000000000..d0175b27f5a
--- /dev/null
+++ b/packages/ui/src/machines/authenticator/actors/utils.ts
@@ -0,0 +1,8 @@
+export const getFederatedSignInState = (target: 'signIn' | 'signUp') => ({
+  entry: ['sendUpdate', 'clearError'],
+  invoke: {
+    src: 'signInWithRedirect',
+    onDone: { target },
+    onError: { actions: 'setRemoteError', target },
+  },
+});
diff --git a/packages/ui/src/machines/authenticator/index.ts b/packages/ui/src/machines/authenticator/index.ts
index 6b15901a5a9..3067fa04ca1 100644
--- a/packages/ui/src/machines/authenticator/index.ts
+++ b/packages/ui/src/machines/authenticator/index.ts
@@ -265,10 +265,7 @@ export function createAuthenticatorMachine(
           initial: 'spawnActor',
           states: {
             spawnActor: {
-              always: {
-                actions: 'spawnSignOutActor',
-                target: 'runActor',
-              },
+              always: { actions: 'spawnSignOutActor', target: 'runActor' },
             },
             runActor: {
               entry: 'clearActorDoneData',