@instructure/quiz-core 22.17.0 → 22.18.0

package/src/common/api/callHandlers.js

@@ -0,0 +1,185 @@
+/* eslint "no-param-reassign": "warn" */
+import {normalize} from 'normalizr'
+import omit from 'lodash/omit'
+
+import {
+  bankEntrySchema,
+  bankSchema,
+  interactionTypeSchema,
+  itemAnalysisSchema,
+  itemSchema,
+  qtiImportSchema,
+  quizAnalysisSchema,
+  quizEntrySchema,
+  quizEntriesSchema,
+  quizSchema,
+  quizSessionEventSchema,
+  quizSessionResultSchema,
+  quizSessionSchema,
+  resumeDataSchema,
+  shareBankSchema,
+  sessionItemResultSchema,
+  sessionItemSchema,
+  stimulusSchema,
+} from './schema'
+
+import getPersistenceActions from './getPersistenceActions'
+import {loadResumeData} from '../actions/taking'
+
+// ===========
+//   HELPERS
+// ===========
+
+const handleSingleObject = (data, schema) => {
+  const normalizedData = normalize(data, schema)
+  return getPersistenceActions(normalizedData)
+}
+
+const handleArray = (data, schema) => {
+  const normalizedData = normalize(data, [schema])
+  return getPersistenceActions(normalizedData)
+}
+
+const setQuizSessionKeys = (quizSessionId, itemToKey) => {
+  itemToKey.quizSessionId = quizSessionId
+  itemToKey.id = `${quizSessionId}_${itemToKey.position}`
+}
+
+const setQuizSessionKeysForList = (quizSessionId, listOfItems) => {
+  return listOfItems.forEach(itemToKey => setQuizSessionKeys(quizSessionId, itemToKey))
+}
+
+const omitDeprecatedQSData = quizSessionData => {
+  return omit(quizSessionData, ['resume_data', 'session_items', 'session_item_responses'])
+}
+
+const quizEntriesWithInteractionTypes = quizEntriesData => {
+  return quizEntriesData.map(quizEntry => {
+    const sampleItemsInteractionTypes = []
+
+    quizEntry.sample_items &&
+      quizEntry.sample_items.forEach(item => {
+        const itemInteractionType = item.entry && item.entry.interaction_type
+        if (
+          itemInteractionType &&
+          !sampleItemsInteractionTypes.filter(i => i.id === itemInteractionType.id).length
+        ) {
+          sampleItemsInteractionTypes.push(itemInteractionType)
+        }
+      })
+
+    return {
+      ...quizEntry,
+      interaction_types: sampleItemsInteractionTypes,
+    }
+  })
+}
+
+// ============
+//   HANDLERS
+// ============
+
+// these handlers are called in the success callback of an api call
+
+// - normalize the data (via normaliz & schema)
+// - get actions based on that data (via getPersistenceActions)
+// return an array of those actions
+// - adds id attribute to objects that need a uniq key in the store
+
+// ========= Single Object Handlers =========
+
+export const handleQuizResponse = quizData => {
+  return handleSingleObject(quizData, quizSchema)
+}
+
+export const handleQuizAnalysisResponse = quizAnalysisData => {
+  return handleSingleObject(quizAnalysisData, quizAnalysisSchema)
+}
+
+export const handleQuizSessionResponse = quizSessionData => {
+  return handleSingleObject(omitDeprecatedQSData(quizSessionData), quizSessionSchema)
+}
+
+export const handleBankResponse = bankData => {
+  return handleSingleObject(bankData, bankSchema)
+}
+
+export const handleShareBankResponse = shareBankData => {
+  return handleSingleObject(shareBankData, shareBankSchema)
+}
+
+export const handleBankEntryResponse = bankEntryData => {
+  return handleSingleObject(bankEntryData, bankEntrySchema)
+}
+
+export const handleQuizEntryResponse = quizEntryData => {
+  return handleSingleObject(quizEntryData, quizEntrySchema)
+}
+
+// ========= Array Handlers =========
+
+export const handleQtiImportsResponse = importsData => {
+  return handleArray(importsData, qtiImportSchema)
+}
+
+export const handleQuizSessionEventsResponse = quizSessionEventsData => {
+  return handleArray(quizSessionEventsData, quizSessionEventSchema)
+}
+
+export const handleItemAnalysesResponse = itemAnalysisData => {
+  return handleArray(itemAnalysisData, itemAnalysisSchema)
+}
+
+export const handleItemsResponse = itemsData => {
+  return handleArray(itemsData, itemSchema)
+}
+
+export const handleStimuliResponse = stimuliData => {
+  return handleArray(stimuliData, stimulusSchema)
+}
+
+export const handleInteractionTypesResponse = interactionTypesData => {
+  return handleArray(interactionTypesData, interactionTypeSchema)
+}
+
+export const handleQuizEntriesResponse = quizEntriesData => {
+  return handleArray(quizEntriesWithInteractionTypes(quizEntriesData), quizEntriesSchema)
+}
+
+export const handleSessionItemsResponse = (sessionItemsData, quizSessionId) => {
+  setQuizSessionKeysForList(quizSessionId, sessionItemsData)
+  return handleArray(sessionItemsData, sessionItemSchema)
+}
+
+export const handleSessionItemResultsResponse = (sessionItemResultsData, quizSessionId) => {
+  setQuizSessionKeysForList(quizSessionId, sessionItemResultsData)
+  return handleArray(sessionItemResultsData, sessionItemResultSchema)
+}
+
+export const handleResumeDataResponse = (resumeData, quizSessionId) => {
+  setQuizSessionKeysForList(quizSessionId, resumeData)
+  if (resumeData.length === 0) {
+    return loadResumeData(resumeData)
+  }
+  return handleArray(resumeData, resumeDataSchema)
+}
+
+export const handleQuizSessionResultsResponse = quizSessionResultsData => {
+  return handleArray(quizSessionResultsData, quizSessionResultSchema)
+}
+
+export const handleQuizSessionsResponse = quizSessionsData => {
+  return handleArray(quizSessionsData.map(omitDeprecatedQSData), quizSessionSchema)
+}
+
+export const handleBanksResponse = banksData => {
+  return handleArray(banksData, bankSchema)
+}
+
+export const handleShareBanksResponse = shareBankData => {
+  return handleArray(shareBankData, shareBankSchema)
+}
+
+export const handleBankEntriesResponse = bankEntriesData => {
+  return handleArray(bankEntriesData, bankEntrySchema)
+}

package/src/common/api/camelizeHelpers.js

@@ -0,0 +1,27 @@
+import {camelizeKeys} from 'humps'
+import values from 'lodash/values'
+import isuuid from 'isuuid'
+
+// =====================
+// =====================
+// DEFAULT FUNCTIONALITY
+// =====================
+// =====================
+
+// we key some user response values by
+// their uuids, so we don't want to strip
+// their '-'s
+const maintainUUIDs = (key, convert) => {
+  return isuuid(key) ? key : convert(key)
+}
+
+// convert snake_case to camelCase
+export const camelizeNonUuidKeys = listOfObjects => {
+  return camelizeKeys(listOfObjects, maintainUUIDs)
+}
+
+const camelizedVals = objectMap => {
+  return camelizeNonUuidKeys(values(objectMap))
+}
+
+export default camelizedVals

package/src/common/api/features.js

@@ -0,0 +1,25 @@
+import ExhaustivePaginatedFetcher from '../util/ExhaustivePaginatedFetcher'
+import {addFeatures} from '../actions/features'
+import {loadedApiFeatures} from '../actions/ui'
+
+export const getFeatures = () => {
+  const url = '/api/features'
+  return (dispatch, getState) => {
+    const state = typeof getState === 'function' ? getState() : getState
+    const fetcher = ExhaustivePaginatedFetcher({
+      dispatch,
+      getState: typeof getState === 'function' ? getState : undefined,
+      apiEndpoint: state?.config?.get?.('apiEndpoint') || '',
+      userToken: state?.config?.get?.('userToken'),
+    })
+
+    const addFeaturesToStore = featuresList => {
+      dispatch(addFeatures(featuresList))
+    }
+
+    return fetcher
+      .get(url, {per_page: 100})
+      .then(addFeaturesToStore)
+      .then(() => dispatch(loadedApiFeatures(true)))
+  }
+}

package/src/common/api/fileUpload.js

@@ -0,0 +1,35 @@
+import {FILE_UPLOAD_CALL, FILE_UPLOAD_URL_CALL} from '@instructure/quiz-common/constants'
+
+import contentDisposition from 'content-disposition'
+
+import Fetcher from '../util/Fetcher'
+
+export function getUploadUrl(url, {apiEndpoint, userToken} = {}) {
+  const urlFetcher = new Fetcher({callType: FILE_UPLOAD_URL_CALL, apiEndpoint, userToken})
+  return urlFetcher.get(url)
+}
+
+// This fxn requires a secondary fxn as an argument.
+// It gets the url to post the file to S3 from the request and returns a promise.
+export const sendFileToS3 = (file, onSuccess, onError, altText, {apiEndpoint, userToken} = {}) => {
+  const fileFetcher = new Fetcher({
+    asyncResponseHandler: () => {},
+    callType: FILE_UPLOAD_CALL,
+    apiEndpoint,
+    userToken,
+    headers: {
+      'Content-Type': file.type,
+      // This thing handles unicode filenames appropriately for HTTP headers - yay
+      'Content-Disposition': contentDisposition(file.name),
+    },
+    onError: onError,
+  })
+
+  return res => {
+    // After uploading, the signed portion of the URL is useless and incorrect
+    const s3url = res.url.split(/[?#]/)[0]
+    return fileFetcher.put(`${res.url}`, {body: file}).then(ref => {
+      onSuccess(s3url, altText)
+    })
+  }
+}

package/src/common/api/getPersistenceActions.js

@@ -0,0 +1,80 @@
+import isEmpty from 'lodash/isEmpty'
+
+import valMap from '../util/valMap'
+import camelizedVals from './camelizeHelpers'
+
+import {addBanks} from '../actions/banks'
+import {addBankEntries} from '../actions/bankEntries'
+import {addInteractionTypes} from '../actions/addInteractionTypes'
+import {addItems} from '../actions/items'
+import {addItemAnalyses, addQuizAnalysis} from '../actions/reporting'
+import {addQtiImports} from '../actions/qtiImports'
+import {addQuizEntries, addQuizEntry} from '../actions/quizEntries'
+import {addQuizSessionEvents} from '../actions/quizSessionEvents'
+import {addQuizSessionResults} from '../actions/quizSessionResults'
+import {addQuizSessions} from '../actions/quizSessions'
+import {addQuizzes} from '../actions/quizzes'
+import {addSessionItemResults} from '../actions/sessionItemResults'
+import {addSessionItems} from '../actions/sessionItems'
+import {addStimuli} from '../actions/stimuli'
+import {loadResumeData} from '../actions/taking'
+import {addSharedBanks} from '../actions/sharedBanks'
+
+// getPersistenceActions is given an object that 'normalizr' returns
+// is iterates over the different types of objects that can come
+// back from the api, maps their type to an action, then returns
+// an array of actions to dispatch (which persist the data to the store)
+
+const getPersistenceActions = normalizedResp => {
+  const {
+    banks,
+    bankEntries,
+    interactionTypes,
+    itemAnalyses,
+    items,
+    qtiImports,
+    quizAnalyses,
+    quizEntries,
+    quizEntry,
+    quizSessionEvents,
+    quizSessionResults,
+    quizSessions,
+    quizzes,
+    resumeData,
+    sharedBanks,
+    sessionItemResults,
+    sessionItems,
+    stimuli,
+  } = valMap(normalizedResp.entities, camelizedVals)
+
+  const baseDataActionPairs = [
+    {data: banks, actionCreator: addBanks},
+    {data: bankEntries, actionCreator: addBankEntries},
+    {data: interactionTypes, actionCreator: addInteractionTypes},
+    {data: items, actionCreator: addItems},
+    {data: quizSessionEvents, actionCreator: addQuizSessionEvents},
+    {data: quizSessionResults, actionCreator: addQuizSessionResults},
+    {data: quizSessions, actionCreator: addQuizSessions},
+    {data: quizzes, actionCreator: addQuizzes},
+    {data: quizEntries, actionCreator: addQuizEntries},
+    {data: quizEntry, actionCreator: addQuizEntry},
+    {data: resumeData, actionCreator: loadResumeData},
+    {data: sessionItemResults, actionCreator: addSessionItemResults},
+    {data: sessionItems, actionCreator: addSessionItems},
+    {data: stimuli, actionCreator: addStimuli},
+    {data: itemAnalyses, actionCreator: addItemAnalyses},
+    {data: quizAnalyses, actionCreator: addQuizAnalysis},
+    {data: sharedBanks, actionCreator: addSharedBanks},
+  ]
+
+  // parse only if feature is on
+  const qtiImportActionPairs = [{data: qtiImports, actionCreator: addQtiImports}]
+  const dataActionPairs = baseDataActionPairs.concat(qtiImportActionPairs)
+
+  const actionsToDispatch = dataActionPairs.reduce((memo, {data, actionCreator}) => {
+    return isEmpty(data) ? memo : memo.concat([actionCreator(data)])
+  }, [])
+  return actionsToDispatch
+}
+
+export default getPersistenceActions

package/src/common/api/helpers.js

@@ -0,0 +1,114 @@
+import {set as setUI} from '../actions/ui'
+import {addError} from '../actions/alerts'
+import {TRAY_ALERT_OPEN} from '@instructure/quiz-common/constants'
+import flatten from 'lodash/flatten'
+import t from '@instructure/quiz-i18n/format-message'
+
+export const handleError = (dispatch, errorMessage) => error => {
+  if (error.response && [404, 401].includes(error.response.status)) {
+    // need a timeout so focus is not stolen by
+    // other callbacks after the alert opens
+    setTimeout(() => {
+      dispatch(setUI(TRAY_ALERT_OPEN, true))
+    }, 500)
+  } else if (errorMessage) {
+    dispatch(addError(errorMessage))
+  } else if (error.response && error.response.status) {
+    dispatch(
+      addError(
+        t('Sorry, there was a {status} Error.', {
+          status: error.response.status,
+        }),
+      ),
+    )
+  } else {
+    dispatch(addError(t('Sorry, there was an error.')))
+  }
+}
+
+// The Header for QuizEntryEdit has a 200ms delay in componentDidMount before
+// moving focus to its title.
+// If we try to show the error banner immediately, VoiceOver will begin reading
+// it, but get interupted part way through by the focus moving to the Header.
+// We need a long enough delay here for the modal to close, the QuizEntryEdit
+// header to get mounted, the delay to happen and the focus to move to the title.
+// Please forgive me.
+const UGLY_HARDCODED_TIMEOUT = 800
+
+export const getOnErrorWithDelayedValidationMessage = (
+  dispatch,
+  validationErrorMsg,
+  genericErrorMsg,
+  timeout = UGLY_HARDCODED_TIMEOUT,
+) => {
+  let errMsg = genericErrorMsg
+  const onError =
+    ({response}) =>
+    async () => {
+      if (response && response.status === 422) {
+        try {
+          const {errors} = await response.json()
+          if (errorsAllFromValidation(errors)) {
+            errMsg = validationErrorMsg
+          }
+        } catch {
+          // Not a json response
+        }
+      }
+
+      return setTimeout(() => dispatch(addError(errMsg)), timeout)
+    }
+
+  return onError
+}
+
+// ==============================
+// ==============================
+//  API INPUT VALIDATION HELPERS
+// ==============================
+// ==============================
+
+const validationTextForError = errorType => {
+  if (errorType === 'regexp') {
+    return t('Invalid Regular Expression')
+  }
+  return t('Unknown validation error')
+}
+
+export const errorsAllFromValidation = errors => {
+  const errorArray = flatten(Object.values(errors))
+  // All api errors are just part of input validation flow
+  // Don't show the error banner, validation feedback should be shown
+  // at input level
+  return errorArray.every(error => error.validation_error)
+}
+
+export const processApiError = async fetcherError => {
+  const {response} = fetcherError
+  const unprocessableEntityCode = 422
+
+  if (response && parseInt(response.status) === unprocessableEntityCode) {
+    const {errors} = await response.json()
+    const validationErrorsArray = flatten(Object.values(errors)).filter(
+      error => error.validation_error,
+    )
+    if (!validationErrorsArray.length) {
+      throw fetcherError
+    }
+    const validationErrorsObject = {}
+
+    validationErrorsArray.forEach(error => {
+      validationErrorsObject[error.input_id] = validationErrorsObject[error.input_id] || []
+      validationErrorsObject[error.input_id].push({
+        type: 'error',
+        text: validationTextForError(error.error_type),
+      })
+    })
+
+    const validationError = Object.assign(Object.create(Error.prototype), fetcherError)
+    validationError.validationErrorsFromApi = validationErrorsObject
+
+    throw validationError
+  }
+  throw fetcherError
+}

package/src/common/api/interactionTypes.js

@@ -0,0 +1,14 @@
+import {createFetcher} from '../util/Fetcher'
+
+import {handleInteractionTypesResponse} from './callHandlers'
+
+export const interactionTypeFetch = function () {
+  const url = '/api/interaction_types'
+
+  return (dispatch, getState) => {
+    const fetcher = createFetcher(dispatch, getState)
+    return fetcher.get(url).then(interactionTypesData => {
+      dispatch(handleInteractionTypesResponse(interactionTypesData))
+    })
+  }
+}