-
Notifications
You must be signed in to change notification settings - Fork 31
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Adding in remove capability for group members + csv download (#1367)
* fix: formatting without data * fix: adding in tests * fix: teeny fix * feat: adding in remove member functionality * fix: adding csv download * fix: adding in download capability * fix: remove formatting changes * fix: PR requests
- Loading branch information
Showing
14 changed files
with
412 additions
and
51 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
4 changes: 2 additions & 2 deletions
4
...PeopleManagement/AddMembersBulkAction.jsx → .../GroupDetailPage/AddMembersBulkAction.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
83 changes: 83 additions & 0 deletions
83
src/components/PeopleManagement/GroupDetailPage/DownloadCsvIconButton.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,83 @@ | ||
| import React from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import { defineMessages, useIntl } from '@edx/frontend-platform/i18n'; | ||
|
|
||
| import { | ||
| Icon, IconButtonWithTooltip, Toast, useToggle, | ||
| } from '@openedx/paragon'; | ||
| import { Download } from '@openedx/paragon/icons'; | ||
| import { logError } from '@edx/frontend-platform/logging'; | ||
| import GeneralErrorModal from '../GeneralErrorModal'; | ||
| import { downloadCsv, getTimeStampedFilename } from '../../../utils'; | ||
|
|
||
| const csvHeaders = ['Name', 'Email', 'Recent action', 'Enrollments']; | ||
|
|
||
| const DownloadCsvIconButton = ({ fetchAllData, dataCount, testId }) => { | ||
| const [isToastOpen, openToast, closeToast] = useToggle(false); | ||
| const [isErrorModalOpen, openErrorModal, closeErrorModal] = useToggle(false); | ||
| const intl = useIntl(); | ||
| const messages = defineMessages({ | ||
| downloadToastText: { | ||
| id: 'adminPortal.peopleManagement.groupDetail.downloadCsv.toast', | ||
| defaultMessage: 'Downloaded group members', | ||
| description: 'Toast message for the download button on the group detail page.', | ||
| }, | ||
| downloadHoverText: { | ||
| id: 'adminPortal.peopleManagement.groupDetail.downloadCsv.hoverTooltip', | ||
| defaultMessage: `Download (${dataCount})`, | ||
| description: 'Tooltip message for the download button on the group detail page.', | ||
| }, | ||
| }); | ||
|
|
||
| const dataEntryToRow = (entry) => { | ||
| const { memberDetails: { userEmail, userName }, recentAction, enrollments } = entry; | ||
| return [userName, userEmail, recentAction, enrollments]; | ||
| }; | ||
|
|
||
| const handleClick = async () => { | ||
| fetchAllData().then((response) => { | ||
| const fileName = getTimeStampedFilename('group-report.csv'); | ||
| downloadCsv(fileName, response.results, csvHeaders, dataEntryToRow); | ||
| openToast(); | ||
| }).catch((err) => { | ||
| logError(err); | ||
| openErrorModal(); | ||
| }); | ||
| }; | ||
|
|
||
| return ( | ||
| <> | ||
| { isToastOpen | ||
| && ( | ||
| <Toast onClose={closeToast} show={isToastOpen}> | ||
| {intl.formatMessage(messages.downloadToastText)} | ||
| </Toast> | ||
| )} | ||
| <GeneralErrorModal | ||
| isOpen={isErrorModalOpen} | ||
| close={closeErrorModal} | ||
| /> | ||
| <IconButtonWithTooltip | ||
| data-testid={testId} | ||
| tooltipContent={intl.formatMessage(messages.downloadHoverText)} | ||
| src={Download} | ||
| iconAs={Icon} | ||
| alt="Download group members" | ||
| variant="primary" | ||
| onClick={handleClick} | ||
| /> | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| DownloadCsvIconButton.defaultProps = { | ||
| testId: 'download-csv-icon-button', | ||
| }; | ||
|
|
||
| DownloadCsvIconButton.propTypes = { | ||
| fetchAllData: PropTypes.func.isRequired, | ||
| dataCount: PropTypes.number.isRequired, | ||
| testId: PropTypes.string, | ||
| }; | ||
|
|
||
| export default DownloadCsvIconButton; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.