From 26def9309fc47ff4fbf6797f0cf36e119d27f9f2 Mon Sep 17 00:00:00 2001
From: Tom <20648924+moT01@users.noreply.github.com>
Date: Wed, 18 May 2022 06:11:03 -0500
Subject: [PATCH] chore: check if canClaimCert before calling backend (#46029)

* chore: check if canClaimCert before calling backend

* refactor: make canClaimCert declarative

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
---
 client/src/redux/settings/settings-sagas.js | 33 ++++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

diff --git a/client/src/redux/settings/settings-sagas.js b/client/src/redux/settings/settings-sagas.js
index 00bf9dc8957..2656c4a0fa7 100644
--- a/client/src/redux/settings/settings-sagas.js
+++ b/client/src/redux/settings/settings-sagas.js
@@ -1,5 +1,12 @@
 import { omit } from 'lodash-es';
-import { call, delay, put, takeLatest, takeEvery } from 'redux-saga/effects';
+import {
+  call,
+  delay,
+  put,
+  select,
+  takeLatest,
+  takeEvery
+} from 'redux-saga/effects';
 
 import { createFlashMessage } from '../../components/Flash/redux';
 import {
@@ -10,6 +17,8 @@ import {
   putUpdateUserFlag,
   putVerifyCert
 } from '../../utils/ajax';
+import { certMap } from '../../resources/cert-and-project-map';
+import { completedChallengesSelector } from '..';
 import {
   updateUserFlagComplete,
   updateUserFlagError,
@@ -78,6 +87,28 @@ function* validateUsernameSaga({ payload }) {
 }
 
 function* verifyCertificationSaga({ payload }) {
+  // check redux if can claim cert before calling backend
+  const completedChallenges = yield select(completedChallengesSelector);
+  const currentCert = certMap.find(cert => cert.certSlug === payload);
+  const currentCertIds = currentCert?.projects.map(project => project.id);
+  const certTitle = currentCert?.title || payload;
+
+  const flash = {
+    type: 'info',
+    message: 'flash.incomplete-steps',
+    variables: { name: certTitle }
+  };
+
+  const canClaimCert = currentCertIds.every(id =>
+    completedChallenges.find(challenge => challenge.id === id)
+  );
+
+  if (!canClaimCert) {
+    yield put(createFlashMessage(flash));
+    return;
+  }
+
+  // redux says challenges are complete, call back end
   try {
     const { response, isCertMap, completedChallenges } = yield call(
       putVerifyCert,