View is shaking by no reason on React Native iOS

I have detected a weird behaviour in the RN app I'm developing. By no reason apparently, one of the components of the screen starts to shake when refresh the app. This happens both on iOS simulator and iPhone device. It does not happen every time I refresh, but most of the time, and when it happens the simulator becomes unresponsive.

Here is the GIF of what happens: https://gph.is/g/EvAqBgg

Here is the code of the screen and the shaking component:

Screen

<Container>
      <SafeAreaView />
      <Header>
        <TouchableOpacity onPress={() => navigation.openDrawer()}>
          <MaterialIcons name="menu" size={24} color="black" />
        </TouchableOpacity>
        <TouchableOpacity onPress={() => navigation.navigate('Filter')}>
          <MaterialIcons name="search" size={24} color="black" />
        </TouchableOpacity>
      </Header>
      <FlatList
        data={products}
        renderItem={({ item }) => (
          <ProductItem
            product={item}
            onPress={() => navigation.navigate('Product', { product: item })}
          />
        )}
        keyExtractor={(item) => item.id}
        numColumns={2}
        ListEmptyComponent={() => <Text>No hay elementos</Text>}
        ListHeaderComponent={<HomeHeader />}
      ></FlatList>
      <ShoppingCartButton
        items={itemsInCart}
        onPress={() => navigation.navigate('ShoppingCart')}
        price={price}
      ></ShoppingCartButton>
    </Container>
  );
}

const Container = styled.View`
  flex: 1;
  align-items: center;
  justify-content: center;
  background-color: white;
`;

const Header = styled.View`
  width: 100%;
  height: 40px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding-left: 16px;
  padding-right: 16px;
`;

Shaking component

export default function ShoppingCartButton({ onPress, price, items }) {
  return (
    <ButtonArea>
      <Container onPress={onPress}>
        <CartIndicator>
          <CartQuantity>{items}</CartQuantity>
        </CartIndicator>
        <ButtonTitle>Ver carrito</ButtonTitle>
        <Price>{price} €</Price>
      </Container>
      <SafeAreaView />
    </ButtonArea>
  );
}

const ButtonArea = styled.View`
  width: 100%;
  padding: 16px;
  border-top-width: 1px;
  border-top-color: ${colors.separatorGrey};
  background-color: ${colors.white};
  box-shadow: 0px -4px 4px rgba(222, 222, 222, 0.2);
`;

const Container = styled.TouchableOpacity`
  height: 48px;
  width: 100%;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  background-color: ${colors.mainBlue};
  border-radius: 5px;
  padding-left: 16px;
  padding-right: 16px;
`;

const CartIndicator = styled.View`
  background-color: #2c81ab;
  padding: 4px;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 3px;
`;

const CartQuantity = styled.Text`
  font-family: 'Medium';
  color: ${colors.white};
`;

const ButtonTitle = styled.Text`
  font-family: 'Medium';
  color: ${colors.white};
`;

const Price = styled.Text`
  font-family: 'Book';
  color: ${colors.white};
`;