Suggest search when adding groups to record

[phette23]

Is your feature request related to a problem? Please describe.

When one goes to a record > Share > Groups > Add Groups, the API used in the "search for groups" input only returns exact ID matches. It's difficult to users to know the exact identifiers of existing groups. I would like this search to operate more like the "add users" input, which is a much broader query using multiple pieces of user data (names, username, fuzzy matches).

We are planning to have many discipline-specific groups like animation_majors, animation_faculty. Typing "animation" in, however, yields no options because it doesn't exactly match. In general, I don't want users to need to know our identifiers.

Maybe this is more of an invenio_communities issue based on the underlying API code; let me know and I'll move it there.

Describe the solution you'd like

I'd like the groups search to be similarly broad like the users one, not relying on exact identifier matches.

The quickest solution is to make GroupsApi.getGroups use ${this.endpoint}?q=description:${query} instead of ${this.endpoint}?q=${query} in its query URL. An even more robust solution is the URL ${this.endpoint}?q=description:${query}+OR+id:${query} to search both group id and description fields.

The Users API supports suggest queries like /api/users?suggest=frida but /api/groups?suggest=animation throws a 400 Invalid querystring parameters error. I assume it'd require much larger changes to add suggest query support here.

Describe alternatives you've considered

If there's an easy way to override this component, or better yet only the GroupsApi, I am interested in that. I could not find an overridable component when I looked for one but I could've missed it.

Additional context

The JS component for the sharing modal is AddUserGroupAccessModal.js in this repo. The search client code:

  searchEntities = () => {
    const { searchType } = this.props;
    if (searchType === "user") {
      const usersClient = new UsersApi();
      return usersClient.suggestUsers;
    }
    if (searchType === "role") {
      const groupsClient = new GroupsApi();
      return groupsClient.getGroups;
    }
  };

Note suggestUsers versus getGroups. These API classes come from invenio_communities:

// UsersApi.js
import { http } from "react-invenio-forms";

export class UsersApi {
  get endpoint() {
    return `/api/users`;
  }

  getUsers = async (query) => {
    return await http.get(`${this.endpoint}?q=${query}`);
  };

  suggestUsers = async (query) => {
    return await http.get(`${this.endpoint}?suggest=${query}`);
  };
}

// GroupsApi.js
import { http } from "react-invenio-forms";

export class GroupsApi {
  get endpoint() {
    return `/api/groups`;
  }

  getGroups = async (query) => {
    return await http.get(`${this.endpoint}?q=${query}`);
  };
}