Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ishpaul777/rhn no dropzone #23528

Merged
merged 13 commits into from
Jul 27, 2023
32 changes: 32 additions & 0 deletions src/components/DragAndDrop/NoDropZone/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
import {useEffect} from 'react';
import PropTypes from 'prop-types';

const propTypes = {
/** Content */
children: PropTypes.node.isRequired,
};

function NoDropZone(props) {
function handleDrag(event) {
event.preventDefault();
// eslint-disable-next-line no-param-reassign
event.dataTransfer.dropEffect = 'none';
}

useEffect(() => {
document.addEventListener('dragenter', handleDrag);
document.addEventListener('dragover', handleDrag);

return () => {
document.removeEventListener('dragenter', handleDrag);
document.removeEventListener('dragover', handleDrag);
};
}, []);

return props.children;
}

NoDropZone.displayName = 'NoDropZone';
NoDropZone.propTypes = propTypes;

export default NoDropZone;
5 changes: 5 additions & 0 deletions src/components/DragAndDrop/NoDropZone/index.native.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
const NoDropZone = (props) => props.children;

NoDropZone.displayName = 'NoDropZone';

export default NoDropZone;
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import styles from '../../../../styles/styles';
import CONST from '../../../../CONST';
import PressableWithoutFeedback from '../../../../components/Pressable/PressableWithoutFeedback';
import useLocalize from '../../../../hooks/useLocalize';
import NoDropZone from '../../../../components/DragAndDrop/NoDropZone';

const propTypes = {
/* State from useNavigationBuilder */
Expand Down Expand Up @@ -53,25 +54,26 @@ function ThreePaneView(props) {
}
if (route.name === NAVIGATORS.RIGHT_MODAL_NAVIGATOR) {
return (
<View
key={route.key}
style={[
styles.flexRow,
styles.pAbsolute,
styles.w100,
styles.h100,
StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.shadow, CONST.RIGHT_MODAL_BACKGROUND_OVERLAY_OPACITY),
StyleUtils.displayIfTrue(props.state.index === i),
]}
>
<PressableWithoutFeedback
style={[styles.flex1]}
onPress={() => props.navigation.goBack()}
accessibilityLabel={translate('common.close')}
accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
/>
<View style={styles.rightPanelContainer}>{props.descriptors[route.key].render()}</View>
</View>
<NoDropZone key={route.key}>
<View
style={[
styles.flexRow,
styles.pAbsolute,
styles.w100,
styles.h100,
StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.shadow, CONST.RIGHT_MODAL_BACKGROUND_OVERLAY_OPACITY),
StyleUtils.displayIfTrue(props.state.index === i),
]}
>
<PressableWithoutFeedback
style={[styles.flex1]}
onPress={() => props.navigation.goBack()}
accessibilityLabel={translate('common.close')}
accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON}
/>
<View style={styles.rightPanelContainer}>{props.descriptors[route.key].render()}</View>
</View>
</NoDropZone>
);
}
return (
Expand Down
Loading