Files
frontend-app-learner-dashboard/src/widgets/RecommendationsPanel/hooks.js

67 lines
2.0 KiB
JavaScript

import React from 'react';
import { StrictDict } from 'utils';
import { RequestStates } from 'data/constants/requests';
import * as module from './hooks';
import testData from './testData';
import api from './api';
export const searchCourseEventName = 'learner_home.widget.search_course';
export const state = StrictDict({
requestState: (val) => React.useState(val), // eslint-disable-line
data: (val) => React.useState(val), // eslint-disable-line
courses: (val) => React.useState(val), // eslint-disable-line
});
export const useFetchCourses = (setRequestState, setData) => {
React.useEffect(() => {
let isMounted = true;
api.fetchRecommendedCourses().then((response) => {
if (isMounted) {
setRequestState(RequestStates.completed);
setData(response);
}
}).catch(() => {
if (isMounted) {
setRequestState(RequestStates.failed);
}
});
return () => { isMounted = false; };
/* eslint-disable */
}, []);
};
export const useRecommendationPanelData = () => {
const [requestState, setRequestState] = module.state.requestState(RequestStates.pending);
const [data, setData] = module.state.data({});
module.useFetchCourses(setRequestState, setData);
const [courses, setCourses] = module.state.courses(data.data?.courses || []);
const isControl = data.data?.isControl === undefined ? null : data.data?.isControl;
React.useEffect(() => {
window.loadMockRecommendations = () => {
setCourses(testData.courses);
setRequestState(RequestStates.completed);
}
}, []);
React.useEffect(() => {
setCourses(data.data?.courses || []);
}, [data]);
return {
courses,
isControl,
isLoaded: requestState === RequestStates.completed && courses.length > 0,
isFailed: requestState === RequestStates.failed
|| (requestState === RequestStates.completed && courses.length === 0),
isLoading: requestState === RequestStates.pending,
};
};
export default {
useRecommendationPanelData,
};