사이드바에 사용자 정의 변경 사항을 프로그래밍 방식으로 적용하는 방법

개발
,
6

chat 플러그인이 사이드바와 어떻게 통합되는지 확인해 보세요:

이 경우 링크의 상태는 서비스 객체에 저장되며, 상태가 변경될 때마다 사이드바가 업데이트됩니다:

잠재적인 해결책은 페이지 변경 이벤트에 구독(subscribe)하여 링크를 업데이트하는 것입니다. 의사 코드(pseudocode)는 다음과 같이 작성할 수 있습니다:

import { tracked } from "@glimmer/tracking";

api.addSidebarSection(
  (BaseCustomSidebarSection, BaseCustomSidebarSectionLink) => {
    const TestSectionLink = class extends BaseCustomSidebarSectionLink {
      // 여기에서 사용자 정의 링크 속성을 정의합니다
    };

    const SidebarTestSection = class extends BaseCustomSidebarSection {
      @tracked links = [];

      constructor() {
        super(...arguments);

        this.#updateLinks();
        this.onAppEvent("page:changed", () => this.#updateLinks());
      }

      get newLinksArray() {
        // 현재 URL 기반의 링크 목록
      }

      #updateLinks() {
        this.links = this.newLinksArray.map(
          (link) =>
            new TestSectionLink({
              link,
            })
        );
      }

      get sectionLinks() {
        return this.links;
      }
    };
    return SidebarTestSection;
  }
);