be-components 6.7.8 → 6.7.9

package/lib/module/CompetitionManager/components/AdminCompetitionList.js

@@ -1,18 +1,22 @@
 import React, { useEffect, useState } from "react";
-import { View, FlatList, TouchableOpacity, Image, ActivityIndicator, ScrollView } from "react-native";
+import { FlatList, Image, ActivityIndicator } from "react-native";
 import { ManageCompetitionApi, ManageCompetitionHelpers } from "../api";
-import Colors from "../../constants/colors";
-import { view_styles } from "../../constants/styles";
-import { Button, Icons, Text } from "../../Components";
+import { Icons, Toggle } from "../../Components";
+import { Button, Text, View } from "../../Components/Themed";
+import { useColors } from "../../constants/useColors";
+import Pagination from "../../Components/Pagination";
+const sections = ['header', 'toggle', 'active_past_toggle', 'pagination', 'loading', 'admin_competitions', 'competitions', 'admin_squares', 'squares', 'admin_brackets', 'brackets'];
 const AdminCompetitionList = ({
-  width,
-  height,
+  header_style,
+  float,
+  footer_style,
   onClose,
   onCreateNew,
   onSelectCompetition,
   onSelectBracketCompetition,
   onSelectSquaresCompetition
 }) => {
+  const Colors = useColors();
   const [list_data, setData] = useState({
     loading: false,
     offset: 0,
@@ -21,8 +25,13 @@ const AdminCompetitionList = ({
     competitions: [],
     competition_players: [],
     competition_records: [],
+    show_admin_brackets: false,
+    show_admin_competitions: false,
+    show_admin_squares: false,
     competition_results: [],
+    admin_brackets: [],
     admin_competitions: [],
+    admin_squares: [],
     competition_seasons: [],
     competition_season_players: [],
     competition_season_results: [],
@@ -35,6 +44,11 @@ const AdminCompetitionList = ({
     offset,
     active_tab,
     active_engagement,
+    show_admin_brackets,
+    show_admin_competitions,
+    show_admin_squares,
+    admin_squares,
+    admin_brackets,
     loading,
     competitions,
     admin_competitions,
@@ -86,20 +100,24 @@ const AdminCompetitionList = ({
         return;
       case 'brackets':
         if (active_tab == 'active') {
+          const admin_bracks_active = await ManageCompetitionApi.getMyActiveAdminBracketCompetitions();
           const b_resp = await ManageCompetitionApi.getMyActiveBracketCompetitions();
           setData({
             ...list_data,
             loading: false,
+            admin_brackets: admin_bracks_active,
             bracket_competitions: b_resp.bracket_competitions,
             player_brackets: b_resp.player_brackets,
             competition_player_brackets: b_resp.competition_player_brackets,
             offset
           });
         } else {
+          const admin_bracks_history = await ManageCompetitionApi.getMyHistoryAdminBracketCompetitions(offset);
           const b_resp = await ManageCompetitionApi.getMyHistoryBracketCompetitions(offset);
           setData({
             ...list_data,
             loading: false,
+            admin_brackets: admin_bracks_history,
             bracket_competitions: b_resp.bracket_competitions,
             player_brackets: b_resp.player_brackets,
             competition_player_brackets: b_resp.competition_player_brackets,
@@ -109,18 +127,22 @@ const AdminCompetitionList = ({
         return;
       case 'squares':
         if (active_tab == 'active') {
+          const active_admin_squares = await ManageCompetitionApi.getMyActiveAdminSquares();
           const s_resp = await ManageCompetitionApi.getMyActiveSquaresCompetitions();
           setData({
             ...list_data,
             loading: false,
             offset,
+            admin_squares: active_admin_squares,
             squares_competitions: s_resp.squares_competitions
           });
         } else {
+          const past_admin_squares = await ManageCompetitionApi.getMyHistoryAdminSquares(offset);
           const s_resp = await ManageCompetitionApi.getMyHistorySquaresCompetitions(offset);
           setData({
             ...list_data,
             loading: false,
+            admin_squares: past_admin_squares,
             offset,
             squares_competitions: s_resp.squares_competitions
           });
@@ -133,12 +155,14 @@ const AdminCompetitionList = ({
   const renderCompetitions = data => {
     const competition_result = competition_results.find(cr => cr.competition_id == data.item.competition_id);
     const cl = data.item.market_type == 'FOR_MONEY' ? '$' : 'E';
-    return /*#__PURE__*/React.createElement(TouchableOpacity, {
+    return /*#__PURE__*/React.createElement(Button, {
       style: {
-        ...view_styles.body_row,
+        flexDirection: 'row',
+        alignItems: 'center',
+        borderRadius: 0,
         padding: 15,
         borderBottomWidth: 1,
-        borderColor: Colors.shades.shade600
+        borderColor: Colors.borders.light
       },
       onPress: () => onSelectCompetition(data.item)
     }, /*#__PURE__*/React.createElement(Image, {
@@ -157,12 +181,12 @@ const AdminCompetitionList = ({
         marginLeft: 10
       }
     }, /*#__PURE__*/React.createElement(Text, {
-      theme: "header_2"
+      theme: "h2"
     }, data.item.competition_name), /*#__PURE__*/React.createElement(Text, {
       style: {
         marginTop: 3
       },
-      theme: "body"
+      theme: "description"
     }, data.item.competition_description)), competition_result ? /*#__PURE__*/React.createElement(View, {
       style: {
         marginRight: 10,
@@ -170,63 +194,27 @@ const AdminCompetitionList = ({
         justifyContent: 'center'
       }
     }, /*#__PURE__*/React.createElement(Text, {
-      size: 12,
-      color: Colors.brand.midnight,
-      weight: "bold",
-      textAlign: "center"
+      size: 12
     }, ManageCompetitionHelpers.formatPlace(competition_result.place)), /*#__PURE__*/React.createElement(Text, {
       size: 12,
-      color: Colors.brand.midnight,
-      textAlign: "center",
       style: {
         marginTop: 3
       }
     }, cl, competition_result.winnings.toFixed(2))) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(Icons.ChevronIcon, {
       direction: "right",
       size: 8,
-      color: Colors.brand.midnight
+      color: Colors.text.h1
     }));
   };
-  const renderAdminCompetitions = data => {
-    return /*#__PURE__*/React.createElement(TouchableOpacity, {
-      style: {
-        borderRadius: 8,
-        backgroundColor: Colors.shades.white,
-        width: width / 3,
-        borderWidth: 1,
-        borderColor: Colors.shades.shade600
-      },
-      onPress: () => onSelectCompetition(data.item)
-    }, /*#__PURE__*/React.createElement(Image, {
-      source: {
-        uri: data.item.image?.url
-      },
-      style: {
-        height: width / 3 * 0.5,
-        width: width / 3,
-        borderRadius: 4,
-        borderBottomRightRadius: 0,
-        borderBottomLeftRadius: 0
-      },
-      resizeMode: "cover"
-    }), /*#__PURE__*/React.createElement(View, {
-      style: {
-        marginTop: 5,
-        padding: 10
-      }
-    }, /*#__PURE__*/React.createElement(Text, {
-      size: 14,
-      textAlign: "center",
-      weight: "bold"
-    }, data.item.competition_name)));
-  };
   const renderSquares = data => {
-    return /*#__PURE__*/React.createElement(TouchableOpacity, {
+    return /*#__PURE__*/React.createElement(Button, {
       style: {
-        ...view_styles.body_row,
+        flexDirection: 'row',
+        alignItems: 'center',
+        borderRadius: 0,
         padding: 10,
         borderBottomWidth: 1,
-        borderColor: Colors.shades.shade600
+        borderColor: Colors.borders.light
       },
       onPress: () => onSelectSquaresCompetition(data.item)
     }, /*#__PURE__*/React.createElement(Image, {
@@ -245,27 +233,29 @@ const AdminCompetitionList = ({
         marginLeft: 10
       }
     }, /*#__PURE__*/React.createElement(Text, {
-      theme: "header_2"
+      theme: "h2"
     }, data.item.sq_comp_name), /*#__PURE__*/React.createElement(Text, {
       style: {
         marginTop: 3
       },
-      theme: "body"
+      theme: "description"
     }, data.item.sq_comp_description)), /*#__PURE__*/React.createElement(Icons.ChevronIcon, {
       direction: "right",
       size: 8,
-      color: Colors.brand.midnight
+      color: Colors.text.h1
     }));
   };
   const renderBrackets = data => {
     const competition_player_bracket = competition_player_brackets.find(cpb => cpb.bracket_competition_id == data.item.bracket_competition_id);
     const cl = data.item.market_type == 'FOR_MONEY' ? '$' : 'E';
-    return /*#__PURE__*/React.createElement(TouchableOpacity, {
+    return /*#__PURE__*/React.createElement(Button, {
       style: {
-        ...view_styles.body_row,
+        flexDirection: 'row',
+        alignItems: 'center',
+        borderRadius: 0,
         padding: 10,
         borderBottomWidth: 1,
-        borderColor: Colors.shades.shade600
+        borderColor: Colors.borders.light
       },
       onPress: () => onSelectBracketCompetition(data.item)
     }, /*#__PURE__*/React.createElement(Image, {
@@ -284,12 +274,12 @@ const AdminCompetitionList = ({
         marginLeft: 10
       }
     }, /*#__PURE__*/React.createElement(Text, {
-      theme: "header_2"
+      theme: "h2"
     }, data.item.competition_name), /*#__PURE__*/React.createElement(Text, {
       style: {
         marginTop: 3
       },
-      theme: "body"
+      theme: "description"
     }, data.item.competition_description)), competition_player_bracket ? /*#__PURE__*/React.createElement(View, {
       style: {
         marginRight: 10,
@@ -297,240 +287,369 @@ const AdminCompetitionList = ({
         justifyContent: 'center'
       }
     }, /*#__PURE__*/React.createElement(Text, {
-      size: 12,
-      color: Colors.brand.midnight,
-      weight: "bold",
-      textAlign: "center"
+      size: 12
     }, ManageCompetitionHelpers.formatPlace(competition_player_bracket.place)), /*#__PURE__*/React.createElement(Text, {
       size: 12,
-      color: Colors.brand.midnight,
-      textAlign: "center",
       style: {
         marginTop: 3
       }
     }, cl, competition_player_bracket.winnings.toFixed(2))) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(Icons.ChevronIcon, {
       direction: "right",
       size: 8,
-      color: Colors.brand.midnight
+      color: Colors.text.h1
     }));
   };
-  return /*#__PURE__*/React.createElement(View, {
-    style: {
-      maxWidth: width,
-      minWidth: 300,
-      minHeight: 400,
-      height: height,
-      backgroundColor: Colors.shades.white
-    }
-  }, /*#__PURE__*/React.createElement(View, {
-    style: {
-      ...view_styles.section_header
-    }
-  }, /*#__PURE__*/React.createElement(View, {
-    style: {
-      flex: 1
-    }
-  }, /*#__PURE__*/React.createElement(Text, {
-    theme: "header"
-  }, "MY ENGAGEMENTS"), /*#__PURE__*/React.createElement(Text, {
-    style: {
-      marginTop: 3
-    },
-    theme: "body"
-  }, "Use the buttons below to see your active and past engagements (competitions, brackets, squares, etc)"))), /*#__PURE__*/React.createElement(View, {
-    style: {
-      flexDirection: 'row',
-      margin: 10,
-      borderRadius: 22,
-      borderWidth: 4,
-      borderColor: Colors.shades.shade100
+  const renderSections = data => {
+    switch (data.item) {
+      case 'header':
+        return /*#__PURE__*/React.createElement(View, {
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 10,
+            ...header_style
+          }
+        }, /*#__PURE__*/React.createElement(View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/React.createElement(Text, {
+          theme: "h1"
+        }, "My Admin Engagements"), /*#__PURE__*/React.createElement(Text, {
+          theme: "description",
+          style: {
+            marginTop: 3
+          }
+        }, "Use the buttons below to see your active and past engagements (competitions, brackets, squares, etc)")), /*#__PURE__*/React.createElement(Button, {
+          title: "X",
+          float: true,
+          title_color: Colors.text.error,
+          onPress: () => onClose()
+        }));
+      case 'toggle':
+        return /*#__PURE__*/React.createElement(View, {
+          style: {
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(Toggle, {
+          options: [{
+            key: 'competitions',
+            label: 'Competitions'
+          }, {
+            key: 'squares',
+            label: 'Squares'
+          }, {
+            key: 'brackets',
+            label: 'Brackets'
+          }],
+          selected_option: active_engagement,
+          onSelectOption: o => setData({
+            ...list_data,
+            active_engagement: o
+          })
+        }));
+      case 'active_past_toggle':
+        return /*#__PURE__*/React.createElement(View, {
+          style: {
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(Toggle, {
+          options: [{
+            key: 'closed',
+            label: 'Closed'
+          }, {
+            key: 'active',
+            label: 'Active'
+          }],
+          selected_option: active_tab,
+          onSelectOption: o => setData({
+            ...list_data,
+            active_tab: o
+          })
+        }));
+      case 'pagination':
+        if (active_tab != 'closed') {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, {
+          transparent: true
+        }, /*#__PURE__*/React.createElement(Pagination, {
+          offset: offset,
+          onNext: () => getDataFromServer(offset + 1),
+          onPrevious: () => getDataFromServer(offset - 1)
+        }));
+      case 'loading':
+        if (!loading) {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, {
+          transparent: true
+        }, /*#__PURE__*/React.createElement(ActivityIndicator, {
+          style: {
+            alignSelf: 'center',
+            padding: 20
+          },
+          size: "large",
+          color: Colors.text.h1
+        }));
+      case 'admin_competitions':
+        if (active_engagement != 'competitions') {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        if (admin_competitions.length == 0) {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/React.createElement(Text, {
+          theme: "h1"
+        }, "Admin Competitions"), /*#__PURE__*/React.createElement(Text, {
+          theme: "description",
+          style: {
+            marginTop: 3
+          }
+        }, "Below are the competitions that you are the admin of")), /*#__PURE__*/React.createElement(Button, {
+          transparent: true,
+          onPress: () => setData({
+            ...list_data,
+            show_admin_competitions: !show_admin_competitions
+          })
+        }, /*#__PURE__*/React.createElement(Icons.ChevronIcon, {
+          size: 10,
+          direction: show_admin_competitions ? 'up' : 'down',
+          color: Colors.text.action
+        }))), show_admin_competitions ? /*#__PURE__*/React.createElement(FlatList, {
+          data: admin_competitions,
+          key: 'admin_comps_list',
+          keyExtractor: item => `admin_${item.competition_id}`,
+          renderItem: renderCompetitions
+        }) : /*#__PURE__*/React.createElement(React.Fragment, null));
+      case 'competitions':
+        if (active_engagement != 'competitions') {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        if (competitions.length == 0) {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/React.createElement(Text, {
+          theme: "h1"
+        }, "My Competitions"), /*#__PURE__*/React.createElement(Text, {
+          theme: "description",
+          style: {
+            marginTop: 3
+          }
+        }, "Below are the competitions that you have joined"))), /*#__PURE__*/React.createElement(FlatList, {
+          data: competitions,
+          key: 'competitions_list',
+          keyExtractor: item => item.competition_id.toString(),
+          renderItem: renderCompetitions
+        }));
+      case 'admin_squares':
+        if (active_engagement != 'squares') {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        if (admin_squares.length == 0) {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/React.createElement(Text, {
+          theme: "h1"
+        }, "Admin Squares Competitions"), /*#__PURE__*/React.createElement(Text, {
+          theme: "description",
+          style: {
+            marginTop: 3
+          }
+        }, "Below are the squares competitions that you are the admin of")), /*#__PURE__*/React.createElement(Button, {
+          transparent: true,
+          onPress: () => setData({
+            ...list_data,
+            show_admin_squares: !show_admin_squares
+          })
+        }, /*#__PURE__*/React.createElement(Icons.ChevronIcon, {
+          size: 10,
+          direction: show_admin_squares ? 'up' : 'down',
+          color: Colors.text.action
+        }))), show_admin_squares ? /*#__PURE__*/React.createElement(FlatList, {
+          data: admin_squares,
+          key: 'admin_squares_list',
+          keyExtractor: item => `admin_${item.sq_comp_id}`,
+          renderItem: renderSquares
+        }) : /*#__PURE__*/React.createElement(React.Fragment, null));
+      case 'squares':
+        if (active_engagement != 'squares') {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        if (squares_competitions.length == 0) {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/React.createElement(Text, {
+          theme: "h1"
+        }, "Squares Competitions"), /*#__PURE__*/React.createElement(Text, {
+          theme: "description",
+          style: {
+            marginTop: 3
+          }
+        }, "Below are the squares competitions that you are participating in"))), /*#__PURE__*/React.createElement(FlatList, {
+          data: squares_competitions,
+          key: 'squares_list',
+          keyExtractor: item => `${item.sq_comp_id}`,
+          renderItem: renderSquares
+        }));
+      case 'admin_brackets':
+        if (active_engagement != 'brackets') {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        if (admin_brackets.length == 0) {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/React.createElement(Text, {
+          theme: "h1"
+        }, "Admin Bracket Competitions"), /*#__PURE__*/React.createElement(Text, {
+          theme: "description",
+          style: {
+            marginTop: 3
+          }
+        }, "Below are the bracket competitions that you are the admin of")), /*#__PURE__*/React.createElement(Button, {
+          transparent: true,
+          onPress: () => setData({
+            ...list_data,
+            show_admin_brackets: !show_admin_brackets
+          })
+        }, /*#__PURE__*/React.createElement(Icons.ChevronIcon, {
+          size: 10,
+          direction: show_admin_brackets ? 'up' : 'down',
+          color: Colors.text.action
+        }))), show_admin_brackets ? /*#__PURE__*/React.createElement(FlatList, {
+          data: admin_brackets,
+          key: 'admin_brackets_list',
+          keyExtractor: item => `admin_${item.bracket_competition_id}`,
+          renderItem: renderBrackets
+        }) : /*#__PURE__*/React.createElement(React.Fragment, null));
+      case 'brackets':
+        if (active_engagement != 'brackets') {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        if (bracket_competitions.length == 0) {
+          return /*#__PURE__*/React.createElement(React.Fragment, null);
+        }
+        return /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, {
+          type: "header",
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            padding: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, {
+          transparent: true,
+          style: {
+            flex: 1
+          }
+        }, /*#__PURE__*/React.createElement(Text, {
+          theme: "h1"
+        }, "Bracket Competitions"), /*#__PURE__*/React.createElement(Text, {
+          theme: "description",
+          style: {
+            marginTop: 3
+          }
+        }, "Below are the bracket competitions that you have participated in"))), /*#__PURE__*/React.createElement(FlatList, {
+          data: bracket_competitions,
+          key: 'brackets_list',
+          keyExtractor: item => `${item.bracket_competition_id}`,
+          renderItem: renderBrackets
+        }));
+      default:
+        return /*#__PURE__*/React.createElement(React.Fragment, null);
     }
-  }, /*#__PURE__*/React.createElement(Button, {
-    title: "COMPETITIONS",
-    title_color: active_engagement == 'competitions' ? Colors.shades.white : Colors.brand.midnight,
-    backgroundColor: active_engagement == 'competitions' ? Colors.brand.midnight : Colors.shades.white,
-    title_weight: active_engagement == 'competitions' ? 'bold' : 'regular',
-    borderRadius: 0,
-    padding: 10,
-    style: {
-      flex: 1,
-      borderTopLeftRadius: 22,
-      borderBottomLeftRadius: 22
-    },
-    onPress: () => setData({
-      ...list_data,
-      active_engagement: 'competitions'
-    })
-  }), /*#__PURE__*/React.createElement(Button, {
-    title: "SQUARES",
-    title_color: active_engagement == 'squares' ? Colors.shades.white : Colors.brand.midnight,
-    backgroundColor: active_engagement == 'squares' ? Colors.brand.midnight : Colors.shades.white,
-    title_weight: active_engagement == 'squares' ? 'bold' : 'regular',
-    borderRadius: 0,
-    padding: 10,
+  };
+  return /*#__PURE__*/React.createElement(View, {
+    float: float,
     style: {
       flex: 1
-    },
-    onPress: () => setData({
-      ...list_data,
-      active_engagement: 'squares'
-    })
-  }), /*#__PURE__*/React.createElement(Button, {
-    title: "BRACKETS",
-    title_color: active_engagement == 'brackets' ? Colors.shades.white : Colors.brand.midnight,
-    backgroundColor: active_engagement == 'brackets' ? Colors.brand.midnight : Colors.shades.white,
-    title_weight: active_engagement == 'brackets' ? 'bold' : 'regular',
-    borderRadius: 0,
-    padding: 10,
-    style: {
-      flex: 1,
-      borderTopRightRadius: 22,
-      borderBottomRightRadius: 22
-    },
-    onPress: () => setData({
-      ...list_data,
-      active_engagement: 'brackets'
-    })
-  })), /*#__PURE__*/React.createElement(ScrollView, {
-    style: {
-      ...view_styles.section_body,
-      padding: 0
-    }
-  }, /*#__PURE__*/React.createElement(View, {
-    style: {
-      ...view_styles.section_header,
-      backgroundColor: Colors.shades.shade100
     }
   }, /*#__PURE__*/React.createElement(View, {
-    style: {
-      flex: 1,
-      marginRight: 10
-    }
-  }, /*#__PURE__*/React.createElement(Text, {
-    theme: "header"
-  }, "Showing ", active_tab, " ", active_engagement), /*#__PURE__*/React.createElement(Text, {
-    style: {
-      marginTop: 3
-    },
-    theme: "body"
-  }, "Use the toggle to the right to see active / closed engagements")), /*#__PURE__*/React.createElement(View, {
-    style: {
-      flexDirection: 'row'
-    }
-  }, /*#__PURE__*/React.createElement(Button, {
-    title: "ACTIVE",
-    title_color: active_tab == 'active' ? Colors.shades.white : Colors.brand.midnight,
-    backgroundColor: active_tab == 'active' ? Colors.utility.success : Colors.shades.white,
-    title_weight: active_tab == 'active' ? 'bold' : 'regular',
-    borderRadius: 0,
-    style: {
-      borderTopLeftRadius: 22,
-      borderBottomLeftRadius: 22
-    },
-    padding: 10,
-    onPress: () => setData({
-      ...list_data,
-      active_tab: 'active'
-    })
-  }), /*#__PURE__*/React.createElement(Button, {
-    title: "CLOSED",
-    title_color: active_tab == 'closed' ? Colors.shades.white : Colors.brand.midnight,
-    backgroundColor: active_tab == 'closed' ? Colors.utility.error : Colors.shades.white,
-    title_weight: active_tab == 'closed' ? 'bold' : 'regular',
-    borderRadius: 0,
-    padding: 10,
-    style: {
-      borderTopRightRadius: 22,
-      borderBottomRightRadius: 22
-    },
-    onPress: () => setData({
-      ...list_data,
-      active_tab: 'closed'
-    })
-  }))), active_tab == 'closed' ? /*#__PURE__*/React.createElement(View, {
-    style: {
-      ...view_styles.section_footer
-    }
-  }, offset > 0 ? /*#__PURE__*/React.createElement(Button, {
-    title: "PREV",
-    title_color: Colors.brand.electric,
-    backgroundColor: "transparent",
-    onPress: () => getDataFromServer(offset - 1)
-  }) : /*#__PURE__*/React.createElement(View, null), /*#__PURE__*/React.createElement(View, {
+    transparent: true,
     style: {
       flex: 1
     }
-  }), /*#__PURE__*/React.createElement(Button, {
-    title: "NEXT",
-    title_color: Colors.brand.electric,
-    backgroundColor: "transparent",
-    onPress: () => getDataFromServer(offset + 1)
-  })) : /*#__PURE__*/React.createElement(React.Fragment, null), loading ? /*#__PURE__*/React.createElement(ActivityIndicator, {
-    style: {
-      padding: 20,
-      alignSelf: 'center'
-    },
-    size: "large",
-    color: Colors.brand.midnight
-  }) : /*#__PURE__*/React.createElement(React.Fragment, null), active_engagement == 'competitions' ? /*#__PURE__*/React.createElement(View, null, admin_competitions.length > 0 ? /*#__PURE__*/React.createElement(View, {
+  }, /*#__PURE__*/React.createElement(FlatList, {
+    data: sections,
+    key: 'admin_list',
+    keyExtractor: item => item,
+    renderItem: renderSections
+  })), /*#__PURE__*/React.createElement(View, {
+    type: "footer",
     style: {
+      flexDirection: 'row',
+      alignItems: 'center',
       padding: 10,
-      backgroundColor: Colors.incentive.gold_faded
-    }
-  }, /*#__PURE__*/React.createElement(View, {
-    style: {
-      padding: 10
-    }
-  }, /*#__PURE__*/React.createElement(Text, {
-    theme: "header_2"
-  }, "Admin Competitions"), /*#__PURE__*/React.createElement(Text, {
-    style: {
-      marginTop: 4
-    },
-    theme: "body"
-  }, "These are the competitions you are an admin of")), /*#__PURE__*/React.createElement(FlatList, {
-    key: "admin_competition",
-    data: admin_competitions,
-    horizontal: true,
-    renderItem: renderAdminCompetitions,
-    keyExtractor: item => item.competition_id.toString()
-  })) : /*#__PURE__*/React.createElement(React.Fragment, null), /*#__PURE__*/React.createElement(FlatList, {
-    key: 'my_competitions',
-    data: competitions,
-    renderItem: renderCompetitions,
-    keyExtractor: item => item.competition_id.toString()
-  })) : active_engagement == 'brackets' ? /*#__PURE__*/React.createElement(FlatList, {
-    data: bracket_competitions,
-    renderItem: renderBrackets,
-    keyExtractor: item => item.bracket_competition_id.toString()
-  }) : active_engagement == 'squares' ? /*#__PURE__*/React.createElement(FlatList, {
-    data: squares_competitions,
-    renderItem: renderSquares,
-    keyExtractor: item => item.sq_comp_id.toString()
-  }) : /*#__PURE__*/React.createElement(React.Fragment, null)), /*#__PURE__*/React.createElement(View, {
-    style: {
-      ...view_styles.section_footer
+      ...footer_style
     }
   }, /*#__PURE__*/React.createElement(Button, {
-    title: "CREATE NEW",
     style: {
-      flex: 1,
-      marginRight: 5
-    },
-    title_color: Colors.shades.white,
-    backgroundColor: Colors.utility.success,
-    padding: 15,
-    onPress: () => onCreateNew(active_engagement)
-  }), /*#__PURE__*/React.createElement(Button, {
-    title: "CLOSE",
-    title_color: Colors.shades.white,
-    style: {
-      flex: 2,
-      marginRight: 8
+      flex: 1
     },
-    padding: 15,
-    backgroundColor: Colors.utility.error,
-    onPress: () => onClose()
+    onPress: () => onCreateNew(active_engagement),
+    type: "success",
+    title: "CREATE NEW ENGAGEMENT"
   })));
 };
 export default AdminCompetitionList;