Почему не правильно работает scrollView?

Question

[Sneiksus]

Lessonlist в компоненте app отображает список пар, если их много то работает прокрутка но не показывет все элементы.То есть какой то элемент остается внизу и его видно только на половину.При изменении высоты lessonlist начинает изменятся также высота компонента dataslider.Где может быть проблема?

app

return (
    <View style={styles.container}>
      <StatusBar style="auto" />
      <View style={styles.today}>
        <Moment element={Text} style={styles.today_day} format='D'></Moment>
        <View style={styles.today_column}>
          <Moment element={Text} style={styles.today_day_week} format='dddd'></Moment>
          <Moment element={Text} style={styles.today_month_year} format='MMMM YYYY'></Moment>
        </View>
      </View>
      <View>
          <DateSlider data={Lessons} index={index} setIndex={setIndex} />
          <LessonList data={Lessons} index={index} setIndex={setIndex} />
      </View>
    </View>
  );

lessonList

import React from 'react';
import { StyleSheet, Text, View, FlatList, Dimensions, ScrollView } from 'react-native'
import AntDesign from '@expo/vector-icons/AntDesign';

const { width, height } = Dimensions.get('screen');

const LessonList = ({ data, index, setIndex }) => {
  const lessonsRef = React.useRef<FlatList>();

  React.useEffect(() => {
    lessonsRef.current?.scrollToOffset({
      offset: index * width,
      animated: true,
    });
  }, [index]);

  return (
    <FlatList
      ref={lessonsRef}
      initialNumToRender={1}
      initialScrollIndex={index}
      data={data.days}
      maxToRenderPerBatch={3}
      keyExtractor={(item) => item.date}
      getItemLayout={(data, index) => ({
        length: width,
        offset: width * index,
        index,
      })}
      onMomentumScrollEnd={(ev) => {
        setIndex(Math.floor(Math.floor(ev.nativeEvent.contentOffset.x) / Math.floor(width)));
      }}
      horizontal
      pagingEnabled
      showsHorizontalScrollIndicator={false}
      renderItem={({ item }) => {
        return (
          <FlatList
            data={item.lessons}
            keyExtractor={(item) => item.id}
            showsVerticalScrollIndicator={false}
            scrollEnabled={true}
            style={styles.lessons_scrollview}
            renderItem={({ item }) => {
              return (
                <View style={styles.lessons}>
                  <View style={styles.lesson_time}>
                    <Text style={styles.lesson_time_list_text}>
                      {item.starttime}
                    </Text>
                    <Text style={styles.lesson_time_end_list_text}>
                      {item.endtime}
                    </Text>
                  </View>
                  <View style={styles.lesson_card}>
                    <Text style={styles.lesson_card_name}>{item.name}</Text>
                    <Text style={styles.lesson_card_description}>
                      {item.description}
                    </Text>
                    <Text style={styles.lesson_card_locate}>
                      <AntDesign name="enviromento" size={16} color="white" />
                      {item.location}
                    </Text>
                    <Text style={styles.lesson_card_teacher}>
                      <AntDesign name="user" size={16} color="white" />
                      {item.teacher}
                    </Text>
                  </View>
                </View>
                
              );
            }}
          />
        );
      }}
    />
  );
};

const styles = StyleSheet.create({
  lessons_scrollview: {
    paddingHorizontal: 15,
    paddingTop: 5,
    width: width,
  },
  lessons: {
    flexDirection: "row",
  },
  lesson_time_text: {
    fontFamily: "eUkraineBold",
    fontSize: 9,
    paddingRight: 30,
    color: "#BCC1CD",
  },
  lesson_time: {
    flexDirection: "column",
    paddingRight: 9,
    borderRightWidth: 1,
    borderRightColor: "#FAF9F9",
  },
  lessons_text: {
    fontFamily: "eUkraineBold",
    fontSize: 9,
    color: "#BCC1CD",
  },
  lesson_time_list: {
    flexDirection: "column",
    paddingTop: 14,
  },
  lesson_time_list_text: {
    fontFamily: "eUkraineMedium",
    fontSize: 14,
  },
  lesson_time_end_list_text: {
    fontFamily: "eUkraineMedium",
    fontSize: 14,
    color: "#BCC1CD",
  },
  lesson_card: {
    flexDirection: "column",
    marginLeft: 16,
    backgroundColor: "#4DC591",
    borderRadius: 16,
    paddingTop: 16,
    paddingLeft: 16,
    paddingBottom: 17,
    flex: 1,
    marginBottom: 16,
  },
  lesson_card_name: {
    fontFamily: "eUkraineBold",
    fontSize: 13,
    color: "#ffff",
  },
  lesson_card_description: {
    fontFamily: "eUkraineMedium",
    fontSize: 10,
    paddingTop: 4,
    color: "#ffff",
  },
  lesson_card_locate_img: {
    height: 16,
    width: 16,
    marginRight: 50,
    tintColor: "#FFFFFF",
  },
  lesson_card_locate: {
    fontFamily: "eUkraineRegular",
    fontSize: 10,
    paddingTop: 15,
    color: "#ffff",
  },
  lesson_card_teacher: {
    fontFamily: "eUkraineRegular",
    fontSize: 10,
    paddingTop: 3,
    color: "#ffff",
  },
});

export default LessonList