diff --git a/mailpoet/assets/js/src/common/form/index.ts b/mailpoet/assets/js/src/common/form/index.ts
index f80c088ab0..daf0736375 100644
--- a/mailpoet/assets/js/src/common/form/index.ts
+++ b/mailpoet/assets/js/src/common/form/index.ts
@@ -1,3 +1,4 @@
export * from './select/select';
export * from './input/input';
export * from './toggle/toggle';
+export * from './checkbox/checkbox';
diff --git a/mailpoet/assets/js/src/settings/pages/woo-commerce/checkout-optin.tsx b/mailpoet/assets/js/src/settings/pages/woo-commerce/checkout-optin.tsx
index 9f7ed3af6b..c7911c4b66 100644
--- a/mailpoet/assets/js/src/settings/pages/woo-commerce/checkout-optin.tsx
+++ b/mailpoet/assets/js/src/settings/pages/woo-commerce/checkout-optin.tsx
@@ -1,7 +1,5 @@
import { useEffect } from 'react';
-import { onChange } from 'common/functions';
-import { Checkbox } from 'common/form/checkbox/checkbox';
-import { Input } from 'common/form/input/input';
+import { onChange, Checkbox, Input, Select } from 'common';
import { Label, Inputs, SegmentsSelect } from 'settings/components';
import { useSetting, useAction } from 'settings/store/hooks';
import { __ } from '@wordpress/i18n';
@@ -22,6 +20,11 @@ export function CheckoutOptin() {
'optin_on_checkout',
'message',
);
+ const [position, setPosition] = useSetting(
+ 'woocommerce',
+ 'optin_on_checkout',
+ 'position',
+ );
const setErrorFlag = useAction('setErrorFlag');
const emptyMessage = message.trim() === '';
useEffect(() => {
@@ -98,6 +101,75 @@ export function CheckoutOptin() {
>
)}
+ {enabled === '1' && (
+ <>
+
+
+
+
+ >
+ )}
>
);
}
diff --git a/mailpoet/assets/js/src/settings/store/types.ts b/mailpoet/assets/js/src/settings/store/types.ts
index 95e1cc14d2..f013e514b5 100644
--- a/mailpoet/assets/js/src/settings/store/types.ts
+++ b/mailpoet/assets/js/src/settings/store/types.ts
@@ -123,6 +123,7 @@ export type Settings = {
enabled: '1' | '';
segments: string[];
message: string;
+ position?: string;
};
accept_cookie_revenue_tracking: {
set: '1' | '';