@selfcommunity/react-ui 0.11.0-mui7.24 → 0.11.0-mui7.27
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.
- package/lib/cjs/components/Composer/Layer/ScheduledLayer/ScheduledLayer.js +1 -1
- package/lib/cjs/components/EventForm/EventAddress.js +3 -3
- package/lib/cjs/components/EventForm/EventForm.js +75 -56
- package/lib/cjs/components/EventLocationWidget/EventLocationWidget.js +4 -9
- package/lib/cjs/components/EventLocationWidget/EventMap.d.ts +8 -0
- package/lib/cjs/components/EventLocationWidget/EventMap.js +22 -0
- package/lib/cjs/components/LessonReleaseMenu/LessonReleaseMenu.js +13 -14
- package/lib/cjs/components/LocationAutocomplete/LocationAutocomplete.js +10 -9
- package/lib/cjs/components/PaymentOrders/PaymentOrders.js +27 -25
- package/lib/cjs/components/UserProfileEdit/Section/PublicInfo.js +5 -15
- package/lib/cjs/shared/Media/File/DocComponent.d.ts +2 -0
- package/lib/cjs/shared/Media/File/DocComponent.js +3 -2
- package/lib/cjs/shared/Media/File/PreviewComponent.js +4 -3
- package/lib/esm/components/Composer/Layer/ScheduledLayer/ScheduledLayer.js +1 -1
- package/lib/esm/components/EventForm/EventAddress.js +3 -3
- package/lib/esm/components/EventForm/EventForm.js +76 -57
- package/lib/esm/components/EventLocationWidget/EventLocationWidget.js +5 -10
- package/lib/esm/components/EventLocationWidget/EventMap.d.ts +8 -0
- package/lib/esm/components/EventLocationWidget/EventMap.js +19 -0
- package/lib/esm/components/LessonReleaseMenu/LessonReleaseMenu.js +13 -14
- package/lib/esm/components/LocationAutocomplete/LocationAutocomplete.js +2 -1
- package/lib/esm/components/PaymentOrders/PaymentOrders.js +27 -25
- package/lib/esm/components/UserProfileEdit/Section/PublicInfo.js +8 -18
- package/lib/esm/shared/Media/File/DocComponent.d.ts +2 -0
- package/lib/esm/shared/Media/File/DocComponent.js +3 -2
- package/lib/esm/shared/Media/File/PreviewComponent.js +4 -3
- package/lib/umd/484.js +1 -1
- package/lib/umd/484.js.LICENSE.txt +1 -1
- package/lib/umd/react-ui.js +1 -1
- package/package.json +11 -11
- package/lib/cjs/shared/UpScalingTierBadge/UpScalingTierBadge.d.ts +0 -5
- package/lib/cjs/shared/UpScalingTierBadge/UpScalingTierBadge.js +0 -14
- package/lib/esm/shared/UpScalingTierBadge/UpScalingTierBadge.d.ts +0 -5
- package/lib/esm/shared/UpScalingTierBadge/UpScalingTierBadge.js +0 -10
|
@@ -48,7 +48,7 @@ const ScheduledLayer = react_1.default.forwardRef((props, ref) => {
|
|
|
48
48
|
const restOfDate = (0, date_fns_1.format)(value, 'd MMMM yyyy • HH:mm', { locale });
|
|
49
49
|
return (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4" }, { children: `${dayName} ${restOfDate}` }));
|
|
50
50
|
};
|
|
51
|
-
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ ref: ref, className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogTitle, Object.assign({ className: classes.title }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.scheduled.title", defaultMessage: "Programma la Pubblicazione" }) }), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", color: "secondary", variant: "contained", onClick: () => onSave(scheduledAt), disabled: !scheduledAt }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.scheduled.submit", defaultMessage: "Attiva Programmazione" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.message }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.scheduled.message", defaultMessage: "ui.composer.audience.scheduled.message" }) })), (0, jsx_runtime_1.jsx)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: locale }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.StaticDateTimePicker, { className: classes.picker, disablePast: true, value: scheduledAt, onChange:
|
|
51
|
+
return ((0, jsx_runtime_1.jsxs)(Root, Object.assign({ ref: ref, className: (0, classnames_1.default)(className, classes.root) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.DialogTitle, Object.assign({ className: classes.title }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow_back" }) })), (0, jsx_runtime_1.jsx)(material_1.Typography, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.scheduled.title", defaultMessage: "Programma la Pubblicazione" }) }), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ size: "small", color: "secondary", variant: "contained", onClick: () => onSave(scheduledAt), disabled: !scheduledAt }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.scheduled.submit", defaultMessage: "Attiva Programmazione" }) }))] })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, Object.assign({ className: classes.content }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ className: classes.message }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.composer.layer.scheduled.message", defaultMessage: "ui.composer.audience.scheduled.message" }) })), (0, jsx_runtime_1.jsx)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: locale }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.StaticDateTimePicker, { className: classes.picker, disablePast: true, value: scheduledAt, onChange: setScheduledAt, onAccept: handleUpdate, slots: {
|
|
52
52
|
toolbar: CustomToolbar,
|
|
53
53
|
tabs: (props) => (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePickerTabs, Object.assign({}, props)),
|
|
54
54
|
actionBar: () => null
|
|
@@ -86,7 +86,7 @@ function EventAddress(inProps) {
|
|
|
86
86
|
(event.live_stream && event.live_stream.created_at);
|
|
87
87
|
}, [liveStreamEnabled, (_a = scUserContext === null || scUserContext === void 0 ? void 0 : scUserContext.user) === null || _a === void 0 ? void 0 : _a.permission, event]);
|
|
88
88
|
// HOOKS
|
|
89
|
-
const { isLoaded, geocodingApiKey } = (0, react_core_2.useSCGoogleApiLoader)();
|
|
89
|
+
const { isLoaded, geocodingApiKey, placesLibrary } = (0, react_core_2.useSCGoogleApiLoader)();
|
|
90
90
|
// HANDLERS
|
|
91
91
|
const handleChange = (_event, newValue) => {
|
|
92
92
|
setLocation(newValue);
|
|
@@ -134,9 +134,9 @@ function EventAddress(inProps) {
|
|
|
134
134
|
}
|
|
135
135
|
if (inputValue.length >= 3) {
|
|
136
136
|
const newTimeoutId = setTimeout(() => {
|
|
137
|
-
const autocompleteService = new
|
|
137
|
+
const autocompleteService = new placesLibrary.AutocompleteService(); // TODO - deprecated, to fix when possibile
|
|
138
138
|
autocompleteService.getPlacePredictions({ input: inputValue }, (predictions, status) => {
|
|
139
|
-
if (status ===
|
|
139
|
+
if (status === placesLibrary.PlacesServiceStatus.OK && predictions) {
|
|
140
140
|
setSuggestions(predictions.map((prediction) => ({
|
|
141
141
|
description: prediction.description,
|
|
142
142
|
id: prediction.place_id
|
|
@@ -27,7 +27,16 @@ const constants_2 = require("../LiveStreamForm/constants");
|
|
|
27
27
|
const deafultCover_1 = tslib_1.__importDefault(require("../../assets/deafultCover"));
|
|
28
28
|
const PaywallsConfigurator_1 = tslib_1.__importDefault(require("../PaywallsConfigurator"));
|
|
29
29
|
const constants_3 = require("../PaywallsConfigurator/constants");
|
|
30
|
+
const react_google_maps_1 = require("@vis.gl/react-google-maps");
|
|
30
31
|
const messages = (0, react_intl_1.defineMessages)({
|
|
32
|
+
titleDate: {
|
|
33
|
+
id: 'ui.eventForm.date.title',
|
|
34
|
+
defaultMessage: 'ui.eventForm.date.title'
|
|
35
|
+
},
|
|
36
|
+
titleTime: {
|
|
37
|
+
id: 'ui.eventForm.time.title',
|
|
38
|
+
defaultMessage: 'ui.eventForm.time.title'
|
|
39
|
+
},
|
|
31
40
|
name: {
|
|
32
41
|
id: 'ui.eventForm.name.placeholder',
|
|
33
42
|
defaultMessage: 'ui.eventForm.name.placeholder'
|
|
@@ -172,6 +181,8 @@ function EventForm(inProps) {
|
|
|
172
181
|
const [field, setField] = (0, react_1.useState)(initialFieldState);
|
|
173
182
|
const [error, setError] = (0, react_1.useState)({});
|
|
174
183
|
const [genericError, setGenericError] = (0, react_1.useState)(null);
|
|
184
|
+
// HOOKS
|
|
185
|
+
const { geocodingApiKey, libraries } = (0, react_core_1.useSCGoogleApiLoader)();
|
|
175
186
|
// PREFERENCES
|
|
176
187
|
const scPreferences = (0, react_core_1.useSCPreferences)();
|
|
177
188
|
const liveStreamEnabled = (0, react_1.useMemo)(() => scPreferences.preferences &&
|
|
@@ -376,89 +387,97 @@ function EventForm(inProps) {
|
|
|
376
387
|
endAdornment: (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: Event_1.EVENT_TITLE_MAX_LENGTH - field.name.length }))
|
|
377
388
|
}
|
|
378
389
|
}, error: Boolean(field.name.length > Event_1.EVENT_TITLE_MAX_LENGTH) || Boolean(error['nameError']), helperText: field.name.length > Event_1.EVENT_TITLE_MAX_LENGTH ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.name.error.maxLength", defaultMessage: "ui.eventForm.name.error.maxLength" })) : error['nameError'] ? (error['nameError']) : null }), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.dateTime }, { children: (0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.it : en_US_1.enUS, localeText: {
|
|
379
|
-
cancelButtonLabel:
|
|
380
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, disablePast: !event, minDate: minStartDate, label: field.startDate && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, enableAccessibleFieldDOMStructure: false,
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.startDate)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }) }))) })
|
|
385
|
-
} })));
|
|
386
|
-
}
|
|
390
|
+
cancelButtonLabel: intl.formatMessage(messages.pickerCancelAction)
|
|
391
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, disablePast: !event, minDate: minStartDate, label: field.startDate && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.placeholder", defaultMessage: "ui.eventForm.date.placeholder" }), value: field.startDate, enableAccessibleFieldDOMStructure: false, localeText: {
|
|
392
|
+
toolbarTitle: intl.formatMessage(messages.titleDate)
|
|
393
|
+
}, slots: {
|
|
394
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, params, { sx: { marginLeft: 0 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) })))
|
|
387
395
|
}, slotProps: {
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
396
|
+
field: {
|
|
397
|
+
openPickerButtonPosition: 'start'
|
|
398
|
+
},
|
|
399
|
+
textField: {
|
|
400
|
+
slotProps: {
|
|
401
|
+
input: {
|
|
402
|
+
placeholder: intl.formatMessage(messages.startDate)
|
|
403
|
+
}
|
|
404
|
+
}
|
|
392
405
|
}
|
|
393
406
|
}, onChange: (value) => {
|
|
394
407
|
handleChangeDateTime(value, 'startDate');
|
|
395
408
|
handleChangeDateTime(value, 'startTime');
|
|
396
|
-
} }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, minTime: minStartTime, label: field.startTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, enableAccessibleFieldDOMStructure: false,
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.startTime)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }) }) }))) })
|
|
401
|
-
} })));
|
|
402
|
-
}
|
|
409
|
+
} }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastStartTime, minTime: minStartTime, label: field.startTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.placeholder", defaultMessage: "ui.eventForm.time.placeholder" }), value: field.startTime, enableAccessibleFieldDOMStructure: false, localeText: {
|
|
410
|
+
toolbarTitle: intl.formatMessage(messages.titleTime)
|
|
411
|
+
}, slots: {
|
|
412
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, params, { sx: { marginLeft: 0 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }) })))
|
|
403
413
|
}, slotProps: {
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
414
|
+
field: {
|
|
415
|
+
openPickerButtonPosition: 'start'
|
|
416
|
+
},
|
|
417
|
+
textField: {
|
|
418
|
+
slotProps: {
|
|
419
|
+
input: {
|
|
420
|
+
placeholder: intl.formatMessage(messages.startTime)
|
|
421
|
+
}
|
|
422
|
+
}
|
|
408
423
|
}
|
|
409
424
|
}, onChange: (value) => {
|
|
410
425
|
handleChangeDateTime(value, 'startDate');
|
|
411
426
|
handleChangeDateTime(value, 'startTime');
|
|
412
|
-
} })] })) })), (0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ className: classes.frequency }, { children: [field.recurring !== types_1.SCEventRecurrenceType.NEVER && (0, jsx_runtime_1.jsx)(material_1.InputLabel, Object.assign({ id: "recurring" }, { children:
|
|
427
|
+
} })] })) })), (0, jsx_runtime_1.jsxs)(material_1.FormControl, Object.assign({ className: classes.frequency }, { children: [field.recurring !== types_1.SCEventRecurrenceType.NEVER && (0, jsx_runtime_1.jsx)(material_1.InputLabel, Object.assign({ id: "recurring" }, { children: intl.formatMessage(messages.frequency) })), (0, jsx_runtime_1.jsx)(material_1.Select, Object.assign({ name: "recurring", label: field.recurring !== types_1.SCEventRecurrenceType.NEVER && intl.formatMessage(messages.frequency), labelId: "recurring", value: field.recurring, onChange: handleChange, displayEmpty: true, renderValue: (selected) => {
|
|
413
428
|
if (!selected) {
|
|
414
|
-
return (0, jsx_runtime_1.jsx)("em", { children:
|
|
429
|
+
return (0, jsx_runtime_1.jsx)("em", { children: intl.formatMessage(messages.frequencyPlaceholder) });
|
|
415
430
|
}
|
|
416
431
|
return ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.eventForm.frequency.${selected}.placeholder`, defaultMessage: `ui.eventForm.frequency.${selected}.placeholder` }));
|
|
417
432
|
}, startAdornment: (0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "frequency" }) }) })) }, { children: Object.values(types_1.SCEventRecurrenceType).map((f) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: f }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.eventForm.frequency.${f}.placeholder`, defaultMessage: `ui.eventForm.frequency.${f}.placeholder` }) }), f))) }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.dateTime }, { children: (0, jsx_runtime_1.jsxs)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.it : en_US_1.enUS, localeText: {
|
|
418
|
-
cancelButtonLabel:
|
|
419
|
-
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, minDate: field.startDate, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, enableAccessibleFieldDOMStructure: false,
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.endDate)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "calendar_off" }) }) }))) })
|
|
424
|
-
} })));
|
|
425
|
-
}
|
|
433
|
+
cancelButtonLabel: intl.formatMessage(messages.pickerCancelAction)
|
|
434
|
+
} }, { children: [(0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, minDate: field.startDate, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.date.end.placeholder", defaultMessage: "ui.eventForm.date.end.placeholder" }), value: field.endDate, enableAccessibleFieldDOMStructure: false, localeText: {
|
|
435
|
+
toolbarTitle: intl.formatMessage(messages.titleDate)
|
|
436
|
+
}, slots: {
|
|
437
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, params, { sx: { marginLeft: 0 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "calendar_off" }) })))
|
|
426
438
|
}, slotProps: {
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
439
|
+
field: {
|
|
440
|
+
openPickerButtonPosition: 'start'
|
|
441
|
+
},
|
|
442
|
+
textField: {
|
|
443
|
+
slotProps: {
|
|
444
|
+
input: {
|
|
445
|
+
placeholder: intl.formatMessage(messages.endDate)
|
|
446
|
+
}
|
|
447
|
+
}
|
|
431
448
|
}
|
|
432
449
|
}, onChange: (value) => {
|
|
433
450
|
handleChangeDateTime(value, 'endDate');
|
|
434
451
|
handleChangeDateTime(value, 'endTime');
|
|
435
|
-
}, shouldDisableDate: shouldDisableDate }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, enableAccessibleFieldDOMStructure: false,
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.endTime)}`, startAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "start" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }) }) }))) })
|
|
440
|
-
} })));
|
|
441
|
-
}
|
|
452
|
+
}, shouldDisableDate: shouldDisableDate }), (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileTimePicker, { className: classes.picker, disablePast: disablePastEndTime, label: field.endTime && (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.time.end.placeholder", defaultMessage: "ui.eventForm.time.end.placeholder" }), value: field.endTime, enableAccessibleFieldDOMStructure: false, localeText: {
|
|
453
|
+
toolbarTitle: intl.formatMessage(messages.titleTime)
|
|
454
|
+
}, slots: {
|
|
455
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, params, { sx: { marginLeft: 0 } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "access_time" }) })))
|
|
442
456
|
}, slotProps: {
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
457
|
+
field: {
|
|
458
|
+
openPickerButtonPosition: 'start'
|
|
459
|
+
},
|
|
460
|
+
textField: {
|
|
461
|
+
slotProps: {
|
|
462
|
+
input: {
|
|
463
|
+
placeholder: intl.formatMessage(messages.endTime)
|
|
464
|
+
}
|
|
465
|
+
}
|
|
447
466
|
}
|
|
448
467
|
}, onChange: (value) => {
|
|
449
468
|
handleChangeDateTime(value, 'endDate');
|
|
450
469
|
handleChangeDateTime(value, 'endTime');
|
|
451
|
-
}, shouldDisableTime: shouldDisableTime })] })) })), (0, jsx_runtime_1.jsx)(EventAddress_1.default, Object.assign({ forwardGeolocationData: handleGeoData, forwardLivestreamSettingsData: handleLiveStreamSettingsData, event: Object.assign(Object.assign({}, event), {
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
470
|
+
}, shouldDisableTime: shouldDisableTime })] })) })), (0, jsx_runtime_1.jsx)(react_google_maps_1.APIProvider, Object.assign({ apiKey: geocodingApiKey, libraries: libraries }, { children: (0, jsx_runtime_1.jsx)(EventAddress_1.default, Object.assign({ forwardGeolocationData: handleGeoData, forwardLivestreamSettingsData: handleLiveStreamSettingsData, event: Object.assign(Object.assign({}, event), {
|
|
471
|
+
name: field.name,
|
|
472
|
+
start_date: field.startDate,
|
|
473
|
+
location: field.location,
|
|
474
|
+
geolocation: field.geolocation,
|
|
475
|
+
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 })
|
|
476
|
+
}) }, 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: {
|
|
458
477
|
b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }, "ui.eventForm.privacy.public.info.b")
|
|
459
478
|
} })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventForm.privacy.private.info", defaultMessage: "ui.eventForm.private.public.info", values: {
|
|
460
479
|
b: (chunks) => (0, jsx_runtime_1.jsx)("strong", { children: chunks }, "ui.eventForm.privacy.private.info.b")
|
|
461
|
-
} })) }))] }))), (0, jsx_runtime_1.jsx)(material_1.TextField, { multiline: true, className: classes.description, placeholder:
|
|
480
|
+
} })) }))] }))), (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, slotProps: {
|
|
462
481
|
input: {
|
|
463
482
|
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 })))
|
|
464
483
|
}
|
|
@@ -14,6 +14,7 @@ const string_1 = require("../../utils/string");
|
|
|
14
14
|
const Widget_1 = tslib_1.__importDefault(require("../Widget"));
|
|
15
15
|
const constants_1 = require("./constants");
|
|
16
16
|
const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
|
|
17
|
+
const EventMap_1 = tslib_1.__importDefault(require("./EventMap"));
|
|
17
18
|
const classes = {
|
|
18
19
|
root: `${constants_1.PREFIX}-root`,
|
|
19
20
|
title: `${constants_1.PREFIX}-title`,
|
|
@@ -66,25 +67,19 @@ function EventLocationWidget(inProps) {
|
|
|
66
67
|
// STATE
|
|
67
68
|
const { scEvent } = (0, react_core_1.useSCFetchEvent)({ id: eventId, event });
|
|
68
69
|
// HOOKS
|
|
69
|
-
const {
|
|
70
|
+
const { geocodingApiKey, libraries } = (0, react_core_1.useSCGoogleApiLoader)();
|
|
70
71
|
if (!geocodingApiKey || (scEvent === null || scEvent === void 0 ? void 0 : scEvent.location) === types_1.SCEventLocationType.ONLINE) {
|
|
71
72
|
return (0, jsx_runtime_1.jsx)(HiddenPlaceholder_1.default, {});
|
|
72
73
|
}
|
|
73
74
|
/**
|
|
74
75
|
* Loading event
|
|
75
76
|
*/
|
|
76
|
-
if (!
|
|
77
|
+
if (!scEvent) {
|
|
77
78
|
return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
|
|
78
79
|
}
|
|
79
80
|
/**
|
|
80
81
|
* Renders root object
|
|
81
82
|
*/
|
|
82
|
-
return ((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.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.title, gutterBottom: true }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventLocationWidget.title", defaultMessage: "ui.eventLocationWidget.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.map }, { children: (0, jsx_runtime_1.jsx)(react_google_maps_1.APIProvider, Object.assign({ apiKey: geocodingApiKey }, { children: (0, jsx_runtime_1.jsx)(
|
|
83
|
-
lat: scEvent.geolocation_lat,
|
|
84
|
-
lng: scEvent.geolocation_lng
|
|
85
|
-
}, zoom: 15, fullscreenControl: false, mapTypeControl: false, streetViewControl: false, zoomControl: false }, { children: (0, jsx_runtime_1.jsx)(react_google_maps_1.Marker, { position: {
|
|
86
|
-
lat: scEvent.geolocation_lat,
|
|
87
|
-
lng: scEvent.geolocation_lng
|
|
88
|
-
} }) })) })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.locationTitle }, { children: (0, string_1.formatEventLocationGeolocation)(scEvent.geolocation, true) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.address }, { children: (0, string_1.formatEventLocationGeolocation)(scEvent.geolocation) }))] }) })));
|
|
83
|
+
return ((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.CardContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.title, gutterBottom: true }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.eventLocationWidget.title", defaultMessage: "ui.eventLocationWidget.title" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.map }, { children: (0, jsx_runtime_1.jsx)(react_google_maps_1.APIProvider, Object.assign({ apiKey: geocodingApiKey, libraries: libraries }, { children: (0, jsx_runtime_1.jsx)(EventMap_1.default, { event: scEvent, className: classes.map }) })) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h4", className: classes.locationTitle }, { children: (0, string_1.formatEventLocationGeolocation)(scEvent.geolocation, true) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body1", className: classes.address }, { children: (0, string_1.formatEventLocationGeolocation)(scEvent.geolocation) }))] }) })));
|
|
89
84
|
}
|
|
90
85
|
exports.default = EventLocationWidget;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { SCEventType } from '@selfcommunity/types';
|
|
2
|
+
import { HTMLAttributes } from 'react';
|
|
3
|
+
interface EventMapProps {
|
|
4
|
+
event: SCEventType;
|
|
5
|
+
className?: HTMLAttributes<HTMLDivElement>['className'];
|
|
6
|
+
}
|
|
7
|
+
export default function EventMap(props: EventMapProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
|
+
const react_core_1 = require("@selfcommunity/react-core");
|
|
5
|
+
const react_google_maps_1 = require("@vis.gl/react-google-maps");
|
|
6
|
+
function EventMap(props) {
|
|
7
|
+
// PROPS
|
|
8
|
+
const { event, className } = props;
|
|
9
|
+
// HOOKS
|
|
10
|
+
const { isLoaded } = (0, react_core_1.useSCGoogleApiLoader)();
|
|
11
|
+
if (!isLoaded) {
|
|
12
|
+
return null;
|
|
13
|
+
}
|
|
14
|
+
return ((0, jsx_runtime_1.jsx)(react_google_maps_1.Map, Object.assign({ className: className, center: {
|
|
15
|
+
lat: event.geolocation_lat,
|
|
16
|
+
lng: event.geolocation_lng
|
|
17
|
+
}, zoom: 15, fullscreenControl: false, mapTypeControl: false, streetViewControl: false, zoomControl: false }, { children: (0, jsx_runtime_1.jsx)(react_google_maps_1.Marker, { position: {
|
|
18
|
+
lat: event.geolocation_lat,
|
|
19
|
+
lng: event.geolocation_lng
|
|
20
|
+
} }) })));
|
|
21
|
+
}
|
|
22
|
+
exports.default = EventMap;
|
|
@@ -139,28 +139,27 @@ function LessonReleaseMenu(inProps) {
|
|
|
139
139
|
okButtonLabel: `${intl.formatMessage(messages.pickerOkMessage)}`,
|
|
140
140
|
cancelButtonLabel: `${intl.formatMessage(messages.pickerCancelMessage)}`,
|
|
141
141
|
clearButtonLabel: `${intl.formatMessage(messages.pickerClearMessage)}`
|
|
142
|
-
} }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDateTimePicker, { className: classes.picker, disablePast: true, label: drippedAt && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonReleaseMenu.scheduled.picker.placeholder", defaultMessage: "ui.lessonReleaseMenu.scheduled.picker.placeholder" })), value: drippedAt, enableAccessibleFieldDOMStructure: false,
|
|
143
|
-
|
|
142
|
+
} }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDateTimePicker, { className: classes.picker, disablePast: true, label: drippedAt && ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonReleaseMenu.scheduled.picker.placeholder", defaultMessage: "ui.lessonReleaseMenu.scheduled.picker.placeholder" })), value: drippedAt, enableAccessibleFieldDOMStructure: false, localeText: {
|
|
143
|
+
toolbarTitle: intl.formatMessage(messages.pickerPlaceholder)
|
|
144
|
+
}, slots: {
|
|
144
145
|
tabs: (props) => (0, jsx_runtime_1.jsx)(x_date_pickers_1.DateTimePickerTabs, Object.assign({}, props)),
|
|
145
|
-
|
|
146
|
-
var _a;
|
|
147
|
-
return ((0, jsx_runtime_1.jsx)(material_2.TextField, Object.assign({}, params, { error: false, slotProps: {
|
|
148
|
-
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.pickerPlaceholder)}`, endAdornment: ((0, jsx_runtime_1.jsx)(material_2.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_2.IconButton, Object.assign({ disabled: isDisabled }, { children: (0, jsx_runtime_1.jsx)(material_2.Icon, { children: "expand_more" }) })) }))) })
|
|
149
|
-
} })));
|
|
150
|
-
}
|
|
146
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsx)(material_2.IconButton, Object.assign({}, params, { children: (0, jsx_runtime_1.jsx)(material_2.Icon, { children: "expand_more" }) })))
|
|
151
147
|
}, slotProps: {
|
|
152
148
|
tabs: {
|
|
153
149
|
hidden: false
|
|
154
150
|
},
|
|
155
|
-
toolbar: {
|
|
156
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
157
|
-
// @ts-ignore
|
|
158
|
-
toolbarTitle: ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.lessonReleaseMenu.scheduled.picker.placeholder", defaultMessage: "ui.lessonReleaseMenu.scheduled.picker.placeholder" }))
|
|
159
|
-
},
|
|
160
151
|
actionBar: {
|
|
161
152
|
actions: ['cancel', 'clear', 'accept']
|
|
153
|
+
},
|
|
154
|
+
textField: {
|
|
155
|
+
error: false,
|
|
156
|
+
slotProps: {
|
|
157
|
+
input: {
|
|
158
|
+
placeholder: intl.formatMessage(messages.pickerPlaceholder)
|
|
159
|
+
}
|
|
160
|
+
}
|
|
162
161
|
}
|
|
163
|
-
}, onChange:
|
|
162
|
+
}, onChange: setDrippedAt, onAccept: handleUpdate, disabled: isDisabled }) }))) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_2.TextField, { size: "small", value: placeholderStructured, onClick: isDisabled ? undefined : handleClick, slotProps: {
|
|
164
163
|
input: {
|
|
165
164
|
endAdornment: ((0, jsx_runtime_1.jsx)(material_2.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_2.IconButton, Object.assign({ onClick: handleClick, disabled: isDisabled }, { children: (0, jsx_runtime_1.jsx)(material_2.Icon, { children: "expand_more" }) })) })))
|
|
166
165
|
}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
const tslib_1 = require("tslib");
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
4
|
const react_1 = require("react");
|
|
5
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
const react_2 = require("react");
|
|
6
7
|
const react_intl_1 = require("react-intl");
|
|
7
8
|
const material_1 = require("@mui/material");
|
|
8
9
|
const api_services_1 = require("@selfcommunity/api-services");
|
|
@@ -53,10 +54,10 @@ function LocationAutocomplete(inProps) {
|
|
|
53
54
|
label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.locationAutocomplete.label", defaultMessage: "ui.composer.locations.label" })
|
|
54
55
|
} } = props, rest = tslib_1.__rest(props, ["defaultValue", "disabled", "onChange", "TextFieldProps"]);
|
|
55
56
|
// State
|
|
56
|
-
const [isLoading, setIsLoading] = (0,
|
|
57
|
-
const [locations, setLocations] = (0,
|
|
58
|
-
const [value, setValue] = (0,
|
|
59
|
-
const [search, setSearch] = (0,
|
|
57
|
+
const [isLoading, setIsLoading] = (0, react_2.useState)(false);
|
|
58
|
+
const [locations, setLocations] = (0, react_2.useState)([]);
|
|
59
|
+
const [value, setValue] = (0, react_2.useState)(defaultValue);
|
|
60
|
+
const [search, setSearch] = (0, react_2.useState)('');
|
|
60
61
|
const load = (offset = 0, limit = 20) => {
|
|
61
62
|
api_services_1.http
|
|
62
63
|
.request({
|
|
@@ -74,12 +75,12 @@ function LocationAutocomplete(inProps) {
|
|
|
74
75
|
.then(() => setIsLoading(false));
|
|
75
76
|
};
|
|
76
77
|
// Component update
|
|
77
|
-
(0,
|
|
78
|
+
(0, react_2.useEffect)(() => {
|
|
78
79
|
if (!isLoading && search.trim().length > 0) {
|
|
79
80
|
load();
|
|
80
81
|
}
|
|
81
82
|
}, [search]);
|
|
82
|
-
(0,
|
|
83
|
+
(0, react_2.useEffect)(() => {
|
|
83
84
|
if (value) {
|
|
84
85
|
onChange && onChange(value);
|
|
85
86
|
}
|
|
@@ -93,7 +94,7 @@ function LocationAutocomplete(inProps) {
|
|
|
93
94
|
setSearch(_search);
|
|
94
95
|
};
|
|
95
96
|
// Render
|
|
96
|
-
const options = (0,
|
|
97
|
+
const options = (0, react_2.useMemo)(() => {
|
|
97
98
|
if (!value || typeof value === 'string' || locations.find((loc) => value.lat === loc.lat && value.lng === loc.lng)) {
|
|
98
99
|
return locations;
|
|
99
100
|
}
|
|
@@ -106,7 +107,7 @@ function LocationAutocomplete(inProps) {
|
|
|
106
107
|
}, renderOption: (props, option, { inputValue }) => {
|
|
107
108
|
const matches = (0, match_1.default)(option.full_address, inputValue);
|
|
108
109
|
const parts = (0, parse_1.default)(option.full_address, matches);
|
|
109
|
-
return ((0,
|
|
110
|
+
return ((0, react_1.createElement)("li", Object.assign({}, props, { key: `${option.lat}_${option.lng}`, style: { whiteSpace: 'break-spaces' } }), parts.map((part, index) => part.highlight ? ((0, jsx_runtime_1.jsx)("span", Object.assign({ style: { fontWeight: 700 } }, { children: part.text }), index)) : (part.text))));
|
|
110
111
|
} }, rest)));
|
|
111
112
|
}
|
|
112
113
|
exports.default = LocationAutocomplete;
|
|
@@ -28,6 +28,10 @@ const en_US_1 = require("date-fns/locale/en-US");
|
|
|
28
28
|
const Category_1 = tslib_1.__importDefault(require("../Category"));
|
|
29
29
|
const PREFIX = 'SCPaymentOrders';
|
|
30
30
|
const messages = (0, react_intl_1.defineMessages)({
|
|
31
|
+
datePicker: {
|
|
32
|
+
id: 'ui.paymentOrders.picker.date',
|
|
33
|
+
defaultMessage: 'ui.paymentOrders.picker.date'
|
|
34
|
+
},
|
|
31
35
|
dateFrom: {
|
|
32
36
|
id: 'ui.paymentOrders.dateFrom',
|
|
33
37
|
defaultMessage: 'ui.paymentOrders.dateFrom'
|
|
@@ -221,41 +225,39 @@ function PaymentOrders(inProps) {
|
|
|
221
225
|
}, disabled: isLoading }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "close" }) }))), isMobile ? ((0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => fetchInvoices(), disabled: isLoading })) : ((0, jsx_runtime_1.jsx)(material_1.Button, { size: "small", variant: "contained", color: "secondary", onClick: () => fetchInvoices(), endIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "search" }), disabled: isLoading }))] })))
|
|
222
226
|
}
|
|
223
227
|
} }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, md: 3 } }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({ select: true, fullWidth: true, disabled: isLoading, size: "small", label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.contentTypeFilter", defaultMessage: "ui.paymentOrders.contentTypeFilter" }), value: contentTypeFilter, onChange: handleContentTypeChange }, { children: options.map((option) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, Object.assign({ value: option.value }, { children: option.label }), option.value))) })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: { xs: 12, sm: 8, md: 4 } }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.it : en_US_1.enUS, localeText: {
|
|
224
|
-
cancelButtonLabel:
|
|
225
|
-
clearButtonLabel:
|
|
226
|
-
} }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: 6 }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.dateFrom", defaultMessage: "ui.paymentOrders.dateFrom" }), value: startDate, enableAccessibleFieldDOMStructure: false,
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.dateFrom)}`, endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }) }))) })
|
|
231
|
-
} })));
|
|
232
|
-
}
|
|
228
|
+
cancelButtonLabel: intl.formatMessage(messages.pickerCancelAction),
|
|
229
|
+
clearButtonLabel: intl.formatMessage(messages.pickerClearAction)
|
|
230
|
+
} }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, width: "100%", spacing: 2 }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: 6 }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.dateFrom", defaultMessage: "ui.paymentOrders.dateFrom" }), value: startDate, enableAccessibleFieldDOMStructure: false, localeText: {
|
|
231
|
+
toolbarTitle: intl.formatMessage(messages.datePicker)
|
|
232
|
+
}, slots: {
|
|
233
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, params, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) })))
|
|
233
234
|
}, slotProps: {
|
|
234
235
|
actionBar: {
|
|
235
236
|
actions: ['cancel', 'clear', 'accept']
|
|
236
237
|
},
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
textField: (params) => {
|
|
244
|
-
var _a;
|
|
245
|
-
return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, { size: "small", slotProps: {
|
|
246
|
-
input: Object.assign(Object.assign({}, (_a = params.slotProps) === null || _a === void 0 ? void 0 : _a.input), { placeholder: `${intl.formatMessage(messages.dateTo)}`, endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) }) }))) })
|
|
247
|
-
} })));
|
|
238
|
+
textField: {
|
|
239
|
+
slotProps: {
|
|
240
|
+
input: {
|
|
241
|
+
placeholder: intl.formatMessage(messages.dateFrom)
|
|
242
|
+
}
|
|
243
|
+
}
|
|
248
244
|
}
|
|
245
|
+
}, onChange: setStartDate }) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ size: 6 }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.MobileDatePicker, { className: classes.picker, label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.dateTo", defaultMessage: "ui.paymentOrders.dateTo" }), value: endDate, enableAccessibleFieldDOMStructure: false, localeText: {
|
|
246
|
+
toolbarTitle: intl.formatMessage(messages.datePicker)
|
|
247
|
+
}, slots: {
|
|
248
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, params, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) })))
|
|
249
249
|
}, slotProps: {
|
|
250
250
|
actionBar: {
|
|
251
251
|
actions: ['cancel', 'clear', 'accept']
|
|
252
252
|
},
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
253
|
+
textField: {
|
|
254
|
+
slotProps: {
|
|
255
|
+
input: {
|
|
256
|
+
placeholder: intl.formatMessage(messages.dateTo)
|
|
257
|
+
}
|
|
258
|
+
}
|
|
257
259
|
}
|
|
258
|
-
}, onChange:
|
|
260
|
+
}, onChange: setEndDate }) }))] })) })) }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.content }, { children: !isLoading ? ((0, jsx_runtime_1.jsx)(material_1.TableContainer, Object.assign({ style: { margin: 'auto', borderRadius: 0 } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Table, Object.assign({ sx: { minWidth: 650 }, "aria-label": "simple table", stickyHeader: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.TableHead, { children: (0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: "5%" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.number", defaultMessage: "ui.paymentOrders.number" }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: "7%" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.contentType", defaultMessage: "ui.paymentOrders.contentType" }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: "38%" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.content", defaultMessage: "ui.paymentOrders.content" }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: "10%" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.price", defaultMessage: "ui.paymentOrders.price" }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: "12%" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.createdAt", defaultMessage: "ui.paymentOrders.createdAt" }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: "13%" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.expired_at", defaultMessage: "ui.paymentOrders.expired_at" }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ width: "10%" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.status", defaultMessage: "ui.paymentOrders.status" }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paymentOrders.actions", defaultMessage: "ui.paymentOrders.actions" }) })] }) }), (0, jsx_runtime_1.jsxs)(material_1.TableBody, { children: [orders.map((order, index) => ((0, jsx_runtime_1.jsxs)(material_1.TableRow, { children: [(0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ scope: "row" }, { children: (0, jsx_runtime_1.jsx)("b", { children: order.id }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ scope: "row" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: `ui.paymentOrders.contentType.${order.content_type}`, defaultMessage: `ui.paymentOrders.contentType.${order.content_type}` }) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ scope: "row" }, { children: renderContent(order) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ scope: "row" }, { children: (0, payment_1.getConvertedAmount)(order.payment_price) })), (0, jsx_runtime_1.jsx)(material_1.TableCell, Object.assign({ scope: "row" }, { children: order.created_at &&
|
|
259
261
|
intl.formatDate(new Date(order.created_at), {
|
|
260
262
|
year: 'numeric',
|
|
261
263
|
month: 'numeric',
|
|
@@ -69,9 +69,7 @@ function PublicInfo(props) {
|
|
|
69
69
|
return null;
|
|
70
70
|
}, [scPreferences.preferences]);
|
|
71
71
|
// STATE
|
|
72
|
-
const
|
|
73
|
-
const isMobile = (0, material_1.useMediaQuery)(theme.breakpoints.down('md'));
|
|
74
|
-
const [user, setUser] = (0, react_1.useState)();
|
|
72
|
+
const [user, setUser] = (0, react_1.useState)(null);
|
|
75
73
|
const [error, setError] = (0, react_1.useState)({});
|
|
76
74
|
const [editing, setEditing] = (0, react_1.useState)([]);
|
|
77
75
|
const [saving, setSaving] = (0, react_1.useState)([]);
|
|
@@ -161,7 +159,7 @@ function PublicInfo(props) {
|
|
|
161
159
|
return ((0, jsx_runtime_1.jsx)(x_date_pickers_1.LocalizationProvider, Object.assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: scContext.settings.locale.default === 'it' ? it_1.it : en_US_1.enUS }, { children: (0, jsx_runtime_1.jsx)(x_date_pickers_1.DatePicker, { label: intl.formatMessage({
|
|
162
160
|
id: `ui.userInfo.${(0, utils_1.camelCase)(field)}`,
|
|
163
161
|
defaultMessage: `ui.userInfo.${field}`
|
|
164
|
-
}), defaultValue: user[field] ?
|
|
162
|
+
}), defaultValue: user[field] ? new Date(user[field]) : null, minDate: DATEPICKER_MINDATE, onChange: (newValue) => {
|
|
165
163
|
const u = user;
|
|
166
164
|
const field = types_1.SCUserProfileFields.DATE_OF_BIRTH;
|
|
167
165
|
const camelField = (0, utils_1.camelCase)(field);
|
|
@@ -183,13 +181,8 @@ function PublicInfo(props) {
|
|
|
183
181
|
}
|
|
184
182
|
setUser(u);
|
|
185
183
|
setEditing([...editing, field]);
|
|
186
|
-
}, disableFuture: true, disabled: isSaving, slots: {
|
|
187
|
-
|
|
188
|
-
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore,@typescript-eslint/ban-ts-comment
|
|
189
|
-
// @ts-ignore
|
|
190
|
-
const _a = params.children.props, { children } = _a, rest = tslib_1.__rest(_a, ["children"]);
|
|
191
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.InputAdornment, Object.assign({ position: "end" }, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({}, rest, { children: children })), isSaving && (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 10 })] })));
|
|
192
|
-
}
|
|
184
|
+
}, disableFuture: true, disabled: isSaving, enableAccessibleFieldDOMStructure: false, slots: {
|
|
185
|
+
openPickerButton: (params) => ((0, jsx_runtime_1.jsxs)(material_1.IconButton, Object.assign({}, params, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }), isSaving && (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 10 })] })))
|
|
193
186
|
},
|
|
194
187
|
// onAccept={isMobile ? handleSave(SCUserProfileFields.DATE_OF_BIRTH) : null}
|
|
195
188
|
slotProps: {
|
|
@@ -197,10 +190,7 @@ function PublicInfo(props) {
|
|
|
197
190
|
className: classes.field,
|
|
198
191
|
fullWidth: true,
|
|
199
192
|
variant: 'outlined',
|
|
200
|
-
helperText: _error || null
|
|
201
|
-
InputProps: {
|
|
202
|
-
endAdornment: isMobile && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ disabled: !isEditing }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "CalendarIcon" }) })), isSaving ? (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 10 }) : null] }))
|
|
203
|
-
}
|
|
193
|
+
helperText: _error || null
|
|
204
194
|
}
|
|
205
195
|
} }) }), field));
|
|
206
196
|
case types_1.SCUserProfileFields.BIO:
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { SCMediaType } from '@selfcommunity/types';
|
|
2
|
+
import { HTMLAttributes } from 'react';
|
|
2
3
|
interface DocComponentProps {
|
|
3
4
|
document: SCMediaType;
|
|
4
5
|
index?: number;
|
|
5
6
|
onDelete?: (id: number) => void;
|
|
6
7
|
handleDownload?: (id: number) => void;
|
|
7
8
|
onMediaClick?: (media: SCMediaType) => void;
|
|
9
|
+
className?: HTMLAttributes<HTMLDivElement>['className'];
|
|
8
10
|
}
|
|
9
11
|
export default function DocComponent(props: DocComponentProps): import("react/jsx-runtime").JSX.Element;
|
|
10
12
|
export {};
|