@if (settings?.envato_on == 'on') {
    <div class="alert alert-danger mb-5 br-13 align-center d-none" #supportexpired>
      <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-exclamation-triangle-fill mb-1 me-1" viewBox="0 0 16 16">
        <path
          d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z" />
      </svg>
      {{'Support Expired: Your support has expired. In order to continue receiving our assistance, please renew your support.' | translate}}
      <a class="btn-sm btn btn-dark mt-sm-max-2 me-2" [href]="settings?.SUPPORT_POLICY_URL" target="_blank">{{'Support Policy' | translate}}</a>
      <a class="btn-sm btn btn-dark mt-sm-max-2" href="https://help.market.envato.com/hc/en-us/articles/207886473-Extending-and-Renewing-Item-Support" target="_blank">{{'How To Renew Item Support' | translate}}</a>
    </div>
  }
  @if (settings?.envato_on == 'on') {
    <div class="alert alert-warning mb-5 br-13 align-center d-none" #verifysupportexpired>
      <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-exclamation-triangle-fill mb-1 me-1" viewBox="0 0 16 16">
        <path
          d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z" />
      </svg>
      {{'Your purchase code has been verified, but product support has expired.' | translate}}
      <a class="btn-sm btn btn-dark me-2 mt-sm-max-2" [href]="settings?.SUPPORT_POLICY_URL" target="_blank">{{'Support Policy' | translate}}</a>
      <a class="btn-sm btn btn-dark mt-sm-max-2" href="https://help.market.envato.com/hc/en-us/articles/207886473-Extending-and-Renewing-Item-Support" target="_blank">{{'How To Renew Item Support' | translate}}</a>
    </div>
  }
  <admin-page-header [title]="'My Open Chats'"></admin-page-header>
<div class="main-chart-wrapper">
    <div class="row">
        <div class="col-xl-3">
            <div class="chat-info border card">
                <div class="card-header border-0 pb-5">
                        <h4 class="card-title">{{ 'My Opened Chats' }}</h4>
                </div>
                <div>
                    <app-live-chat-sidebar [timezone]="timezone" [data]="data" [settings]="settings" link="/admin/live-chat/my-open-chats" [id]="id" [AuthId]="AuthId" (sideMenuOpenClickFunction)="sideMenuOpenClickFunction($event)" ></app-live-chat-sidebar>
                </div>
            </div>
        </div>
        <div class="col-xl-6">
            <app-livechat-view class="main-chat-area main-chat-area-new bg-white" [data]="data" [settings]="settings" [id]="id" [autoUserInfo]="autoUserInfo" [AuthId]="AuthId" [customerData]="customerData" [parsedChatFlowMessages]="parsedChatFlowMessages" [chatDataVal]="chatData" [newVal]="newVal" [pastMessage]="pastMessage" [subscategory]="subscategory" [reply]="reply" [isChat]="isChat" [engaged]="true" (clearVal)="clearVal($event)" ></app-livechat-view>
        </div>
        <div class="col-xl-3">
            <div class="chat-user-details bg-transparent p-0">
                @if(customerData){
                    <app-customer-info [customerData]="customerData"></app-customer-info>

                    <div class="card">
                        <div class="card-header pb-4 d-flex align-items-center border-0">
                            <h4 class="card-title">{{ 'File Upload Permission' | translate }}</h4>
                            <div class="switch-toggle  ms-auto">
                                <a class="onoffswitch2 ">
                                    <input type="checkbox" id="fileUploadPermission" class="toggle-class onoffswitch2-checkbox" [checked]="chatData?.livechatcust?.file_upload_permission == 1 ? true: false" (change)="fileUploadPermission($event, customerData)">
                                    <label for="fileUploadPermission" class="toggle-class onoffswitch2-label"></label>
                                </a>
                            </div>
                        </div>
                    </div>
                }
            </div>
        </div>
    </div>
</div>