Как отредактировать ссылки в боковой панели, добавленные через api.addCommunitySectionLink?

Разработка
1

Я хочу добавить новую ссылку в боковую панель с использованием компонента. Я использую этот код:

      api.addCommunitySectionLink({
        name: "custom-homepage",
        route: "discovery.custom",
        title: "Home",
        text: "Home",
        icon: "house",
      });

Это добавляет ссылку, но в модальном окне настройки она не отображается. Поэтому я не могу редактировать стандартную ссылку или перетаскивать её в другое положение.

Я заметил, что то же самое происходит со ссылкой, добавленной плагином «Календарь». Вот эта ссылка:

image
image246×227 6.21 KB

Но в модальном окне настройки ссылка не отображается:

На этом изображении представлен скриншот интерфейса пользователя для редактирования пользовательского раздела, показывающий иконки и названия различных пользовательских ссылок, таких как «Темы», «Мои сообщения», «Обзор» и «Админ», а также соответствующие URL-адреса. (Подпись сгенерирована ИИ)
На этом изображении представлен скриншот интерфейса пользователя для редактирования пользовательского раздела, показывающий иконки и названия различных пользовательских ссылок, таких как «Темы», «Мои сообщения», «Обзор» и «Админ», а также соответствующие URL-адреса. (Подпись сгенерирована ИИ)593×466 18.2 KB

Так что я задаюсь вопросом: это баг или есть другой подход?

2

К сожалению, нельзя.

3

Будут ли изменения отменены при каждом обновлении компонента или плагина?

Похоже, подход заключается в том, чтобы вообще не добавлять ссылку по умолчанию.

4

Только если вы напрямую перезаписываете компонент или плагин… Если вы хотите изменить порядок в существующем разделе, скорее всего, проще всего сделать это с помощью CSS:

#sidebar-section-content-community {
  display: flex;
  flex-direction: column;
  
  li {
    order: 2
  }
  
  [data-list-item-name="upcoming-events"] {
    order: 1
  }
}

Если вы хотите переместить элемент в меню «Ещё», скройте оригинал и продублируйте его в отдельном компоненте:

#sidebar-section-content-community {
  [data-list-item-name="upcoming-events"] {
    display: none;
  }
}

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

export default apiInitializer((api) => {
  const siteSettings = api.container.lookup("service:site-settings");
  if (
    siteSettings.discourse_post_event_enabled &&
    siteSettings.sidebar_show_upcoming_events
  ) {
    api.addCommunitySectionLink(
      {
        name: "custom-upcoming-events",
        route: "discourse-post-event-upcoming-events",
        text: i18n("discourse_post_event.upcoming_events.title"),
        title: i18n("discourse_post_event.upcoming_events.title"),
        icon: "calendar-days",
      },
      true,
    );
  }
});
5

Если новые ссылки нельзя изменить в модальном окне настройки, я, пожалуй, пока откажусь от идеи их добавления. Тогда добавление ссылки, которая скрыта в модальном окне настройки, будет просто запутанным.

Однако я хотел бы, чтобы ссылка (если она добавлена вручную) подсвечивалась при нахождении на соответствующем маршруте, поэтому я добавлю это сейчас:

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

export default apiInitializer("0.8", (api) => {
  const router = api.container.lookup("service:router");

  api.onPageChange(() => {
    const currentRoute = router.currentRoute.name;
    const customHomepageLink = document.querySelector(
      '.sidebar-section-link[href="/custom"]'
    );

    if (currentRoute === "discovery.custom") {
      if (customHomepageLink) {
        customHomepageLink.classList.add("active");
      }
    } else {
      if (customHomepageLink) {
        customHomepageLink.classList.remove("active");
      }
    }
  });
});