tf-checkout-react-native 1.0.45 → 2.0.0-beta.0

package/src/apiv2/index.ts

@@ -1,142 +0,0 @@
-// Re-export EVERYTHING from tf-checkout-shared
-export {
-  // Configuration
-  setConfigs,
-  CONFIGS,
-
-  // Constants
-  DEFAULT_FEES_STYLE,
-  FEES_STYLES,
-  X_TF_ECOMMERCE,
-
-  // Authentication API
-  authorize,
-  register,
-  logout,
-  checkEmailExists,
-  getProfileData,
-  logoutUser,
-  setLoggedUserData,
-
-  // Cart API
-  addToCart,
-  getCart,
-
-  // Checkout API
-  postOnCheckout,
-  updateCheckout,
-
-  // Payment API
-  getPaymentData,
-  handlePaymentSuccess,
-  handleFreeSuccess,
-  getConfirmationData,
-  getConditions,
-
-  // Orders API
-  getOrders,
-  getOrderDetails,
-
-  // Common API
-  getEvent,
-  getTickets,
-  getTimeSlotsByDate,
-  getCountries,
-  getStates,
-  sendRSVPInfo,
-  addToWaitingList,
-  postReferralVisits,
-  validatePhoneNumber,
-  publicRequest,
-  setAxiosHeader,
-  setBaseUrl,
-
-  // Cookie utilities
-  setCustomCookie,
-  getCookieByName,
-  deleteCookieByName,
-
-  // Other utilities
-  getDomain,
-  getQueryVariable,
-  isBrowser,
-} from 'tf-checkout-shared'
-
-export type {
-  // Config types
-  IConfigs,
-
-  // Auth types
-  IAuthorizeRequestData,
-  ITicketHolderData,
-  IProfileData,
-  IProfileResponse,
-
-  // Cart types
-  ICartData,
-  ICartRequestData,
-  ICart,
-  ICartResponseData,
-  ICartResponse,
-  IGetCartData,
-  IGetCartAttributes,
-  IGetCartResponse,
-
-  // Checkout types
-  ICheckoutResponseData,
-  ICheckoutResponse,
-
-  // Common types (Events, Tickets, Countries, States, etc.)
-  IEventResponseData,
-  ITimeslotSettings,
-  IEventResponse,
-  ITicketData,
-  ITicketItemData,
-  ITicketsResponseData,
-  ITicketsAdaptedResponseData,
-  ITimeslotsAdaptedData,
-  ITicketsAdaptedResponse,
-  ITimeslotsAdaptedResponse,
-  ICountriesResponseData,
-  ICountriesResponse,
-  IStatesData,
-  IStatesResponse,
-  IWaitingListRequestData,
-  IWaitingListResponse,
-  IRSVPRequestData,
-  IRSVPResponse,
-
-  // Orders types
-  IPurchasedEventData,
-  IOrdersItemData,
-  IOrdersData,
-  IOrdersResponse,
-  IOrderTicketType,
-  IOrderAddOn,
-  IOrderTicketAddOn,
-  ITicketTypes,
-  IOrderTicketData,
-  IOrderData,
-  IOrderResponse,
-
-  // Payment types
-  IPaymentCartData,
-  IPaymentOrderDetails,
-  IPaymentMethodData,
-  IShippingBillingInfoData,
-  IEventDetails,
-  IPaymentData,
-  IPaymentDataResponse,
-  IConditionsAdaptedData,
-  IConditionsAdaptedDataResponse,
-  IPaymentSuccessData,
-  IPaymentSuccessDataResponse,
-  IFreeRegistrationData,
-  IFreeRegistrationDataResponse,
-  IPersonalShareSaleData,
-  ICheckoutCompleteData,
-  ICheckoutCompleteDataResponse,
-
-  // Axios response type
-  IAxiosResponseData,
-} from 'tf-checkout-shared'

package/src/common/query.types.ts

@@ -1,6 +0,0 @@
-import type { QueryKey, UndefinedInitialDataOptions } from '@tanstack/react-query'
-
-export type QueryOpts<T, E> = Omit<
-  UndefinedInitialDataOptions<T, E, T, QueryKey>,
-  'queryKey' | 'queryFn'
->

package/src/components/bottomSheetModal/BottomSheetModal.tsx

@@ -1,95 +0,0 @@
-import React, { forwardRef, useEffect, useImperativeHandle, useRef } from 'react'
-import {
-  Animated,
-  Dimensions,
-  Image,
-  Modal as RNModal,
-  StyleProp,
-  Text,
-  TouchableOpacity,
-  View,
-} from 'react-native'
-
-import R from '../../res'
-import s from './BottomSheetModalStyles'
-import { IBottomSheetModalProps } from './BottomSheetModalTypes'
-
-const animationDuration = 350
-const { height: screenHeight } = Dimensions.get('window')
-
-export type BottomSheetHandle = {
-  close(): void
-}
-
-const BottomSheetModal = forwardRef<BottomSheetHandle, IBottomSheetModalProps>(
-  ({ onClose, texts, styles, content, contentHeight = screenHeight / 2 }, ref) => {
-    const contentYPosition = useRef(new Animated.Value(contentHeight)).current
-
-    const showContent = () => {
-      Animated.timing(contentYPosition, {
-        toValue: 0,
-        duration: animationDuration,
-        useNativeDriver: true,
-      }).start()
-    }
-
-    const hideContent = () => {
-      Animated.timing(contentYPosition, {
-        toValue: contentHeight,
-        duration: animationDuration,
-        useNativeDriver: true,
-      }).start(onClose)
-    }
-
-    useEffect(() => {
-      showContent()
-    })
-
-    const onCloseHandler = () => {
-      hideContent()
-    }
-
-    const animatedStyle: StyleProp<any> = {
-      height: contentHeight,
-      transform: [
-        {
-          translateY: contentYPosition,
-        },
-      ],
-    }
-
-    useImperativeHandle(ref, () => ({
-      async close() {
-        hideContent()
-      },
-    }))
-
-    const mergedStyle = [s.animatedContent, animatedStyle, styles?.content]
-
-    const title = texts?.title || 'Title'
-
-    return (
-      <RNModal transparent>
-        <View style={[s.rootContainer, styles?.rootContainer]}>
-          <Animated.View style={mergedStyle}>
-            <View style={[s.header, styles?.headerContainer]}>
-              <Text style={[s.title, styles?.title]}>{title}</Text>
-              <TouchableOpacity
-                onPress={onCloseHandler}
-                style={[s.closeButton, styles?.closeButton]}
-              >
-                <Image
-                  style={[s.closeButtonIcon, styles?.closeButtonIcon]}
-                  source={R.icons.error}
-                />
-              </TouchableOpacity>
-            </View>
-            <View style={[s.contentContainer, styles?.contentContainer]}>{content}</View>
-          </Animated.View>
-        </View>
-      </RNModal>
-    )
-  }
-)
-
-export default BottomSheetModal

package/src/components/bottomSheetModal/BottomSheetModalStyles.ts

@@ -1,43 +0,0 @@
-import { Dimensions, StyleSheet } from 'react-native'
-
-import R from '../../res'
-
-const { width: screenWidth } = Dimensions.get('window')
-
-export default StyleSheet.create({
-  rootContainer: {
-    backgroundColor: R.colors.transparentBlack,
-    flex: 1,
-    justifyContent: 'flex-end',
-  },
-  animatedContent: {
-    width: screenWidth,
-    borderTopStartRadius: 20,
-    borderTopEndRadius: 20,
-    paddingVertical: 24,
-    backgroundColor: R.colors.listBackground,
-  },
-  closeButton: {
-    padding: 8,
-    justifyContent: 'flex-end',
-  },
-  header: {
-    flexDirection: 'row',
-    justifyContent: 'center',
-    alignItems: 'center',
-    marginBottom: 16,
-    paddingHorizontal: 24,
-  },
-  title: {
-    fontSize: 20,
-  },
-  closeButtonIcon: {
-    height: 16,
-    width: 16,
-    resizeMode: 'contain',
-    tintColor: R.colors.white,
-  },
-  contentContainer: {
-    flex: 1,
-  },
-})

package/src/components/bottomSheetModal/BottomSheetModalTypes.ts

@@ -1,26 +0,0 @@
-import { ReactNode } from 'react'
-import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native'
-
-export interface IBottomSheetModalStyles {
-  rootContainer?: StyleProp<ViewStyle>
-  headerContainer?: StyleProp<ViewStyle>
-  content?: StyleProp<ViewStyle>
-  title?: StyleProp<TextStyle>
-  closeButton?: StyleProp<ViewStyle>
-  closeButtonIcon?: StyleProp<ImageStyle>
-  contentContainer?: StyleProp<ViewStyle>
-}
-
-export interface IBottomSheetModalTexts {
-  title?: string
-}
-
-export interface IBottomSheetModalProps {
-  title?: string
-  onClose: () => void
-  content: ReactNode
-  contentHeight?: number
-
-  styles?: IBottomSheetModalStyles
-  texts?: IBottomSheetModalTexts
-}

package/src/components/button/Button.tsx

@@ -1,53 +0,0 @@
-//@ts-nocheck
-import React from 'react'
-import { ActivityIndicator, Text, TouchableOpacity, View } from 'react-native'
-
-import R from '../../res'
-import s from './styles'
-import { IButtonProps } from './types'
-
-const Button = React.forwardRef(
-  (
-    {
-      text = 'Press me',
-      onPress,
-      isUpperCase,
-      isDisabled,
-      isLoading,
-      styles,
-    }: IButtonProps,
-    ref
-  ) => {
-    const formatText = isUpperCase ? text.toUpperCase() : text
-
-    return (
-      <>
-        <View style={[s.container, styles?.container]} ref={ref?.containerView}>
-          <TouchableOpacity
-            ref={ref?.touchableOpacity}
-            onPress={onPress}
-            activeOpacity={0.8}
-            style={[isDisabled ? s.buttonDisabled : s.button, styles?.button]}
-            disabled={isDisabled || isLoading}
-          >
-            {isLoading ? (
-              <View ref={ref?.loadingView}>
-                <ActivityIndicator
-                  color={R.colors.white}
-                  size={'small'}
-                  ref={ref?.activityIndicator}
-                />
-              </View>
-            ) : (
-              <Text style={[s.text, styles?.text]} ref={ref?.loadingText}>
-                {formatText}
-              </Text>
-            )}
-          </TouchableOpacity>
-        </View>
-      </>
-    )
-  }
-)
-
-export default Button

package/src/components/button/styles.tsx

@@ -1,30 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-import R from '../../res'
-
-export default StyleSheet.create({
-  container: {
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  button: {
-    alignItems: 'center',
-    justifyContent: 'center',
-    backgroundColor: R.colors.primary,
-    height: 45,
-    width: '100%',
-    paddingHorizontal: 8,
-  },
-  buttonDisabled: {
-    alignItems: 'center',
-    justifyContent: 'center',
-    backgroundColor: R.colors.disabled,
-    height: 45,
-    width: '100%',
-  },
-  text: {
-    color: R.colors.white,
-    fontSize: 18,
-    fontWeight: '700',
-  },
-})

package/src/components/button/types.ts

@@ -1,16 +0,0 @@
-import { StyleProp, TextStyle, ViewStyle } from 'react-native'
-
-export interface IButtonStyles {
-  container?: StyleProp<ViewStyle>
-  button?: StyleProp<ViewStyle>
-  text?: StyleProp<TextStyle>
-}
-
-export interface IButtonProps {
-  text: string
-  onPress: () => void
-  styles?: IButtonStyles
-  isUpperCase?: boolean
-  isDisabled?: boolean
-  isLoading?: boolean
-}

package/src/components/cartTimer/CartTimer.tsx

@@ -1,68 +0,0 @@
-import React, { FC, useEffect, useState } from 'react'
-import { Image, Pressable, Text, View } from 'react-native'
-
-import R from '../../res'
-import s from './styles'
-import { ICartTimerProps } from './types'
-
-const CartTimer: FC<ICartTimerProps> = ({
-  shouldNotMinimize,
-  texts,
-  styles,
-  secondsLeft,
-}) => {
-  const [isOnlyTimeVisible, setIsOnlyTimeVisible] = useState(false)
-  const hideOtherData = () => {
-    if (!shouldNotMinimize) {
-      setIsOnlyTimeVisible(!isOnlyTimeVisible)
-    }
-  }
-  const [timeRemaining, setTimeRemaining] = useState('')
-
-  const message = texts?.message
-    ? texts.message
-    : 'Please complete your purchase before the timer reaches zero:'
-
-  useEffect(() => {
-    const clockify = () => {
-      //let hours = Math.floor(secondsLeft / 60 / 60)
-      const mins = Math.floor((secondsLeft / 60) % 60)
-      const seconds = Math.floor(secondsLeft % 60)
-      //let displayHours = hours < 10 ? `0${hours}` : hours
-      const displayMins = mins < 10 ? `0${mins}` : mins
-      const displaySecs = seconds < 10 ? `0${seconds}` : seconds
-
-      setTimeRemaining(`${displayMins}:${displaySecs}`)
-    }
-
-    clockify()
-  }, [secondsLeft])
-
-  return (
-    <View
-      style={[
-        s.rootContainer,
-        isOnlyTimeVisible && s.rootContainerSmall,
-        styles?.rootContainer,
-      ]}
-    >
-      <Pressable onPressOut={hideOtherData}>
-        <View style={[s.contentContainer, styles?.contentContainer]}>
-          {!isOnlyTimeVisible && (
-            <Image source={R.icons.clock} style={[s.icon, styles?.icon]} />
-          )}
-          <View style={[s.textsContainer, styles?.textsContainer]}>
-            {!isOnlyTimeVisible && (
-              <Text style={[s.message, styles?.message]}>{message}</Text>
-            )}
-            <Text style={[s.time, isOnlyTimeVisible && s.timeOnlyVisible, styles?.time]}>
-              {timeRemaining}
-            </Text>
-          </View>
-        </View>
-      </Pressable>
-    </View>
-  )
-}
-
-export default CartTimer

package/src/components/cartTimer/styles.ts

@@ -1,44 +0,0 @@
-import { Dimensions, StyleSheet } from 'react-native'
-
-import R from '../../res'
-
-const { width: sWidth } = Dimensions.get('window')
-
-export default StyleSheet.create({
-  rootContainer: {
-    backgroundColor: R.colors.timerBackground,
-    position: 'absolute',
-    right: 0,
-    top: 40,
-    width: sWidth / 1.5,
-    borderRadius: 2,
-    padding: 8,
-    elevation: 3,
-    shadowOffset: { width: -3, height: 3 },
-    shadowColor: R.colors.black,
-    shadowOpacity: 0.2,
-    shadowRadius: 3,
-  },
-  rootContainerSmall: {
-    width: sWidth / 5,
-  },
-  contentContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    flex: 1,
-  },
-  icon: {
-    width: 16,
-    height: 16,
-    resizeMode: 'contain',
-    marginRight: 8,
-  },
-  textsContainer: { flex: 1 },
-  message: { marginBottom: 4 },
-  time: {
-    fontWeight: '800',
-  },
-  timeOnlyVisible: {
-    alignSelf: 'center',
-  },
-})

package/src/components/cartTimer/types.ts

@@ -1,22 +0,0 @@
-import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native'
-
-export interface ICartTimerStyles {
-  rootContainer?: StyleProp<ViewStyle>
-  contentContainer?: StyleProp<ViewStyle>
-  textsContainer?: StyleProp<ViewStyle>
-  icon?: StyleProp<ImageStyle>
-  message?: StyleProp<TextStyle>
-  time?: StyleProp<TextStyle>
-}
-
-export interface ICartTimerTexts {
-  message?: string
-}
-
-export interface ICartTimerProps {
-  styles?: ICartTimerStyles
-  texts?: ICartTimerTexts
-  // Determine if the timer should minimize when user taps on it
-  shouldNotMinimize?: boolean
-  secondsLeft: number
-}

package/src/components/checkbox/Checkbox.tsx

@@ -1,53 +0,0 @@
-import React from 'react'
-import { Image, StyleProp, Text, TouchableOpacity, View, ViewStyle } from 'react-native'
-
-import R from '../../res'
-import s from './styles'
-import { ICheckboxProps } from './types'
-
-const Checkbox = ({
-  onPress,
-  text,
-  styles,
-  isActive,
-  customTextComp,
-  error,
-}: ICheckboxProps) => {
-  let indicatorStyles: StyleProp<ViewStyle> = isActive
-    ? [s.indicatorOn, styles?.indicator]
-    : [s.indicator, styles?.indicatorDisabled]
-
-  if (error) {
-    indicatorStyles = [...indicatorStyles, { borderColor: styles?.errorColor }]
-  }
-
-  return (
-    <TouchableOpacity
-      onPress={onPress}
-      activeOpacity={0.8}
-      style={[s.container, styles?.container]}
-    >
-      <>
-        <View style={[s.content, styles?.content]}>
-          <View style={indicatorStyles}>
-            {isActive && <Image source={R.icons.check} style={[s.check, styles?.icon]} />}
-          </View>
-          {customTextComp || (
-            <Text
-              style={[
-                s.textContainer,
-                styles?.text,
-                !!error && { color: styles?.errorColor },
-              ]}
-            >
-              {text}
-            </Text>
-          )}
-        </View>
-        {!!error && <Text style={styles?.error}>{error}</Text>}
-      </>
-    </TouchableOpacity>
-  )
-}
-
-export default Checkbox

package/src/components/checkbox/styles.ts

@@ -1,41 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-import R from '../../res'
-
-export default StyleSheet.create({
-  container: {
-    marginBottom: 24,
-  },
-  content: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  indicator: {
-    width: 24,
-    height: 24,
-    borderRadius: 5,
-    borderWidth: 1,
-    backgroundColor: R.colors.transparent,
-    marginRight: 16,
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  indicatorOn: {
-    width: 24,
-    height: 24,
-    borderRadius: 5,
-    borderWidth: 1,
-    backgroundColor: R.colors.primary,
-    marginRight: 16,
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  check: {
-    width: '60%',
-    height: '60%',
-    tintColor: R.colors.white,
-  },
-  textContainer: {
-    flex: 1,
-  },
-})

package/src/components/checkbox/types.ts

@@ -1,23 +0,0 @@
-import { ReactNode } from 'react'
-import { ColorValue, ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native'
-
-export interface ICheckboxStyles {
-  container?: StyleProp<ViewStyle>
-  content?: StyleProp<ViewStyle>
-  indicator?: StyleProp<ViewStyle>
-  indicatorDisabled?: StyleProp<ViewStyle>
-  text?: StyleProp<TextStyle>
-  box?: StyleProp<ViewStyle>
-  icon?: StyleProp<ImageStyle>
-  error?: StyleProp<TextStyle>
-  errorColor?: ColorValue
-}
-
-export interface ICheckboxProps {
-  onPress: () => void
-  text?: string
-  isActive: boolean
-  styles?: ICheckboxStyles
-  customTextComp?: ReactNode
-  error?: string
-}