@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
59 lines (58 loc) • 3.21 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const material_1 = require("@mui/material");
const react_1 = require("react");
const react_intl_1 = require("react-intl");
const lab_1 = require("@mui/lab");
const types_1 = require("@selfcommunity/types");
const api_services_1 = require("@selfcommunity/api-services");
const utils_1 = require("@selfcommunity/utils");
const Errors_1 = require("../../constants/Errors");
const notistack_1 = require("notistack");
const OPTIONS = ['ui.editCourse.tab.users.table.select.joined', 'ui.editCourse.tab.users.table.select.manager'];
function ChangeUserStatus(props) {
// PROPS
const { course, user } = props;
// STATES
const [value, setValue] = (0, react_1.useState)('');
const [loading, setLoading] = (0, react_1.useState)(false);
// CONTEXTS
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
// EFFECTS
(0, react_1.useEffect)(() => {
setValue(`ui.editCourse.tab.users.table.select.${user.join_status || 'joined'}`);
}, [user, setValue]);
// HANDLERS
const handleChange = (0, react_1.useCallback)((e) => {
setLoading(true);
const newValue = e.target.value;
const data = {
joined: newValue.endsWith(types_1.SCCourseJoinStatusType.JOINED) ? [user.id] : undefined,
managers: newValue.endsWith(types_1.SCCourseJoinStatusType.MANAGER) ? [user.id] : undefined
};
api_services_1.CourseService.changeCourseUserRole(course.id, data)
.then(() => {
setValue(newValue);
setLoading(false);
enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseUsersTable.changeStatus.snackbar.success", defaultMessage: "ui.courseUsersTable.changeStatus.snackbar.success" }), {
variant: 'success',
autoHideDuration: 3000
});
})
.catch((error) => {
utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
variant: 'error',
autoHideDuration: 3000
});
});
}, [course, user, setLoading, setValue]);
return ((0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ size: "small", value: value, onChange: handleChange }, { children: OPTIONS.map((option, i) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: option }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", color: "inherit", loading: loading, disabled: loading, sx: {
padding: 0,
':hover': {
backgroundColor: 'unset'
}
} }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: option, defaultMessage: option }) })) })) }), i))) })));
}
exports.default = (0, react_1.memo)(ChangeUserStatus);