diff --git a/ts/components/registration/ModalContainer.tsx b/ts/components/registration/ModalContainer.tsx
new file mode 100644
index 000000000..75fd21498
--- /dev/null
+++ b/ts/components/registration/ModalContainer.tsx
@@ -0,0 +1,15 @@
+import { useSelector } from 'react-redux';
+import { getTermsOfServicePrivacyModalState } from '../../state/onboarding/selectors/modals';
+import { TermsOfServicePrivacyDialog } from '../dialog/TermsOfServicePrivacyDialog';
+
+export const ModalContainer = () => {
+ const termsOfServicePrivacyModalState = useSelector(getTermsOfServicePrivacyModalState);
+
+ return (
+ <>
+ {termsOfServicePrivacyModalState && (
+
+ )}
+ >
+ );
+};
diff --git a/ts/components/registration/RegistrationStages.tsx b/ts/components/registration/RegistrationStages.tsx
index 2109ad15e..6da3476b2 100644
--- a/ts/components/registration/RegistrationStages.tsx
+++ b/ts/components/registration/RegistrationStages.tsx
@@ -1,4 +1,5 @@
import { createContext, useEffect, useMemo, useState } from 'react';
+import { Provider } from 'react-redux';
import { Data } from '../../data/data';
import { SettingsKey } from '../../data/settings-key';
import { getSwarmPollingInstance } from '../../session/apis/snode_api';
@@ -8,6 +9,7 @@ import { PromiseUtils, StringUtils, ToastUtils } from '../../session/utils';
import { TaskTimedOutError } from '../../session/utils/Promise';
import { fromHex } from '../../session/utils/String';
import { trigger } from '../../shims/events';
+import { onboardingStore } from '../../state/onboarding/store';
import {
generateMnemonic,
registerSingleDevice,
@@ -15,6 +17,7 @@ import {
signInByLinkingDevice,
} from '../../util/accountManager';
import { Storage, setSignInByLinking, setSignWithRecoveryPhrase } from '../../util/storage';
+import { ModalContainer } from './ModalContainer';
import { SignInMode, SignInTab } from './SignInTab';
import { SignUpMode, SignUpTab } from './SignUpTab';
@@ -235,13 +238,16 @@ export const RegistrationStages = () => {
]);
return (
-
-
- {(registrationPhase === RegistrationPhase.Start ||
- registrationPhase === RegistrationPhase.SignUp) && }
- {(registrationPhase === RegistrationPhase.Start ||
- registrationPhase === RegistrationPhase.SignIn) && }
-
-
+
+
+
+
+ {(registrationPhase === RegistrationPhase.Start ||
+ registrationPhase === RegistrationPhase.SignUp) && }
+ {(registrationPhase === RegistrationPhase.Start ||
+ registrationPhase === RegistrationPhase.SignIn) && }
+
+
+
);
};
diff --git a/ts/components/registration/TermsAndConditions.tsx b/ts/components/registration/TermsAndConditions.tsx
index 29a494a39..39bc083e8 100644
--- a/ts/components/registration/TermsAndConditions.tsx
+++ b/ts/components/registration/TermsAndConditions.tsx
@@ -1,6 +1,6 @@
import { useDispatch } from 'react-redux';
import styled from 'styled-components';
-import { updateTermsOfServicePrivacyModal } from '../../state/ducks/modalDialog';
+import { updateTermsOfServicePrivacyModal } from '../../state/onboarding/ducks/modals';
import { SessionHtmlRenderer } from '../basic/SessionHTMLRenderer';
const StyledTermsAndConditions = styled.div`
diff --git a/ts/state/onboarding/ducks/modals.ts b/ts/state/onboarding/ducks/modals.ts
new file mode 100644
index 000000000..9fa1ea20f
--- /dev/null
+++ b/ts/state/onboarding/ducks/modals.ts
@@ -0,0 +1,28 @@
+import { PayloadAction, createSlice } from '@reduxjs/toolkit';
+import { TermsOfServicePrivacyDialogProps } from '../../../components/dialog/TermsOfServicePrivacyDialog';
+
+export type TermsOfServicePrivacyModalState = TermsOfServicePrivacyDialogProps | null;
+
+export type ModalsState = {
+ termsOfServicePrivacyModalState: TermsOfServicePrivacyModalState | null;
+};
+
+const initialState: ModalsState = {
+ termsOfServicePrivacyModalState: null,
+};
+
+export const modalsSlice = createSlice({
+ name: 'modals',
+ initialState,
+ reducers: {
+ updateTermsOfServicePrivacyModal(
+ state,
+ action: PayloadAction
+ ) {
+ return { ...state, termsOfServicePrivacyModalState: action.payload };
+ },
+ },
+});
+
+export const { updateTermsOfServicePrivacyModal } = modalsSlice.actions;
+export default modalsSlice.reducer;
diff --git a/ts/state/onboarding/selectors/modals.ts b/ts/state/onboarding/selectors/modals.ts
new file mode 100644
index 000000000..3f6483c1c
--- /dev/null
+++ b/ts/state/onboarding/selectors/modals.ts
@@ -0,0 +1,12 @@
+import { createSelector } from '@reduxjs/toolkit';
+import { ModalsState, TermsOfServicePrivacyModalState } from '../ducks/modals';
+import { OnboardingStoreState } from '../store';
+
+const getModals = (state: OnboardingStoreState): ModalsState => {
+ return state.modals;
+};
+
+export const getTermsOfServicePrivacyModalState = createSelector(
+ getModals,
+ (state: ModalsState): TermsOfServicePrivacyModalState => state.termsOfServicePrivacyModalState
+);
diff --git a/ts/state/onboarding/store.ts b/ts/state/onboarding/store.ts
new file mode 100644
index 000000000..f3cc4b4b4
--- /dev/null
+++ b/ts/state/onboarding/store.ts
@@ -0,0 +1,9 @@
+import { configureStore } from '@reduxjs/toolkit';
+import modalsReducer from './ducks/modals';
+
+export const onboardingStore = configureStore({
+ reducer: { modals: modalsReducer },
+});
+
+export type OnboardingStoreState = ReturnType;
+export type OnboardingStoreDispatch = typeof onboardingStore.dispatch;