CODEWITHSUNDEEP
javascriptsearch
lecham
lecham

Reputation: 2464

JS: Nested array of objects search - section list format

I have such an array in section list format:

const sectionList = [
  {
    caption: 'caption1',
    data: [
      {
        id: '1',
        title: 'Payment',
        description: 'Pay info',
      },
      {
        id: '2',
        title: 'Refund',
        description:
          'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corporis, sapiente quasi obcaecati quae totam consequatur cum, perspiciatis pariatur !',
      },
      {
        id: '3',
        title: 'Mobs',
        description:
          'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corpori!',
      },
      {
        id: '4',
        title: 'test',
        description:
          'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla',
      },
    ],
  },
  {
    caption: 'caption2',
    data: [
      {
        id: '5',
        title:
          'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Recusandae eveniet?',
        description: 'Custom desc',
      },
    ],
  },
];


// const query = "Custom desc"; // Works fine
const query = 'Lorem ipsum' // Not working

const res = sectionList.filter(d => d.data.every(c => query.includes(c.description)));

console.log(res);

Expected
//  [
//   {
//     caption: 'caption1',
//     data: [
//       {
//         id: '2',
//         title: 'Refund',
//         description:
//           'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corporis, sapiente quasi obcaecati quae totam consequatur cum, perspiciatis pariatur !',
//       },
//       {
//         id: '3',
//         title: 'Mobs',
//         description:
//           'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corpori!',
//       },
//       {
//         id: '4',
//         title: 'test',
//         description:
//           'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla',
//       },
//     ],
//   }
// ];

Basically, I need to implement simple search in nested data and return results. However, I cannot figure out how to polish my solution.

If I search for 'Lorem ipsum', I'm not getting any results.

How should I updated my current solution? Thanks!

Upvotes: 0

Views: 95

Answers (1)

pilchard
pilchard

Reputation: 12948

You need to filter the inner arrays separately from the outer array. Here checking for inclusion of the query on the inner arrays and then filtering the result to remove empty arrays.

The reason it worked for const query = "Custom desc"; is that only one array had an element in it that matched the condition and it was the only element in the array.

const sectionList = [{ caption: 'caption1', data: [{ id: '1', title: 'Payment', description: 'Pay info', }, { id: '2', title: 'Refund', description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corporis, sapiente quasi obcaecati quae totam consequatur cum, perspiciatis pariatur !', }, { id: '3', title: 'Mobs', description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla asperiores corpori!', }, { id: '4', title: 'test', description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta et ipsam voluptate commodi nulla', },], }, { caption: 'caption2', data: [{ id: '5', title: 'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Recusandae eveniet?', description: 'Custom desc', },], },];

const query = 'Lorem ipsum' // Not working

const res = sectionList
  .map(d => ({ ...d, data: d.data.filter(c => c.description.includes(query)) }))
  .filter(d => d.data.length)

console.log(res);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Upvotes: 2

Related Questions