Search code examples
javascriptarraysfilterlodash

Filter one array based on property of another array


I do have 2 collections - events and bookings. enter image description here

Events contain a collection of events. Bookings collection contain just the eventId of the event which we need to book and the current loggedin user.

I got the events which was not booked, using lodash

  const results = _.differenceWith(
          eventsArr,
          bookingArr,
          (event, booking) => event.id == booking.eventId
        );

How do we select the booked events? I was tying to filter the events array based on the eventID of the other array, but didnt work!

Any ideas will be of great help!

EDIT: Adding the structure too, ( and thanks for the quick help, adding full structure of that can help another person, also the backend was firebase )

The events array

{
  "-LWSkZgZ-e84Aq7EnvOo" : {
    "date" : "January 17",
    "description" : "Lorem ipsum dolor amet fashion axe cray pour-over green juice. Salvia everyday carry viral, PBR&B pop-up polaroid direct trade gochujang hot chicken disrupt gentrify quinoa crucifix pabst cred. ",
    "imageUrl" : "https://images.pexels.com/photos/1047940/pexels-photo-1047940.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=500&w=500",
    "location" : {
      "lat" : 77.88,
      "lng" : 66.65,
      "name" : "Texas CA"
    },
    "name" : "MetalBone",
    "ticketsAvailable" : true
  },
  "-LWSkbMLqDlpTgcgFHy2" : {
    "date" : "January 18",
    "description" : "Mlkshk brooklyn gastropub paleo bicycle rights. Man bun brunch helvetica food truck whatever tousled vegan vinyl pug cred mumblecore. ",
    "imageUrl" : "https://images.pexels.com/photos/849/people-festival-party-dancing.jpg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=500&w=500",
    "location" : {
      "lat" : 32.77,
      "lng" : 96.7,
      "name" : "Dallas SF"
    },
    "name" : "Big Day Out",
    "ticketsAvailable" : true
  },

The bookings array

{
  "-LWdae8S33xrHfLetvT7" : {
    "eventId" : "-LWSkZgZ-e84Aq7EnvOo",
    "userMail" : "[email protected]"
  },
  "-LWdj2UDTwVV6_71Bcyd" : {
    "eventId" : "-LWTraS93uC37S21syqP",
    "userMail" : "[email protected]"
  }
}

Solution

  • You can use _.intersectionWith() to find events/bookings with common id:

    const results = _.intersectionWith(
      eventsArr,
      bookingArr,
      (event, booking) => event.id === booking.eventId
    );
    

    This example takes, the data you've added, converts it to an array format, and uses _intersectionWith() to find booked events:

    const events = {"-LWSkZgZ-e84Aq7EnvOo":{"date":"January 17","description":"Lorem ipsum dolor amet fashion axe cray pour-over green juice. Salvia everyday carry viral, PBR&B pop-up polaroid direct trade gochujang hot chicken disrupt gentrify quinoa crucifix pabst cred. ","imageUrl":"https://images.pexels.com/photos/1047940/pexels-photo-1047940.jpeg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=500&w=500","location":{"lat":77.88,"lng":66.65,"name":"Texas CA"},"name":"MetalBone","ticketsAvailable":true},"-LWSkbMLqDlpTgcgFHy2":{"date":"January 18","description":"Mlkshk brooklyn gastropub paleo bicycle rights. Man bun brunch helvetica food truck whatever tousled vegan vinyl pug cred mumblecore. ","imageUrl":"https://images.pexels.com/photos/849/people-festival-party-dancing.jpg?auto=compress&cs=tinysrgb&dpr=1&fit=crop&h=500&w=500","location":{"lat":32.77,"lng":96.7,"name":"Dallas SF"},"name":"Big Day Out","ticketsAvailable":true}}
    
    const bookings = {"-LWdae8S33xrHfLetvT7":{"eventId":"-LWSkZgZ-e84Aq7EnvOo","userMail":"[email protected]"},"-LWdj2UDTwVV6_71Bcyd":{"eventId":"-LWTraS93uC37S21syqP","userMail":"[email protected]"}}
    
    const result = _.intersectionWith(
      _.map(events, (v, id) => ({ id, ...v })),
      _.values(bookings),
      (event, booking) => event.id == booking.eventId
    )
    
    console.log(result)
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>