JS لم يعد يعمل لمكون السمة

مطور
1

متابعةً للنقاش من مساعدة بسيطة في محدد CSS؟:

مرحباً،

قبل فترة قصيرة طرحت هذا الموضوع وكان JavaScript الخاص بإنشاء محددات CSS لمستويات الثقة يعمل. لم يعد يعمل الآن. هذا هو JavaScript…


import { apiInitializer } from "discourse/lib/api";

export default apiInitializer((api) => {
  const allowedGroups = ["trust_level_4"]; // أضف المجموعات التي تريد استهدافها
  const includeUsersField = ["username"]; // استخدم "id" أو "username"

  api.modifyClass("component:chat/message/info", (SuperClass) => {
    return class extends SuperClass {
      @service currentUser;

      get usernameClasses() {
        if (!this.currentUser) {
          return super.usernameClasses;
        }
        const allowedGroupClasses = this.currentUser.groups
          .filter((g) => allowedGroups.includes(g.name))
          .map((g) => `group--${g.name}`);

        const extraClasses = [
          ...allowedGroupClasses,
          ...includeUsersField.map((f) => `user--${this.currentUser[f]}`),
        ]
          .filter(Boolean)
          .join(" ");

        return super.usernameClasses + " " + extraClasses;
      }
    };
  });
})

وهذا هو CSS الذي كنت أستخدمه…

.chat-message-info__username.group–trust_level_4 {
.chat-message-info__username__name {
color: blue;
}
}

هل لديك أي أفكار حول كيفية إصلاح هذا؟

على وجه التحديد، هل هناك تحديث لـ Discourse يجب أن أعرف عنه أم أن هذا يتعلق بأن مستوى الثقة 4 ليس مجموعة أساسية أو شيء من هذا القبيل؟

شكراً!

2 
import { service } from "@ember/service";

بمجرد إضافة ذلك، سيعمل @service currentUser لديك بشكل صحيح مرة أخرى.

3 إعجابات
3

تعديل: لقد وضعته في البرنامج النصي ولكن لا يزال بإمكاني الحصول عليه يعمل.

4

هل يمكنك مشاركة أي أخطاء في وحدة تحكم المتصفح؟ قد يساعد ذلك.

5

هل يمكنك محاولة إضافة CSS التالي بعد إزالة CSS الحالي الخاص بك؟

.chat-message-info__username.group--trust_level_4 .chat-message-info__username__name {
  color: blue !important;
}