The filtering currently uses up three variables, filterField, filterQuery, and filterUserState. The only thing that currently links these variables is the name, rather than being in an object of their own to link them systematically. Doing this avoids any ambiguity as to whether they are related to the same component or just coincidentally the same. In the data object, create a new object titled filter and move each variable inside:
data: { people: [..], currency: '$', filter: { field: '', query: '', userState: '', } }
To access the data, update any references of filterField to this.filter.field. Note the extra dot, denoting it is a key of the filter object. Don't forget to update ...
