META-INF.resources.js.FragmentServiceConfiguration.js Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of com.liferay.fragment.web
Liferay Fragment Web
The newest version!
/**
 * SPDX-FileCopyrightText: (c) 2000 Liferay, Inc. https://liferay.com
 * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
 */

import ClayButton from '@clayui/button';
import ClayForm, {ClayCheckbox} from '@clayui/form';
import ClayModal, {useModal} from '@clayui/modal';
import {fetch, objectToFormData, openToast} from 'frontend-js-web';
import React, {useState} from 'react';

const FEEDBACK_MESSAGES = {
	error: {
		cssClass: 'has-error',
		icon: 'exclamation-full',
		text: Liferay.Language.get(
			'the-changes-could-not-be-propagated,-please-try-again'
		),
	},
	success: {
		cssClass: 'has-success',
		icon: 'check-circle-full',
		text: Liferay.Language.get('all-changes-were-propagated'),
	},
};

export default function FragmentServiceConfiguration({
	alreadyPropagateContributedFragmentChanges,
	namespace,
	propagateChanges,
	propagateContributedFragmentChanges,
	propagateContributedFragmentEntriesChangesURL,
}) {
	const [disablePropagateChangesButton, setDisablePropagateChangesButton] =
		useState(alreadyPropagateContributedFragmentChanges);

	const [
		propagateContributedFragmentChangesChecked,
		setPropagateContributedFragmentChangesChecked,
	] = useState(propagateContributedFragmentChanges);

	const [propagateChangesChecked, setPropagateChangesChecked] =
		useState(propagateChanges);

	const [feedbackMessage, setFeedbackMessage] = useState(
		disablePropagateChangesButton ? FEEDBACK_MESSAGES.success : null
	);

	const [warningModalVisible, setWarningModalVisible] = useState(false);

	const {observer, onClose} = useModal({
		onClose: () => setWarningModalVisible(false),
	});

	const handleSubmit = () => {
		setFeedbackMessage(null);

		fetch(propagateContributedFragmentEntriesChangesURL, {
			body: objectToFormData({
				[`${namespace}propagateChanges`]: propagateChangesChecked,
				[`${namespace}propagateContributedFragmentChanges`]:
					propagateContributedFragmentChangesChecked,
			}),
			method: 'POST',
		})
			.then((response) => response.json())
			.then(({success}) => {
				if (success) {
					openToast({
						message: Liferay.Language.get(
							'the-changes-in-the-contributed-fragments-have-been-propagated-successfully'
						),
						title: Liferay.Language.get('success'),
						type: 'success',
					});

					setDisablePropagateChangesButton(true);
					setFeedbackMessage(FEEDBACK_MESSAGES.success);
				}
				else {
					openToast({
						message: Liferay.Language.get(
							'something-went-wrong-and-the-changes-in-the-contributed-fragments-could-not-be-propagated.-please-try-again-later'
						),
						title: Liferay.Language.get('error'),
						type: 'danger',
					});

					setFeedbackMessage(FEEDBACK_MESSAGES.error);
				}

				setWarningModalVisible(false);
			});
	};

	return (
		<>
			
				{Liferay.Language.get('default-fragments')}
			

			
				{Liferay.Language.get(
					'default-fragments-are-provided-by-liferay-and-they-are-part-of-the-product-code.-define-their-behavior'
				)}
			

			
					setPropagateContributedFragmentChangesChecked(
						event.target.checked
					)
				}
			/>

			
				
					{Liferay.Language.get(
						'propagate-contributed-fragment-changes-automatically-description'
					)}
				
			

			{!propagateContributedFragmentChangesChecked && (
				
					 setWarningModalVisible(true)}
					>
						{Liferay.Language.get('propagate-changes')}
					

					{feedbackMessage && (
						
							
								
									

									{feedbackMessage.text}
								
							
						
					)}
				
			)}

			
				{Liferay.Language.get('custom-fragments')}
			

			
				{Liferay.Language.get(
					'custom-fragments-are-those-that-are-created-by-the-user.-define-their-behavior'
				)}
			

			
					setPropagateChangesChecked(event.target.checked)
				}
			/>

			
				
					{Liferay.Language.get(
						'propagate-fragment-changes-automatically-description'
					)}
				
			

			{warningModalVisible && (
				
					
						{Liferay.Language.get('propagate-changes')}
					

					
						
							{Liferay.Language.get(
								'please-be-aware-that-if-any-content-creator-is-editing-a-page,-some-changes-may-not-be-saved.-performance-issues-can-also-result-from-this-action'
							)}
						

						
							{Liferay.Language.get(
								'are-you-sure-you-want-to-continue'
							)}
						
					

					
								
									{Liferay.Language.get('cancel')}
								

								
									{Liferay.Language.get('continue')}
								
							
						}
					/>
				
			)}
		
	);
}