r
/
p5.js-web-editor
1
0
Fork 0
Code Issues 1 Pull Requests Releases 1 Wiki Activity

✨ make forceDesktop work

This commit is contained in:
ghalestrilo 2020-08-21 18:07:41 -03:00
parent 36670f72fd
commit f4d654a08f
1 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
client/utils/responsive.jsx
View File

@ -1,20 +1,24 @@
import React from 'react';
import { useSelector } from 'react-redux';
import MediaQuery from 'react-responsive';
import ResponsiveForm from '../modules/User/components/ResponsiveForm';
export const mobileEnabled = () => (window.process.env.MOBILE_ENABLED === true);
/** createMobileFirst: Receives the store, and creates a function that chooses between two components,
* aimed at mobile and desktop resolutions, respectively.
* The created function returns a Component (props => jsx)
*/
export const createMobileFirst = store => (MobileComponent, Fallback) => props => (
<MediaQuery minWidth={770}>
{matches => ((matches || (store && store.getState().editorAccessibility.forceDesktop) || (!mobileEnabled()))
? <Fallback {...props} />
: <MobileComponent {...props} />)}
</MediaQuery>);
export const createMobileFirst = store => (MobileComponent, Fallback) => (props) => {
const { forceDesktop } = useSelector(state => state.editorAccessibility);
return (
<MediaQuery minWidth={770}>
{matches => ((matches || (store && forceDesktop) || (!mobileEnabled()))
? <Fallback {...props} />
: <MobileComponent {...props} />)}
</MediaQuery>
);
};
export const responsiveForm = DesktopComponent => props => (
<ResponsiveForm>