@php
    $isNotNonTemplateCampaign = (!isset($nonTemplateCampaign) or !$nonTemplateCampaign);
@endphp
<!-- Add New Advance Bot Reply Modal -->
<x-lw.modal id="lwAddNewAdvanceBotReply" modal-dialog-class="modal-lg lw-modal-xl" :header="$isNotNonTemplateCampaign ? __tr('Add New Bot Reply') : __tr('Add New Preset Message')" :hasForm="true">
    <!--  Add New Bot Reply Form -->
    <x-lw.form x-data="{triggerType:'',headerType:'',interactiveButtonType:'button'}" id="lwAddNewAdvanceBotReplyForm"
        :action="route('vendor.bot_reply.write.create')"
        :data-callback-params="['modalId' => '#lwAddNewAdvanceBotReply', 'datatableId' => '#lwBotReplyList']"
        data-callback="appFuncs.modelSuccessCallback" x-on:reset-modal.window="headerType = ''">

        <div id="lwAddBotReplyBody" class="lw-form-modal-body"></div>
        <script type="text/template" id="lwAddBotReplyBody-template">

        <!-- form body -->
        <div>
            <!-- form fields form fields -->
            <input type="hidden" name="message_type" :value="isAdvanceBot">
            <template x-if="botFlowUid">
                <input type="hidden" name="bot_flow_uid" :value="botFlowUid">
            </template>
            <template x-if="ntCampaignPresetMessage">
                <input type="hidden" name="nt_campaign_preset_message" value="yes">
            </template>
            <!-- Name -->
            <x-lw.input-field type="text" id="lwAdvanceBotNameField" data-form-group-class="" :label="__tr('Name')"
                name="name" required="true" />
            <!-- /Name -->
            <fieldset class="lw-dynamic-template-container">
                <legend>{{  __tr('Reply Message') }}</legend>

                <div x-show="isAdvanceBot == 'template'" x-data="{ selectedTemplate: '', onTemplateChange() {

                                if (!_.isEmpty(this.selectedTemplate)) {
                                    __DataRequest.post('{{ route('vendor.request.template.view') }}', {
                                        'template_selection': this.selectedTemplate,
                                        'page_type': 'bot_reply_form',
                                        'form_type': 'add_template_bot'
                                    }, function() {
                                        _.defer(function() {
                                            $('.lw-change-template-btn').remove();
                                            window.lwPluginsInit();
                                        });
                                    });
                                } else {
                                    $('#lwTemplateStructureContainer').text('');
                                }
                            } 
                        }">
                        @if($isNotNonTemplateCampaign)
                        <div x-cloak>
                            <x-lw.input-field 
                                x-model="selectedTemplate"
                                placeholder="{!! __tr('Select & Configure Template') !!}" 
                                type="selectize"
                                data-lw-plugin="lwSelectize" 
                                data-selected=" " 
                                type="select"
                                id="lwField_templateSelection" 
                                name="template_selection" 
                                data-form-group-class=""
                                required
                                class="custom-select" 
                                :label="__tr('Select Template')">
                                <x-slot name="selectOptions">
                                    <option value="">{{ __tr('Select & Configure Template') }}</option>
                                    @foreach ($templateData['whatsAppTemplates'] as $whatsAppTemplate)
                                        <option value="{{ $whatsAppTemplate->_uid }}">
                                            {{ $whatsAppTemplate->template_name }} ({{ $whatsAppTemplate->language }}) ({{ $whatsAppTemplate->category }})
                                        </option>
                                    @endforeach
                                </x-slot>
                            </x-lw.input-field>
                            <div x-effect="onTemplateChange()"></div>
                        </div>
                        @endif
                    <div id="lwTemplateStructureContainer" class="lw-template-structure-model"></div>
                </div>

                <div x-show="isAdvanceBot != 'template'">
                    <!-- Reply_Text -->
                    <div class="form-group" x-show="isAdvanceBot == 'simple' || isAdvanceBot == 'interactive'">
                        <label for="lwReplyTextField">{{ __tr('Reply Text') }}</label>
                        <textarea cols="10" rows="3" id="lwAdvanceBotReplyTextField" class="lw-form-field form-control"
                            placeholder="{{ __tr('Add your main message body text here') }}" name="reply_text" required="true"></textarea>
                            <div class="help-text my-3 border p-3">{{  __tr('You are free to use following dynamic variables for reply text, which will get replaced with contact\'s concerned field value.') }} <div><code>{{ implode(' ', $dynamicFields) }}</code></div></div>
                    </div>
                    <!-- /Reply_Text -->
                    <div x-show="isAdvanceBot == 'interactive' || isAdvanceBot == 'media'">
                            {{-- select type --}}
                        <div x-show="isAdvanceBot == 'interactive'">
                        <x-lw.input-field x-init="$watch('headerType', function() {
                            if((interactiveButtonType == 'list') && !_.includes(['','text'],headerType)) {
                                interactiveButtonType = 'button';
                            }
                        })" x-model="headerType" type="selectize" id="lwAdvanceBotHeaderTypeField"  data-form-group-class="" data-selected=" " :label="__tr('Header Type (optional)')" name="header_type" >
                            <x-slot name="selectOptions">
                                <option value="">{{  __tr('None') }}</option>
                                <option value="text">{{  __tr('Text') }}</option>
                                <option value="image">{{  __tr('Image') }}</option>
                                <option value="video">{{  __tr('Video') }}</option>
                                <option value="document">{{  __tr('Document') }}</option>
                            </x-slot>
                        </x-lw.input-field>
                        </div>
                        <span x-text="headerType"></span>
                        <div x-show="isAdvanceBot == 'media'">
                            <x-lw.input-field x-model="headerType" type="selectize" id="lwMediaHeaderType"
                            data-form-group-class="" data-selected=" " :label="__tr('Header Type')" name="media_header_type" >
                                <x-slot name="selectOptions">
                                    <option value="">{{  __tr('None') }}</option>
                                    <option value="image">{{  __tr('Image') }}</option>
                                    <option value="video">{{  __tr('Video') }}</option>
                                    <option value="document">{{  __tr('Document') }}</option>
                                    <option value="audio">{{  __tr('Audio') }}</option>
                                </x-slot>
                            </x-lw.input-field>
                        </div>
                        <div class="my-3">
                        {{-- document --}}
                        <div x-show="headerType == 'document'" class="form-group col-sm-12">
                        <input id="lwDocumentMediaFilepond" type="file" data-allow-revert="true"
                            data-label-idle="{{ __tr('Select Document') }}" class="lw-file-uploader" data-instant-upload="true"
                            data-action="