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>