@selfcommunity/react-ui
Version:
React UI Components to integrate a Community created with SelfCommunity Platform.
81 lines (80 loc) • 8.58 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importStar(require("react"));
const styles_1 = require("@mui/material/styles");
const material_1 = require("@mui/material");
const react_intl_1 = require("react-intl");
const react_core_1 = require("@selfcommunity/react-core");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const SettingsSkeleton_1 = tslib_1.__importDefault(require("./SettingsSkeleton"));
const notistack_1 = require("notistack");
const UserProfile_1 = require("../../../constants/UserProfile");
const types_1 = require("../../../types");
const constants_1 = require("../constants");
const classes = {
root: `${constants_1.PREFIX}-settings-root`,
control: `${constants_1.PREFIX}-control`
};
const Root = (0, styles_1.styled)(material_1.Box, {
name: constants_1.PREFIX,
slot: 'SettingsRoot'
})(() => ({}));
function Settings(props) {
// PROPS
const { id = null, className = null, settings = [...UserProfile_1.DEFAULT_SETTINGS], onEditSuccess = null, startActions = null, endActions = null } = props, rest = tslib_1.__rest(props, ["id", "className", "settings", "onEditSuccess", "startActions", "endActions"]);
// CONTEXT
const scUserContext = (0, react_core_1.useSCUser)();
// STATE
const [_settings, setSetting] = (0, react_1.useState)(null);
// HOOKS
const { enqueueSnackbar } = (0, notistack_1.useSnackbar)();
// EFFECTS
(0, react_1.useEffect)(() => {
if (scUserContext.user) {
setSetting(scUserContext.managers.settings.all());
}
}, [scUserContext.user, scUserContext.managers.settings.all]);
// HANDLERS
const handleChange = (event) => {
scUserContext.managers.settings
.update(event.target.name, parseInt(event.target.value, 10))
.then((res) => {
setSetting(res);
if (onEditSuccess) {
onEditSuccess();
}
else {
enqueueSnackbar((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.saved", defaultMessage: "ui.userProfileEditSettings.saved" }), {
variant: 'success',
autoHideDuration: 3000
});
}
})
.catch((error) => {
console.log(error);
});
};
// RENDER
if (!scUserContext.user) {
return null;
}
if (_settings === null) {
return (0, jsx_runtime_1.jsx)(SettingsSkeleton_1.default, {});
}
const renderSetting = (setting) => {
switch (setting) {
case types_1.SCUserProfileSettings.NOTIFICATION:
return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ gutterBottom: true, variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.notification.title", defaultMessage: "ui.userProfileEditSettings.notification.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.control }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.notification.label", defaultMessage: "ui.userProfileEditSettings.notification.label" }) }), (0, jsx_runtime_1.jsxs)(material_1.RadioGroup, Object.assign({ "aria-labelledby": "notification settings", value: _settings.show_toast_notifications, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_SHOW_TOAST, onChange: handleChange }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.yes", defaultMessage: "ui.common.yes" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 0, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.common.no", defaultMessage: "ui.common.no" }) })] }))] }) }))] }, setting));
case types_1.SCUserProfileSettings.INTERACTION:
return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ gutterBottom: true, variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.title", defaultMessage: "ui.userProfileEditSettings.interaction.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.control }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.label", defaultMessage: "ui.userProfileEditSettings.interaction.label" }) }), (0, jsx_runtime_1.jsxs)(material_1.RadioGroup, Object.assign({ "aria-labelledby": "email notification settings", value: _settings.qa_frequency, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_QA_FREQUENCY, onChange: handleChange }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: -1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.immediatly", defaultMessage: "ui.userProfileEditSettings.interaction.immediatly" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.daily", defaultMessage: "ui.userProfileEditSettings.interaction.daily" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 0, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.interaction.never", defaultMessage: "ui.userProfileEditSettings.interaction.never" }) })] }))] }) }))] }, setting));
case types_1.SCUserProfileSettings.PRIVATE_MESSAGE:
return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ gutterBottom: true, variant: "body1" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.title", defaultMessage: "ui.userProfileEditSettings.privateMessage.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.control }, { children: (0, jsx_runtime_1.jsxs)(material_1.FormControl, { children: [(0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.label", defaultMessage: "ui.userProfileEditSettings.privateMessage.label" }) }), (0, jsx_runtime_1.jsxs)(material_1.RadioGroup, Object.assign({ "aria-labelledby": "email notification settings", value: _settings.email_notification_not_qa, name: react_core_1.SCNotification.NOTIFICATIONS_SETTINGS_EMAIL_NOT_QA, onChange: handleChange }, { children: [(0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 1, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.email", defaultMessage: "ui.userProfileEditSettings.privateMessage.email" }) }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { value: 0, control: (0, jsx_runtime_1.jsx)(material_1.Radio, { size: "small" }), label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.userProfileEditSettings.privateMessage.frontend", defaultMessage: "ui.userProfileEditSettings.privateMessage.frontend" }) })] }))] }) }))] }, setting));
default:
return null;
}
};
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [startActions, settings.map((setting) => renderSetting(setting)), endActions] })));
}
exports.default = Settings;