{% block vrpayment_settings_content_card_channel_config_credentials %}
	<mt-card
			class="mt-card"
			:title="$tc('vrpayment-settings.settingForm.credentials.cardTitle')"
			v-if="actualConfigData"
	>

		{% block vrpayment_settings_content_card_channel_config_credentials_card_container %}
			<sw-container>

				{% block vrpayment_settings_content_card_channel_config_credentials_card_container_settings %}
					<div v-if="actualConfigData" class="vrpayment-settings-credentials-fields">

						{% block vrpayment_settings_content_card_channel_config_credentials_card_container_settings_space_id %}
							<sw-inherit-wrapper
									v-model:value="actualConfigData[CONFIG_SPACE_ID]"
									:inheritedValue="getInheritedValue(CONFIG_SPACE_ID)"
									@update:value="onSwitchInput">
								<template #content="props">
									<mt-number-field
											:name="CONFIG_SPACE_ID"
											:required="true"
											:mapInheritance="props"
											:label="$tc('vrpayment-settings.settingForm.credentials.spaceId.label')"
											:helpText="$tc('vrpayment-settings.settingForm.credentials.spaceId.tooltipText')"
											:disabled="!acl.can('vrpayment.editor')"
											:model-value="props.currentValue"
											:error="spaceIdErrorState"
											@update:model-value="props.updateCurrentValue">
									</mt-number-field>
								</template>
							</sw-inherit-wrapper>
						{% endblock %}

						{% block vrpayment_settings_content_card_channel_config_credentials_card_container_settings_user_id %}
							<sw-inherit-wrapper
									v-model:value="actualConfigData[CONFIG_USER_ID]"
									:inheritedValue="getInheritedValue(CONFIG_USER_ID)"
									:customInheritationCheckFunction="checkNumberFieldInheritance">
								<template #content="props">
									<mt-number-field
											:name="CONFIG_USER_ID"
											:required="true"
											:mapInheritance="props"
											:label="$tc('vrpayment-settings.settingForm.credentials.userId.label')"
											:helpText="$tc('vrpayment-settings.settingForm.credentials.userId.tooltipText')"
											:disabled="!acl.can('vrpayment.editor')"
											:model-value="props.currentValue"
											:error="userIdErrorState"
											@update:model-value="props.updateCurrentValue">
									</mt-number-field>
								</template>
							</sw-inherit-wrapper>
						{% endblock %}

						{% block vrpayment_settings_content_card_channel_config_credentials_card_container_settings_application_key %}
							<sw-inherit-wrapper
									v-model:value="actualConfigData[CONFIG_APPLICATION_KEY]"
									:inheritedValue="getInheritedValue(CONFIG_APPLICATION_KEY)"
									:customInheritationCheckFunction="checkTextFieldInheritance">
								<template #content="props">
									<mt-password-field
											:name="CONFIG_APPLICATION_KEY"
											:required="true"
											:passwordToggleAble="true"
											:mapInheritance="props"
											:label="$tc('vrpayment-settings.settingForm.credentials.applicationKey.label')"
											:helpText="$tc('vrpayment-settings.settingForm.credentials.applicationKey.tooltipText')"
											:disabled="!acl.can('vrpayment.editor')"
											:model-value="props.currentValue"
											:error="applicationKeyErrorState"
											@update:model-value="props.updateCurrentValue">
									</mt-password-field>
								</template>
							</sw-inherit-wrapper>
						{% endblock %}
					</div>
				{% endblock %}

				{% verbatim %}
				<sw-container columns="1fr 1fr" gap="0px 30px">
					<mt-button
							variant="primary"
							:isLoading="isTesting"
							@click="emitCheckApiConnectionEvent">
						{{ $tc('vrpayment-settings.settingForm.credentials.button.label') }}
					</mt-button>
				</sw-container>
				{% endverbatim %}

			</sw-container>
		{% endblock %}
	</mt-card>

{% endblock %}
