Skip to content

Instantly share code, notes, and snippets.

@MohammadAzimi
Last active January 28, 2022 15:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save MohammadAzimi/1978072cfc5d6bcc59978e8d4476318d to your computer and use it in GitHub Desktop.
Save MohammadAzimi/1978072cfc5d6bcc59978e8d4476318d to your computer and use it in GitHub Desktop.
Helper methods and functions - ReactNative, ReactJS, ReactNativeWeb and Monorepo design pattern for single source of code
import React from 'react';
import {Image, Platform, StyleSheet, Text, View} from 'react-native';
import {useIsMount} from '/Helper';
const ReactDeviceDetect = Platform.OS === 'web' ? require('react-device-detect') : {}
const {isIOS, isMobile, isMobileOnly, isTablet} = ReactDeviceDetect;
const PORTRAIT = 'portrait-primary';
const initialOrientationValue = Platform.OS === 'web' ? window.matchMedia("(orientation: portrait)").matches : true;
const DeviceDetector = ({children, attemptPortrait = false, attemptMobile = false}) => {
const [isPortrait, setIsPortrait] = React.useState(initialOrientationValue);
const isMounted = useIsMount()
React.useEffect(()=> {
if (Platform.OS === 'web' && attemptPortrait) {
window.addEventListener("orientationchange", function(event) {
// console.log("the orientation of the device is now " , event.target.screen.orientation.type);
// setIsPortrait(event.target.screen.orientation.type === PORTRAIT)
switch(window.orientation) {
case 90:
case -90:
setIsPortrait(false);
break;
default:
setIsPortrait(true);
}
});
}
}, [])
React.useEffect(() => {
if (__DEV__) console.log({isPortrait, isMounted})
if (isMounted && isPortrait && attemptPortrait) {
location.reload()
}
}, [isPortrait])
if (Platform.OS !== 'web') { //TODO: needs double check
return (children)
} else {
if (isTablet && __DEV__ ) console.log('tablet-detected');
if (isMobileOnly && __DEV__) console.log('mobileOnly-detected');
if (!isMobile && attemptMobile) {
return (
<View style={styles.mainContainer}>
<Text style={{marginTop: 64, fontSize: 32}}>لطفا با گوشی موبایل وارد این صفحه شوید!</Text>
</View>
)
}
if (isMobile && attemptPortrait) {
if (isIOS) {
console.log('ios-detected');
}
if (isPortrait) {
return (children)
} else {
return (
<View style={styles.mainContainer}>
<Text>لطفا گوشی خود را عمودی نگه دارید.</Text>
</View>
)
}
} else {
return (children)
}
}
}
export {DeviceDetector};
const styles = StyleSheet.create({
mainContainer: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
}
})
import React from 'react';
const toPersianNumber = input => {
if (typeof input === 'string') {
let persian = ['۰', '۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹'];
for (let i = 0; i < 10; i++) {
let regex = eval('/' + i + '/g');
input = input.replace(regex, persian[i]);
}
return input;
} else {
return '';
}
}
const commaSeprator = (numberInput, toPersianNumber = false) => {
if (
numberInput !== '' &&
numberInput !== null &&
typeof numberInput !== typeof undefined
) {
const number = numberInput
.toString()
.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
if (toPersianNumber) {
return toPersianNumber(number);
}
return number;
} else {
return '';
}
}
/**
* to detect first mount in useEffect hooks
*/
export const useIsMount = () => {
const isMountRef = React.useRef(false);
React.useEffect(() => {
isMountRef.current = true;
}, []);
return isMountRef.current;
};
// Iranian national code validator
// needs some refactoring!
export funciton checkValidNationalCode(code){
let L = code.length;
if(L < 8 || parseInt(code, 10) == 0) return false;
code = ('0000' + code).substr(L + 4 - 10);
if(parseInt(code.substr(3, 6), 10) == 0) return false;
let c = parseInt(code.substr(9, 1), 10);
let s = 0;
for(let i = 0; i < 9; i++)
s += parseInt(code.substr(i, 1), 10) * ( 10 - i );
s = s % 11;
return (s < 2 && c==s) || (s>=2 && c==(11 - s));
}
//https://www.regextester.com/99710
const IRAN_MOBILE_REGEX = /(\+98|0)?9\d{9}$/;
const isValidMobileNumber(phone) => IRAN_MOBILE_REGEX.text(phone);
// generate random numbers between two values
function randomIntFromInterval(min, max) { // min and max included
return Math.floor(Math.random() * (max - min + 1) + min)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment