Trying to filter array of object based on returned values

Question

I have this TypeScript array of objects which I want to filter,

const test: any[] = [
  {agency: 'SOME AGENCY 1', id: '1', association: '2433982101'},
  {agency: 'SOME AGENCY 1', id: '2', association: '2433982101'},
  {agency: 'SOME AGENCY 1', id: '3', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '4', association: '2433982101'},
  {agency: 'SOME AGENCY 2', id: '5', association: '2433982101'},
  {agency: 'SOME AGENCY 2', id: '6', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '7', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '8', association: '2102923701'},
  {agency: 'SOME AGENCY 3', id: '9', association: '2433982101'},
  {agency: 'SOME AGENCY 3', id: '10', association: '2433982101'},
  {agency: 'SOME AGENCY 3', id: '11', association: '1917852501'}
]

Trying to filter data from above array using these below values I am getting in onChange callback function,

onChange = (agency: string) => (
    association: string[]
  ) => {

}
// I am getting these values in callback
// agency = 'SOME AGENCY 2'
// association = ['2433982101', '2102923701']

// OR in another case
// agency = 'SOME AGENCY 1'
// association = ['2433982101']

I am trying to remove any values which were not returned in association array for the particular agency in callback. I have tried to filter the array by doing something like this,

onChange = (agency: string) => (
    association: string[]
  ) => {
      const filteredData = test.filter(t =>
        association.some(a => a === t.association && t.agency === agency)
      );
      console.log('Filtered Data: ', filteredData);
}

For example, in this case 1 here,

// agency = 'SOME AGENCY 2'
// association = ['2433982101', '2102923701']

This is what I am getting in filteredData:

Filtered Data:
      [
        {agency: "SOME AGENCY 2", id: "4", association: "2433982101"},
        {agency: "SOME AGENCY 2", id: "5", association: "2433982101"},
        {agency: "SOME AGENCY 2", id: "8", association: "2102923701"}
      ]

So these two got eliminated, which is correct:

  {agency: 'SOME AGENCY 2', id: '6', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '7', association: '1917874801'}

But I am expecting output like this instead of what I actually got. In here, I only want items with id="6" and "7" removed from 'test' array for the given example case 1

[
  {agency: 'SOME AGENCY 1', id: '1', association: '2433982101'},
  {agency: 'SOME AGENCY 1', id: '2', association: '2433982101'},
  {agency: 'SOME AGENCY 1', id: '3', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '4', association: '2433982101'},
  {agency: 'SOME AGENCY 2', id: '5', association: '2433982101'},
  {agency: 'SOME AGENCY 2', id: '8', association: '2102923701'},
  {agency: 'SOME AGENCY 3', id: '9', association: '2433982101'},
  {agency: 'SOME AGENCY 3', id: '10', association: '2433982101'},
  {agency: 'SOME AGENCY 3', id: '11', association: '1917852501'}
]

So to put it simply here, I am trying remove any items from 'test' array which are not included in string of association array for the particular agency meanwhile keeping all other agency and association data as it is but I am not sure how to exactly get this.

I tried searching this same issue but I was not able to find something similar to this. I am sorry if this type of issue has been answered previously but if anyone could help me that would be great.

Will try to get reproducible demo link and edit it if needed so it will be easy to understand what I am trying to achieve here exactly.

Reproducible demo link: https://codesandbox.io/s/cool-resonance-drv0i

What I want here exactly is to display data in table only from selected checkbox association numbers so if I select or deselect from any of the boxes, previously selected/deselected data from other boxes should not disappear.

Answer 1

If you want to filter only by passed - in association array, you should do it siimple:

const test = [
  {agency: 'SOME AGENCY 1', id: '1', association: '2433982101'},
  {agency: 'SOME AGENCY 1', id: '2', association: '2433982101'},
  {agency: 'SOME AGENCY 1', id: '3', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '4', association: '2433982101'},
  {agency: 'SOME AGENCY 2', id: '5', association: '2433982101'},
  {agency: 'SOME AGENCY 2', id: '6', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '7', association: '1917874801'},
  {agency: 'SOME AGENCY 2', id: '8', association: '2102923701'},
  {agency: 'SOME AGENCY 3', id: '9', association: '2433982101'},
  {agency: 'SOME AGENCY 3', id: '10', association: '2433982101'},
  {agency: 'SOME AGENCY 3', id: '11', association: '1917852501'}
];

  onChange = (agency: string) => (association: string[]) => {
      const filteredData = test.filter(t => 
        (agency === t.agency) ? association.includes(t.association) : t
      );
      console.log('Filtered Data: ', filteredData);
};

onChange('SOME AGENCY 2')(['2433982101', '2102923701']);

[ { agency: 'SOME AGENCY 1', id: '1', association: '2433982101' },
{agency: 'SOME AGENCY 1', id: '2', association: '2433982101' },
{agency: 'SOME AGENCY 1', id: '3', association: '1917874801' },
{agency: 'SOME AGENCY 2', id: '4', association: '2433982101' },
{agency: 'SOME AGENCY 2', id: '5', association: '2433982101' },
{agency: 'SOME AGENCY 2', id: '8', association: '2102923701' },
{agency: 'SOME AGENCY 3', id: '9', association: '2433982101' },
{agency: 'SOME AGENCY 3', id: '10', association: '2433982101' },
{agency: 'SOME AGENCY 3', id: '11', association: '1917852501' } ]

Answer 2

To obtain the expected filter behavior, remove the t.agency === agency crtiera to include only items that have asscoations in the specified association list:

const onChange = (agency: string) => (association: string[]) => {

  const filteredData = test.filter(t => association.some(a => a === t.association));
  console.log('Filtered Data: ', filteredData);
}

onChange('SOME AGENCY 2')(['2433982101', '2102923701'])

Here's a working example for you to try