How to bring in Latest topics when using category boxes

Разработка
23

Я почти сдался, но затем просто использовал этот код.

https://meta.discourse.org/t/add-a-featured-topic-list-to-your-discourse-homepage/132949

И изменил путь к JSON на /latest.json

<script type="text/discourse-plugin" version="0.8">
  const ajax = require('discourse/lib/ajax').ajax;
  const Topic = require('discourse/models/topic').default;
  // Мы используем ajax и модель Topic из Discourse

  api.registerConnectorClass('below-discovery-categories', 'featured-topics', {
    // above-main-container — это выходной порт плагина,
    // featured-topics — ваше собственное имя компонента

    setupComponent(args, component) {

      api.onPageChange((url, title) => {
        if ((url == "/") || (url == "/categories") ){
        // при смене страницы проверяем, совпадает ли URL
        // если ваша главная страница не /latest, измените это на /categories
        
          $('html').addClass('custom-featured-topics');
          // добавляем класс к тегу HTML для удобного CSS-целевого поиска

          component.set('displayfeaturedTopics', true);
          // позже мы используем это, чтобы показать наш шаблон

          component.set("loadingTopics", true);
          // помогает показать индикатор загрузки, пока темы не готовы

          ajax("/latest.json").then (function(result){
          // Получаем посты с тегом «featured» с помощью AJAX
          // если бы это была категория, вы бы использовали /c/featured.json

            let featuredTopics = [];
            // Создаём пустой массив, в который будем добавлять темы

            var featuredUsers = result.users;
            // Получаем соответствующих пользователей

            result.topic_list.topics.slice(0,4).forEach(function(topic){
            // Мы извлекаем темы, начиная с 0 и заканчивая 4
            // Это значит, что мы покажем 3 темы всего. Увеличьте 4, чтобы показать больше.

              topic.posters.forEach(function(poster){
                poster.user = $.grep(featuredUsers, function(e){ return e.id == poster.user_id; })[0];
              });
              // Связываем пользователей с нашей темой

              featuredTopics.push(Topic.create(topic));
              // Добавляем наши темы в массив featuredTopics
            });

            component.set("loadingTopics", false);
            // Темы загружены, прекращаем показ индикатора загрузки

            component.set('featuredTopics', featuredTopics);
            // Настраиваем наш компонент с темами из массива
          });

        } else {
        // Если страница не совпадает с URL выше, сделайте следующее:

          $('html').removeClass('custom-featured-topics');
          // Удаляем наш собственный класс

          component.set('displayfeaturedTopics', false);
          // Не отображаем нашу кастомизацию
        }
      });
    }
  });
</script>

<script type="text/x-handlebars" data-template-name="/connectors/below-discovery-categories/featured-topics">

  {{#if displayfeaturedTopics}}
  <!-- Если наш компонент истинен, покажите этот контент: -->

      <div class="custom-featured-topics-wrapper">
        {{conditional-loading-spinner condition=loadingTopics}}
        <!-- Покажите индикатор загрузки, если темы загружаются -->

        {{#unless loadingTopics}}
        <!-- Если темы всё ещё не загружаются... -->
          {{topic-list topics=featuredTopics showPosters=true}}
          <!-- Покажите список тем -->
        {{/unless}}

      </div>

  {{/if}}
</script>