refactor: add loading state for publisher consents

jwplayer · Feb 9, 2024 · 9266111 · 9266111
1 parent 24dde0b
commit 9266111
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/packages/common/src/controllers/AccountController.ts b/packages/common/src/controllers/AccountController.ts
@@ -270,10 +270,10 @@ export default class AccountController {
   getPublisherConsents = async () => {
     const { config } = useConfigStore.getState();
 
-    useAccountStore.setState({ loading: true });
+    useAccountStore.setState({ publisherConsentsLoading: true });
     const consents = await this.accountService.getPublisherConsents(config);
 
-    useAccountStore.setState({ publisherConsents: consents, loading: false });
+    useAccountStore.setState({ publisherConsents: consents, publisherConsentsLoading: false });
   };
 
   getCaptureStatus = async (): Promise<GetCaptureStatusResponse> => {

diff --git a/packages/common/src/stores/AccountStore.ts b/packages/common/src/stores/AccountStore.ts
@@ -12,6 +12,7 @@ type AccountStore = {
   activePayment: PaymentDetail | null;
   customerConsents: CustomerConsent[] | null;
   publisherConsents: CustomFormField[] | null;
+  publisherConsentsLoading: boolean;
   pendingOffer: Offer | null;
   setLoading: (loading: boolean) => void;
   getAccountInfo: () => { customerId: string; customer: Customer; customerConsents: CustomerConsent[] | null };
@@ -25,6 +26,7 @@ export const useAccountStore = createStore<AccountStore>('AccountStore', (set, g
   activePayment: null,
   customerConsents: null,
   publisherConsents: null,
+  publisherConsentsLoading: false,
   pendingOffer: null,
   setLoading: (loading: boolean) => set({ loading }),
   getAccountInfo: () => {

diff --git a/packages/ui-react/src/containers/AccountModal/forms/Registration.tsx b/packages/ui-react/src/containers/AccountModal/forms/Registration.tsx
@@ -22,7 +22,11 @@ const Registration = () => {
   const [consentValues, setConsentValues] = useState<Record<string, string | boolean>>({});
   const [consentErrors, setConsentErrors] = useState<string[]>([]);
 
-  const { publisherConsents, loading } = useAccountStore(({ publisherConsents, loading }) => ({ publisherConsents, loading }));
+  const { publisherConsents, publisherConsentsLoading, loading } = useAccountStore(({ publisherConsents, publisherConsentsLoading, loading }) => ({
+    publisherConsents,
+    publisherConsentsLoading,
+    loading,
+  }));
 
   const handleChangeConsent: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> = ({ currentTarget }) => {
     if (!currentTarget) return;
@@ -84,7 +88,7 @@ const Registration = () => {
       submitting={submitting}
       consentValues={consentValues}
       publisherConsents={publisherConsents}
-      loading={loading}
+      loading={loading || publisherConsentsLoading}
       canSubmit={!!values.email && !!values.password}
     />
   );