tf-checkout-react-native 1.0.47 → 2.0.0-beta.5

package/src/containers/myOrders/components/OrderListItem.tsx

@@ -1,50 +0,0 @@
-import React, { FC } from 'react'
-import { Image, Text, TouchableOpacity, View } from 'react-native'
-
-import R from '../../../res'
-import { OrderListItemStyles as s } from './styles'
-import { IOrderListItemProps } from './types'
-
-const OrderListItem: FC<IOrderListItemProps> = ({ order, onSelectOrder, styles }) => {
-  return (
-    <View style={[s.rootContainer, styles?.rootContainer]}>
-      <TouchableOpacity
-        onPress={() => {
-          onSelectOrder(order)
-        }}
-      >
-        <View style={[s.contentContainer, styles?.contentContainer]}>
-          {/* Left side of the item */}
-          <View style={[s.infoRootContainer, styles?.infoRootContainer]}>
-            {/* Image content */}
-            <View style={[s.imageContainer, styles?.imageContainer]}>
-              <Image source={{ uri: order.image }} style={[s.image, styles?.image]} />
-            </View>
-            {/* Info content */}
-            <View style={[s.infoContainer, styles?.infoContainer]}>
-              <View style={[s.infoTopContainer, styles?.infoTopContainer]}>
-                <Text style={styles?.orderId}>{order.id}</Text>
-                <Text style={styles?.orderDate}>{order.date}</Text>
-              </View>
-              <View style={[s.infoBottomContainer, styles?.infoBottomContainer]}>
-                <Text style={[s.eventName, styles?.eventName]} numberOfLines={2}>
-                  {order.eventName}
-                </Text>
-                <View style={[s.priceContainer, styles?.priceContainer]}>
-                  <Text style={styles?.currency}>{order.currency} </Text>
-                  <Text style={styles?.price}>{order.amount}</Text>
-                </View>
-              </View>
-            </View>
-          </View>
-          {/* Right side of the item */}
-          <View style={[s.iconNextContainer, styles?.iconNextContainer]}>
-            <Image style={[s.iconNext, styles?.iconNext]} source={R.icons.next} />
-          </View>
-        </View>
-      </TouchableOpacity>
-    </View>
-  )
-}
-
-export default OrderListItem

package/src/containers/myOrders/components/styles.ts

@@ -1,55 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-import R from '../../../res'
-
-export const OrderListItemStyles = StyleSheet.create({
-  rootContainer: {
-    backgroundColor: R.colors.listBackground,
-    marginVertical: 8,
-  },
-  contentContainer: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-  },
-  imageContainer: {
-    justifyContent: 'center',
-    alignItems: 'center',
-    marginRight: 16,
-  },
-  image: { height: 60, width: 60, resizeMode: 'contain' },
-  infoRootContainer: {
-    flexDirection: 'row',
-    flex: 1,
-  },
-  infoContainer: {
-    flex: 1,
-  },
-  infoTopContainer: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    marginVertical: 8,
-  },
-  infoBottomContainer: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    marginVertical: 8,
-    alignItems: 'flex-end',
-  },
-  iconNext: {
-    height: 24,
-    width: 24,
-    resizeMode: 'contain',
-  },
-  iconNextContainer: {
-    alignItems: 'center',
-    justifyContent: 'center',
-    padding: 16,
-    paddingRight: 0,
-  },
-  priceContainer: {
-    flexDirection: 'row',
-  },
-  eventName: {
-    width: '65%',
-  },
-})

package/src/containers/myOrders/components/types.ts

@@ -1,28 +0,0 @@
-import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native'
-
-import { IMyOrdersOrder } from '../../../api/types'
-
-export interface IOrderListItemStyles {
-  rootContainer?: StyleProp<ViewStyle>
-  contentContainer?: StyleProp<ViewStyle>
-  infoContainer?: StyleProp<ViewStyle>
-  infoTopContainer?: StyleProp<ViewStyle>
-  infoBottomContainer?: StyleProp<ViewStyle>
-  imageContainer?: StyleProp<ViewStyle>
-  image?: StyleProp<ImageStyle>
-  infoRootContainer?: StyleProp<ViewStyle>
-  iconNextContainer?: StyleProp<ViewStyle>
-  iconNext?: StyleProp<ImageStyle>
-  orderId?: StyleProp<TextStyle>
-  orderDate?: StyleProp<TextStyle>
-  eventName?: StyleProp<TextStyle>
-  priceContainer?: StyleProp<ViewStyle>
-  price?: StyleProp<TextStyle>
-  currency?: StyleProp<TextStyle>
-}
-
-export interface IOrderListItemProps {
-  onSelectOrder: (order: IMyOrdersOrder) => void
-  order: IMyOrdersOrder
-  styles?: IOrderListItemStyles
-}

package/src/containers/myOrders/styles.ts

@@ -1,42 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-import R from '../../res'
-
-export const MyOrdersViewStyles = StyleSheet.create({
-  eventsContainer: {
-    marginVertical: 16,
-  },
-  eventsTitle: {
-    marginBottom: 8,
-  },
-  eventsDropdownContainer: {
-    flex: 1,
-    marginRight: 16,
-  },
-  eventsDropdownButton: {
-    marginBottom: 0,
-  },
-  safeArea: {
-    flex: 1,
-  },
-  listContainer: {
-    //flex: 1,
-  },
-  backButtonContainer: {
-    marginBottom: 24,
-  },
-  rootContainer: {
-    flex: 1,
-  },
-  eventsSelectionContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    width: '100%',
-    justifyContent: 'space-between',
-  },
-  clearEventSelectionIcon: {
-    tintColor: R.colors.white,
-    width: 20,
-    height: 20,
-  },
-})

package/src/containers/myOrders/types.ts

@@ -1,84 +0,0 @@
-import { ColorValue, ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native'
-
-import { IMyOrderDetailsData, IMyOrdersData, IMyOrdersOrder } from '../../api/types'
-import { IDropdownItem, IDropdownStyles } from '../../components/dropdown/types'
-import { IError } from '../../types'
-import { IOrderListItemStyles } from './components/types'
-
-export interface IMyOrdersConfig {
-  isEventsDropdownHidden?: boolean
-  areActivityIndicatorsEnabled?: boolean
-  areAlertsEnabled?: boolean
-  isTimeFilterDropdownHidden?: boolean
-}
-
-export interface IMyOrdersStyles {
-  orderListItem?: IOrderListItemStyles
-  safeArea?: StyleProp<ViewStyle>
-  listContainer?: StyleProp<ViewStyle>
-  eventsContainer?: StyleProp<ViewStyle>
-  eventsTitle?: StyleProp<TextStyle>
-  refreshControlColor?: ColorValue
-  eventsDropdown?: IDropdownStyles
-  rootContainer?: StyleProp<ViewStyle>
-  eventsSelectionContainer?: StyleProp<ViewStyle>
-  clearEventSelectionIcon?: StyleProp<ImageStyle>
-  timeFilters?: {
-    label?: StyleProp<TextStyle>
-    container?: StyleProp<ViewStyle>
-    dropdown?: IDropdownStyles
-    selectionContainer?: StyleProp<ViewStyle>
-    clearSelectionIcon?: StyleProp<ImageStyle>
-  }
-}
-
-export interface IMyOrdersTexts {
-  selectEventPlaceholder?: string
-  selectTimeFilterPlaceholder?: string
-  title?: string
-  timeFilters?: {
-    upcoming?: string
-    ongoingAndUpcoming?: string
-    ongoing?: string
-    past?: string
-  }
-}
-
-export interface IMyOrdersProps {
-  onSelectOrder: (order: IMyOrderDetailsData) => void
-
-  onFetchMyOrdersSuccess?: (data: IMyOrdersData) => void
-  onFetchMyOrdersError?: (error: IError) => void
-
-  onFetchOrderDetailsSuccess?: (data: IMyOrderDetailsData) => void
-  onFetchOrderDetailsError?: (error: IError) => void
-
-  onRemoveTicketFromResaleSuccess?: (orderHash: string) => void
-  onRemoveTicketFromResaleError?: (orderHash: string) => void
-
-  onLoadingChange?: (isLoading: boolean) => void
-
-  styles?: IMyOrdersStyles
-  config?: IMyOrdersConfig
-  texts?: IMyOrdersTexts
-}
-
-export interface IMyOrdersViewProps {
-  myEvents: IDropdownItem[]
-  selectedEvent?: IDropdownItem
-  onChangeEvent: (event: IDropdownItem) => void
-  myOrders: IMyOrdersOrder[]
-  onSelectOrder: (order: IMyOrdersOrder) => void
-  isGettingEventDetails?: boolean
-  isLoading?: boolean
-  isRefreshing?: boolean
-  styles?: IMyOrdersStyles
-  onRefresh?: () => void
-  config?: IMyOrdersConfig
-  onFetchMoreOrders: () => void
-  texts?: IMyOrdersTexts
-
-  timeFilters: IDropdownItem[]
-  selectedTimeFilter?: IDropdownItem
-  onChangeTimeFilter: (event: IDropdownItem) => void
-}

package/src/containers/purchaseConfirmation/PurchaseConfirmation.tsx

@@ -1,145 +0,0 @@
-import React, {
-  forwardRef,
-  useCallback,
-  useEffect,
-  useImperativeHandle,
-  useRef,
-  useState,
-} from 'react'
-import { Alert } from 'react-native'
-
-import { IFetchAccessTokenResponse } from '../../api/types'
-import {
-  PurchaseConfirmationCore,
-  PurchaseConfirmationCoreHandle,
-  SessionHandle,
-} from '../../core'
-import { SessionHandleType } from '../../core/Session/SessionCoreTypes'
-import PurchaseConfirmationView from './PurchaseConfirmationView'
-import { IPurchaseConfirmationProps } from './types'
-
-const PurchaseConfirmation = forwardRef<SessionHandleType, IPurchaseConfirmationProps>(
-  (
-    {
-      orderHash,
-      onComplete,
-      styles,
-      texts,
-      onFetchPurchaseConfirmationError,
-      onFetchPurchaseConfirmationSuccess,
-      onLoadingChange,
-      areActivityIndicatorsEnabled,
-      areAlertsEnabled,
-    },
-    ref
-  ) => {
-    //#region State
-    const [isLoading, setIsLoading] = useState(false)
-    //#endregion State
-
-    const showAlert = (text: string) => {
-      areAlertsEnabled && Alert.alert(text)
-    }
-
-    const isPurchaseConfirmationCoreRefReady = (): boolean => {
-      if (!purchaseConfirmationCoreRef.current) {
-        onFetchPurchaseConfirmationError?.({
-          message: 'PurchaseConfirmationCore is not initialized',
-        })
-        showAlert('PurchaseConfirmationCore is not initialized')
-        return false
-      }
-
-      return true
-    }
-
-    //#region Fetch data
-    const getInitialData = async () => {
-      if (!isPurchaseConfirmationCoreRefReady()) {
-        return
-      }
-
-      purchaseConfirmationCoreRef.current?.stopCartTimer()
-      setIsLoading(true)
-      const { purchaseConfirmationError } =
-        await purchaseConfirmationCoreRef.current!.getPurchaseConfirmation(orderHash)
-      setIsLoading(false)
-
-      if (purchaseConfirmationError) {
-        onFetchPurchaseConfirmationError?.(purchaseConfirmationError)
-        return showAlert(purchaseConfirmationError.message)
-      }
-
-      onFetchPurchaseConfirmationSuccess?.()
-    }
-    //#endregion Fetch data
-
-    //#region Ref
-    const purchaseConfirmationCoreRef = useRef<PurchaseConfirmationCoreHandle>(null)
-    const sessionHandleRef = useRef<SessionHandleType>(null)
-    //#endregion Ref
-
-    const handleOnLoadingChange = useCallback(
-      (loading: boolean) => {
-        onLoadingChange?.(loading)
-      },
-      [onLoadingChange]
-    )
-
-    //#region Imperative Handler
-    useImperativeHandle(ref, () => ({
-      async refreshAccessToken(refreshToken: string): Promise<IFetchAccessTokenResponse> {
-        if (!sessionHandleRef.current) {
-          return {
-            accessTokenError: {
-              message: 'Session Handle ref is not initialized',
-            },
-          }
-        }
-
-        const { accessTokenError, accessTokenData } =
-          await sessionHandleRef.current!.refreshAccessToken(refreshToken)
-        if (!accessTokenError && accessTokenData?.accessToken) {
-          await getInitialData()
-        }
-        return {
-          accessTokenData,
-          accessTokenError,
-        }
-      },
-
-      async reloadData() {
-        await getInitialData()
-      },
-    }))
-    //#endregion Imperative Handler
-
-    //#region useEffect
-    useEffect(() => {
-      handleOnLoadingChange(isLoading)
-    }, [handleOnLoadingChange, isLoading])
-
-    useEffect(() => {
-      getInitialData()
-    }, [])
-    //#endregion useEffect
-
-    //#region RENDER
-    return (
-      <PurchaseConfirmationCore ref={purchaseConfirmationCoreRef}>
-        <SessionHandle ref={sessionHandleRef}>
-          <PurchaseConfirmationView
-            orderHash={orderHash}
-            onComplete={onComplete}
-            styles={styles}
-            texts={texts}
-            areActivityIndicatorsEnabled={areActivityIndicatorsEnabled}
-          />
-        </SessionHandle>
-      </PurchaseConfirmationCore>
-    )
-    //#endregion RENDER
-  }
-)
-
-export default PurchaseConfirmation

package/src/containers/purchaseConfirmation/PurchaseConfirmationView.tsx

@@ -1,82 +0,0 @@
-import React, { FC } from 'react'
-import { Text, View } from 'react-native'
-
-import { Button, Loading } from '../../components'
-import s from './styles'
-import { IPurchaseConfirmationViewProps } from './types'
-
-const PurchaseConfirmationView: FC<IPurchaseConfirmationViewProps> = ({
-  texts,
-  styles,
-  onComplete,
-  areActivityIndicatorsEnabled,
-  isLoading,
-}) => (
-  <View style={[s.rootContainer, styles?.rootContainer]}>
-    <Text style={[s.title, styles?.title]}>
-      {texts?.title || 'Your Tickets are Confirmed!'}
-    </Text>
-
-    <View style={[s.messagesContainer, styles?.message?.container]}>
-      <Text style={styles?.message?.line1}>
-        {texts?.message?.line1 || 'YOUR TICKETS HAVE BEEN EMAILED TO YOU \n'}
-      </Text>
-      <Text style={styles?.message?.line2}>
-        {texts?.message?.line2 || 'PLEASE BRING THEM WITH YOU TO THE EVENT'}
-      </Text>
-    </View>
-    {/* 
-    <View style={[s.promoContainer, styles?.promo?.container]}>
-      <Text style={[s.promoTitle, styles?.promo?.title]}>
-        Your ticket can become{' '}
-        <Text style={[s.promoTitleKeyword, styles?.promo?.titleKeyword]}>
-          cheaper
-        </Text>{' '}
-        or even{' '}
-        <Text style={[s.promoTitleKeyword, styles?.promo?.titleKeyword]}>
-          FREE!
-        </Text>
-      </Text>
-
-      <Text style={[s.promoMessage, styles?.promo?.message]}>
-        <Text style={[s.promoMessageKeyword, styles?.promo?.messageKeyword]}>
-          Invite friends
-        </Text>{' '}
-        and we'll refund up to{' '}
-        <Text style={[s.promoDiscount, styles?.promo?.discount]}>
-          {texts?.promo?.discount || '100%'}
-        </Text>{' '}
-        of your ticket money, if they buy tickets as well!
-      </Text>
-    </View>
-
-    <View style={[s.inviteContainer, styles?.invite?.container]}>
-      <Text style={[s.inviteTitle, styles?.invite?.title]}>
-        {texts?.invite?.title || 'How do you invite your friends?'}
-      </Text>
-      <Text style={[s.inviteMessage, styles?.invite?.message]}>
-        {texts?.invite?.message || 'Send them this link:'}
-      </Text>
-
-      <View style={[s.inviteLinkContainer, styles?.invite?.linkContainer]}>
-        <Text style={[s.inviteLink, styles?.invite?.link]}>
-          {referralLink || 'http://www.theticketfairy.com'}
-        </Text>
-        <TouchableOpacity style={[s.copyButton, styles?.invite?.copyButton]}>
-          <Image
-            source={R.icons.copy}
-            style={[s.copyIcon, styles?.invite?.copyIcon]}
-          />
-        </TouchableOpacity>
-      </View>
-    </View> */}
-    <Button
-      text={texts?.exitButton || 'Exit'}
-      styles={styles?.exitButton}
-      onPress={onComplete}
-    />
-    {areActivityIndicatorsEnabled && isLoading && <Loading />}
-  </View>
-)
-
-export default PurchaseConfirmationView

package/src/containers/purchaseConfirmation/styles.ts

@@ -1,79 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-import R from '../../res'
-
-export default StyleSheet.create({
-  rootContainer: {
-    backgroundColor: R.colors.white,
-    padding: 24,
-    flex: 1,
-  },
-  messagesContainer: {
-    marginVertical: 24,
-    padding: 12,
-    backgroundColor: 'gainsboro',
-  },
-  title: {
-    fontWeight: '700',
-    color: R.colors.black,
-    fontSize: 22,
-  },
-
-  promoContainer: {
-    marginVertical: 24,
-  },
-  promoTitleKeyword: {
-    fontWeight: '800',
-    color: R.colors.danger,
-  },
-  promoTitle: {
-    fontSize: 25,
-  },
-  promoMessage: {
-    fontSize: 18,
-    marginTop: 8,
-  },
-  promoMessageKeyword: {
-    fontWeight: '600',
-  },
-  promoDiscount: {
-    fontWeight: '700',
-    color: R.colors.danger,
-  },
-
-  inviteContainer: {
-    marginVertical: 24,
-  },
-  inviteTitle: {
-    fontSize: 18,
-    fontWeight: '500',
-    marginBottom: 16,
-  },
-  inviteMessage: {
-    fontSize: 18,
-  },
-
-  inviteLinkContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    marginTop: 16,
-  },
-  inviteLink: {
-    padding: 8,
-    backgroundColor: R.colors.black,
-    color: R.colors.white,
-  },
-  copyButton: {
-    backgroundColor: R.colors.black,
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginLeft: 16,
-    padding: 4,
-  },
-  copyIcon: {
-    width: 28,
-    height: 28,
-    resizeMode: 'contain',
-    tintColor: R.colors.white,
-  },
-})

package/src/containers/purchaseConfirmation/types.ts

@@ -1,77 +0,0 @@
-import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native'
-
-import { IButtonStyles } from '../../components/button/types'
-import { IError } from '../../types'
-
-export interface IPurchaseConfirmationProps {
-  orderHash: string
-  onComplete: () => void
-  styles?: IPurchaseConfirmationStyles
-  texts?: IPurchaseConfirmationTexts
-
-  onFetchPurchaseConfirmationError?: (error: IError) => void
-  onFetchPurchaseConfirmationSuccess?: () => void
-
-  areActivityIndicatorsEnabled?: boolean
-  areAlertsEnabled?: boolean
-  onLoadingChange?: (isLoading: boolean) => void
-}
-
-export interface IPurchaseConfirmationTexts {
-  title?: string
-  message?: {
-    line1?: string
-    line2?: string
-  }
-
-  promo?: {
-    discount?: string
-  }
-
-  invite?: {
-    title?: string
-    message?: string
-  }
-  exitButton?: string
-}
-
-export interface IPurchaseConfirmationStyles {
-  rootContainer?: StyleProp<ViewStyle>
-  title?: StyleProp<TextStyle>
-
-  message?: {
-    container?: StyleProp<ViewStyle>
-    line1?: StyleProp<TextStyle>
-    line2?: StyleProp<TextStyle>
-  }
-
-  promo?: {
-    container?: StyleProp<ViewStyle>
-    title?: StyleProp<TextStyle>
-    titleKeyword?: StyleProp<TextStyle>
-    message?: StyleProp<TextStyle>
-    messageKeyword?: StyleProp<TextStyle>
-    discount?: StyleProp<TextStyle>
-  }
-
-  invite?: {
-    container?: StyleProp<ViewStyle>
-    title?: StyleProp<TextStyle>
-    message?: StyleProp<TextStyle>
-    link?: StyleProp<TextStyle>
-    linkContainer?: StyleProp<ViewStyle>
-    copyIcon?: StyleProp<ImageStyle>
-    copyButton?: StyleProp<ViewStyle>
-  }
-  exitButton?: IButtonStyles
-}
-
-export interface IPurchaseConfirmationViewProps {
-  texts?: IPurchaseConfirmationTexts
-  styles?: IPurchaseConfirmationStyles
-  referralLink?: string
-  onComplete: () => void
-  orderHash: string
-  areActivityIndicatorsEnabled?: boolean
-  isLoading?: boolean
-}