@selfcommunity/react-ui/lib/esm/shared/CourseUsersTable/ChangeUsersStatus.js

React UI Components to integrate a Community created with SelfCommunity Platform.

import { jsx as _jsx } from "react/jsx-runtime";
import { MenuItem, Select, Typography } from '@mui/material';
import { memo, useCallback, useEffect, useState } from 'react';
import { FormattedMessage } from 'react-intl';
import { LoadingButton } from '@mui/lab';
import { SCCourseJoinStatusType } from '@selfcommunity/types';
import { CourseService } from '@selfcommunity/api-services';
import { Logger } from '@selfcommunity/utils';
import { SCOPE_SC_UI } from '../../constants/Errors';
import { useSnackbar } from '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] = useState('');
    const [loading, setLoading] = useState(false);
    // CONTEXTS
    const { enqueueSnackbar } = useSnackbar();
    // EFFECTS
    useEffect(() => {
        setValue(`ui.editCourse.tab.users.table.select.${user.join_status || 'joined'}`);
    }, [user, setValue]);
    // HANDLERS
    const handleChange = useCallback((e) => {
        setLoading(true);
        const newValue = e.target.value;
        const data = {
            joined: newValue.endsWith(SCCourseJoinStatusType.JOINED) ? [user.id] : undefined,
            managers: newValue.endsWith(SCCourseJoinStatusType.MANAGER) ? [user.id] : undefined
        };
        CourseService.changeCourseUserRole(course.id, data)
            .then(() => {
            setValue(newValue);
            setLoading(false);
            enqueueSnackbar(_jsx(FormattedMessage, { id: "ui.courseUsersTable.changeStatus.snackbar.success", defaultMessage: "ui.courseUsersTable.changeStatus.snackbar.success" }), {
                variant: 'success',
                autoHideDuration: 3000
            });
        })
            .catch((error) => {
            Logger.error(SCOPE_SC_UI, error);
            enqueueSnackbar(_jsx(FormattedMessage, { id: "ui.common.error.action", defaultMessage: "ui.common.error.action" }), {
                variant: 'error',
                autoHideDuration: 3000
            });
        });
    }, [course, user, setLoading, setValue]);
    return (_jsx(Select, Object.assign({ size: "small", value: value, onChange: handleChange }, { children: OPTIONS.map((option, i) => (_jsx(MenuItem, Object.assign({ value: option }, { children: _jsx(LoadingButton, Object.assign({ size: "small", color: "inherit", loading: loading, disabled: loading, sx: {
                    padding: 0,
                    ':hover': {
                        backgroundColor: 'unset'
                    }
                } }, { children: _jsx(Typography, Object.assign({ variant: "body1" }, { children: _jsx(FormattedMessage, { id: option, defaultMessage: option }) })) })) }), i))) })));
}
export default memo(ChangeUserStatus);