Групировать одинаковые items во flatlist

Как групировать одинаковые items во flatlist, или не выводить повторы даты и задания например, или чем другим реализовать подобную задачу?

const DATA = [
    {
        id: 'bd7acbea-c1b1-46c2-aed5-3ad53abb28ba',
        date: 'Thursday 10 December 2020р',
        title: 'WORK1',
        firm: 'John',
        type: 'todo',
    },
    {
        id: 'bd7acbea-c1b1-46c2-aed5-5ad53abb28ba',
        date: 'Thursday 10 December 2020р',
        title: 'WORK1',
        firm: 'Dan',
        type: 'todo',
    },
    {
        id: '3ac68afc-c605-48d3-a4f8-fbd91aa97f63',
        date: 'Thursday 10 December 2020р',
        title: 'WORK2',
        firm: 'Dan',
        type: 'todo',
    },
    {
        id: '3ac68afc-c605-48d3-a4f8-f3d91aa97f63',
        date: 'Friday 11 December 2020р',
        title: 'WORK2',
        firm: 'Dan',
        type: 'todo',
    },
];

const DateItem = ({date}) => (
    <View style={styles.date}>
        <Text style={styles.dateText}>{date}</Text>
    </View>
)

const TitleItem = ({title}) => (
    <View style={styles.title}>
        <Text style={styles.titleText}>{title}</Text>
    </View>
)
const FirmItem = ({firm}) => (
    <View style={styles.firm}>
        <Text style={styles.firmText}>{firm}</Text>
    </View>
)

const renderItems = ({ item }) => {
    return(
        <View style={styles.item}>
            <DateItem date={item.date} />
            <TitleItem title={item.title} />
            <FirmItem firm={item.firm} />
        </View>
    );
}
const  FlatListItemSeparator = () => {
    return (
      <View
        style={{
          height: 1,
          width: "100%",
          backgroundColor: "#000",
        }}
      />
    );
  }

const ToDoScreen = (props) => {
    return (
        <SafeAreaView style={styles.container}>
            <FlatList
                data={DATA}
                renderItem={renderItems}
                ItemSeparatorComponent = { FlatListItemSeparator }
                keyExtractor={item => item.id}
            />
        </SafeAreaView>
    )
}


сейчас сейчас

должно быть должно быть


Ответы (0 шт):