{# backend/templates/communications/chat_list.html #}
{% extends "base.html" %}
{% load static django_bootstrap5 %}

{% block title %}Мои чаты{% endblock %}

{% block extra_css %}
<link rel="stylesheet" href="{% static 'css/components/ios-search.css' %}">
<link rel="stylesheet" href="{% static 'css/components/page-header.css' %}">
<link rel="stylesheet" href="{% static 'css/components/document-list.css' %}">
<link rel="stylesheet" href="{% static 'css/components/chat-list-enhanced.css' %}">
{% endblock %}

{% block content %}
<div class="container">
  <div class="row gx-0">
    <div class="col-12">

      {# ===== НОВАЯ ШАПКА С КОМПОНЕНТОМ ===== #}
      {% include "includes/components/page_header.html" with icon="bi-chat-dots" title="Мои чаты" search_id="chatSearch" search_placeholder="Поиск по названию или участникам" create_as_card=True create_modal="chatCreateModal" create_text="Создать чат" %}

      {# ===== ДВУХКОЛОНОЧНАЯ СТРУКТУРА ===== #}
      <div class="d-flex gap-3 chat-list-wrapper">
        
        {# Левая колонка - иконки типов чатов #}
        <div class="chat-type-sidebar">
          <div class="card">
            <div class="list-group list-group-flush">
              <button type="button" class="list-group-item list-group-item-action text-center py-3 chat-type-btn active" 
                      data-chat-type="all" title="Все чаты">
                <i class="bi-chat-dots fs-4 d-block"></i>
                <span class="badge rounded-pill bg-secondary" data-count="all">0</span>
              </button>
              <button type="button" class="list-group-item list-group-item-action text-center py-3 chat-type-btn" 
                      data-chat-type="global" title="Глобальный">
                <i class="bi-globe fs-4 d-block"></i>
                <span class="badge rounded-pill bg-secondary" data-count="global">0</span>
              </button>
              <button type="button" class="list-group-item list-group-item-action text-center py-3 chat-type-btn" 
                      data-chat-type="department" title="Отделы">
                <i class="bi-diagram-3 fs-4 d-block"></i>
                <span class="badge rounded-pill bg-secondary" data-count="department">0</span>
              </button>
              <button type="button" class="list-group-item list-group-item-action text-center py-3 chat-type-btn" 
                      data-chat-type="private" title="Личные">
                <i class="bi-person-fill fs-4 d-block"></i>
                <span class="badge rounded-pill bg-secondary" data-count="private">0</span>
              </button>
              <button type="button" class="list-group-item list-group-item-action text-center py-3 chat-type-btn" 
                      data-chat-type="group" title="Группы">
                <i class="bi-people-fill fs-4 d-block"></i>
                <span class="badge rounded-pill bg-secondary" data-count="group">0</span>
              </button>
              <button type="button" class="list-group-item list-group-item-action text-center py-3 chat-type-btn" 
                      data-chat-type="channel" title="Каналы">
                <i class="bi-broadcast fs-4 d-block"></i>
                <span class="badge rounded-pill bg-secondary" data-count="channel">0</span>
              </button>
              <button type="button" class="list-group-item list-group-item-action text-center py-3 chat-type-btn" 
                      data-chat-type="announcement" title="Объявления">
                <i class="bi-megaphone fs-4 d-block"></i>
                <span class="badge rounded-pill bg-secondary" data-count="announcement">0</span>
              </button>
            </div>
          </div>
        </div>

        {# Правая колонка - список чатов #}
        <div class="chat-list-main flex-grow-1">

      {# ===== 1) ГЛОБАЛЬНЫЙ ===== #}
      <div class="card chat-section mb-3" data-sec="global">
        <div class="card-header">
          <div class="card-icon" style="width:44px;height:44px;"><i class="bi-globe"></i></div>
          <div class="card-meta flex-grow-1">
            <h6 class="mb-0 text-secondary">Глобальный</h6>
            <span class="small text-secondary" data-empty-note style="display:none;">Нет глобального чата</span>
          </div>
        </div>

        <div id="sec-global" class="list-chats">
          {% for chat in chats %}
            {% if chat.type == 'global' %}
              {% include "includes/components/chat_card.html" with chat=chat %}
            {% endif %}
          {% endfor %}
        </div>
      </div>

      {# ===== 2) ОТДЕЛЫ ===== #}
      <div class="card chat-section mb-3" data-sec="department">
        <div class="card-header">
          <div class="card-icon" style="width:44px;height:44px;"><i class="bi-diagram-3"></i></div>
          <div class="card-meta flex-grow-1">
            <h6 class="mb-0 text-secondary">Отделы</h6>
            <span class="small text-secondary" data-empty-note style="display:none;">Нет чатов отделов</span>
          </div>
        </div>

        <div id="sec-department" class="list-chats">
          {% for chat in chats %}
            {% if chat.type == 'department' %}
              {% include "includes/components/chat_card.html" with chat=chat %}
            {% endif %}
          {% endfor %}
        </div>
      </div>

      {# ===== 3) ЛИЧНЫЕ ===== #}
      <div class="card chat-section mb-3" data-sec="private">
        <div class="card-header">
          <div class="card-icon" style="width:44px;height:44px;"><i class="bi-people"></i></div>
          <div class="flex-grow-1 card-meta">
            <h6 class="mb-0 text-secondary">Личные</h6>
            <span class="small text-secondary" data-empty-note style="display:none;">Нет личных чатов</span>
          </div>
        </div>

        <div id="sec-private" class="list-chats">
          {% for chat in chats %}
            {% if chat.type == 'private' %}
              {% include "includes/components/chat_card.html" with chat=chat %}
            {% endif %}
          {% endfor %}
        </div>
      </div>

      {# ===== 4) ГРУППЫ ===== #}
      <div class="card chat-section mb-3" data-sec="group">
        <div class="card-header">
          <div class="card-icon" style="width:44px;height:44px;"><i class="bi-people-fill"></i></div>
          <div class="flex-grow-1 card-meta">
            <h6 class="mb-0 text-secondary">Группы</h6>
            <span class="small text-secondary" data-empty-note style="display:none;">Нет групповых чатов</span>
          </div>
        </div>

        <div id="sec-group" class="list-chats">
          {% for chat in chats %}
            {% if chat.type == 'group' %}
              {% include "includes/components/chat_card.html" with chat=chat %}
            {% endif %}
          {% endfor %}
        </div>
      </div>

      {# ===== 5) КАНАЛЫ ===== #}
      <div class="card chat-section mb-3" data-sec="channel">
        <div class="card-header">
          <div class="card-icon" style="width:44px;height:44px;"><i class="bi-broadcast"></i></div>
          <div class="flex-grow-1 card-meta">
            <h6 class="mb-0 text-secondary">Каналы</h6>
            <span class="small text-secondary" data-empty-note style="display:none;">Нет каналов</span>
          </div>
        </div>

        <div id="sec-channel" class="list-chats">
          {% for chat in chats %}
            {% if chat.type == 'channel' %}
              {% include "includes/components/chat_card.html" with chat=chat %}
            {% endif %}
          {% endfor %}
        </div>
      </div>

      {# ===== 6) ОБЪЯВЛЕНИЯ ===== #}
      <div class="card chat-section mb-3" data-sec="announcement">
        <div class="card-header">
          <div class="card-icon" style="width:44px;height:44px;"><i class="bi-megaphone"></i></div>
          <div class="flex-grow-1 card-meta">
            <h6 class="mb-0 text-secondary">Объявления</h6>
            <span class="small text-secondary" data-empty-note style="display:none;">Нет объявлений</span>
          </div>
        </div>

        <div id="sec-announcement" class="list-chats">
          {% for chat in chats %}
            {% if chat.type == 'announcement' %}
              {% include "includes/components/chat_card.html" with chat=chat %}
            {% endif %}
          {% endfor %}
        </div>
      </div>

      {% if not chats %}
        <div class="alert alert-info shadow-sm mt-3">
          Чатов пока нет. Начните с <a href="{% url 'employees:employees_list' %}" class="text-decoration-none">поиска сотрудника</a>.
        </div>
      {% endif %}

        </div> {# конец chat-list-main #}
      </div> {# конец d-flex #}

    </div>
  </div>
</div>

{# ===== МОДАЛКА СОЗДАНИЯ ЧАТА ===== #}
<div class="modal fade" id="chatCreateModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Создать чат</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Закрыть"></button>
      </div>
      <div class="modal-body">
        
        {# Выбор типа чата #}
        <div class="mb-3">
          <label for="chatTypeSelect" class="form-label">Тип чата <span class="text-danger">*</span></label>
          <select class="form-select" id="chatTypeSelect">
            <option value="private">Личный чат</option>
            <option value="group">Группа</option>
            <option value="department">Чат отдела</option>
            <option value="channel">Канал</option>
            <option value="announcement">Объявления</option>
            <option value="global">Глобальный чат</option>
          </select>
          <div class="form-text">
            <small>
              <strong>Личный:</strong> приватный чат с 1 сотрудником.<br>
              <strong>Группа:</strong> чат с несколькими участниками.<br>
              <strong>Отдел:</strong> автоматически включает всех сотрудников отдела.<br>
              <strong>Канал:</strong> для объявлений с ограниченной отправкой.<br>
              <strong>Объявления:</strong> односторонняя рассылка.<br>
              <strong>Глобальный:</strong> общий чат компании (может быть только 1 основной).
            </small>
          </div>
        </div>

        {# Поля для группы/канала/объявлений/глобального #}
        <div id="groupFieldsSection" style="display:none;">
          <div class="mb-3">
            <label for="chatNameInput" class="form-label">Название чата <span class="text-danger">*</span></label>
            <input type="text" class="form-control" id="chatNameInput" placeholder="Введите название">
          </div>
          
          <div class="mb-3">
            <label for="chatDescInput" class="form-label">Описание</label>
            <textarea class="form-control" id="chatDescInput" rows="3" placeholder="Краткое описание чата"></textarea>
          </div>

          {# Аватар чата #}
          <div class="mb-3">
            <label for="chatAvatarInput" class="form-label">Аватар чата</label>
            <div class="d-flex align-items-center gap-3">
              <div id="chatAvatarPreview" class="position-relative bg-light rounded-circle d-flex align-items-center justify-content-center" style="width: 80px; height: 80px;">
                <i class="bi bi-people-fill text-secondary" style="font-size: 2rem;"></i>
              </div>
              <div class="flex-grow-1">
                <input type="file" class="form-control" id="chatAvatarInput" accept="image/jpeg,image/png,image/gif">
                <div class="form-text">JPG, PNG или GIF. Макс. 5 МБ. Будет сжато до 512x512px.</div>
              </div>
            </div>
          </div>
        </div>

        {# Выбор отдела (только для типа "department") #}
        <div id="departmentSection" style="display:none;">
          <div class="mb-3">
            <label for="chatDepartmentSelect" class="form-label">Отдел <span class="text-danger">*</span></label>
            <select class="form-select" id="chatDepartmentSelect">
              <option value="">-- Выберите отдел --</option>
              {% for dept in departments %}
              <option value="{{ dept.id }}">{{ dept.name }}</option>
              {% endfor %}
            </select>
            <div class="form-text">Все сотрудники выбранного отдела автоматически станут участниками чата.</div>
          </div>
        </div>

        {# Опция "Включить всех сотрудников" (для announcement/global/channel) #}
        <div id="includeAllSection" style="display:none;">
          <div class="mb-3 form-check">
            <input type="checkbox" class="form-check-input" id="includeAllEmployees">
            <label class="form-check-label" for="includeAllEmployees">
              Включить всех сотрудников компании
            </label>
            <div class="form-text">Все активные сотрудники автоматически станут участниками чата.</div>
          </div>
        </div>

        {# Опция "Основной чат" (для global/department) #}
        <div id="mainChatSection" style="display:none;">
          <div class="mb-3 form-check">
            <input type="checkbox" class="form-check-input" id="isMainChat">
            <label class="form-check-label" for="isMainChat">
              Сделать основным чатом
            </label>
            <div class="form-text">Основной чат отображается первым в списке. Может быть только 1 основной глобальный чат и 1 основной чат на отдел.</div>
          </div>
        </div>

        {# Выбор участников (для личного чата и группы) #}
        <div id="recipientSection">
          <label class="form-label">Выберите участников <span id="recipientRequired" class="text-danger" style="display:none;">*</span></label>
          <div id="chatRecipients" class="recipient-picker" data-api-employees="{% url 'api:v1:employees-list' %}">
            <div class="rp-selected" aria-live="polite"></div>
            <div class="rp-search mb-2">
              <input type="search" class="form-control" placeholder="Найти сотрудника (имя, почта, телефон)">
            </div>
            <div class="rp-results" role="listbox" aria-label="Сотрудники"></div>
          </div>
        </div>

      </div>
      <div class="modal-footer">
        <button class="btn btn-primary" type="button" id="createChatBtn"><i class="bi-check-lg"></i> Создать</button>
        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Отмена</button>
      </div>
    </div>
  </div>
</div>

<script type="module">
  import { initSearchFilter } from "{% static 'js/components/searchFilterHandler.js' %}";
  import { RecipientPicker } from "{% static 'js/components/recipientPickerHandler.js' %}";

  // Получаем токен доступа
  const accessMeta = document.querySelector('meta[name="api-access"]');
  const ACCESS = accessMeta ? accessMeta.content : '';
  const headersAuth = ACCESS ? { 'Authorization': 'Bearer ' + ACCESS } : {};

  // Динамически рассчитываем высоту page-header для смещения липкой панели
  const chatListWrapper = document.querySelector('.chat-list-wrapper');

  function updateSidebarOffset() {
    const pageHeader = document.querySelector('.page-header');
    if (!pageHeader) return;

    const headerStyles = window.getComputedStyle(pageHeader);
    const marginBottom = parseFloat(headerStyles.marginBottom) || 0;
    const offset = pageHeader.offsetHeight + marginBottom;

    document.documentElement.style.setProperty('--chat-sidebar-offset', `${offset}px`);
  }

  let resizeTimeout;
  window.addEventListener('resize', () => {
    clearTimeout(resizeTimeout);
    resizeTimeout = setTimeout(updateSidebarOffset, 150);
  });

  updateSidebarOffset();

  // Инициализация RecipientPicker для создания чата
  const chatPicker = new RecipientPicker(
    document.getElementById('chatRecipients'),
    { 
      headers: headersAuth, 
      apiUrl: "{% url 'api:v1:employees-list' %}",
      maxSelections: 1  // По умолчанию для личного чата
    }
  );

  // Переключение типа чата
  const chatTypeSelect = document.getElementById('chatTypeSelect');
  const recipientSection = document.getElementById('recipientSection');
  const recipientRequired = document.getElementById('recipientRequired');
  const groupFieldsSection = document.getElementById('groupFieldsSection');
  const departmentSection = document.getElementById('departmentSection');
  const includeAllSection = document.getElementById('includeAllSection');
  const mainChatSection = document.getElementById('mainChatSection');

  chatTypeSelect?.addEventListener('change', function() {
    const type = this.value;
    
    // Скрываем все секции по умолчанию
    recipientSection.style.display = 'none';
    recipientRequired.style.display = 'none';
    groupFieldsSection.style.display = 'none';
    departmentSection.style.display = 'none';
    includeAllSection.style.display = 'none';
    mainChatSection.style.display = 'none';
    
    if(type === 'private') {
      // Личный чат: только выбор 1 участника
      recipientSection.style.display = 'block';
      recipientRequired.style.display = 'inline';
      chatPicker.setMaxSelections(1);
    } else if(type === 'group') {
      // Группа: название + описание + аватар + участники
      recipientSection.style.display = 'block';
      groupFieldsSection.style.display = 'block';
      chatPicker.setMaxSelections(100);
    } else if(type === 'department') {
      // Чат отдела: название + описание + аватар + выбор отдела + опция "основной"
      groupFieldsSection.style.display = 'block';
      departmentSection.style.display = 'block';
      mainChatSection.style.display = 'block';
    } else if(type === 'global') {
      // Глобальный: название + описание + аватар + опция "включить всех" + опция "основной"
      groupFieldsSection.style.display = 'block';
      includeAllSection.style.display = 'block';
      mainChatSection.style.display = 'block';
    } else {
      // channel, announcement: название + описание + аватар + опция "включить всех"
      groupFieldsSection.style.display = 'block';
      includeAllSection.style.display = 'block';
    }
  });

  // Предпросмотр аватара чата
  const chatAvatarInput = document.getElementById('chatAvatarInput');
  const chatAvatarPreview = document.getElementById('chatAvatarPreview');
  
  chatAvatarInput?.addEventListener('change', function(e) {
    const file = e.target.files[0];
    if(!file) {
      // Восстанавливаем иконку по умолчанию
      chatAvatarPreview.innerHTML = '<i class="bi bi-people-fill text-secondary" style="font-size: 2rem;"></i>';
      return;
    }
    
    // Валидация размера
    if(file.size > 5 * 1024 * 1024) {
      alert('Файл слишком большой. Максимум 5 МБ.');
      this.value = '';
      return;
    }
    
    // Валидация типа
    if(!file.type.match(/^image\/(jpeg|png|gif)$/)) {
      alert('Разрешены только JPG, PNG или GIF.');
      this.value = '';
      return;
    }
    
    // Показываем предпросмотр
    const reader = new FileReader();
    reader.onload = function(e) {
      chatAvatarPreview.innerHTML = `<img src="${e.target.result}" alt="Preview" class="rounded-circle" style="width: 100%; height: 100%; object-fit: cover;">`;
    };
    reader.readAsDataURL(file);
  });

  // Функция получения CSRF токена
  function getCSRFToken() {
    // Сначала пробуем найти в скрытом поле формы
    const tokenInput = document.querySelector('[name=csrfmiddlewaretoken]');
    if (tokenInput) {
      return tokenInput.value;
    }
    
    // Иначе берем из cookie
    const name = 'csrftoken';
    let cookieValue = null;
    if (document.cookie && document.cookie !== '') {
      const cookies = document.cookie.split(';');
      for (let i = 0; i < cookies.length; i++) {
        const cookie = cookies[i].trim();
        if (cookie.substring(0, name.length + 1) === (name + '=')) {
          cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
          break;
        }
      }
    }
    return cookieValue;
  }

  // Обработка создания чата
  document.getElementById('createChatBtn')?.addEventListener('click', async () => {
    const type = chatTypeSelect.value;
    const csrftoken = getCSRFToken();

    if(type === 'private') {
      // Создание личного чата
      const selected = chatPicker.getSelected();
      if (selected.length === 0) {
        alert('Выберите сотрудника для чата');
        return;
      }
      
      const employeeId = selected[0].id;
      window.location.href = "{% url 'communications:start_private_chat' 0 %}".replace('/0/', `/${employeeId}/`);
    } else {
      // Создание group/department/channel/announcement/global через API
      const nameInput = document.getElementById('chatNameInput');
      const descInput = document.getElementById('chatDescInput');
      const departmentSelect = document.getElementById('chatDepartmentSelect');
      const includeAllCheckbox = document.getElementById('includeAllEmployees');
      const isMainCheckbox = document.getElementById('isMainChat');
      const avatarInput = document.getElementById('chatAvatarInput');
      
      const name = nameInput?.value.trim() || '';
      const description = descInput?.value.trim() || '';

      // Валидация обязательных полей
      if(!name && type !== 'private') {
        alert('Введите название чата');
        return;
      }

      if(type === 'department') {
        const deptId = departmentSelect?.value;
        if(!deptId) {
          alert('Выберите отдел для чата отдела');
          return;
        }
      }

      // Собираем данные в FormData (для поддержки файлов)
      const formData = new FormData();
      formData.append('type', type);
      formData.append('name', name);
      formData.append('description', description);
      
      // Добавляем аватар если выбран
      if(avatarInput?.files[0]) {
        formData.append('avatar', avatarInput.files[0]);
      }
      
      // Добавляем department_id для типа "department"
      if(type === 'department' && departmentSelect?.value) {
        formData.append('department_id', departmentSelect.value);
      }
      
      // Добавляем include_all_employees
      if(includeAllCheckbox?.checked) {
        formData.append('include_all_employees', 'true');
      }
      
      // Добавляем is_main
      if(isMainCheckbox?.checked) {
        formData.append('is_main', 'true');
      }

      // Собираем participant_ids для группового чата
      if(type === 'group') {
        const selected = chatPicker.getSelected();
        selected.forEach(s => {
          formData.append('participant_ids', s.id);
        });
      }

      const res = await fetch('/api/v1/communications/chats/create/', {
        method: 'POST',
        headers: {
          'X-CSRFToken': csrftoken
          // НЕ устанавливаем Content-Type, браузер сам добавит multipart/form-data с boundary
        },
        body: formData
      });

      if(res.ok) {
        const data = await res.json();
        window.location.href = `/communications/chats/${data.chat_id}/`;
      } else {
        const err = await res.json();
        
        // Если это ошибка с existing_chat_id - редиректим на существующий чат
        if(err.existing_chat_id) {
          if(confirm(err.error + '\n\nПерейти к вашему чату объявлений?')) {
            window.location.href = `/communications/chats/${err.existing_chat_id}/`;
          }
        } else {
          alert('Ошибка: ' + (err.error || 'Неизвестная ошибка'));
        }
      }
    }
  });
  
  // Инициализация поиска и фильтрации
  const filterApi = initSearchFilter({
    inputId: 'chatSearch',
    clearSelector: '.ios-search-clear',
    sectionSelector: '.chat-section',
    rowSelector: '.chat-row'
  });

  // ===== ФИЛЬТРАЦИЯ ПО ТИПАМ ЧАТОВ =====
  let activeFilter = 'all';
  
  const chatTypeButtons = document.querySelectorAll('.chat-type-btn');
  const chatSections = document.querySelectorAll('.chat-section');
  
  // Функция подсчета чатов по типам и управления видимостью
  function updateChatCounts() {
    const counts = {
      all: 0,
      global: 0,
      department: 0,
      private: 0,
      group: 0,
      channel: 0,
      announcement: 0
    };
    
    // Подсчитываем чаты в каждой секции
    chatSections.forEach(section => {
      const sectionType = section.dataset.sec;
      const chatRows = section.querySelectorAll('.chat-row');
      
      // Считаем только видимые (не скрытые поиском) чаты
      const visibleChats = Array.from(chatRows).filter(row => {
        return row.style.display !== 'none';
      }).length;
      
      counts[sectionType] = visibleChats;
      counts.all += visibleChats;
      
      // Управление видимостью секции
      // 1. Если чатов нет (скрыты поиском или отсутствуют) -> скрываем секцию
      if (visibleChats === 0) {
        section.style.display = 'none';
      } 
      // 2. Если чаты есть, проверяем активный фильтр
      else {
        if (activeFilter === 'all' || activeFilter === sectionType) {
          section.style.display = '';
        } else {
          section.style.display = 'none';
        }
      }
    });
    
    // Обновляем бейджи и кнопки
    Object.keys(counts).forEach(type => {
      const badge = document.querySelector(`[data-count="${type}"]`);
      const button = document.querySelector(`[data-chat-type="${type}"]`);
      
      if (badge) {
        badge.textContent = counts[type];
        // Скрываем бейдж если 0
        badge.style.display = counts[type] === 0 ? 'none' : '';
      }
      
      // Скрываем кнопку категории, если в ней нет чатов (кроме 'all')
      if (button && type !== 'all') {
        button.style.display = counts[type] === 0 ? 'none' : '';
      }
    });
  }
  
  function applyTypeFilter(filterType) {
    activeFilter = filterType;
    
    // Обновляем активную кнопку
    chatTypeButtons.forEach(btn => {
      if (btn.dataset.chatType === filterType) {
        btn.classList.add('active');
      } else {
        btn.classList.remove('active');
      }
    });
    
    // Переприменяем поиск (если есть), это обновит видимость строк
    if (filterApi && filterApi.reapply) {
      filterApi.reapply();
    }
    
    // Обновляем видимость секций и счетчики
    updateChatCounts();
  }
  
  // Обработка кликов по кнопкам типов
  chatTypeButtons.forEach(btn => {
    btn.addEventListener('click', () => {
      const filterType = btn.dataset.chatType;
      applyTypeFilter(filterType);
    });
  });
  
  // Применяем начальный фильтр и подсчитываем чаты
  applyTypeFilter('all');
  
  // Обновляем счетчики после поиска
  const searchInput = document.getElementById('chatSearch');
  if (searchInput) {
    searchInput.addEventListener('input', () => {
      setTimeout(updateChatCounts, 100);
    });
  }
</script>

{# ========== CHAT SCRIPTS ========== #}
{# Общие скрипты для всех chat-страниц #}
{% include "includes/chat_scripts.html" %}

{# Скрипты специфичные для chat_list #}
{% include "includes/chat_list_scripts.html" %}

{# УСТАРЕЛО: chat-list-enhanced.js больше не используется #}
{# Весь функционал перенесён в модульные компоненты: #}
{# - chatListFilter.js - фильтрация чатов #}
{# - chatListRealtime.js - real-time обновления #}
{# - userWebSocket.js - единое WS соединение #}
{% endblock %}