Microsoft Graph PeoplePicker sending bad query to Graph when using peopleFilters

Question

I'm using the v2 version of PeoplePicker in a React app and running into an issue where any use of the "peopleFilters" property results in sending invalid queries to Microsoft Graph.

Since the query breaks every time I use any peopleFilters value at all, and filtering seems like a pretty common use case, I hesitate to believe that this is a bug that nobody's ever noticed, and prefer to think that I'm just doing something wrong on my end but ¯\(ツ)/¯.

Here's an example: When I set peopleFilters = "personType/subclass eq 'OrganizationUser'" and type "Joe" in the PeoplePicker box, here's the query it sends ...

https://graph.microsoft.com/v1.0/me/people?$search=%22joe%20%22&$top=6&$filter=personType/class%20eq%20%27Person%27personType/class%20eq%20%27Person%27%20and%20personType/subclass%20eq%20%27OrganizationUser%27

And here it is again, URL-decoded for readability:

https://graph.microsoft.com/v1.0/me/people?$search="joe "&$top=6&$filter=personType/class eq 'Person'personType/class eq 'Person' and personType/subclass eq 'OrganizationUser'

The problem is in the filter. Notice where it says "personType/class eq 'Person'personType/class eq 'Person'" ... there should be an "and" between "'Person'" and "person." In other words, it goes something like this:

• The first "personType/class eq 'Person'" comes from a default. If you don't tell the control what type of search to use, it uses a "person" search by default.
• The second "personType/class eq 'Person'" comes from adding any peopleFilter at all. It assumes (rightly) that if you're using a peopleFilter, then you're looking at person records.
• The "and personType/subclass eq 'OrganizationUser'" comes from the explicit peopleFilter that I'm setting.

So it's smart enough to put an "and" in between the second bit and the third bit, but not smart enough to put one between the first and second bits ... and that breaks the query.

Here's the code for my control if that helps:

          <PeoplePicker
            selectionChanged={handleSelectionChanged}
            selectedPeople={users} 
            disableImages='true'
            showPresence='false'
            selectionMode='single'                
            peopleFilters="personType/subclass eq 'OrganizationUser'"
          />

Any idea why this is happening and how I can "fix" it?

Thanks.