ordering-ui-react-native 0.24.18 → 0.25.1

package/src/components/NavBar/index.tsx

@@ -1,122 +1,122 @@
-import * as React from 'react'
-import styled, { useTheme } from 'styled-components/native'
-import { OButton, OIcon, OText } from '../shared'
-import { TextStyle } from 'react-native'
-
-const Wrapper = styled.View`
-  background-color: ${(props: any) => props.theme.colors.white};
-  padding: 10px 20px 20px 0px;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  position: relative;
-`
-const TitleWrapper = styled.View`
-  flex-direction: column;
-  padding-horizontal: 10px;
-`
-const TitleTopWrapper = styled.View`
-  flex-grow: 1;
-  flex-direction: row;
-  align-items: center;
-`
-
-const btnBackArrow = {
-  borderWidth: 0,
-  backgroundColor: '#FFF',
-  borderColor: '#FFF',
-  shadowColor: '#FFF'
-}
-interface Props {
-  navigation?: any,
-  route?: any,
-  title?: string,
-  subTitle?: any,
-  titleColor?: string,
-  titleAlign?: any,
-  withIcon?: boolean,
-  icon?: any,
-  leftImg?: any,
-  isBackStyle?: boolean,
-  onActionLeft?: () => void,
-  onRightAction?: () => void,
-  showCall?: boolean,
-  titleStyle?: TextStyle,
-  btnStyle?: TextStyle,
-  style?: TextStyle,
-  paddingTop?: number,
-}
-
-const NavBar = (props: Props) => {
-  const theme = useTheme()
-
-  const goSupport = () => {
-    props.navigation.navigate('Supports', {});
-  }
-
-  return (
-    <Wrapper style={{ paddingTop: props.paddingTop, ...props.style }}>
-      <OButton
-        imgLeftSrc={props.leftImg || theme.images.general.arrow_left}
-        imgRightSrc={null}
-        style={{ ...btnBackArrow, ...props.btnStyle }}
-        onClick={props.onActionLeft}
-      />
-      <TitleTopWrapper>
-        {props.withIcon
-          ? (
-              <OIcon
-                url={props.icon}
-                style={{
-                  borderColor: theme.colors.lightGray,
-                  borderRadius: 20,
-                }}
-                width={60}
-                height={60}
-              />
-          )
-          : null
-        }
-        <TitleWrapper>
-          <OText
-            size={22}
-            weight={'600'}
-            style={
-              {
-                textAlign: props.titleAlign ? props.titleAlign : 'center',
-                marginRight: props.showCall ? 0 : 40,
-                color: props.titleColor || 'black',
-                paddingHorizontal: props.titleAlign == 'left' ? 12 : 0,
-                ...props.titleStyle
-              }
-            }
-          >
-            {props.title || ''}
-          </OText>
-          {props.subTitle
-            ? (props.subTitle)
-            : null
-          }
-        </TitleWrapper>
-      </TitleTopWrapper>
-      { props.showCall
-        ? (<OButton
-          isCircle={true}
-          bgColor={theme.colors.primary}
-          borderColor={theme.colors.primary}
-          imgRightSrc={null}
-          imgLeftStyle={{ tintColor: 'white', width: 30, height: 30 }}
-          imgLeftSrc={theme.images.general.support}
-          onClick={props.onRightAction || goSupport} />)
-        : null
-      }
-    </Wrapper>
-  )
-}
-
-NavBar.defaultProps = {
-  title: '',
-  textAlign: 'center'
-};
-
-export default NavBar;
+import * as React from 'react'
+import styled, { useTheme } from 'styled-components/native'
+import { OButton, OIcon, OText } from '../shared'
+import { TextStyle } from 'react-native'
+
+const Wrapper = styled.View`
+  background-color: ${(props: any) => props.theme.colors.white};
+  padding: 10px 20px 20px 0px;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+`
+const TitleWrapper = styled.View`
+  flex-direction: column;
+  padding-horizontal: 10px;
+`
+const TitleTopWrapper = styled.View`
+  flex-grow: 1;
+  flex-direction: row;
+  align-items: center;
+`
+
+const btnBackArrow = {
+  borderWidth: 0,
+  backgroundColor: '#FFF',
+  borderColor: '#FFF',
+  shadowColor: '#FFF'
+}
+interface Props {
+  navigation?: any,
+  route?: any,
+  title?: string,
+  subTitle?: any,
+  titleColor?: string,
+  titleAlign?: any,
+  withIcon?: boolean,
+  icon?: any,
+  leftImg?: any,
+  isBackStyle?: boolean,
+  onActionLeft?: () => void,
+  onRightAction?: () => void,
+  showCall?: boolean,
+  titleStyle?: TextStyle,
+  btnStyle?: TextStyle,
+  style?: TextStyle,
+  paddingTop?: number,
+}
+
+const NavBar = (props: Props) => {
+  const theme = useTheme()
+
+  const goSupport = () => {
+    props.navigation.navigate('Supports', {});
+  }
+
+  return (
+    <Wrapper style={{ paddingTop: props.paddingTop, ...props.style }}>
+      <OButton
+        imgLeftSrc={props.leftImg || theme.images.general.arrow_left}
+        imgRightSrc={null}
+        style={{ ...btnBackArrow, ...props.btnStyle }}
+        onClick={props.onActionLeft}
+      />
+      <TitleTopWrapper>
+        {props.withIcon
+          ? (
+              <OIcon
+                url={props.icon}
+                style={{
+                  borderColor: theme.colors.lightGray,
+                  borderRadius: 20,
+                }}
+                width={60}
+                height={60}
+              />
+          )
+          : null
+        }
+        <TitleWrapper>
+          <OText
+            size={22}
+            weight={'600'}
+            style={
+              {
+                textAlign: props.titleAlign ? props.titleAlign : 'center',
+                marginRight: props.showCall ? 0 : 40,
+                color: props.titleColor || 'black',
+                paddingHorizontal: props.titleAlign == 'left' ? 12 : 0,
+                ...props.titleStyle
+              }
+            }
+          >
+            {props.title || ''}
+          </OText>
+          {props.subTitle
+            ? (props.subTitle)
+            : null
+          }
+        </TitleWrapper>
+      </TitleTopWrapper>
+      { props.showCall
+        ? (<OButton
+          isCircle={true}
+          bgColor={theme.colors.primary}
+          borderColor={theme.colors.primary}
+          imgRightSrc={null}
+          imgLeftStyle={{ tintColor: 'white', width: 30, height: 30 }}
+          imgLeftSrc={theme.images.general.support}
+          onClick={props.onRightAction || goSupport} />)
+        : null
+      }
+    </Wrapper>
+  )
+}
+
+NavBar.defaultProps = {
+  title: '',
+  textAlign: 'center'
+};
+
+export default NavBar;

package/src/components/NotFoundSource/index.tsx

@@ -1,56 +1,56 @@
-import React from 'react'
-import { View } from 'react-native'
-import { OButton, OIcon, OText } from '../shared'
-import {NotFoundSourceParams} from '../../types'
-
-import {
-  NotFound,
-  NotFoundImage
-} from './styles'
-import { useTheme } from 'styled-components/native'
-
-export const NotFoundSource = (props: NotFoundSourceParams) => {
-  const {
-    image,
-    content,
-    btnTitle,
-    conditioned,
-    onClickButton,
-    textSize
-  } = props
-
-  const theme = useTheme()
-
-  const errorImage = image || theme.images.general.notFound
-
-  return (
-    <NotFound>
-      {errorImage && (
-        <NotFoundImage>
-          <OIcon
-            src={errorImage}
-            width={260}
-            height={220}
-          />
-        </NotFoundImage>
-      )}
-        {content && conditioned && !errorImage && <OText color={theme.colors.disabled} size={textSize ?? 18} style={{textAlign: 'center'}}>{content}</OText>}
-        {content && !conditioned && <OText color={theme.colors.disabled} size={textSize ?? 18} style={{textAlign: 'center'}}>{content}</OText>}
-      {!onClickButton && props.children && (
-        props.children
-      )}
-      {onClickButton && (
-        <View style={{marginTop: 10,width: '100%'}}>
-          <OButton
-            style={{width: '100%', height: 50}}
-            bgColor={theme.colors.primary}
-            borderColor={theme.colors.primary}
-            onClick={() => onClickButton()}
-            text={btnTitle}
-            textStyle={{color: theme.colors.white}}
-          />
-        </View>
-      )}
-    </NotFound>
-  )
-}
+import React from 'react'
+import { View } from 'react-native'
+import { OButton, OIcon, OText } from '../shared'
+import {NotFoundSourceParams} from '../../types'
+
+import {
+  NotFound,
+  NotFoundImage
+} from './styles'
+import { useTheme } from 'styled-components/native'
+
+export const NotFoundSource = (props: NotFoundSourceParams) => {
+  const {
+    image,
+    content,
+    btnTitle,
+    conditioned,
+    onClickButton,
+    textSize
+  } = props
+
+  const theme = useTheme()
+
+  const errorImage = image || theme.images.general.notFound
+
+  return (
+    <NotFound>
+      {errorImage && (
+        <NotFoundImage>
+          <OIcon
+            src={errorImage}
+            width={260}
+            height={220}
+          />
+        </NotFoundImage>
+      )}
+        {content && conditioned && !errorImage && <OText color={theme.colors.disabled} size={textSize ?? 18} style={{textAlign: 'center'}}>{content}</OText>}
+        {content && !conditioned && <OText color={theme.colors.disabled} size={textSize ?? 18} style={{textAlign: 'center'}}>{content}</OText>}
+      {!onClickButton && props.children && (
+        props.children
+      )}
+      {onClickButton && (
+        <View style={{marginTop: 10,width: '100%'}}>
+          <OButton
+            style={{width: '100%', height: 50}}
+            bgColor={theme.colors.primary}
+            borderColor={theme.colors.primary}
+            onClick={() => onClickButton()}
+            text={btnTitle}
+            textStyle={{color: theme.colors.white}}
+          />
+        </View>
+      )}
+    </NotFound>
+  )
+}

package/src/components/NotFoundSource/styles.tsx

@@ -1,16 +1,16 @@
-import styled from 'styled-components/native'
-
-export const NotFound = styled.View`
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: auto;
-  margin: 10px auto;
-  padding: 10px;
-`
-
-export const NotFoundImage = styled.View`
-  max-width: 300px;
-`
+import styled from 'styled-components/native'
+
+export const NotFound = styled.View`
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: auto;
+  margin: 10px auto;
+  padding: 10px;
+`
+
+export const NotFoundImage = styled.View`
+  max-width: 300px;
+`

package/src/components/NotificationSetting/index.tsx

@@ -1,85 +1,85 @@
-import React, { useEffect } from 'react';
-import { useTheme } from 'styled-components/native';
-import { StyleSheet, View } from 'react-native';
-import {
-  openSettings,
-  checkNotifications
-} from 'react-native-permissions';
-import { useLanguage } from 'ordering-components/native'
-import { OBottomPopup, OButton, OText } from '../shared';
-interface NotificationSettingPropsParams {
-  checkNotificationStatus: { open: boolean, checked: boolean };
-  setCheckNotificationStatus: (notificationStatus: any) => void;
-}
-export const NotificationSetting = (props: NotificationSettingPropsParams) => {
-  const { checkNotificationStatus, setCheckNotificationStatus } = props
-  const theme = useTheme();
-  const [, t] = useLanguage();
-
-  const requestLocationPermission = async () => {
-    const notificationStatus = await checkNotifications()
-    if (notificationStatus?.status === 'blocked') {
-      setCheckNotificationStatus({ open: true, checked: false })
-      return
-    }
-    setCheckNotificationStatus({ open: false, checked: true })
-  };
-
-  const callOpenSettings = () => {
-    openSettings().catch(() => console.warn('cannot open settings'));
-    setCheckNotificationStatus({ open: false, checked: true })
-  }
-
-  useEffect(() => {
-    requestLocationPermission()
-  }, [])
-  return (
-    <OBottomPopup
-      open={checkNotificationStatus?.open}
-      onClose={() => setCheckNotificationStatus({ open: false, checked: true })}
-      title={t('ENABLE_NOTIFICATIONS', 'Enable notifications')}
-      titleStyle={{ textAlign: 'center' }}
-      containerStyle={{ borderRadius: 10, borderTopRightRadius: 10, borderTopLeftRadius: 10 }}
-    >
-      <View style={styles.container}>
-        <View style={styles.textContainer}>
-          <OText style={{ textAlign: 'center' }}>
-            {t('ACTIVE_NOTIFICATION_TO_RECEIVE_INFORMATION', 'Activate notifications to receive information about your orders')}
-          </OText>
-        </View>
-        <OButton
-          text={t('ENABLE_NOTIFICATIONS', 'Enable notifications')}
-          bgColor={theme.colors.primary}
-          borderColor={theme.colors.primary}
-          parentStyle={styles.parentStyle}
-          style={styles.button}
-          textStyle={{ color: 'white' }}
-          onClick={() => callOpenSettings()}
-        />
-      </View>
-    </OBottomPopup>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    width: '100%',
-    textAlign: 'center'
-  },
-  textContainer: {
-    width: '100%',
-    paddingHorizontal: 25,
-    paddingBottom: 20
-  },
-  parentStyle: {
-    display: 'flex',
-    width: '70%',
-    marginLeft: 'auto',
-    marginRight: 'auto',
-    marginBottom: 25
-
-  },
-  button: {
-    borderRadius: 5
-  }
-});
+import React, { useEffect } from 'react';
+import { useTheme } from 'styled-components/native';
+import { StyleSheet, View } from 'react-native';
+import {
+  openSettings,
+  checkNotifications
+} from 'react-native-permissions';
+import { useLanguage } from 'ordering-components/native'
+import { OBottomPopup, OButton, OText } from '../shared';
+interface NotificationSettingPropsParams {
+  checkNotificationStatus: { open: boolean, checked: boolean };
+  setCheckNotificationStatus: (notificationStatus: any) => void;
+}
+export const NotificationSetting = (props: NotificationSettingPropsParams) => {
+  const { checkNotificationStatus, setCheckNotificationStatus } = props
+  const theme = useTheme();
+  const [, t] = useLanguage();
+
+  const requestLocationPermission = async () => {
+    const notificationStatus = await checkNotifications()
+    if (notificationStatus?.status === 'blocked') {
+      setCheckNotificationStatus({ open: true, checked: false })
+      return
+    }
+    setCheckNotificationStatus({ open: false, checked: true })
+  };
+
+  const callOpenSettings = () => {
+    openSettings().catch(() => console.warn('cannot open settings'));
+    setCheckNotificationStatus({ open: false, checked: true })
+  }
+
+  useEffect(() => {
+    requestLocationPermission()
+  }, [])
+  return (
+    <OBottomPopup
+      open={checkNotificationStatus?.open}
+      onClose={() => setCheckNotificationStatus({ open: false, checked: true })}
+      title={t('ENABLE_NOTIFICATIONS', 'Enable notifications')}
+      titleStyle={{ textAlign: 'center' }}
+      containerStyle={{ borderRadius: 10, borderTopRightRadius: 10, borderTopLeftRadius: 10 }}
+    >
+      <View style={styles.container}>
+        <View style={styles.textContainer}>
+          <OText style={{ textAlign: 'center' }}>
+            {t('ACTIVE_NOTIFICATION_TO_RECEIVE_INFORMATION', 'Activate notifications to receive information about your orders')}
+          </OText>
+        </View>
+        <OButton
+          text={t('ENABLE_NOTIFICATIONS', 'Enable notifications')}
+          bgColor={theme.colors.primary}
+          borderColor={theme.colors.primary}
+          parentStyle={styles.parentStyle}
+          style={styles.button}
+          textStyle={{ color: 'white' }}
+          onClick={() => callOpenSettings()}
+        />
+      </View>
+    </OBottomPopup>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    textAlign: 'center'
+  },
+  textContainer: {
+    width: '100%',
+    paddingHorizontal: 25,
+    paddingBottom: 20
+  },
+  parentStyle: {
+    display: 'flex',
+    width: '70%',
+    marginLeft: 'auto',
+    marginRight: 'auto',
+    marginBottom: 25
+
+  },
+  button: {
+    borderRadius: 5
+  }
+});