React - Search Directory - Additional options like: Adding more filtering or sorting capabilities

[Trevino-Valerie]

Sample

https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-directory

Author(s)

@petkir and @sudharsank

Suggestion

We have added the react - search directory component into our site, but I am searching for ways to add additional features/options like:

a feature to have the option to point to M365 or Azure AD or Both
add more than one filter/sort
Is there a way to filter inactive employees
A way to assign certain tags to the job titles, like we do for our other search functions? MarComm, MarCom, Marketing and Communications, MarCom Administration, etc

Are you willing to help?

Yes

[ghost]

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

[mariaarcena]

Hello everyone and/or anyone! To break down the list above:

1. a feature to have the option to point to M365 or Azure AD or Both?
2. add more than one filter/sort?
3. is there a way to filter inactive employees?
4. a way to assign certain tags to the job titles, like we do for our other search functions?

If we can concentrate requests 1 and 2, will someone be able to take a look at this? 😊 I also understand the authors and contributors can be quite busy as well so any tips and pointers where we should start looking into for requests 1 and 2 will be appreciated!

Like for 1, is there a specific thing we should be googling for?(I looked into the source code and googled a couple things and no luck so far 😔) Same thing for 2!

Hope any of the authors and/or contributors as well as the lurkers can help or give advice! (I will also be copy pasting this within the forum post!) ✨

[petkir]

Hi @Trevino-Valerie, Hi @mariaarcena

for 1. ) it is possible to make a Switch to change from SpService to a Graph Service:

• implement a Graph Service for the interface ISPServices
• For Graph API Access you have to add in the package-solution.json some webApiPermissionRequests

for 2.) It is possible, but you have to look that all two Services have the same capacity of filtering/sorting

• The easiest way is to implement clientside Sorting
• for Filtering, I would prefer a Solution where filtering is made in the Service Endpoint

for 3.) As Far I know Sharepoint Search has no default Property for inactive/disabled User

• custom Mapping is required in Search Schema

for 4.) it is related to default Search Properties

I will Take a look, what is possible.

[mariaarcena]

@petkir Oh my! I forgot to thank you for your advice from last time---so thank you so much! ☺✨I don't think we are going to do the number 1 (in the previous post) anymore! And I just started a udemy course on sharepoint framework to help myself understand the code better! So please forgive my questions below!

I do have some questions though:

1. Are the properties that is used (for this webpart) from Microsoft Office 365 or SharePoint User Profile service or a mix of both?
2. The question above leads to this question (I was trying to the documentation more)... does simply adding another property in the "Properties to search" field work? 🤔💭

• I wanted to test react-directory myself and I added MobilePhone and OfficeNumber in "Properties to search" within the property pane; the search was not successful. I followed this direction: "You can add custom properties separated by comma." (below in red) but does this assume that I would have to modify the code itself too? 🤔
• Is this second question more appropriate to be a separate issue/bug or should I still use this same issue thread? Let me know because I am fine either way!

Hope my post was easy to understand! If not, let me know as well! ☺✨

tagging @sudharsank as well! ✨

[github-actions]

This issue has been marked as stale due to no progress in over 90 days. If you are still experiencing this issue, please provide additional information so we can help you resolve it.

[github-actions]

Closing this issue due to lack of activity. If you are still encountering this issue, please do not hesitate to open a new issue. Make sure to follow the guidance on how to create good issues to increase your chances of getting the help you deserve.