npm - @selfcommunity/react-ui - Versions diffs - 0.10.5-payments.182 → 0.10.5-payments.183 - Mend

@selfcommunity/react-ui 0.10.5-payments.182 → 0.10.5-payments.183

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (84) hide show

package/lib/cjs/components/BuyButton/BuyButton.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { SCPaymentProduct, SCContentType, SCPurchasableContent } from '@selfcommunity/types';
+import { PaymentOrderPdfButtonProps } from '../PaymentOrderPdfButton';
 export interface BuyButtonProps {
     /**
      * Overrides or extends the styles applied to the component.
@@ -27,6 +28,15 @@ export interface BuyButtonProps {
      * @param joined
      */
     onPurchase?: (contentType: SCContentType, id: number) => any;
+    /**
+     * show ticket button if content is already paid
+     */
+    showTicket?: boolean;
+    /**
+     * Props to spread to the PaymentOrderPdfButton component
+     * @default {}
+     */
+    PaymentOrderPdfButtonComponentProps?: PaymentOrderPdfButtonProps;
     /**
      * Others properties
      */

package/lib/cjs/components/BuyButton/BuyButton.js CHANGED Viewed

@@ -15,6 +15,7 @@ const PaywallsDialog_1 = tslib_1.__importDefault(require("../PaywallsDialog"));
 const api_services_1 = require("@selfcommunity/api-services");
 const utils_1 = require("@selfcommunity/utils");
 const Paywalls_1 = tslib_1.__importDefault(require("../Paywalls"));
+const PaymentOrderPdfButton_1 = tslib_1.__importDefault(require("../PaymentOrderPdfButton"));
 const PREFIX = 'SCBuyButton';
 const classes = {
     requestRoot: `${PREFIX}-request-root`,
@@ -62,7 +63,7 @@ function BuyButton(inProps) {
         props: inProps,
         name: PREFIX
     });
-    const { className, contentId, contentType, content, disabled, onPurchase } = props, rest = tslib_1.__rest(props, ["className", "contentId", "contentType", "content", "disabled", "onPurchase"]);
+    const { className, contentId, contentType, content, disabled, onPurchase, showTicket = false, PaymentOrderPdfButtonComponentProps = {} } = props, rest = tslib_1.__rest(props, ["className", "contentId", "contentType", "content", "disabled", "onPurchase", "showTicket", "PaymentOrderPdfButtonComponentProps"]);
     // STATE
     const [open, setOpen] = (0, react_1.useState)(false);
     // CONTEXT
@@ -94,7 +95,7 @@ function BuyButton(inProps) {
      * Price param is the new price selected
      */
     const handleUpdatePaymentOrder = (0, react_1.useCallback)((price) => {
-        // TODO: update order/subscription when will be recurring payment
+        // update order/subscription when will be recurring payment
     }, [paymentOrder, purchased]);
     /**
      * Get current status
@@ -185,7 +186,7 @@ function BuyButton(inProps) {
     if (!contentId && !content) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: disabled ? (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.buyButton.disabled", defaultMessage: "ui.buyButton.disabled" }) : '' }, { children: (0, jsx_runtime_1.jsx)(RequestRoot, Object.assign({ className: (0, classnames_1.default)(classes.requestRoot, className), variant: "contained", color: purchased ? 'inherit' : 'secondary', size: "small", startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "card_giftcard" }), loading: scUserContext.user === undefined || purchased === null, onClick: handleOpen, disabled: disabled }, rest, { children: btnLabel })) })), open && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, PaperProps: { className: classes.paper }, open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", component: "div", marginBottom: 2 }, { children: (0, jsx_runtime_1.jsx)("b", { children: paymentOrder ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallssDialog.title.purchased", defaultMessage: "ui.paymentProductsDialog.title.purchased" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallssDialog.title", defaultMessage: "ui.paymentProductsDialog.title" })) }) })), (0, jsx_runtime_1.jsx)(Paywalls_1.default, Object.assign({ contentType: contentType }, (content ? { content } : { contentId }), { prefetchedPaymentContentStatus: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: disabled ? (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.buyButton.disabled", defaultMessage: "ui.buyButton.disabled" }) : '' }, { children: (0, jsx_runtime_1.jsx)(RequestRoot, Object.assign({ className: (0, classnames_1.default)(classes.requestRoot, className), variant: "contained", color: purchased ? 'inherit' : 'secondary', size: "small", startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "card_giftcard" }), loading: scUserContext.user === undefined || purchased === null, onClick: handleOpen, disabled: disabled || (!paymentOrder && purchased) }, rest, { children: !paymentOrder && purchased ? (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.buyButton.free", defaultMessage: "ui.buyButton.free" }) : btnLabel })) })), paymentOrder && showTicket && (0, jsx_runtime_1.jsx)(PaymentOrderPdfButton_1.default, Object.assign({}, PaymentOrderPdfButtonComponentProps, { paymentOrder: paymentOrder })), open && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, PaperProps: { className: classes.paper }, open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", component: "div", marginBottom: 2 }, { children: (0, jsx_runtime_1.jsx)("b", { children: paymentOrder ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallssDialog.title.purchased", defaultMessage: "ui.paymentProductsDialog.title.purchased" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallssDialog.title", defaultMessage: "ui.paymentProductsDialog.title" })) }) })), (0, jsx_runtime_1.jsx)(Paywalls_1.default, Object.assign({ contentType: contentType }, (content ? { content } : { contentId }), { prefetchedPaymentContentStatus: {
                                     paywalls: products,
                                     payment_order: paymentOrder
                                 }, onUpdatePaymentOrder: handleUpdatePaymentOrder }))] }) }))) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(PaywallsDialog_1.default, { open: true, onClose: handleClose, PaywallsComponentProps: Object.assign(Object.assign({ contentType }, (content ? { content } : { contentId })), { prefetchedPaymentContentStatus: {

package/lib/cjs/components/CourseDashboard/Student.js CHANGED Viewed

@@ -175,14 +175,20 @@ function Student(inProps) {
         return ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ className: classes.actionsWrapper }, { children: [(scCourse.join_status === types_1.SCCourseJoinStatusType.CREATOR || scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: BUTTON_MESSAGES.dashboard, to: scRoutingContext.url(react_core_1.SCRoutes.COURSE_DASHBOARD_ROUTE_NAME, scCourse), color: "inherit", variant: "outlined" })), (((scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE || scCourse.privacy === types_1.SCCoursePrivacyType.SECRET) &&
                     (scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER || scCourse.join_status === types_1.SCCourseJoinStatusType.JOINED)) ||
                     (scCourse.privacy === types_1.SCCoursePrivacyType.OPEN && scCourse.join_status !== types_1.SCCourseJoinStatusType.CREATOR)) &&
-                    (!isPaymentsEnabled || !((_a = scCourse.paywalls) === null || _a === void 0 ? void 0 : _a.length) || (isPaymentsEnabled && ((_b = scCourse.paywalls) === null || _b === void 0 ? void 0 : _b.length) > 0 && scCourse.payment_order)) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: scCourse.join_status === null
+                    (!isPaymentsEnabled ||
+                        !((_a = scCourse.paywalls) === null || _a === void 0 ? void 0 : _a.length) ||
+                        (isPaymentsEnabled &&
+                            ((_b = scCourse.paywalls) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
+                            (scCourse.join_status === types_1.SCCourseJoinStatusType.JOINED || scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER))) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: scCourse.join_status === null
                         ? BUTTON_MESSAGES.signUp
                         : scCourse.user_completion_rate === 0
                             ? BUTTON_MESSAGES.start
                             : scCourse.user_completion_rate === 100
                                 ? BUTTON_MESSAGES.review
-                                : BUTTON_MESSAGES.continue, to: scCourse.join_status !== null ? scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, getUrlNextLesson(scCourse)) : undefined, disabled: scCourse.join_status !== null ? getIsNextLessonLocked(scCourse) : undefined, color: scCourse.user_completion_rate === 100 ? 'inherit' : undefined, variant: scCourse.user_completion_rate === 100 ? 'outlined' : undefined, loading: scCourse.join_status === null ? loadingRequest : undefined, onClick: !scUserContext.user ? handleAnonymousAction : scCourse.join_status === null ? handleRequest : undefined })), isPaymentsEnabled && ((_c = scCourse.paywalls) === null || _c === void 0 ? void 0 : _c.length) > 0 && !scCourse.join_status && ((0, jsx_runtime_1.jsx)(BuyButton_1.default, { contentType: types_1.SCContentType.COURSE, content: scCourse })), scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE &&
-                    (scCourse.join_status === null || scCourse.join_status === types_1.SCCourseJoinStatusType.REQUESTED) && ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: sentRequest ? BUTTON_MESSAGES.cancel : BUTTON_MESSAGES.request, color: "inherit", variant: "outlined", loading: loadingRequest, onClick: handleRequest }))] })));
+                                : BUTTON_MESSAGES.continue, to: scCourse.join_status !== null ? scRoutingContext.url(react_core_1.SCRoutes.COURSE_LESSON_ROUTE_NAME, getUrlNextLesson(scCourse)) : undefined, disabled: scCourse.join_status !== null ? getIsNextLessonLocked(scCourse) : undefined, color: scCourse.user_completion_rate === 100 ? 'inherit' : undefined, variant: scCourse.user_completion_rate === 100 ? 'outlined' : undefined, loading: scCourse.join_status === null ? loadingRequest : undefined, onClick: !scUserContext.user ? handleAnonymousAction : scCourse.join_status === null ? handleRequest : undefined })), scCourse.privacy === types_1.SCCoursePrivacyType.PRIVATE &&
+                    (scCourse.join_status === null || scCourse.join_status === types_1.SCCourseJoinStatusType.REQUESTED) ? ((0, jsx_runtime_1.jsx)(ActionButton_1.default, { labelId: sentRequest ? BUTTON_MESSAGES.cancel : BUTTON_MESSAGES.request, color: "inherit", variant: "outlined", loading: loadingRequest, onClick: handleRequest })) : (isPaymentsEnabled &&
+                    ((_c = scCourse.paywalls) === null || _c === void 0 ? void 0 : _c.length) > 0 &&
+                    !(scCourse.join_status === types_1.SCCourseJoinStatusType.CREATOR || scCourse.join_status === types_1.SCCourseJoinStatusType.MANAGER) && ((0, jsx_runtime_1.jsx)(BuyButton_1.default, { contentType: types_1.SCContentType.COURSE, content: scCourse })))] })));
     }, [scCourse, sentRequest, loadingRequest, handleRequest]);
     if (!scCourse) {
         return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});

package/lib/cjs/components/CourseForm/CourseForm.js CHANGED Viewed

@@ -23,6 +23,7 @@ const CategoryAutocomplete_1 = tslib_1.__importDefault(require("../CategoryAutoc
 const Edit_1 = tslib_1.__importDefault(require("./Edit"));
 const Dialog_1 = tslib_1.__importDefault(require("./Dialog"));
 const PaywallsConfigurator_1 = tslib_1.__importDefault(require("../PaywallsConfigurator"));
+const constants_2 = require("../PaywallsConfigurator/constants");
 const messages = (0, react_intl_1.defineMessages)({
     name: {
         id: 'ui.courseForm.name.placeholder',
@@ -103,7 +104,7 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  * @param inProps
  */
 function CourseForm(inProps) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e;
     //PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -120,7 +121,8 @@ function CourseForm(inProps) {
         description: course ? course.description : '',
         categories: course ? course.categories : [],
         privacy: course ? course.privacy : '',
-        product_ids: ((_a = course === null || course === void 0 ? void 0 : course.paywalls) === null || _a === void 0 ? void 0 : _a.map((p) => p.id)) || [],
+        productIds: ((_a = course === null || course === void 0 ? void 0 : course.paywalls) === null || _a === void 0 ? void 0 : _a.map((p) => p.id)) || [],
+        contentAccessType: ((_b = course === null || course === void 0 ? void 0 : course.paywalls) === null || _b === void 0 ? void 0 : _b.length) ? constants_2.ContentAccessType.PAID : constants_2.ContentAccessType.FREE,
         isSubmitting: false
     };
     // STATE
@@ -212,8 +214,8 @@ function CourseForm(inProps) {
                 formData.append(key, field.categories[key]);
             }
         }
-        if (field.product_ids && (isStaff || (course && ((_a = course.paywalls) === null || _a === void 0 ? void 0 : _a.length)))) {
-            field.product_ids.forEach((p, i) => {
+        if (field.productIds && field.contentAccessType === constants_2.ContentAccessType.PAID && (isStaff || (course && ((_a = course.paywalls) === null || _a === void 0 ? void 0 : _a.length)))) {
+            field.productIds.forEach((p, i) => {
                 formData.append(`product_ids[${i}]`, p.toString());
             });
         }
@@ -258,12 +260,19 @@ function CourseForm(inProps) {
             setError(error);
         }
     }, [setField, error]);
+    /**
+     * Handle change content access tyoe
+     * @param type
+     */
+    const handleChangeContentAccessType = (type) => {
+        setField((prev) => (Object.assign(Object.assign({}, prev), { contentAccessType: type })));
+    };
     /**
      * Handle change payment products
      * @param products
      */
     const handleChangePaymentsProducts = (products) => {
-        setField((prev) => (Object.assign(Object.assign({}, prev), { product_ids: products.map((product) => product.id) })));
+        setField((prev) => (Object.assign(Object.assign({}, prev), { productIds: products.map((product) => product.id) })));
     };
     /**
      * Handles for closing confirm dialog
@@ -277,8 +286,8 @@ function CourseForm(inProps) {
     return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: _step === Course_1.SCCourseFormStepType.GENERAL ? classes.stepOne : classes.stepTwo }, { children: [_step === Course_1.SCCourseFormStepType.GENERAL && ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: Object.values(types_1.SCCourseTypologyType).map((option, index) => ((0, jsx_runtime_1.jsx)(material_1.Card, Object.assign({ className: (0, classnames_1.default)(classes.card, { [classes.selected]: option === field.type }, { [classes.disabled]: !courseAdvancedEnabled && option !== types_1.SCCourseTypologyType.SELF }) }, { children: (0, jsx_runtime_1.jsx)(material_1.CardActionArea, Object.assign({ onClick: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['type']: option }))) }, { children: (0, jsx_runtime_1.jsxs)(material_1.CardContent, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ variant: "subtitle2", className: classes.cardTitle }, { children: [(0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.title`, defaultMessage: `ui.courseForm.${option}.title` }), !courseAdvancedEnabled && option !== types_1.SCCourseTypologyType.SELF && ((0, jsx_runtime_1.jsx)(material_1.Chip, { variant: "outlined", color: "warning", size: "small", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.comingSoon.chip", defaultMessage: "ui.courseForm.comingSoon.chip" }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.courseForm.${option}.info`, defaultMessage: `ui.courseForm.${option}.info` }) }))] }) })) }), index))) })), _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [course && ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.contrastColor }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.edit.title.general", defaultMessage: "ui.courseForm.edit.title.general" }) }))), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: (0, classnames_1.default)(classes.form, _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: (0, jsx_runtime_1.jsx)(UploadCourseCover_1.default, { isUploading: field.isSubmitting, onChange: handleChangeCover }) })), (0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
                                                 endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Course_1.COURSE_TITLE_MAX_LENGTH - field.name.length }))
                                             }, error: Boolean((!!course && !field.name) || field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: !!course && !field.name ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : field.name.length > Course_1.COURSE_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.name.error.maxLength", defaultMessage: "ui.courseForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                                                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_b = field.description) === null || _b === void 0 ? void 0 : _b.length) ? Course_1.COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : Course_1.COURSE_DESCRIPTION_MAX_LENGTH })))
-                                            }, error: Boolean((!!field.privacy && !field.description) || ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: !!field.privacy && !field.description ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : (((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" }))) }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && (0, jsx_runtime_1.jsx)(Edit_1.default, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) }), isPaymentsEnabled && isStaff && !hidePaywalls && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (course && { contentId: course.id }), { contentType: types_1.SCContentType.COURSE, onChange: handleChangePaymentsProducts })) })))] }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.actions, _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === Course_1.SCCourseFormStepType.GENERAL
+                                                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_c = field.description) === null || _c === void 0 ? void 0 : _c.length) ? Course_1.COURSE_DESCRIPTION_MAX_LENGTH - field.description.length : Course_1.COURSE_DESCRIPTION_MAX_LENGTH })))
+                                            }, error: Boolean((!!field.privacy && !field.description) || ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH), helperText: !!field.privacy && !field.description ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.required", defaultMessage: "ui.courseForm.required" })) : (((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) > Course_1.COURSE_DESCRIPTION_MAX_LENGTH && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.courseForm.description.error.maxLength", defaultMessage: "ui.courseForm.description.error.maxLength" }))) }), (0, jsx_runtime_1.jsx)(CategoryAutocomplete_1.default, { defaultValue: field.categories, TextFieldProps: { label: intl.formatMessage(Object.keys(field.categories).length ? messages.category : messages.categoryEmpty) }, multiple: true, onChange: handleOnChangeCategory }), course && (0, jsx_runtime_1.jsx)(Edit_1.default, { course: course, onPrivacyChange: (privacy) => setField((prev) => (Object.assign(Object.assign({}, prev), { ['privacy']: privacy }))) }), isPaymentsEnabled && isStaff && !hidePaywalls && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (course && { contentId: course.id }), { contentType: types_1.SCContentType.COURSE, onChangeContentAccessType: handleChangeContentAccessType, onChangePaymentProducts: handleChangePaymentsProducts })) })))] }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: (0, classnames_1.default)(classes.actions, _step === Course_1.SCCourseFormStepType.CUSTOMIZATION && course ? classes.stepCustomization : undefined) }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ size: "small", loading: field.isSubmitting, disabled: _step === Course_1.SCCourseFormStepType.GENERAL
                                     ? !field.type || Object.keys(error).length !== 0
                                     : _step === Course_1.SCCourseFormStepType.CUSTOMIZATION &&
                                         (!field.name ||

package/lib/cjs/components/EventForm/EventForm.js CHANGED Viewed

@@ -28,6 +28,7 @@ const utils_2 = require("./utils");
 const constants_2 = require("../LiveStreamForm/constants");
 const deafultCover_1 = tslib_1.__importDefault(require("../../assets/deafultCover"));
 const PaywallsConfigurator_1 = tslib_1.__importDefault(require("../PaywallsConfigurator"));
+const constants_3 = require("../PaywallsConfigurator/constants");
 const messages = (0, react_intl_1.defineMessages)({
     name: {
         id: 'ui.eventForm.name.placeholder',
@@ -123,7 +124,7 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  * @param inProps
  */
 function EventForm(inProps) {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     //PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -164,7 +165,8 @@ function EventForm(inProps) {
         link: (event === null || event === void 0 ? void 0 : event.link) || '',
         liveStreamSettings: (event === null || event === void 0 ? void 0 : event.live_stream) ? event === null || event === void 0 ? void 0 : event.live_stream.settings : null,
         recurring: (event === null || event === void 0 ? void 0 : event.recurring) || types_1.SCEventRecurrenceType.NEVER,
-        product_ids: ((_b = event === null || event === void 0 ? void 0 : event.paywalls) === null || _b === void 0 ? void 0 : _b.map((p) => p.id)) || [],
+        productIds: ((_b = event === null || event === void 0 ? void 0 : event.paywalls) === null || _b === void 0 ? void 0 : _b.map((p) => p.id)) || [],
+        contentAccessType: ((_c = event === null || event === void 0 ? void 0 : event.paywalls) === null || _c === void 0 ? void 0 : _c.length) ? constants_3.ContentAccessType.PAID : constants_3.ContentAccessType.FREE,
         isPublic: (event === null || event === void 0 ? void 0 : event.privacy) ? event.privacy === types_1.SCEventPrivacyType.PUBLIC : true,
         isSubmitting: false
     };
@@ -179,7 +181,7 @@ function EventForm(inProps) {
         scPreferences.features.includes(types_1.SCFeatureName.LIVE_STREAM) &&
         react_core_1.SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED in scPreferences.preferences &&
         scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_LIVE_STREAM_ENABLED].value, [scPreferences.preferences, scPreferences.features]);
-    const canCreateLiveStream = (0, react_1.useMemo)(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_live_stream; }, [(_c = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _c === void 0 ? void 0 : _c.permission]);
+    const canCreateLiveStream = (0, react_1.useMemo)(() => { var _a, _b; return (_b = (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission) === null || _b === void 0 ? void 0 : _b.create_live_stream; }, [(_d = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _d === void 0 ? void 0 : _d.permission]);
     const privateEnabled = (0, react_1.useMemo)(() => scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_PRIVATE_ENABLED].value, [scPreferences.preferences]);
     const visibilityEnabled = (0, react_1.useMemo)(() => scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_EVENTS_VISIBILITY_ENABLED].value, [scPreferences.preferences]);
     const disablePastStartTime = (0, react_1.useMemo)(() => field.startDate.getDate() === (0, utils_2.getNewDate)().getDate(), [field]);
@@ -262,8 +264,8 @@ function EventForm(inProps) {
         if (visibilityEnabled) {
             formData.append('visible', 'true');
         }
-        if (field.product_ids && (isStaff || (event && ((_a = event.paywalls) === null || _a === void 0 ? void 0 : _a.length)))) {
-            field.product_ids.forEach((p, i) => {
+        if (field.productIds && field.contentAccessType === constants_3.ContentAccessType.PAID && (isStaff || (event && ((_a = event.paywalls) === null || _a === void 0 ? void 0 : _a.length)))) {
+            field.productIds.forEach((p, i) => {
                 formData.append(`product_ids[${i}]`, p.toString());
             });
         }
@@ -332,12 +334,19 @@ function EventForm(inProps) {
         }
         setGenericError(null);
     }, [error, setField, setGenericError]);
+    /**
+     * Handle change content access tyoe
+     * @param type
+     */
+    const handleChangeContentAccessType = (type) => {
+        setField((prev) => (Object.assign(Object.assign({}, prev), { contentAccessType: type })));
+    };
     /**
      * Handle change payment products
      * @param products
      */
     const handleChangePaymentsProducts = (products) => {
-        setField((prev) => (Object.assign(Object.assign({}, prev), { product_ids: products.map((product) => product.id) })));
+        setField((prev) => (Object.assign(Object.assign({}, prev), { productIds: products.map((product) => product.id) })));
     };
     const shouldDisableDate = (0, react_1.useCallback)((date) => {
         let disabled = false;
@@ -421,7 +430,7 @@ function EventForm(inProps) {
                             start_date: field.startDate,
                             location: field.location,
                             geolocation: field.geolocation,
-                            live_stream: Object.assign(Object.assign({ title: field.name || `${intl.formatMessage(messages.name)}` }, (event && ((_d = event.live_stream) === null || _d === void 0 ? void 0 : _d.created_at) && { created_at: field.startDate })), { settings: field.liveStreamSettings })
+                            live_stream: Object.assign(Object.assign({ title: field.name || `${intl.formatMessage(messages.name)}` }, (event && ((_e = event.live_stream) === null || _e === void 0 ? void 0 : _e.created_at) && { created_at: field.startDate })), { settings: field.liveStreamSettings })
                         }) }, EventAddressComponentProps)), privateEnabled && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.privacySection }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ direction: "row", spacing: 1, alignItems: "center", justifyContent: "center" }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: !field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.private", defaultMessage: "ui.eventForm.privacy.private" })] })), (0, jsx_runtime_1.jsx)(material_1.Switch, { className: classes.switch, checked: field.isPublic, onChange: () => setField((prev) => (Object.assign(Object.assign({}, prev), { ['isPublic']: !field.isPublic }))), disabled: (event === null || event === void 0 ? void 0 : event.privacy) === types_1.SCEventPrivacyType.PRIVATE }), (0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.switchLabel, { [classes.active]: field.isPublic }) }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public", defaultMessage: "ui.eventForm.privacy.public" })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2", textAlign: "center", className: classes.privacySectionInfo }, { children: field.isPublic ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.public.info", defaultMessage: "ui.eventForm.privacy.public.info", values: {
                                         // eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
                                         // @ts-ignores
@@ -431,8 +440,8 @@ function EventForm(inProps) {
                                         // @ts-ignore
                                         b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
                                     } })) }))] }))), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                            endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) ? Event_1.EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : Event_1.EVENT_DESCRIPTION_MAX_LENGTH })))
-                        }, error: Boolean(((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_g = field.description) === null || _g === void 0 ? void 0 : _g.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), isPaymentsEnabled && isStaff && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (event && { contentId: event.id }), { contentType: types_1.SCContentType.EVENT, onChange: handleChangePaymentsProducts })) }))), genericError && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.genericError }, { children: (0, jsx_runtime_1.jsx)(material_1.Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
+                            endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) ? Event_1.EVENT_DESCRIPTION_MAX_LENGTH - field.description.length : Event_1.EVENT_DESCRIPTION_MAX_LENGTH })))
+                        }, error: Boolean(((_g = field.description) === null || _g === void 0 ? void 0 : _g.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH), helperText: ((_h = field.description) === null || _h === void 0 ? void 0 : _h.length) > Event_1.EVENT_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.description.error.maxLength", defaultMessage: "ui.eventForm.description.error.maxLength" })) : null }), isPaymentsEnabled && isStaff && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (event && { contentId: event.id }), { contentType: types_1.SCContentType.EVENT, onChangeContentAccessType: handleChangeContentAccessType, onChangePaymentProducts: handleChangePaymentsProducts })) }))), genericError && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.genericError }, { children: (0, jsx_runtime_1.jsx)(material_1.Alert, Object.assign({ variant: "filled", severity: "error" }, { children: genericError })) }))), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.actions }, { children: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, Object.assign({ loading: field.isSubmitting, disabled: !field.name ||
                                 !field.startDate ||
                                 !field.startTime ||
                                 !field.endDate ||

package/lib/cjs/components/EventForm/types.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { SCEventLocationType, SCEventRecurrenceType, SCLiveStreamSettingsType } from '@selfcommunity/types';
+import { ContentAccessType } from '../PaywallsConfigurator/constants';
 export declare type Place = {
     description: string;
     id?: string;
@@ -23,7 +24,8 @@ export declare type InitialFieldState = Geolocation & {
     description: string;
     isPublic: boolean;
     isSubmitting: boolean;
-    product_ids: number[];
+    productIds: number[];
+    contentAccessType: ContentAccessType;
 };
 export declare type FieldStateKeys = keyof InitialFieldState;
 export declare type FieldStateValues = InitialFieldState[FieldStateKeys];

package/lib/cjs/components/EventHeader/EventHeader.js CHANGED Viewed

@@ -20,7 +20,6 @@ const EventSubscribeButton_1 = tslib_1.__importDefault(require("../EventSubscrib
 const User_1 = tslib_1.__importDefault(require("../User"));
 const constants_1 = require("./constants");
 const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
-const BuyButton_1 = tslib_1.__importDefault(require("../BuyButton"));
 const utils_1 = require("@selfcommunity/utils");
 const classes = {
     root: `${constants_1.PREFIX}-root`,
@@ -76,7 +75,6 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  * @param inProps
  */
 function EventHeader(inProps) {
-    var _a;
     // PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -96,8 +94,6 @@ function EventHeader(inProps) {
     // CONST
     const isEventAdmin = (0, react_1.useMemo)(() => { var _a; return scUserContext.user && scEvent && ((_a = scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by) === null || _a === void 0 ? void 0 : _a.id) === scUserContext.user.id; }, [scUserContext.user, scEvent === null || scEvent === void 0 ? void 0 : scEvent.managed_by]);
     const isEventFinished = (0, react_1.useMemo)(() => (0, events_1.checkEventFinished)(scEvent), [scEvent]);
-    // PAYMENTS
-    const { isPaymentsEnabled } = (0, react_core_1.useSCPaymentsEnabled)();
     /**
      * Handles callback subscribe/unsubscribe event
      */
@@ -146,10 +142,6 @@ function EventHeader(inProps) {
                                     month: 'long'
                                 }),
                                 hour: intl.formatDate(scEvent.start_date, { hour: 'numeric', minute: 'numeric' })
-                            } })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.visibility }, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === types_1.SCEventLocationType.PERSON ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), (0, jsx_runtime_1.jsx)(User_1.default, { className: classes.planner, userId: scEvent.managed_by.id, secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isEventAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.multiActions }, { children: [(0, jsx_runtime_1.jsx)(EventInviteButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, disabled: isEventFinished }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [!isMobile && ((0, jsx_runtime_1.jsx)(EditEventButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, onEditSuccess: setSCEvent, disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isPaymentsEnabled &&
-                                        ((_a = scEvent.paywalls) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
-                                        (scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ||
-                                            (scEvent.privacy === types_1.SCEventPrivacyType.PRIVATE &&
-                                                (!scEvent.subscription_status || scEvent.subscription_status !== types_1.SCEventSubscriptionStatusType.REQUESTED))) ? ((0, jsx_runtime_1.jsx)(BuyButton_1.default, { contentType: types_1.SCContentType.EVENT, content: scEvent })) : ((0, jsx_runtime_1.jsx)(EventSubscribeButton_1.default, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished }))), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: setSCEvent }, EventActionsProps))] })) }) })] }))] })));
+                            } })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scEvent.name })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.visibility }, { children: [(0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.public", defaultMessage: "ui.eventHeader.visibility.public" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.visibility.private", defaultMessage: "ui.eventHeader.visibility.private" })] }))) }), (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: scEvent.location === types_1.SCEventLocationType.PERSON ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.live", defaultMessage: "ui.eventHeader.location.live" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.location.online", defaultMessage: "ui.eventHeader.location.online" })) }))] })), (0, jsx_runtime_1.jsx)(User_1.default, { className: classes.planner, userId: scEvent.managed_by.id, secondary: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventHeader.user.manager", defaultMessage: "ui.eventHeader.user.manager" }), elevation: 0, actions: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isEventAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.multiActions }, { children: [(0, jsx_runtime_1.jsx)(EventInviteButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, disabled: isEventFinished }), (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [!isMobile && ((0, jsx_runtime_1.jsx)(EditEventButton_1.default, { size: isMobile ? 'small' : 'medium', event: scEvent, onEditSuccess: setSCEvent, disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: (data) => setSCEvent(data) }, EventActionsProps))] })] }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(EventSubscribeButton_1.default, Object.assign({ event: scEvent, onSubscribe: handleSubscribe }, EventSubscribeButtonProps, { disabled: isEventFinished })), (0, jsx_runtime_1.jsx)(EventActionsMenu_1.default, Object.assign({ event: scEvent, onEditSuccess: setSCEvent }, EventActionsProps))] })) }) })] }))] })));
 }
 exports.default = EventHeader;

package/lib/cjs/components/EventInfoWidget/EventInfoWidget.js CHANGED Viewed

@@ -86,7 +86,14 @@ function EventInfoWidget(inProps) {
                             types_1.SCEventSubscriptionStatusType.NOT_GOING
                         ].indexOf(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) > -1) ||
                         (((_d = scEvent.paywalls) === null || _d === void 0 ? void 0 : _d.length) &&
-                            ((scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation) === types_1.SCEventLocationType.PERSON || (scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) === types_1.SCEventSubscriptionStatusType.GOING)))));
+                            (((scEvent === null || scEvent === void 0 ? void 0 : scEvent.geolocation) === types_1.SCEventLocationType.PERSON &&
+                                [
+                                    types_1.SCEventSubscriptionStatusType.INVITED,
+                                    types_1.SCEventSubscriptionStatusType.SUBSCRIBED,
+                                    types_1.SCEventSubscriptionStatusType.GOING,
+                                    types_1.SCEventSubscriptionStatusType.NOT_GOING
+                                ].indexOf(scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) > -1) ||
+                                (scEvent === null || scEvent === void 0 ? void 0 : scEvent.subscription_status) === types_1.SCEventSubscriptionStatusType.GOING)))));
     }, [scEvent]);
     const description = (0, react_1.useMemo)(() => (expanded ? scEvent === null || scEvent === void 0 ? void 0 : scEvent.description : getTruncatedText(scEvent === null || scEvent === void 0 ? void 0 : scEvent.description, 220)), [expanded, scEvent]);
     /**

package/lib/cjs/components/EventSubscribeButton/EventSubscribeButton.js CHANGED Viewed

@@ -15,6 +15,7 @@ const react_1 = require("react");
 const react_intl_1 = require("react-intl");
 const Errors_1 = require("../../constants/Errors");
 const PubSub_1 = require("../../constants/PubSub");
+const BuyButton_1 = tslib_1.__importDefault(require("../BuyButton"));
 const PREFIX = 'SCEventSubscribeButton';
 const classes = {
     requestRoot: `${PREFIX}-request-root`,
@@ -48,6 +49,10 @@ const SwipeableDrawerRoot = (0, styles_1.styled)(material_1.SwipeableDrawer, {
     name: PREFIX,
     slot: 'DrawerRoot'
 })(() => ({}));
+const BuyButtonRoot = (0, styles_1.styled)(BuyButton_1.default, {
+    name: PREFIX,
+    slot: 'BuyButtonRoot'
+})(() => ({}));
 const MenuRoot = (0, styles_1.styled)(material_1.Menu, {
     name: PREFIX,
     slot: 'MenuRoot'
@@ -75,7 +80,7 @@ const MenuRoot = (0, styles_1.styled)(material_1.Menu, {
  * @param inProps
  */
 function EventSubscribeButton(inProps) {
-    var _a;
+    var _a, _b;
     // PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -93,6 +98,8 @@ function EventSubscribeButton(inProps) {
     const scEventsManager = scUserContext.managers.events;
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
+    // PAYMENTS
+    const { isPaymentsEnabled } = (0, react_core_1.useSCPaymentsEnabled)();
     // CONST
     const authUserId = scUserContext.user ? scUserContext.user.id : null;
     const { scEvent, setSCEvent } = (0, react_core_1.useSCFetchEvent)({
@@ -174,7 +181,12 @@ function EventSubscribeButton(inProps) {
     if (!scEvent || (isEventAdmin && (user === null || user === void 0 ? void 0 : user.id) === scUserContext.user.id) || (isEventAdmin && !(user === null || user === void 0 ? void 0 : user.id))) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (scEvent === null || scEvent === void 0 ? void 0 : scEvent.privacy) === types_1.SCEventPrivacyType.PRIVATE && (!status || status === types_1.SCEventSubscriptionStatusType.REQUESTED) ? ((0, jsx_runtime_1.jsx)(RequestRoot, Object.assign({ className: (0, classnames_1.default)(classes.requestRoot, className), variant: "outlined", size: "small", loading: scUserContext.user ? scEventsManager.isLoading(scEvent) : null, onClick: handleToggleAction }, rest, { children: getStatus }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SelectRoot, Object.assign({ className: (0, classnames_1.default)(classes.selectRoot, className, { [classes.going]: status && status === types_1.SCEventSubscriptionStatusType.GOING }, { [classes.notGoing]: status && status === types_1.SCEventSubscriptionStatusType.NOT_GOING }), onClick: handleOpen, endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: open ? 'expand_less' : 'expand_more' }), startIcon: status &&
-                        status !== types_1.SCEventSubscriptionStatusType.SUBSCRIBED && ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: status === types_1.SCEventSubscriptionStatusType.GOING ? 'circle_checked' : 'circle_closed' })) }, rest, { children: getStatus })), open && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, PaperProps: { className: classes.paper }, open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuItems() }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: true, onClose: handleClose }, { children: renderMenuItems() }))) }))] })) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isPaymentsEnabled &&
+            ((_b = scEvent.paywalls) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
+            (scEvent.privacy === types_1.SCEventPrivacyType.PUBLIC ||
+                (scEvent.privacy === types_1.SCEventPrivacyType.PRIVATE &&
+                    status &&
+                    status !== types_1.SCEventSubscriptionStatusType.REQUESTED)) ? ((0, jsx_runtime_1.jsx)(BuyButtonRoot, { contentType: types_1.SCContentType.EVENT, content: scEvent, showTicket: true })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (scEvent === null || scEvent === void 0 ? void 0 : scEvent.privacy) === types_1.SCEventPrivacyType.PRIVATE && (!status || status === types_1.SCEventSubscriptionStatusType.REQUESTED) ? ((0, jsx_runtime_1.jsx)(RequestRoot, Object.assign({ className: (0, classnames_1.default)(classes.requestRoot, className), variant: "outlined", size: "small", loading: scUserContext.user ? scEventsManager.isLoading(scEvent) : null, onClick: handleToggleAction }, rest, { children: getStatus }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SelectRoot, Object.assign({ className: (0, classnames_1.default)(classes.selectRoot, className, { [classes.going]: status && status === types_1.SCEventSubscriptionStatusType.GOING }, { [classes.notGoing]: status && status === types_1.SCEventSubscriptionStatusType.NOT_GOING }), onClick: handleOpen, endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: open ? 'expand_less' : 'expand_more' }), startIcon: status &&
+                            status !== types_1.SCEventSubscriptionStatusType.SUBSCRIBED && ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: status === types_1.SCEventSubscriptionStatusType.GOING ? 'circle_checked' : 'circle_closed' })) }, rest, { children: getStatus })), open && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: isMobile ? ((0, jsx_runtime_1.jsx)(SwipeableDrawerRoot, Object.assign({ className: classes.drawerRoot, PaperProps: { className: classes.paper }, open: true, onClose: handleClose, onOpen: handleOpen, anchor: "bottom", disableSwipeToOpen: true }, { children: renderMenuItems() }))) : ((0, jsx_runtime_1.jsx)(MenuRoot, Object.assign({ className: classes.menuRoot, anchorEl: anchorEl, open: true, onClose: handleClose }, { children: renderMenuItems() }))) }))] })) })) }));
 }
 exports.default = EventSubscribeButton;

package/lib/cjs/components/GroupForm/GroupForm.js CHANGED Viewed

@@ -23,6 +23,7 @@ const api_services_1 = require("@selfcommunity/api-services");
 const utils_1 = require("@selfcommunity/utils");
 const PubSub_1 = require("../../constants/PubSub");
 const PaywallsConfigurator_1 = tslib_1.__importDefault(require("../PaywallsConfigurator"));
+const constants_2 = require("../PaywallsConfigurator/constants");
 const messages = (0, react_intl_1.defineMessages)({
     name: {
         id: 'ui.groupForm.name.placeholder',
@@ -95,7 +96,7 @@ const Root = (0, styles_1.styled)(BaseDialog_1.default, {
  * @param inProps
  */
 function GroupForm(inProps) {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g;
     //PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -113,7 +114,8 @@ function GroupForm(inProps) {
         isVisible: group ? group.visible : true,
         invitedUsers: null,
         isSubmitting: false,
-        product_ids: ((_a = group === null || group === void 0 ? void 0 : group.paywalls) === null || _a === void 0 ? void 0 : _a.map((p) => p.id)) || []
+        productIds: ((_a = group === null || group === void 0 ? void 0 : group.paywalls) === null || _a === void 0 ? void 0 : _a.map((p) => p.id)) || [],
+        contentAccessType: ((_b = group === null || group === void 0 ? void 0 : group.paywalls) === null || _b === void 0 ? void 0 : _b.length) ? constants_2.ContentAccessType.PAID : constants_2.ContentAccessType.FREE
     };
     // CONTEXT
     const scUserContext = (0, react_core_1.useSCUser)();
@@ -191,8 +193,8 @@ function GroupForm(inProps) {
         if (field.emotionalImageOriginalFile) {
             formData.append('emotional_image_original', field.emotionalImageOriginalFile);
         }
-        if (field.product_ids && (isStaff || (group && ((_a = group.paywalls) === null || _a === void 0 ? void 0 : _a.length)))) {
-            field.product_ids.forEach((p, i) => {
+        if (field.productIds && field.contentAccessType === constants_2.ContentAccessType.PAID && (isStaff || (group && ((_a = group.paywalls) === null || _a === void 0 ? void 0 : _a.length)))) {
+            field.productIds.forEach((p, i) => {
                 formData.append(`product_ids[${i}]`, p.toString());
             });
         }
@@ -232,8 +234,11 @@ function GroupForm(inProps) {
             setError(error);
         }
     };
+    const handleChangeContentAccessType = (type) => {
+        setField((prev) => (Object.assign(Object.assign({}, prev), { contentAccessType: type })));
+    };
     const handleChangePaymentsProducts = (products) => {
-        setField((prev) => (Object.assign(Object.assign({}, prev), { product_ids: products.map((product) => product.id) })));
+        setField((prev) => (Object.assign(Object.assign({}, prev), { productIds: products.map((product) => product.id) })));
     };
     const handleClose = (_event, reason) => {
         if (reason === 'backdropClick' || reason === 'escapeKeyDown') {
@@ -249,9 +254,9 @@ function GroupForm(inProps) {
                 field.name.length > Group_1.GROUP_TITLE_MAX_LENGTH ||
                 field.name.description > Group_1.GROUP_DESCRIPTION_MAX_LENGTH, variant: "contained", onClick: handleSubmit, color: "secondary" }, { children: group ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.button.edit", defaultMessage: "ui.groupForm.button.edit" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.button.create", defaultMessage: "ui.groupForm.button.create" })) })) }, rest, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.avatar }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { children: field.imageOriginal ? (0, jsx_runtime_1.jsx)("img", { src: field.imageOriginal, alt: "avatar" }) : (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "icon_image" }) }) })), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ChangeGroupPicture_1.default, { isCreationMode: true, onChange: handleChangeAvatar }), (0, jsx_runtime_1.jsx)(ChangeGroupCover_1.default, { isCreationMode: true, onChange: handleChangeCover })] })] })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: (0, classnames_1.default)(classes.header, { [classes.error]: error.emotionalImageOriginalError || error.imageOriginalError }), align: "center" }, { children: error.emotionalImageOriginalError || error.imageOriginalError ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.header.error", defaultMessage: "ui.groupForm.header.error" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.header", defaultMessage: "ui.groupForm.header" })) }))] }), (0, jsx_runtime_1.jsxs)(material_1.FormGroup, Object.assign({ className: classes.form }, { children: [(0, jsx_runtime_1.jsx)(material_1.TextField, { required: true, className: classes.name, placeholder: `${intl.formatMessage(messages.name)}`, margin: "normal", value: field.name, name: "name", onChange: handleChange, InputProps: {
                                 endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Group_1.GROUP_TITLE_MAX_LENGTH - field.name.length }))
-                            }, error: Boolean(((_b = field === null || field === void 0 ? void 0 : field.name) === null || _b === void 0 ? void 0 : _b.length) > Group_1.GROUP_TITLE_MAX_LENGTH), helperText: ((_c = field === null || field === void 0 ? void 0 : field.name) === null || _c === void 0 ? void 0 : _c.length) > Group_1.GROUP_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.name.error.maxLength", defaultMessage: "ui.groupForm.name.error.maxLength" })) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
-                                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_d = field.description) === null || _d === void 0 ? void 0 : _d.length) ? Group_1.GROUP_DESCRIPTION_MAX_LENGTH - field.description.length : Group_1.GROUP_DESCRIPTION_MAX_LENGTH })))
-                            }, error: Boolean(((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) > Group_1.GROUP_DESCRIPTION_MAX_LENGTH), helperText: ((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) > Group_1.GROUP_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.description.error.maxLength", defaultMessage: "ui.groupForm.description.error.maxLength" })) : null }), privateEnabled && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.privacySection }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.privacy.title", defaultMessage: "ui.groupForm.privacy.title", values: {
+                            }, error: Boolean(((_c = field === null || field === void 0 ? void 0 : field.name) === null || _c === void 0 ? void 0 : _c.length) > Group_1.GROUP_TITLE_MAX_LENGTH), helperText: ((_d = field === null || field === void 0 ? void 0 : field.name) === null || _d === void 0 ? void 0 : _d.length) > Group_1.GROUP_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.name.error.maxLength", defaultMessage: "ui.groupForm.name.error.maxLength" })) : null }), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder: `${intl.formatMessage(messages.description)}`, margin: "normal", value: field.description, name: "description", onChange: handleChange, InputProps: {
+                                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: ((_e = field.description) === null || _e === void 0 ? void 0 : _e.length) ? Group_1.GROUP_DESCRIPTION_MAX_LENGTH - field.description.length : Group_1.GROUP_DESCRIPTION_MAX_LENGTH })))
+                            }, error: Boolean(((_f = field.description) === null || _f === void 0 ? void 0 : _f.length) > Group_1.GROUP_DESCRIPTION_MAX_LENGTH), helperText: ((_g = field.description) === null || _g === void 0 ? void 0 : _g.length) > Group_1.GROUP_DESCRIPTION_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.description.error.maxLength", defaultMessage: "ui.groupForm.description.error.maxLength" })) : null }), privateEnabled && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.privacySection }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupForm.privacy.title", defaultMessage: "ui.groupForm.privacy.title", values: {
                                             // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                             // @ts-ignore
                                             b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
@@ -279,6 +284,6 @@ function GroupForm(inProps) {
                                                 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
                                                 // @ts-ignore
                                                 b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks })
-                                            } })) }))] })) })))] })), isPaymentsEnabled && isStaff && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (group && { contentId: group.id }), { contentType: types_1.SCContentType.GROUP, onChange: handleChangePaymentsProducts })) }))), !group && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.inviteSection }, { children: (0, jsx_runtime_1.jsx)(GroupInviteButton_1.default, { handleInvitations: handleInviteSection }) }))] }))] }) })));
+                                            } })) }))] })) })))] })), isPaymentsEnabled && isStaff && ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paywallsConfiguratorWrap }, { children: (0, jsx_runtime_1.jsx)(PaywallsConfigurator_1.default, Object.assign({}, (group && { contentId: group.id }), { contentType: types_1.SCContentType.GROUP, onChangeContentAccessType: handleChangeContentAccessType, onChangePaymentProducts: handleChangePaymentsProducts })) }))), !group && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.inviteSection }, { children: (0, jsx_runtime_1.jsx)(GroupInviteButton_1.default, { handleInvitations: handleInviteSection }) }))] }))] }) })));
 }
 exports.default = GroupForm;

package/lib/cjs/components/GroupHeader/GroupHeader.js CHANGED Viewed

@@ -22,7 +22,6 @@ const GroupInviteButton_1 = tslib_1.__importDefault(require("../GroupInviteButto
 const PubSub_1 = require("../../constants/PubSub");
 const pubsub_js_1 = tslib_1.__importDefault(require("pubsub-js"));
 const GroupActionsMenu_1 = tslib_1.__importDefault(require("../GroupActionsMenu"));
-const BuyButton_1 = tslib_1.__importDefault(require("../BuyButton"));
 const classes = {
     root: `${constants_1.PREFIX}-root`,
     cover: `${constants_1.PREFIX}-cover`,
@@ -73,7 +72,7 @@ const Root = (0, styles_1.styled)(material_1.Box, {
  * @param inProps
  */
 function GroupHeader(inProps) {
-    var _a, _b;
+    var _a;
     // PROPS
     const props = (0, system_1.useThemeProps)({
         props: inProps,
@@ -90,8 +89,6 @@ function GroupHeader(inProps) {
     const { scGroup, setSCGroup } = (0, react_core_1.useSCFetchGroup)({ id: groupId, group });
     const theme = (0, material_1.useTheme)();
     const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
-    // PAYMENTS
-    const { isPaymentsEnabled } = (0, react_core_1.useSCPaymentsEnabled)();
     // REFS
     const updatesSubscription = (0, react_1.useRef)(null);
     // CONST
@@ -156,6 +153,6 @@ function GroupHeader(inProps) {
         : { background: `url('${scPreferences.preferences[react_core_1.SCPreferences.IMAGES_USER_DEFAULT_COVER].value}') center / cover` }));
     return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Paper, Object.assign({ style: _backgroundCover, classes: { root: classes.cover } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.avatar }, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { children: (0, jsx_runtime_1.jsx)("img", { alt: "group", src: scGroup.image_big ? scGroup.image_big : '' }) }) })), isGroupAdmin && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(ChangeGroupPicture_1.default, Object.assign({ groupId: scGroup.id, onChange: handleChangeAvatar, className: classes.changePicture }, ChangePictureProps)), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes.changeCover }, { children: (0, jsx_runtime_1.jsx)(ChangeGroupCover_1.default, Object.assign({ groupId: scGroup.id, onChange: handleChangeCover }, ChangeCoverProps)) }))] }))] })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.info }, { children: [isGroupAdmin && !isMobile && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.multiActions }, { children: [(0, jsx_runtime_1.jsx)(EditGroupButton_1.default, { group: scGroup, groupId: scGroup.id, onEditSuccess: (data) => setSCGroup(data) }), (0, jsx_runtime_1.jsx)(GroupActionsMenu_1.default, Object.assign({ group: scGroup, onEditSuccess: (data) => setSCGroup(data) }, GroupActionsProps))] }))), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h5", className: classes.name }, { children: scGroup.name })), privateEnabled && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.visibility }, { children: [privateEnabled && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: scGroup.privacy === types_1.SCGroupPrivacyType.PUBLIC ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "public" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupHeader.visibility.public", defaultMessage: "ui.groupHeader.visibility.public" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "private" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupHeader.visibility.private", defaultMessage: "ui.groupHeader.visibility.private" })] }))) })), visibilityEnabled && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [privateEnabled && (0, jsx_runtime_1.jsx)(Bullet_1.default, {}), scGroup.visible ? ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "visibility" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupHeader.visibility.visible", defaultMessage: "ui.groupHeader.visibility.visible" })] }))) : ((0, jsx_runtime_1.jsxs)(material_1.Typography, Object.assign({ className: classes.visibilityItem }, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "visibility_off" }), (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupHeader.visibility.hidden", defaultMessage: "ui.groupHeader.visibility.hidden" })] })))] }))] }))), (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: ((scGroup && scGroup.privacy === types_1.SCGroupPrivacyType.PUBLIC) ||
                             scGroup.subscription_status === types_1.SCGroupSubscriptionStatusType.SUBSCRIBED ||
-                            isGroupAdmin) && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.members }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.membersCounter, component: "div" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupHeader.members", defaultMessage: "ui.groupHeader.members", values: { total: scGroup.subscribers_counter } }) })), (0, jsx_runtime_1.jsx)(GroupMembersButton_1.default, Object.assign({ groupId: scGroup === null || scGroup === void 0 ? void 0 : scGroup.id, group: scGroup, autoHide: !isGroupAdmin }, GroupMembersButtonProps), scGroup.subscribers_counter)] }))) }), isGroupAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(GroupInviteButton_1.default, { group: scGroup, groupId: scGroup.id }), isMobile && (0, jsx_runtime_1.jsx)(GroupActionsMenu_1.default, Object.assign({ group: scGroup, onEditSuccess: (data) => setSCGroup(data) }, GroupActionsProps))] })) : isPaymentsEnabled && ((_b = scGroup.paywalls) === null || _b === void 0 ? void 0 : _b.length) > 0 && scGroup.subscription_status !== types_1.SCGroupSubscriptionStatusType.REQUESTED ? ((0, jsx_runtime_1.jsx)(BuyButton_1.default, { contentType: types_1.SCContentType.GROUP, content: scGroup })) : ((0, jsx_runtime_1.jsx)(GroupSubscribeButton_1.default, Object.assign({ group: scGroup, onSubscribe: handleSubscribe }, GroupSubscribeButtonProps)))] }))] })));
+                            isGroupAdmin) && ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.members }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.membersCounter, component: "div" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.groupHeader.members", defaultMessage: "ui.groupHeader.members", values: { total: scGroup.subscribers_counter } }) })), (0, jsx_runtime_1.jsx)(GroupMembersButton_1.default, Object.assign({ groupId: scGroup === null || scGroup === void 0 ? void 0 : scGroup.id, group: scGroup, autoHide: !isGroupAdmin }, GroupMembersButtonProps), scGroup.subscribers_counter)] }))) }), isGroupAdmin ? ((0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(GroupInviteButton_1.default, { group: scGroup, groupId: scGroup.id }), isMobile && (0, jsx_runtime_1.jsx)(GroupActionsMenu_1.default, Object.assign({ group: scGroup, onEditSuccess: (data) => setSCGroup(data) }, GroupActionsProps))] })) : ((0, jsx_runtime_1.jsx)(GroupSubscribeButton_1.default, Object.assign({ group: scGroup, onSubscribe: handleSubscribe }, GroupSubscribeButtonProps)))] }))] })));
 }
 exports.default = GroupHeader;