All files / widgets/EventDataTable/mobile/components CompetitionTemplate.native.tsx

15.38% Statements 2/13
0% Branches 0/27
0% Functions 0/4
15.38% Lines 2/13

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71                    1x   1x                                                                                                                    
import { useEventTable } from '../../context/EventTableContext';
import { Bell, BellEmpty, Star, StarFill, VerticalBar } from '@sb/ui/components/atoms/Icons/mobile/Icons.native';
import { Dimensions, Pressable, Text, View } from 'react-native';
import { useTheme } from '@sb/ui/components/Themes/ThemeProvider';
import { colors } from '@sb/styles/colors';
import DisplayTeams from './DisplayTeams.native';
import { MatchSchedule, MatchScoreView } from './MatchSubComponents.native';
import React from 'react';
import { Match } from '@sb/types';
 
const { width } = Dimensions.get('screen');
 
const CompetitionTemplate = ({
  item,
  marketTypeFilter,
}: {
  item: Match;
  marketTypeFilter?: string;
}) => {
  const sides = useEventTable();
  const { theme } = useTheme();
 
  const isFavorite = sides.isFavorite.includes(item.id);
  const isAlarmActive = sides.activeTorAlarm.includes(item.id);
 
  const onAlarmPress = () => {
    sides.addTorAlarm(item.id);
  };
 
  const showMatchData = !marketTypeFilter || marketTypeFilter !== 'TIPP';
 
  return (
    <View className="flex flex-row items-center justify-between" style={{ width: width / 1.75 }}>
      <View className={'flex flex-row items-center'}>
        {sides.favorite || sides.topAlarm ? (
          <View className="left-0 flex flex-col items-center justify-start bg-white/15 py-1">
            {sides.favorite && (
              <Pressable onPress={() => sides.handleOnFavoriteClick(item.id)}>
                {isFavorite ? <StarFill color={colors[theme].colorAccent} /> : <Star />}
              </Pressable>
            )}
            {sides.topAlarm && (
              <Pressable
                onPress={(e) => {
                  e.stopPropagation();
                  onAlarmPress();
                }}
              >
                {isAlarmActive ? <Bell color={colors[theme].colorAccent} /> : <BellEmpty />}
              </Pressable>
            )}
          </View>
        ) : null}
        <DisplayTeams item={item} favorite={sides.favorite} topAlarm={sides.topAlarm} />
      </View>
      <View className={'flex flex-row items-center'}>
        {showMatchData && item.sessions && (
          <Text className={'text-text-main pr-1 font-normal'}>{item.sessions}</Text>
        )}
        {item.showGraph && <VerticalBar className="h-6 w-6" />}
        {showMatchData && item.matchScores && <MatchScoreView score={item.matchScores} />}
        {(!item.matchScores || marketTypeFilter === 'TIPP') && item.time && item.date && (
          <MatchSchedule scheduleFor={item.date} time={item.time} />
        )}
      </View>
    </View>
  );
};
 
export default CompetitionTemplate;