محدد CSS لفصل منشورات المستخدم الحالي

أبحث عن طريقة بسيطة لمحدد CSS لتطابق المنشورات التي أنشأها المستخدم الحالي (وليس منشورات المستخدمين الآخرين). قدر ما أستطيع الحكم، لا توجد فئة CSS تُضاف إلى هذه المنشورات يمكنني استخدامها. لكن ربما أكون قد فاتني شيء ما؟

إذا لم تكن هناك مثل هذه الفئة حاليًا، فسأكون ممتنًا جدًا لو تم إضافتها!

اقتراحي هو إضافة فئة إلى عنصر topic-post``، مشابهة للفئات الموجودة حاليًا والمتعلقة بمستخدم المنشور، مثل topic-owner. يمكن أن تكون الفئة الجديدة current-userأوmy-post``` أو أي اسم يتناسب مع تسمية Discourse الحالية.

انقر هنا للحصول على شرح لسبب رغبتي في القيام بذلك...

منذ بعض الوقت، اشتكى مستخدمو المنتدى الخاص بي من إدمانهم على التحقق من عدد الإعجابات التي حصلت عليها منشوراتهم. كانوا يعودون إلى المنشورات مرارًا وتكرارًا فقط للتحقق من إعجاباتهم، وكان هذا السلوك يذكرهم بالجوانب الأكثر سمية لمنصات التواصل الاجتماعي الرئيسية.

كان حلّي هو إنشاء سمة (theme) يستخدمونها، حيث أضفت ببساطة قاعدة CSS لإخفاء عداد الإعجابات في منشوراتهم. زر الإعجاب في المنشورات التي أنشأها المستخدم الحالي يحمل فئة تُسمى ```.my-likes``، لذا من السهل تحديده باستخدام CSS. نجح هذا الحل وكان المستخدمون راضين عنه.

ومع ذلك، في وقت سابق من اليوم، أُشير إليّ إلى أنه إذا نقرت على زر “…”، أي “إظهار المزيد” في منشور، فإن المستخدمين الذين أعجبوا بهذا المنشور يُدرَجون. أفاد مستخدم بأنه عاد إلى عاداته كـ “مدمن الدوبامين” بسبب ذلك، حيث كان يضغط على “…” مرارًا وتكرارًا لتجاوز السمة الخاصة والتحقق من إعجاباته.

لكن على عكس حالة زر الإعجاب المذكورة أعلاه، لا أستطيع العثور على محدد CSS يسمح لي بذلك. الحل الوحيد الذي وجدته هو إخفاء قائمة المعجبين لجميع المنشورات، أي جعل مستخدمي السمة غير قادرين على رؤية هذه القائمة لأي منشور.

ما يمكنني فعله الآن هو:

.who-liked { display: none;}

ما كنت آمل في فعله هو شيء مثل:

.topic-post.current-user .who-liked { display: none;}

(لكن هذا لا يعمل، لأن فئة .current-user غير موجودة.)

ربما يمكنك استخدام السمة data-user-id في وسم .topic-post article؟

أحد الخيارات المتاحة هو البحث في قائمة المواضيع عن تلك التي يكون فيها المستخدم الحالي هو منشئ الموضوع، ويمكن تحقيق ذلك باستخدام jQuery. إذا كان الشرط صحيحًا، فقم بتطبيق تنسيق معين على هذا السطر. من العيوب المحتملة أن المستخدم قد يُعتبر منشئًا للموضوع الرئيسي (OP).

البديل الآخر هو تجاوز مكون قائمة المواضيع بالكامل وتنفيذ الإجراءات المطلوبة هناك. يمكنك العثور على مزيد من المعلومات حول تجاوز القوالب هنا:

عذرًا، هل تقصد أنك تريد تزيين منشورات المستخدمين في قائمة المواضيع أم داخل الموضوع الفعلي؟
في هذه الحالة، يمكنك ربط الأمر بصورة المستخدم الحالي، ثم العثور على العنصر الجذر للمنشور الأصلي وإضافة فئة (class) إليه باستخدام jQuery.

شكرًا لكم على الردود!

أنا أدرك تمامًا أنه يمكنني القيام بذلك باستخدام JavaScript. كان يجب أن أذكر ذلك منذ البداية. ومع ذلك، فإن نقطة منشوري هي أنني أرغب في القيام بذلك بطريقة أبسط بكثير، باستخدام جزء صغير من CSS (انظر الجزء القابل للتوسيع في منشوري الأصلي).

إلى جانب كونها حلاً أبسط وأكثر طبيعية، فإنها ستمكنني من إدارة الأمور باستخدام النظام المدمج الممتاز للسمات ومكونات السمات.

وليس الأمر كما لو أن هذا سيكون شيئًا غريبًا أو غريبًا. وكما ذكرت في البداية، فإن Discourse يحتوي بالفعل على سمات class على العنصر نفسه (منشور في صفحة الموضوع) للإشارة إلى خصائص المستخدم الناشر (مالك الموضوع، مستوى الثقة، عضويات المجموعات، إلخ). وفي عنصر فرعي من هذا العنصر (زر الإعجاب)، يوجد بالفعل سمة class تشير إلى أن المنشور قد تم من قبل المستخدم الذي يقوم حاليًا بزيارة الصفحة.

ولهذه الأسباب، أعتقد أن إضافة سمة واحدة فقط على عنصر موضوع المنشور هو حل أفضل بكثير من بعض حيل JavaScript.

أوه، لقد جئت للتو لنشر حل جافا سكريبت. لقد أنشأت مجموعة تسمى hidelikes، وهذا السكربت يخفي قائمة من أعجبهم المنشور لجميع أعضاء المجموعة في منشوراتهم الخاصة.

<script type="text/discourse-plugin" version="0.8">
    $( document ).ready(function() {
        let currentUser = api.getCurrentUser();
        var groups = currentUser.groups;
        var userID = currentUser.id;
        const hidelikes = groups.some(g => g.name === 'hidelikes');
        if (hidelikes) { 
               $('<style>').text('.boxed.onscreen-post[data-user-id="' + userID + '"] .who-liked{display: none;}').appendTo(document.head)
         }
    });
</script>

من الواضح أنه إذا كنت ترغب في تطبيق ذلك على جميع المستخدمين، فقم ببساطة بحذف جزء المجموعات.

شكرًا جزيلاً لك على مشاركة الكود الفعلي، إنه مفيد حقًا!

بعد البحث قليلاً في plugin-api، أعتقد أنني وجدت حلاً لمشكلتك والطريقة الصحيحة لتنفيذ ما اقترحته

<script type="text/discourse-plugin" version="0.8">
  api.addPostClassesCallback((attrs) => {
    const user = api.getCurrentUser();
    if (attrs.user_id === user.id)  {
      return ['current-user-post']
    }
  });
</script>

راجع هنا:
https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/lib/plugin-api.js#L712

سيؤدي هذا إلى إضافة current-user-post إلى كل منشور ينشره المستخدم الحالي المسجل دخوله.

هذا رائع، شكرًا جزيلاً!

أين يجب إضافة هذا الكود؟ لقد أضفته إلى </body> لكنه لا يعمل بشكل صحيح.