Как изменить ссылку, связанную с кнопкой в панели меню пользователя

Разработка
1

Вместо того чтобы выделенная кнопка вела на u/miles/summary, я бы хотел, чтобы она вела на u/miles/activity. Как это сделать? Я пытался найти информацию в интернете (кажется, нужно изменить атрибут data-url с помощью JavaScript, но единственный способ, который я видел, — сначала получить идентификатор элемента, а у этого элемента его нет.)

PIC
PIC1920×1080 480 KB

2

Вам нужно будет повторно открыть соответствующий виджет в компоненте темы, например:

api.reopenWidget("user-menu-links", {
  profileGlyph() {
    return {
      title: Titles["profile"],
      className: "user-preferences-link menu-link",
      id: QuickAccess.PROFILE,
      icon: "user",
      action: UserMenuAction.QUICK_ACCESS,
      actionParam: QuickAccess.PROFILE,
      data: { url: `${this.attrs.path}/activity` },
      role: "tab",
      tabAttrs: this._tabAttrs(QuickAccess.PROFILE),
    };
  },
})
3

Спасибо! Думаю, это имеет смысл.
Однако есть один момент: я вставляю это в <head>, но получаю ошибку: SyntaxError: unknown: Unexpected token, expected "," (28:6)

<script type="text/discourse-plugin" version="0.8">    
    api.reopenWidget("user-menu-links", {
      profileGlyph() {
        return {
          title: Titles["profile"],
          className: "user-preferences-link menu-link",
          id: QuickAccess.PROFILE,
          icon: "user",
          action: UserMenuAction.QUICK_ACCESS,
          actionParam: QuickAccess.PROFILE,
          data: { url: `${this.attrs.path}/activity` },
          role: "tab",
          tabAttrs: this._tabAttrs(QuickAccess.PROFILE),
        };
      },
    }
</script>
4

Выше отсутствовала закрывающая скобка ), исправлено

6

Ошибок больше нет, но… Теперь выпадающее меню ссылок user-menu-links даже не открывается. Есть какая-то идея, почему так происходит?

7

Что вы сделали для отладки?

Всегда стоит начать с просмотра консоли JavaScript в браузере.

Если вы посмотрите, то увидите три очевидные проблемы (в конечном итоге).

Решение в данном случае довольно простое: нужно просто добавить недостающие константы:

      const UserMenuAction = {
        QUICK_ACCESS: "quickAccess",
      };

      const QuickAccess = {
        BOOKMARKS: "bookmarks",
        MESSAGES: "messages",
        NOTIFICATIONS: "notifications",
        PROFILE: "profile",
      };
      
      const Titles = {
        bookmarks: "user.bookmarks",
        messages: "user.private_messages",
        notifications: "user.notifications",
        profile: "user.preferences",
      };

После добавления этих констант (из исходного кода) всё работает :tada:

(Но см. оптимизацию Фаизана ниже, которая делает эти константы ненужными, что ещё лучше :slight_smile: )

8

Проще говоря

<script type="text/discourse-plugin" version="0.8">    
api.reopenWidget("user-menu-links", {
  profileGlyph() {
   const glyph = this._super(...arguments);
   glyph['data'] = { url: `${this.attrs.path}/activity` };
   return glyph;
  },
}

Хотя это не было протестировано :wink:

9

Да, намного лучше и избавляет от необходимости использовать константы — отличное оптимизирование! :slight_smile:

10

На самом деле можно пойти ещё дальше и опустить это:

      api.reopenWidget("user-menu-links", {
        profileGlyph() {
         const glyph = this._super();
         glyph['data'] = { url: `${this.attrs.path}/activity` };
         return glyph;
        }
      });

Так как аргументов нет.

11

Спасибо, ребята! Всё работает отлично. Много узнаю о редактировании в Discourse!