탐색 사이드바

추가 사항이나 변경 사항에 기여할 때 다음 지침을 따르세요
재설계된 탐색 사이드바에.

이 지침은 탐색 사이드바의 현재 상태를 반영합니다. 그러나, 사이드바는 진행 중이며, 이 문서도 마찬가지입니다.

새로운 탐색 사이드바 활성화

새로운 탐색 사이드바를 활성화하려면, 아바타를 선택한 다음 새 탐색 토글을 켭니다.

사이드바에 항목 추가

사이드바에 항목을 추가하기 전에, 탐색을 위한 핸드북 페이지에 설명된 프로세스를 검토하고 따르세요.

페이지 특화 Vue 콘텐츠 추가

페이지는 SidebarPortal 컴포넌트를 사용하여 사이드바에 임의의 콘텐츠를 렌더링할 수 있습니다. 기본 슬롯에 전달된 콘텐츠는 사이드바의 해당 페이지 탐색 항목 아래에 렌더링됩니다.

note
주어진 페이지에서 이 컴포넌트의 인스턴스는 하나만 지원됩니다. 이는 정렬 문제와 사이드바의 혼잡을 피하기 위함입니다.
note
임의의 콘텐츠를 사용할 수 있습니다. ::Sidebars::Panel을 서브클래싱하여 탐색 항목을 구현해야 합니다.
탐색 항목을 렌더링하기 위해 Vue를 사용해야 하는 경우(예: Vue Router를 사용해야 하는 경우) 예외를 만들 수 있습니다.
그러나 해당 panel.rb 파일에 탐색 항목이 렌더링되는 방법을 설명하는 주석을 추가해야 합니다.
note
SidebarPortalTarget 컴포넌트를 사용하지 마세요. 이는 사이드바 내부의 것입니다.

Snowplow 추적

탐색 항목에 대한 모든 클릭은 자동으로 Snowplow에서 추적되어야 하지만 추가 입력이 필요할 수 있습니다.
모든 탐색 요소에 data-tracking 속성을 사용하여 데이터를 Snowplow로 전송합니다.
이들이 작동하는지 확인하려면 GDK에 snowplow 설정하기를 수행할 수 있습니다.

필드 데이터 속성 메모 예시
카테고리 data-tracking-category 사용자가 항목을 클릭할 때 있던 페이지입니다. groups:show
액션 data-tracking-action 수행된 액션입니다. 대부분의 경우 click_link 또는 click_menu_item입니다. click_link
레이블 data-tracking-label 클릭된 항목에 대한 설명자입니다. 대부분의 경우 항목 ID에 의해 추정되지만, item_without_id로 돌아갑니다. 주의해야 할 항목입니다. group_issue_list
속성 data-tracking-property 링크가 클릭된 사이드바의 위치를 설명합니다. 주요 탐색 패널에 있을 경우, 어떤 패널인지 설명해야 합니다. nav_panel_group