Andal.LND/frontend-app-authoring
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: created custom hook for isMobile check

Browse Source
This commit is contained in:
Mehak Nasir
2021-07-19 20:51:39 +05:00
committed by Mehak Nasir
parent e80bd4a3b5
commit fdeccc5f2f
8 changed files with 6126 additions and 1208 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/CourseAuthoringPage.test.jsx
View File

@@ -10,7 +10,7 @@ import { IntlProvider } from '@edx/frontend-platform/i18n';
import initializeStore from './store';
import CourseAuthoringPage from './CourseAuthoringPage';
import PagesAndResources from './pages-and-resources/PagesAndResources';
import executeThunk from './utils';
import { executeThunk } from './utils';
import { fetchCourseApps } from './pages-and-resources/data/thunks';
const courseId = 'course-v1:edX+TestX+Test_Course';

4
src/pages-and-resources/app-settings-modal/AppSettingsModal.jsx
View File

@@ -8,7 +8,6 @@ import {
import { Formik } from 'formik';
import { useDispatch, useSelector } from 'react-redux';
import * as Yup from 'yup';
import { useMediaQuery } from 'react-responsive';
import { RequestStatus } from '../../data/constants';
import FormSwitchGroup from '../../generic/FormSwitchGroup';
import { useModel } from '../../generic/model-store';
@@ -18,6 +17,7 @@ import { updateSavingStatus } from '../data/slice';
import AppConfigFormDivider from '../discussions/app-config-form/apps/shared/AppConfigFormDivider';
import { PagesAndResourcesContext } from '../PagesAndResourcesProvider';
import messages from './messages';
import { useIsMobile } from '../../utils';
function AppSettingsForm({ formikProps, children }) {
return children && (
@@ -65,7 +65,7 @@ function AppSettingsModal({
const appInfo = useModel('courseApps', appId);
const dispatch = useDispatch();
const submitButtonState = updateSettingsRequestStatus === RequestStatus.IN_PROGRESS ? 'pending' : 'default';
const isTabletOrMobile = useMediaQuery({ query: '(max-width: 768px)' });
const isTabletOrMobile = useIsMobile();
const modalVariant = isTabletOrMobile ? 'dark' : 'default';
useEffect(() => {

2
src/pages-and-resources/discussions/app-config-form/apps/legacy/LegacyConfigForm.test.jsx
View File

@@ -9,7 +9,7 @@ import MockAdapter from 'axios-mock-adapter';
import { getAppsUrl } from '../../../data/api';
import { fetchApps } from '../../../data/thunks';
import initializeStore from '../../../../../store';
import executeThunk from '../../../../../utils';
import { executeThunk } from '../../../../../utils';
import {
legacyApiResponse,
} from '../../../factories/mockApiResponses';

2
src/pages-and-resources/discussions/app-config-form/apps/shared/discussion-topics/DiscussionTopics.test.jsx
View File

@@ -18,7 +18,7 @@ import DiscussionTopics from './DiscussionTopics';
import initializeStore from '../../../../../../store';
import { getAppsUrl } from '../../../../data/api';
import { fetchApps } from '../../../../data/thunks';
import executeThunk from '../../../../../../utils';
import { executeThunk } from '../../../../../../utils';
import { legacyApiResponse } from '../../../../factories/mockApiResponses';
import LegacyConfigFormProvider from '../../legacy/LegacyConfigFormProvider';

2
src/pages-and-resources/discussions/app-list/AppList.test.jsx
View File

@@ -13,7 +13,7 @@ import MockAdapter from 'axios-mock-adapter';
import { Context as ResponsiveContext } from 'react-responsive';
import initializeStore from '../../../store';
import executeThunk from '../../../utils';
import { executeThunk } from '../../../utils';
import { getAppsUrl } from '../data/api';
import { fetchApps } from '../data/thunks';
import { emptyAppApiResponse, legacyApiResponse, piazzaApiResponse } from '../factories/mockApiResponses';

2
src/pages-and-resources/discussions/data/redux.test.js
View File

@@ -10,7 +10,7 @@ import {
import { fetchApps, saveAppConfig } from './thunks';
import { LOADED } from '../../../data/slice';
import { legacyApiResponse, piazzaApiResponse } from '../factories/mockApiResponses';
import executeThunk from '../../../utils';
import { executeThunk } from '../../../utils';
const courseId = 'course-v1:edX+TestX+Test_Course';
const pagesAndResourcesPath = `/course/${courseId}/pages-and-resources`;

8
src/utils.js
View File

@@ -1,6 +1,10 @@
const executeThunk = async (thunk, dispatch, getState) => {
import { useMediaQuery } from 'react-responsive';
export const executeThunk = async (thunk, dispatch, getState) => {
await thunk(dispatch, getState);
await new Promise(setImmediate);
};
export default executeThunk;
export function useIsMobile() {
return useMediaQuery({ query: '(max-width: 768px)' });
}