RemoveAdminMenuItem.tsx 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. import React, { useCallback } from 'react';
  2. import type { IUserHasId } from '@growi/core';
  3. import { useTranslation } from 'next-i18next';
  4. import AdminUsersContainer from '~/client/services/AdminUsersContainer';
  5. import { toastSuccess, toastError } from '~/client/util/toastr';
  6. import { useCurrentUser } from '~/stores/context';
  7. import { withUnstatedContainers } from '../../UnstatedUtils';
  8. const RemoveAdminAlert = React.memo((): JSX.Element => {
  9. const { t } = useTranslation();
  10. return (
  11. <div className="px-4">
  12. <i className="icon-fw icon-user-unfollow mb-2"></i>{t('admin:user_management.user_table.remove_admin_access')}
  13. <p className="alert alert-danger">{t('admin:user_management.user_table.cannot_remove')}</p>
  14. </div>
  15. );
  16. });
  17. RemoveAdminAlert.displayName = 'RemoveAdminAlert';
  18. type Props = {
  19. adminUsersContainer: AdminUsersContainer,
  20. user: IUserHasId,
  21. }
  22. const RemoveAdminMenuItem = (props: Props): JSX.Element => {
  23. const { t } = useTranslation('admin');
  24. const { adminUsersContainer, user } = props;
  25. const { data: currentUser } = useCurrentUser();
  26. const clickRemoveAdminBtnHandler = useCallback(async() => {
  27. try {
  28. const username = await adminUsersContainer.removeUserAdmin(user._id);
  29. toastSuccess(t('toaster.remove_user_admin', { username }));
  30. }
  31. catch (err) {
  32. toastError(err);
  33. }
  34. }, [adminUsersContainer, t, user._id]);
  35. return user.username !== currentUser?.username
  36. ? (
  37. <button className="dropdown-item" type="button" onClick={clickRemoveAdminBtnHandler}>
  38. <i className="icon-fw icon-user-unfollow"></i> {t('user_management.user_table.remove_admin_access')}
  39. </button>
  40. )
  41. : <RemoveAdminAlert />;
  42. };
  43. /**
  44. * Wrapper component for using unstated
  45. */
  46. // eslint-disable-next-line max-len
  47. const RemoveAdminMenuItemWrapper: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<any>> = withUnstatedContainers(RemoveAdminMenuItem, [AdminUsersContainer]);
  48. export default RemoveAdminMenuItemWrapper;