be-components 3.3.6 → 3.3.8

package/lib/commonjs/Competition/index.js

@@ -18,9 +18,12 @@ var _EnterCompetitionPrompt = _interopRequireDefault(require("./components/Enter
 var _momentMini = _interopRequireDefault(require("moment-mini"));
 var _LeaderPicks = _interopRequireDefault(require("./components/LeaderPicks"));
 var _SeasonCard = _interopRequireDefault(require("./components/SeasonCard"));
+var _Themed = require("../Components/Themed");
+var _useColors = require("../constants/useColors");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const competition_sections = ['header', 'join', 'details', 'leaderboard', 'play'];
 const CompetitionModule = ({
   competition_id,
   player_id,
@@ -31,6 +34,7 @@ const CompetitionModule = ({
   onClose,
   onViewCompetitionSeason
 }) => {
+  const C = (0, _useColors.useColors)();
   const [viewing_leader, setViewingLeader] = (0, _react.useState)();
   const [show_full_leaderboard, setShowFullLeaderboard] = (0, _react.useState)(false);
   const [module_size, setModuleSize] = (0, _react.useState)({
@@ -324,8 +328,173 @@ const CompetitionModule = ({
       });
     }
   };
+  const renderSections = data => {
+    if (!competition) {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+    switch (data.item) {
+      case 'header':
+        return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "header",
+          nativeID: "competition_header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 20,
+            borderBottomWidth: 1,
+            borderColor: C.borders.light
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true
+        }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+          source: {
+            uri: competition.image?.url ?? 'https://res.cloudinary.com/hoabts6mc/image/upload/v1649737862/be_logo_jte2ux.webp'
+          },
+          style: {
+            height: 50,
+            width: 50,
+            borderRadius: 4
+          },
+          resizeMode: "cover"
+        })), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true,
+          style: {
+            flex: 1,
+            marginLeft: 10,
+            marginRight: 10
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          theme: "h1"
+        }, competition.competition_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          style: {
+            marginTop: 4
+          },
+          theme: "h2"
+        }, competition.competition_description)), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          float: true,
+          onPress: () => onShareCompetition(competition)
+        }, /*#__PURE__*/_react.default.createElement(_Components.Icons.ShareIcon, {
+          color: C.text.h1,
+          size: 14
+        })));
+      case 'join':
+        return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true
+        }, competition_season ? /*#__PURE__*/_react.default.createElement(_SeasonCard.default, {
+          competition_season: competition_season,
+          authenticated_competition_player: authenticated_competition_player,
+          onViewSeason: cs => onViewCompetitionSeason(cs)
+        }) : /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true,
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            padding: 10
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          size: 12,
+          theme: "description"
+        }, competition.status == 'closed' ? 'COMPLETED' : in_progress ? 'IN PROGRESS' : 'JOIN UNTIL'), in_progress ? /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          style: {
+            marginTop: 5
+          },
+          theme: "h2"
+        }, (0, _momentMini.default)(competition.scheduled_datetime).format('MMM DD hh:mm a')) : /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          style: {
+            marginTop: 5
+          },
+          theme: "h2"
+        }, (0, _momentMini.default)(competition.scheduled_datetime).format('MMM DD hh:mm a'))), !authenticated_competition_player ? /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          style: {
+            opacity: can_join ? 1 : 0.5
+          },
+          disabled: !can_join,
+          loading: loading,
+          title: `JOIN`,
+          type: "success",
+          onPress: () => {
+            if (competition.competition_season_id) {
+              return alert('Please select the season to join!');
+            }
+            setShowEnterPrompt(true);
+          }
+        }) : competition.status != 'closed' ? /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          style: {
+            opacity: can_leave ? 1 : 0.5
+          },
+          title: "LEAVE",
+          loading: loading,
+          type: "error",
+          onPress: () => {
+            if (competition.competition_season_id) {
+              return alert('You can only leave via the season');
+            }
+            if (!can_leave) {
+              return alert('Please remove all picks and try again');
+            }
+            handleLeaveCompetition();
+          }
+        }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)));
+      case 'details':
+        if (!competition || !competition_type || !competition_result_type) {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+        }
+        return /*#__PURE__*/_react.default.createElement(_CompetitionInfoCard.default, {
+          competition: competition,
+          competition_type: competition_type,
+          competition_result_type: competition_result_type,
+          competition_payouts: competition_payout_types.filter(cpt => cpt.competition_result_type_id == competition_result_type?.competition_result_type_id)
+        });
+      case 'leaderboard':
+        if (!competition_type) {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+        }
+        return /*#__PURE__*/_react.default.createElement(_CompetitionLeaderboard.default, {
+          competition: competition,
+          width: module_size.width,
+          competition_type: competition_type,
+          height: module_size.height,
+          onLeaderSelect: player => setViewingLeader(player),
+          view_mode: "short",
+          onSeeFull: () => setShowFullLeaderboard(true),
+          viewer_id: player_id
+        });
+      case 'play':
+        if (!competition || !competition_type) {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+        }
+        return /*#__PURE__*/_react.default.createElement(_CompetitionPlay.default, {
+          competition: competition,
+          competition_type: competition_type,
+          competition_matches: competition_matches,
+          competition_match_markets: competition_match_markets,
+          leagues: leagues,
+          events: events,
+          pick_loading: pick_loading,
+          athletes: athletes,
+          markets: markets,
+          tournaments: tournaments,
+          matches: matches,
+          player_picks: player_picks,
+          player_id: player_id,
+          competition_players: competition_players,
+          authenticated_competition_player: authenticated_competition_player,
+          height: module_size.height,
+          width: module_size.width,
+          onPick: handlePick,
+          onRequestAuthentication: () => onRequestAuthentication(competition.auth_strategy_id)
+        });
+      default:
+        return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+  };
   if (!competition || !competition_type || !competition_result_type) {
-    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, {
       style: {
         flex: 1
       }
@@ -338,13 +507,9 @@ const CompetitionModule = ({
       color: _colors.default.brand.midnight
     }));
   }
-  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: {
-      flex: 1
-    }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, {
+  return /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
-      flex: 1
+      flexGrow: 1
     },
     onLayout: ev => {
       const {
@@ -356,158 +521,17 @@ const CompetitionModule = ({
         height
       });
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: {
-      backgroundColor: _colors.default.shades.white
-    }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    nativeID: "competition_header",
-    style: {
-      flexDirection: 'row',
-      alignItems: 'center',
-      padding: 20,
-      borderBottomWidth: 1,
-      borderColor: _colors.default.shades.shade600
-    }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
-    source: {
-      uri: competition.image?.url ?? 'https://res.cloudinary.com/hoabts6mc/image/upload/v1649737862/be_logo_jte2ux.webp'
-    },
-    style: {
-      height: 50,
-      width: 50,
-      borderRadius: 4
-    },
-    resizeMode: "cover"
-  })), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: {
-      flex: 1,
-      marginLeft: 10
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    theme: "header"
-  }, competition.competition_name), /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    style: {
-      marginTop: 4
-    },
-    theme: "header_2>"
-  }, competition.competition_description)), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
-    style: {
-      paddingLeft: 10
-    },
-    onPress: () => onShareCompetition(competition)
-  }, /*#__PURE__*/_react.default.createElement(_Components.Icons.ShareIcon, {
-    color: _colors.default.brand.midnight,
-    size: 14
-  }))), competition_season ? /*#__PURE__*/_react.default.createElement(_SeasonCard.default, {
-    competition_season: competition_season,
-    authenticated_competition_player: authenticated_competition_player,
-    onViewSeason: cs => onViewCompetitionSeason(cs)
-  }) : /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: {
-      flexDirection: 'row',
-      padding: 10,
-      backgroundColor: _colors.default.shades.shade100
-    }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: {
-      flex: 1
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    size: 12,
-    color: _colors.default.brand.midnight,
-    weight: "regular"
-  }, competition.status == 'closed' ? 'COMPLETED' : in_progress ? 'IN PROGRESS' : 'JOIN UNTIL'), in_progress ? /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    style: {
-      marginTop: 5
-    },
-    size: 12,
-    color: _colors.default.brand.midnight,
-    weight: "bold"
-  }, (0, _momentMini.default)(competition.scheduled_datetime).format('MMM DD hh:mm a')) : /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    style: {
-      marginTop: 5
-    },
-    size: 12,
-    color: _colors.default.brand.midnight,
-    weight: "bold"
-  }, (0, _momentMini.default)(competition.scheduled_datetime).format('MMM DD hh:mm a'))), !authenticated_competition_player ? /*#__PURE__*/_react.default.createElement(_Components.Button, {
-    style: {
-      opacity: can_join ? 1 : 0.5
-    },
-    disabled: !can_join,
-    loading: loading,
-    title: `JOIN`,
-    title_color: _colors.default.shades.white,
-    backgroundColor: _colors.default.utility.success,
-    onPress: () => {
-      if (competition.competition_season_id) {
-        return alert('Please select the season to join!');
-      }
-      setShowEnterPrompt(true);
-    }
-  }) : competition.status != 'closed' ? /*#__PURE__*/_react.default.createElement(_Components.Button, {
-    style: {
-      flex: 1,
-      opacity: can_leave ? 1 : 0.5
-    },
-    title: "LEAVE",
-    loading: loading,
-    title_color: _colors.default.shades.white,
-    backgroundColor: _colors.default.utility.error,
-    onPress: () => {
-      if (competition.competition_season_id) {
-        return alert('You can only leave via the season');
-      }
-      if (!can_leave) {
-        return alert('Please remove all picks and try again');
-      }
-      handleLeaveCompetition();
-    }
-  }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null))), /*#__PURE__*/_react.default.createElement(_CompetitionInfoCard.default, {
-    competition: competition,
-    competition_type: competition_type,
-    competition_result_type: competition_result_type,
-    competition_payouts: competition_payout_types.filter(cpt => cpt.competition_result_type_id == competition_result_type?.competition_result_type_id)
-  }), /*#__PURE__*/_react.default.createElement(_CompetitionLeaderboard.default, {
-    competition: competition,
-    width: module_size.width,
-    competition_type: competition_type,
-    height: module_size.height,
-    onLeaderSelect: player => setViewingLeader(player),
-    view_mode: "short",
-    onSeeFull: () => setShowFullLeaderboard(true),
-    viewer_id: player_id
-  }), /*#__PURE__*/_react.default.createElement(_CompetitionPlay.default, {
-    competition: competition,
-    competition_type: competition_type,
-    competition_matches: competition_matches,
-    competition_match_markets: competition_match_markets,
-    leagues: leagues,
-    events: events,
-    pick_loading: pick_loading,
-    athletes: athletes,
-    markets: markets,
-    tournaments: tournaments,
-    matches: matches,
-    player_picks: player_picks,
-    player_id: player_id,
-    competition_players: competition_players,
-    authenticated_competition_player: authenticated_competition_player,
-    height: module_size.height,
-    width: module_size.width,
-    onPick: handlePick,
-    onRequestAuthentication: () => onRequestAuthentication(competition.auth_strategy_id)
-  }), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
+    key: `competition_sections`,
+    data: competition_sections,
+    keyExtractor: item => item,
+    renderItem: renderSections
+  }), player?.player_id == competition.admin_id ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    float: true,
+    type: "row",
     style: {
-      ..._styles.view_styles.section
-    }
-  })), player?.player_id == competition.admin_id ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-    style: {
-      ..._styles.view_styles.body_row,
       padding: 0,
-      paddingRight: 10,
-      backgroundColor: _colors.default.shades.shade100
+      paddingRight: 10
     }
   }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
     source: {
@@ -518,25 +542,25 @@ const CompetitionModule = ({
       width: 55
     },
     resizeMode: "cover"
-  }), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       flex: 1,
       marginLeft: 10,
       padding: 5
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    theme: "header_2"
-  }, "ADMIN ACTIONS"), /*#__PURE__*/_react.default.createElement(_Components.Text, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+    theme: "h2"
+  }, "ADMIN ACTIONS"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
     style: {
       marginTop: 3
     },
-    theme: "body_2"
-  }, "Press manage to make changes to this competition")), /*#__PURE__*/_react.default.createElement(_Components.Button, {
+    theme: "description"
+  }, "Press manage to make changes to this competition")), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+    float: true,
     title: "MANAGE",
-    title_color: _colors.default.shades.white,
-    backgroundColor: _colors.default.brand.electric,
-    onPress: () => onManageCompetition(competition_id)
-  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), show_full_leaderboard ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    onPress: () => onManageCompetition(competition_id),
+    type: "info"
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), show_full_leaderboard ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       position: 'absolute',
       bottom: 0,
@@ -554,7 +578,7 @@ const CompetitionModule = ({
     onClose: () => setShowFullLeaderboard(false),
     onSeeFull: () => setShowFullLeaderboard(!show_full_leaderboard),
     viewer_id: player_id
-  }), "xxw            ") : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       position: 'absolute'
     }
@@ -569,16 +593,16 @@ const CompetitionModule = ({
       ...nav_out,
       visible: false
     })
-  })), draft_player_pick?.draft_pick ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  })), draft_player_pick?.draft_pick ? /*#__PURE__*/_react.default.createElement(_reactNative.Modal, {
+    transparent: true,
+    visible: draft_player_pick.draft_pick ? true : false,
+    onRequestClose: () => setShowEnterPrompt(false),
+    animationType: "slide"
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    type: "blur",
     style: {
-      position: 'absolute',
-      top: 0,
-      right: 0,
-      left: 0,
-      bottom: 0,
-      backgroundColor: _colors.default.shades.black_faded,
-      justifyContent: 'flex-end',
-      alignItems: 'center'
+      flex: 1,
+      justifyContent: 'flex-end'
     }
   }, /*#__PURE__*/_react.default.createElement(_WagerPickForm.default, {
     event_start: draft_player_pick.event_start ?? '',
@@ -589,16 +613,16 @@ const CompetitionModule = ({
     player_pick: draft_player_pick.draft_pick,
     onCancel: () => setDraftPlayerPick({}),
     onSubmit: pp => handleWagerSubmit(pp)
-  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_reactNative.Modal, {
+  }))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_reactNative.Modal, {
     transparent: true,
     visible: show_enter_prompt,
     onRequestClose: () => setShowEnterPrompt(false),
     animationType: "slide"
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    type: "blur",
     style: {
       flex: 1,
-      justifyContent: 'flex-end',
-      backgroundColor: _colors.default.shades.black_faded
+      justifyContent: 'flex-end'
     }
   }, /*#__PURE__*/_react.default.createElement(_EnterCompetitionPrompt.default, {
     competition: competition,
@@ -610,16 +634,16 @@ const CompetitionModule = ({
     onCancel: () => setShowEnterPrompt(false),
     onEnter: promo_balance => handleEnterCompetition(promo_balance),
     onVerify: () => console.log('Handle verify')
-  }))), viewing_leader ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }))), /*#__PURE__*/_react.default.createElement(_reactNative.Modal, {
+    transparent: true,
+    visible: viewing_leader ? true : false,
+    onRequestClose: () => setShowEnterPrompt(false),
+    animationType: "slide"
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    type: "blur",
     style: {
-      position: 'absolute',
-      top: 0,
-      right: 0,
-      left: 0,
-      bottom: 0,
-      backgroundColor: _colors.default.shades.black_faded,
-      justifyContent: 'flex-end',
-      alignItems: 'center'
+      flex: 1,
+      justifyContent: 'flex-end'
     }
   }, /*#__PURE__*/_react.default.createElement(_LeaderPicks.default, {
     competition: competition,
@@ -636,7 +660,7 @@ const CompetitionModule = ({
     height: module_size.height,
     width: module_size.width,
     onClose: () => setViewingLeader(undefined)
-  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), competition.status == 'inactive' ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }))), competition.status == 'inactive' ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       position: 'absolute',
       top: 0,
@@ -647,22 +671,22 @@ const CompetitionModule = ({
       justifyContent: 'center',
       alignItems: 'center'
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section,
       width: '70%',
       backgroundColor: _colors.default.shades.white
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section_header,
       justifyContent: 'center',
       alignItems: 'center',
       backgroundColor: _colors.default.shades.shade100
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    theme: "header"
-  }, "Competition Has Been Deleted")), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+    theme: "h1"
+  }, "Competition Has Been Deleted")), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section_body,
       justifyContent: 'center',
@@ -677,22 +701,20 @@ const CompetitionModule = ({
       width: 75
     },
     resizeMode: "cover"
-  }), /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    theme: "header_2"
-  }, competition.competition_name)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+    theme: "h1"
+  }, competition.competition_name)), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section_footer
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Button, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
     title: "CLOSE",
     style: {
       flex: 1
     },
-    title_color: _colors.default.shades.white,
-    backgroundColor: _colors.default.utility.error,
-    padding: 15,
+    type: "close",
     onPress: () => onClose()
-  })))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), competition.status == 'paused' ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  })))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), competition.status == 'paused' ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       position: 'absolute',
       top: 0,
@@ -703,22 +725,22 @@ const CompetitionModule = ({
       justifyContent: 'center',
       alignItems: 'center'
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section,
       width: '70%',
       backgroundColor: _colors.default.shades.white
     }
-  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section_header,
       justifyContent: 'center',
       alignItems: 'center',
       backgroundColor: _colors.default.shades.shade100
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    theme: "header"
-  }, "Competition Is Paused")), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+    theme: "h1"
+  }, "Competition Is Paused")), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section_body,
       justifyContent: 'center',
@@ -733,20 +755,18 @@ const CompetitionModule = ({
       width: 75
     },
     resizeMode: "cover"
-  }), /*#__PURE__*/_react.default.createElement(_Components.Text, {
-    theme: "header_2"
-  }, competition.competition_name)), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  }), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+    theme: "h2"
+  }, competition.competition_name)), /*#__PURE__*/_react.default.createElement(_Themed.View, {
     style: {
       ..._styles.view_styles.section_footer
     }
-  }, /*#__PURE__*/_react.default.createElement(_Components.Button, {
+  }, /*#__PURE__*/_react.default.createElement(_Themed.Button, {
     title: "CLOSE",
     style: {
       flex: 1
     },
-    title_color: _colors.default.shades.white,
-    backgroundColor: _colors.default.utility.error,
-    padding: 15,
+    type: "close",
     onPress: () => onClose()
   })))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null));
 };