Add support for only filtering available options in the UserListPicker

Signed-off-by: Mike Lewis <mtlewis@users.noreply.github.com>
Co-authored-by: Tim Hansen <timbonicush@spotify.com>
Co-authored-by: Himanshu Mishra <himanshum@spotify.com>

plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx

@@ -106,13 +106,27 @@ function getFilterGroups(orgName: string | undefined): ButtonGroup[] {
 
 type UserListPickerProps = {
   initialFilter?: UserListFilterKind;
+  availableFilters?: UserListFilterKind[];
 };
 
-export const UserListPicker = ({ initialFilter }: UserListPickerProps) => {
+export const UserListPicker = ({
+  initialFilter,
+  availableFilters,
+}: UserListPickerProps) => {
   const classes = useStyles();
   const configApi = useApi(configApiRef);
   const orgName = configApi.getOptionalString('organization.name') ?? 'Company';
-  const filterGroups = getFilterGroups(orgName);
+
+  // Remove group items that aren't in availableFilters and exclude
+  // any now-empty groups.
+  const filterGroups = getFilterGroups(orgName)
+    .map(filterGroup => ({
+      ...filterGroup,
+      items: filterGroup.items.filter(
+        ({ id }) => !availableFilters || availableFilters.includes(id),
+      ),
+    }))
+    .filter(({ items }) => !!items.length);
 
   const { value: user } = useOwnUser();
   const { isStarredEntity } = useStarredEntities();