JS больше не работает для компонента темы

Разработка
1

Продолжение обсуждения из Немного помощи с CSS-селектором?:

Привет,

Некоторое время назад я создал эту тему, и JavaScript для создания CSS-селекторов для уровней доверия работал. Теперь он перестал работать. Вот этот JS…


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, о котором мне следует знать, или проблема в том, что tl4 не является основной группой или что-то в этом роде?

Спасибо!

2

Просто импортируйте декоратор service, и всё должно заработать:

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

После этого ваш @service currentUser снова будет загружаться корректно.

3

Редакция: Я добавил это в скрипт, но всё ещё не могу заставить это работать.

4

Не могли бы вы поделиться любыми ошибками из консоли браузера? Это может помочь.

5

Не могли бы вы попробовать добавить следующий CSS после удаления вашего текущего?

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