create useSWRxSelectableUserGroups

packages/app/src/components/Admin/UserGroupDetail/UserGroupDetailPage.tsx

@@ -17,7 +17,7 @@ import { IPageHasId } from '~/interfaces/page';
 import {
   IUserGroup, IUserGroupHasId, IUserGroupRelation,
 } from '~/interfaces/user';
-import { useSWRxUserGroupPages, useSWRxUserGroupRelations } from '~/stores/user-group';
+import { useSWRxUserGroupPages, useSWRxUserGroupRelations, useSWRxSelectableUserGroups } from '~/stores/user-group';
 
 
 const UserGroupDetailPage: FC = () => {
@@ -45,6 +45,7 @@ const UserGroupDetailPage: FC = () => {
    */
   const { data: userGroupPages } = useSWRxUserGroupPages(userGroup._id, 10, 0);
   const { data: userGroupRelations, mutate: mutateUserGroupRelations } = useSWRxUserGroupRelations(userGroup._id);
+  const { data: selectableUserGroups } = useSWRxSelectableUserGroups(userGroup._id);
 
   /*
    * Function

packages/app/src/stores/user-group.tsx

@@ -62,3 +62,10 @@ export const useSWRxUserGroupPages = (groupId: string | undefined, limit: number
     endpoint => apiv3Get<UserGroupPagesResult>(endpoint, { limit, offset }).then(result => result.data.pages),
   );
 };
+
+export const useSWRxSelectableUserGroups = (groupId: string): SWRResponse<IUserGroupHasId[], Error> => {
+  return useSWRImmutable(
+    groupId != null ? ['/user-groups/selectable-groups'] : null,
+    endpoint => apiv3Get<UserGroupListResult>(endpoint, { groupId }).then(result => result.data.userGroups),
+  );
+};