be-components 4.4.0 → 4.4.2

package/lib/commonjs/Bracket/components/RoomHome.js

@@ -0,0 +1,837 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Themed = require("../../Components/Themed");
+var _reactNative = require("react-native");
+var _PlayerBracketCard = _interopRequireDefault(require("./PlayerBracketCard"));
+var _SearchBox = _interopRequireDefault(require("../../Components/SearchBox"));
+var _Components = require("../../Components");
+var _useColors = require("../../constants/useColors");
+var _momentMini = _interopRequireDefault(require("moment-mini"));
+var _api = require("../api");
+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 MIN_CARD_WIDTH = 330;
+const calcCardWidth = (width, margin) => {
+  let num_cards_possible = Math.floor(width / MIN_CARD_WIDTH);
+  let buffer = margin * 2 * num_cards_possible;
+  let card_widt = (width - buffer) / num_cards_possible;
+  if (card_widt < MIN_CARD_WIDTH) {
+    return MIN_CARD_WIDTH;
+  }
+  return card_widt;
+};
+const sections = ['toggle', 'active_brackets', 'past_brackets', 'tournaments', 'competitions'];
+const RoomHome = ({
+  visible,
+  width,
+  player,
+  leagues,
+  active_brackets,
+  public_competitions,
+  onView,
+  onUpdatePlayerBracket,
+  onEditPlayerBracket,
+  onFocusPosition,
+  brackets,
+  player_brackets,
+  bracket_competitions,
+  competition_player_brackets,
+  athletes,
+  teams
+}) => {
+  const Colors = (0, _useColors.useColors)();
+  const [action_loading, setActionLoading] = (0, _react.useState)(undefined); //This will be a bracket id
+  const [active_toggle, setActiveToggle] = (0, _react.useState)('competitions');
+  const [past_search, setPastSearch] = (0, _react.useState)('');
+  const [show_active_search, setShowActiveSearch] = (0, _react.useState)(false);
+  const [expanded_brackets, setExpandedBrackets] = (0, _react.useState)([]);
+  const [expanded_leagues, setExpandedLeagues] = (0, _react.useState)([]);
+  const [expanded_c_leagues, setExpandedCLeagues] = (0, _react.useState)([]);
+  const [active_search, setActiveSearch] = (0, _react.useState)('');
+  const [show_past_search, setShowPastSearch] = (0, _react.useState)(false);
+  const [show_brackets_search, setShowBracketsSearch] = (0, _react.useState)(false);
+  const [selected_league, setSelectedLeague] = (0, _react.useState)(undefined);
+  const [brackets_search, setBracketsSearch] = (0, _react.useState)('');
+  console.log(brackets_search);
+  const [competition_search, setCompetitionSearch] = (0, _react.useState)('');
+  console.log(competition_search);
+  const [show_competition_search, setShowCompetitionSearch] = (0, _react.useState)(false);
+  let visible_active_brackets = [...active_brackets];
+  const unique_leages = [...new Set(visible_active_brackets.map(b => b.league_id))];
+  if (selected_league) {
+    visible_active_brackets = visible_active_brackets.filter(b => b.league_id == selected_league);
+  }
+  //const inprogress_bracket_ids = [ ...new Set(visible_active_brackets.map(b => b.bracket_id)) ];
+
+  const filterPlayerBrackets = (bs, pbs, status, search) => {
+    let init_pbs = pbs.filter(pb => pb.status == status);
+    if (!search || search == '') {
+      return init_pbs;
+    }
+    let brackets = bs.filter(b => `${b.bracket_name.toLowerCase()}`.includes(search.toLowerCase()));
+    return init_pbs.filter(pb => brackets.map(b => b.bracket_id.toString()).includes(pb.bracket_id.toString()));
+  };
+  let visible_player_brackets = (0, _react.useMemo)(() => {
+    return filterPlayerBrackets(brackets, player_brackets, 'active', active_search);
+  }, [brackets.length, player_brackets.length, active_search]);
+  const active_bracket_ids = [...new Set(visible_player_brackets.map(pb => pb.bracket_id))];
+  let past_player_brackets = (0, _react.useMemo)(() => {
+    console.log('past rendering');
+    return filterPlayerBrackets(brackets, player_brackets, 'closed', past_search);
+  }, [brackets.length, player_brackets.length, past_search]);
+  const past_bracket_ids = [...new Set(past_player_brackets.map(pb => pb.bracket_id))];
+  const competition_bracket_ids = [...new Set(public_competitions.map(bc => bc.bracket_id))];
+  const competition_brackets = brackets.filter(b => competition_bracket_ids.includes(b.bracket_id));
+  const competition_league_ids = [...new Set(competition_brackets.map(cb => cb.league_id))];
+  const pb_width = calcCardWidth(width, 6);
+  const renderBrackets = data => {
+    const bracket = brackets.find(b => b.bracket_id == data.item);
+    if (!bracket) {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+    const expanded = expanded_brackets.includes(data.item) ? true : false;
+    let my_player_brackets = player_brackets.filter(pb => pb.bracket_id == data.item);
+    let additional = my_player_brackets.length - 1;
+    if (!expanded) {
+      my_player_brackets = my_player_brackets.slice(0, 1);
+    }
+    const league = leagues.find(l => l.league_id == bracket.league_id);
+    const act_loading = action_loading == data.item ? true : false;
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      float: true,
+      style: {
+        margin: 5,
+        width: pb_width
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      type: "header",
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        padding: 10
+      }
+    }, league ? /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+      style: {
+        height: 40,
+        width: 40,
+        marginRight: 5
+      },
+      source: {
+        uri: league.league_image
+      },
+      resizeMode: "cover"
+    }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        flex: 1
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "description"
+    }, league ? league.league_name : 'Bracket'), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginTop: 3
+      },
+      theme: "h1"
+    }, bracket.bracket_name)), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        alignItems: 'center'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "success",
+      size: 16
+    }, my_player_brackets.length), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginTop: 3
+      },
+      theme: "success",
+      size: 12,
+      textAlign: "center"
+    }, "Brackets")), bracket.status == 'scheduled' ? /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+      title: "+",
+      type: "success",
+      disabled: act_loading,
+      loading: act_loading,
+      style: {
+        padding: 10,
+        marginLeft: 10,
+        opacity: act_loading ? 0.5 : 1
+      },
+      onPress: async () => {
+        if (action_loading || !player) {
+          return;
+        }
+        setActionLoading(data.item);
+        const new_pb = await _api.BracketComeptitionApi.createPlayerBracket({
+          player_bracket_id: '',
+          player_id: '',
+          bracket_name: `${player.username} Bracket ${Math.floor(Math.random() * (100 - 1 + 1) + 1)}`,
+          create_datetime: '',
+          last_update_datetime: '',
+          bracket_id: data.item,
+          completion_pct: 0,
+          completion_status: 'inprogress',
+          status: 'active'
+        });
+        onUpdatePlayerBracket(new_pb);
+        setActionLoading(undefined);
+        if (!expanded) {
+          setExpandedBrackets(expanded_brackets.concat(data.item));
+        }
+      }
+    }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      style: {
+        flex: 1
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
+      data: my_player_brackets,
+      key: `${data.item}_brackets`,
+      keyExtractor: item => item.player_bracket_id.toString(),
+      renderItem: renderPlayerBrackets
+    })), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'flex-end',
+        padding: 10,
+        backgroundColor: Colors.views.footer,
+        borderTopRightRadius: 0,
+        borderTopLeftRadius: 0
+      },
+      onPress: () => expanded ? setExpandedBrackets(expanded_brackets.filter(b => b != data.item)) : setExpandedBrackets(expanded_brackets.concat(data.item))
+    }, additional > 0 ? /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "action",
+      textAlign: "right"
+    }, "See ", additional, " More Brackets") : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)));
+  };
+  const renderCompetitions = data => {
+    return /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+      style: {
+        padding: 10,
+        flexDirection: 'row',
+        alignItems: 'center',
+        borderRadius: 0,
+        borderBottomWidth: 1,
+        borderColor: Colors.borders.light
+      },
+      onPress: () => onView(data.item.bracket_id, player_brackets.find(pb => pb.bracket_id == data.item.bracket_id)?.player_bracket_id, data.item.bracket_competition_id)
+    }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+      source: {
+        uri: data.item.image?.url
+      },
+      style: {
+        height: 40,
+        width: 40,
+        borderRadius: 4
+      },
+      resizeMode: "cover"
+    })), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        flex: 1,
+        marginLeft: 5
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      size: 14,
+      theme: "h1",
+      weight: "bold"
+    }, data.item.competition_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginTop: 3
+      },
+      size: 12,
+      theme: "light",
+      weight: "regular"
+    }, data.item.competition_description)), /*#__PURE__*/_react.default.createElement(_Components.Icons.ChevronIcon, {
+      size: 10,
+      color: Colors.text.h1,
+      direction: "right"
+    }));
+  };
+  const renderPlayerBrackets = (0, _react.useCallback)(data => {
+    const cpbs = competition_player_brackets.filter(cpb => cpb.status != 'deleted' && cpb.player_bracket_id == data.item.player_bracket_id);
+    const comps = bracket_competitions.filter(bc => cpbs.map(cpb => cpb.bracket_competition_id.toString()).includes(bc.bracket_competition_id.toString()));
+    const bracket = brackets.find(b => b.bracket_id == data.item.bracket_id);
+    if (!bracket) {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+    const league = leagues.find(l => l.league_id == bracket.league_id);
+    const champion_team = teams.find(t => data.item.champion_id_type == 'team' && t.team_id == data.item.champion_id);
+    const champion_athlete = athletes.find(t => data.item.champion_id_type == 'athlete' && t.athlete_id == data.item.champion_id);
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      style: {
+        borderBottomWidth: 1,
+        borderColor: Colors.borders.light,
+        padding: 5
+      }
+    }, /*#__PURE__*/_react.default.createElement(_PlayerBracketCard.default, {
+      league: league,
+      champion_athlete: champion_athlete,
+      champion_team: champion_team,
+      player_bracket: data.item,
+      competition_player_brackets: cpbs,
+      bracket: bracket,
+      bracket_competitions: comps,
+      onView: onView,
+      onEdit: onEditPlayerBracket
+    }));
+  }, [JSON.stringify(player_brackets)]);
+  const renderLeagueFilters = data => {
+    const league = leagues.find(l => l.league_id == data.item);
+    if (!league) {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+    const selected = data.item == selected_league ? true : false;
+    return /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+      float: true,
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        padding: 5,
+        paddingRight: 10,
+        paddingLeft: 10,
+        borderRadius: 100,
+        margin: 5
+      },
+      onPress: () => selected ? setSelectedLeague(undefined) : setSelectedLeague(data.item)
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+      source: {
+        uri: league.league_image
+      },
+      style: {
+        height: 30,
+        width: 30
+      },
+      resizeMode: "cover"
+    }), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginLeft: 5
+      }
+    }, league.league_name));
+  };
+  const renderLeagueBrackets = data => {
+    return /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        padding: 10,
+        borderBottomWidth: 1,
+        borderColor: Colors.borders.light
+      },
+      onPress: () => onView(data.item.bracket_id, player_brackets.find(pb => pb.bracket_id == data.item.bracket_id)?.player_bracket_id, undefined)
+    }, /*#__PURE__*/_react.default.createElement(_Components.Icons.BracketIcon, {
+      size: 18,
+      color: Colors.text.h1
+    }), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        flex: 1,
+        marginLeft: 10,
+        paddingLeft: 5,
+        borderLeftWidth: 1,
+        borderColor: Colors.borders.light
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "h2"
+    }, data.item.bracket_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "light",
+      style: {
+        marginTop: 4
+      }
+    }, (0, _momentMini.default)(data.item.scheduled_datetime).format('YYYY-MM-DD @ hh:mm a'))), /*#__PURE__*/_react.default.createElement(_Components.Icons.ChevronIcon, {
+      direction: "right",
+      color: Colors.text.h1
+    }));
+  };
+  const renderLeaguesForCompetitions = data => {
+    const league = leagues.find(l => l.league_id == data.item);
+    if (!league) {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+    const expanded = expanded_c_leagues.includes(data.item) ? true : false;
+    //Find all the brackets for this league
+    let league_brackets = active_brackets.filter(b => b.league_id == data.item);
+    let league_competitions = public_competitions.filter(bc => league_brackets.map(lb => lb.bracket_id.toString()).includes(bc.bracket_id.toString()));
+    const num_comps = league_competitions.length;
+    let additional = league_competitions.length - 1;
+    if (!expanded) {
+      league_competitions = league_competitions.slice(0, 1);
+    }
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      float: true,
+      style: {
+        margin: 5,
+        width: pb_width
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      type: "header",
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        padding: 10
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+      style: {
+        height: 40,
+        width: 40,
+        marginRight: 5
+      },
+      source: {
+        uri: league.league_image
+      },
+      resizeMode: "cover"
+    }), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        flex: 1
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "description"
+    }, league.league_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginTop: 3
+      },
+      theme: "h1"
+    }, league.sport)), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        alignItems: 'center'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "success",
+      size: 16
+    }, num_comps), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginTop: 3
+      },
+      theme: "success",
+      size: 12,
+      textAlign: "center"
+    }, "Comps"))), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      style: {
+        flex: 1
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
+      data: league_competitions,
+      renderItem: renderCompetitions,
+      keyExtractor: item => item.bracket_competition_id.toString(),
+      key: 'league brackets'
+    })), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'flex-end',
+        padding: 10,
+        backgroundColor: Colors.views.footer,
+        borderTopRightRadius: 0,
+        borderTopLeftRadius: 0
+      },
+      onPress: () => expanded ? setExpandedCLeagues(expanded_c_leagues.filter(b => b != data.item)) : setExpandedCLeagues(expanded_c_leagues.concat(data.item))
+    }, additional > 0 ? /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "action",
+      textAlign: "right"
+    }, "See ", additional, " More Competitions") : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)));
+  };
+  const renderLeagues = data => {
+    const league = leagues.find(l => l.league_id == data.item);
+    if (!league) {
+      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+    const expanded = expanded_leagues.includes(data.item) ? true : false;
+    let league_brackets = active_brackets.filter(b => b.league_id == data.item);
+    let additional = league_brackets.length - 1;
+    if (!expanded) {
+      league_brackets = league_brackets.slice(0, 1);
+    }
+    return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      float: true,
+      style: {
+        margin: 5,
+        width: pb_width
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      type: "header",
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        padding: 10
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
+      style: {
+        height: 40,
+        width: 40,
+        marginRight: 5
+      },
+      source: {
+        uri: league.league_image
+      },
+      resizeMode: "cover"
+    }), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        flex: 1
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "description"
+    }, league.league_name), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginTop: 3
+      },
+      theme: "h1"
+    }, league.sport)), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      transparent: true,
+      style: {
+        alignItems: 'center'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "success",
+      size: 16
+    }, league_brackets.length), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      style: {
+        marginTop: 3
+      },
+      theme: "success",
+      size: 12,
+      textAlign: "center"
+    }, "Brackets"))), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+      style: {
+        flex: 1
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
+      data: league_brackets,
+      renderItem: renderLeagueBrackets,
+      keyExtractor: item => item.bracket_id,
+      key: 'league brackets'
+    })), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+      style: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'flex-end',
+        padding: 10,
+        backgroundColor: Colors.views.footer,
+        borderTopRightRadius: 0,
+        borderTopLeftRadius: 0
+      },
+      onPress: () => expanded ? setExpandedLeagues(expanded_leagues.filter(b => b != data.item)) : setExpandedLeagues(expanded_leagues.concat(data.item))
+    }, additional > 0 ? /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+      theme: "action",
+      textAlign: "right"
+    }, "See ", additional, " More Brackets") : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null)));
+  };
+  const renderSections = data => {
+    switch (data.item) {
+      case 'toggle':
+        return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          style: {
+            margin: 5
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Components.Toggle, {
+          options: [{
+            key: 'my_brackets',
+            label: 'My Brackets'
+          }, {
+            key: 'tournaments',
+            label: 'Tournments'
+          }, {
+            key: 'competitions',
+            label: 'Competitions'
+          }],
+          selected_option: active_toggle,
+          onSelectOption: key => setActiveToggle(key)
+        }));
+      case 'active_brackets':
+        if (active_toggle != 'my_brackets') {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+        }
+        return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          nativeID: "my_competitions"
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "header",
+          style: {
+            padding: 10,
+            flexDirection: 'row',
+            alignItems: 'center'
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true,
+          style: {
+            flex: 1,
+            marginRight: 10
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          theme: "h1"
+        }, "My Active Brackets"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          style: {
+            marginTop: 4
+          }
+        }, "View / Edit your active brackets")), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          float: true,
+          style: {
+            padding: 0,
+            height: 35,
+            width: 35,
+            justifyContent: 'center',
+            alignItems: 'center'
+          },
+          onPress: () => setShowActiveSearch(!show_active_search)
+        }, show_active_search ? /*#__PURE__*/_react.default.createElement(_Components.Icons.CloseIcon, {
+          size: 14,
+          color: Colors.text.error
+        }) : /*#__PURE__*/_react.default.createElement(_Components.Icons.SearchIcon, {
+          size: 14,
+          color: Colors.text.action
+        }))), show_active_search ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {
+          onChange: text => setActiveSearch(text),
+          hide_search_button: true,
+          placeholder: "Search Active Brackets",
+          onFocusPosition: onFocusPosition
+        }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "body",
+          style: {
+            marginBottom: 10,
+            flexDirection: 'row',
+            flexWrap: 'wrap',
+            justifyContent: 'center'
+          }
+        }, active_bracket_ids.map((id, index) => {
+          return renderBrackets({
+            item: id,
+            index
+          });
+        })));
+      case 'tournaments':
+        if (active_toggle != 'tournaments') {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+        }
+        return /*#__PURE__*/_react.default.createElement(_Themed.View, null, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "header",
+          style: {
+            padding: 10,
+            flexDirection: 'row',
+            alignItems: 'center'
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true,
+          style: {
+            flex: 1,
+            marginRight: 10
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          theme: "h1"
+        }, "Active Brackets"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          style: {
+            marginTop: 4
+          }
+        }, "View and fill out active brackets")), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          float: true,
+          style: {
+            padding: 0,
+            height: 35,
+            width: 35,
+            justifyContent: 'center',
+            alignItems: 'center'
+          },
+          onPress: () => setShowBracketsSearch(!show_brackets_search)
+        }, show_brackets_search ? /*#__PURE__*/_react.default.createElement(_Components.Icons.CloseIcon, {
+          size: 14,
+          color: Colors.text.error
+        }) : /*#__PURE__*/_react.default.createElement(_Components.Icons.SearchIcon, {
+          size: 14,
+          color: Colors.text.action
+        }))), show_brackets_search ? /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          style: {
+            padding: 5
+          }
+        }, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
+          key: "unique_leagues",
+          keyExtractor: item => item,
+          data: unique_leages,
+          renderItem: renderLeagueFilters,
+          horizontal: true
+        })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), show_brackets_search ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {
+          onChange: text => setBracketsSearch(text),
+          hide_search_button: true,
+          placeholder: "Search Active Tournaments",
+          onFocusPosition: onFocusPosition
+        }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "body",
+          style: {
+            marginTop: 10,
+            marginBottom: 10,
+            flexDirection: 'row',
+            flexWrap: 'wrap',
+            justifyContent: 'center'
+          }
+        }, unique_leages.map((id, index) => {
+          return renderLeagues({
+            item: id,
+            index
+          });
+        })));
+      case 'past_brackets':
+        if (active_toggle != 'my_brackets') {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+        }
+        return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          nativeID: "past_brackets"
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "header",
+          style: {
+            padding: 10,
+            flexDirection: 'row',
+            alignItems: 'center'
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true,
+          style: {
+            flex: 1,
+            marginRight: 10
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          theme: "h1"
+        }, "MY PAST BRACKETS"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          style: {
+            marginTop: 4
+          }
+        }, "View your past brackets")), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          float: true,
+          style: {
+            padding: 0,
+            height: 35,
+            width: 35,
+            justifyContent: 'center',
+            alignItems: 'center'
+          },
+          onPress: () => setShowPastSearch(!show_past_search)
+        }, show_past_search ? /*#__PURE__*/_react.default.createElement(_Components.Icons.CloseIcon, {
+          size: 14,
+          color: Colors.text.error
+        }) : /*#__PURE__*/_react.default.createElement(_Components.Icons.SearchIcon, {
+          size: 14,
+          color: Colors.text.action
+        }))), show_past_search ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {
+          onChange: text => setPastSearch(text),
+          hide_search_button: true,
+          placeholder: "Search Past Brackets",
+          onFocusPosition: onFocusPosition
+        }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "body",
+          style: {
+            marginBottom: 10,
+            flexDirection: 'row',
+            flexWrap: 'wrap',
+            justifyContent: 'center'
+          }
+        }, past_bracket_ids.map((id, index) => {
+          return renderBrackets({
+            item: id,
+            index
+          });
+        })));
+      case 'competitions':
+        if (active_toggle != 'competitions') {
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+        }
+        return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          nativeID: "competitions"
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "header",
+          style: {
+            padding: 10,
+            flexDirection: 'row',
+            alignItems: 'center'
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          transparent: true,
+          style: {
+            flex: 1,
+            marginRight: 10
+          }
+        }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          theme: "h1"
+        }, "Active Competitions"), /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          style: {
+            marginTop: 4
+          }
+        }, "Join an active competition")), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          float: true,
+          style: {
+            padding: 0,
+            height: 35,
+            width: 35,
+            justifyContent: 'center',
+            alignItems: 'center'
+          },
+          onPress: () => setShowCompetitionSearch(!show_competition_search)
+        }, show_competition_search ? /*#__PURE__*/_react.default.createElement(_Components.Icons.CloseIcon, {
+          size: 12,
+          color: Colors.text.error
+        }) : /*#__PURE__*/_react.default.createElement(_Components.Icons.SearchIcon, {
+          size: 12,
+          color: Colors.text.action
+        })), /*#__PURE__*/_react.default.createElement(_Themed.Button, {
+          type: "success",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            marginLeft: 5,
+            padding: 0,
+            height: 35,
+            width: 40,
+            justifyContent: 'center'
+          },
+          onPress: () => console.log('create a new competition')
+        }, /*#__PURE__*/_react.default.createElement(_Themed.Text, {
+          theme: "h1",
+          color: Colors.text.white
+        }, "+"), /*#__PURE__*/_react.default.createElement(_Components.Icons.TrophyIcon, {
+          color: Colors.text.white,
+          size: 14
+        }))), show_competition_search ? /*#__PURE__*/_react.default.createElement(_SearchBox.default, {
+          onChange: text => setCompetitionSearch(text),
+          onSearch: text => console.log(text),
+          placeholder: "Search or Enter Private Code",
+          onFocusPosition: onFocusPosition
+        }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null), /*#__PURE__*/_react.default.createElement(_Themed.View, {
+          type: "body",
+          style: {
+            marginTop: 10,
+            marginBottom: 10,
+            flexDirection: 'row',
+            flexWrap: 'wrap',
+            justifyContent: 'center'
+          }
+        }, competition_league_ids.map((id, index) => {
+          return renderLeaguesForCompetitions({
+            item: id,
+            index
+          });
+        })));
+      default:
+        return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    }
+  };
+  if (!visible) {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+  }
+  return /*#__PURE__*/_react.default.createElement(_Themed.View, {
+    style: {
+      flex: 1
+    }
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.FlatList, {
+    data: sections,
+    key: "room_sections",
+    keyExtractor: item => item,
+    renderItem: renderSections
+  }));
+};
+var _default = exports.default = RoomHome;
+//# sourceMappingURL=RoomHome.js.map