feat: add required field support (#557)

src/common-components/data/actions.js

@@ -12,9 +12,9 @@ export const getThirdPartyAuthContextBegin = () => ({
   type: THIRD_PARTY_AUTH_CONTEXT.BEGIN,
 });
 
-export const getThirdPartyAuthContextSuccess = (thirdPartyAuthContext) => ({
+export const getThirdPartyAuthContextSuccess = (fieldDescriptions, thirdPartyAuthContext) => ({
   type: THIRD_PARTY_AUTH_CONTEXT.SUCCESS,
-  payload: { thirdPartyAuthContext },
+  payload: { fieldDescriptions, thirdPartyAuthContext },
 });
 
 export const getThirdPartyAuthContextFailure = () => ({

src/common-components/data/reducers.js

@@ -3,6 +3,8 @@ import { THIRD_PARTY_AUTH_CONTEXT } from './actions';
 import { PENDING_STATE, COMPLETE_STATE } from '../../data/constants';
 
 export const defaultState = {
+  extendedProfile: [],
+  fieldDescriptions: {},
   thirdPartyAuthApiStatus: null,
 };
 
@@ -16,6 +18,8 @@ const reducer = (state = defaultState, action) => {
     case THIRD_PARTY_AUTH_CONTEXT.SUCCESS:
       return {
         ...state,
+        extendedProfile: action.payload.fieldDescriptions.extendedProfile,
+        fieldDescriptions: action.payload.fieldDescriptions.fields,
         thirdPartyAuthContext: action.payload.thirdPartyAuthContext,
         thirdPartyAuthApiStatus: COMPLETE_STATE,
       };

src/common-components/data/sagas.js

@@ -18,10 +18,10 @@ import {
 export function* fetchThirdPartyAuthContext(action) {
   try {
     yield put(getThirdPartyAuthContextBegin());
-    const { thirdPartyAuthContext } = yield call(getThirdPartyAuthContext, action.payload.urlParams);
+    const { fieldDescriptions, thirdPartyAuthContext } = yield call(getThirdPartyAuthContext, action.payload.urlParams);
 
     yield put(getThirdPartyAuthContextSuccess(
-      thirdPartyAuthContext,
+      fieldDescriptions, thirdPartyAuthContext,
     ));
   } catch (e) {
     yield put(getThirdPartyAuthContextFailure());

src/common-components/data/selectors.js

@@ -8,3 +8,13 @@ export const thirdPartyAuthContextSelector = createSelector(
   commonComponentsSelector,
   commonComponents => commonComponents.thirdPartyAuthContext,
 );
+
+export const fieldDescriptionSelector = createSelector(
+  commonComponentsSelector,
+  commonComponents => commonComponents.fieldDescriptions,
+);
+
+export const extendedProfileSelector = createSelector(
+  commonComponentsSelector,
+  commonComponents => commonComponents.extendedProfile,
+);

src/common-components/data/service.js

@@ -18,6 +18,11 @@ export async function getThirdPartyAuthContext(urlParams) {
       throw (e);
     });
   return {
-    thirdPartyAuthContext: camelCaseObject(convertKeyNames(data, { fullname: 'name' })),
+    fieldDescriptions: data.registration_fields || {},
+    // For backward compatibility with the API, once https://github.com/openedx/edx-platform/pull/30198 is merged
+    // and deployed update it to use data.context_data
+    thirdPartyAuthContext: camelCaseObject(
+      convertKeyNames(data.context_data || data, { fullname: 'name' }),
+    ),
   };
 }

src/common-components/data/tests/sagas.test.js

@@ -26,7 +26,7 @@ describe('fetchThirdPartyAuthContext', () => {
 
   it('should call service and dispatch success action', async () => {
     const getThirdPartyAuthContext = jest.spyOn(api, 'getThirdPartyAuthContext')
-      .mockImplementation(() => Promise.resolve({ thirdPartyAuthContext: data }));
+      .mockImplementation(() => Promise.resolve({ thirdPartyAuthContext: data, fieldDescriptions: {} }));
 
     const dispatched = [];
     await runSaga(
@@ -38,7 +38,7 @@ describe('fetchThirdPartyAuthContext', () => {
     expect(getThirdPartyAuthContext).toHaveBeenCalledTimes(1);
     expect(dispatched).toEqual([
       actions.getThirdPartyAuthContextBegin(),
-      actions.getThirdPartyAuthContextSuccess(data),
+      actions.getThirdPartyAuthContextSuccess({}, data),
     ]);
     getThirdPartyAuthContext.mockClear();
   });