사용자 지정 태그 순서 지정 방법

개발
1

안녕하세요.

태그 그룹 이름 값 기준으로 토픽 태그를 사용자 지정 정렬하고 싶습니다.

테마 컴포넌트를 살펴보고 있는데, 이 방법이 맞을 것 같습니다. 다만 첫 테마 컴포넌트를 만드는 것이므로 의견과 조언을 구하고 싶습니다.

감사합니다.

2

결국 태그 설명 필드를 사용해 정수를 저장하여 원하는 순서를 시뮬레이션했습니다. 태그 그룹은 태그 구조나 DOM에 노출되지 않기 때문에 이 방법을 사용하게 되었습니다.

이후 테마 편집기의 헤더 코드 스니펫을 사용하여 다음 스크립트를 DOM에 주입했습니다.

이를 통해 태그를 동적으로 재정렬할 수 있었습니다. 현재로서는 "해킹"에 가깝지만, 적어도 작동은 합니다.

<script type="text/discourse-plugin" version="0.8">
  api.addTagsHtmlCallback(function(topic, params) {
    const containers = document.querySelectorAll(".discourse-tags");
    for (const container of containers) {
      const children = Array.from(container.children);

      children.sort((a, b) => {
        const orderA = parseInt(a.getAttribute("title"));
        const orderB = parseInt(b.getAttribute("title"));
        return orderA - orderB;
      });

      children.forEach(child => container.appendChild(child));
    }
  }, {priority: 100});
</script>