| ... | ... | @@ -3746,36 +3746,45 @@ export default function Sidebar() { |
| 3746 | 3746 | routeDraftId={routeDraftIdForRows} |
| 3747 | 3747 | onNavigateToDraft={navigateToDraft} |
| 3748 | 3748 | />, |
| 3749 | | <DndContext |
| 3750 | | key="pinned-dnd" |
| 3751 | | sensors={pinnedDndSensors} |
| 3752 | | collisionDetection={closestCenter} |
| 3753 | | modifiers={[restrictToVerticalAxis, restrictToFirstScrollableAncestor]} |
| 3754 | | onDragEnd={handlePinnedDragEnd} |
| 3755 | | > |
| 3756 | | <SortableContext |
| 3757 | | items={orderedPinnedThreads |
| 3758 | | .map((thread) => |
| 3759 | | scopedThreadKey(scopeThreadRef(thread.environmentId, thread.id)), |
| 3760 | | ) |
| 3761 | | .filter((threadKey) => reorderablePinnedKeys.has(threadKey))} |
| 3762 | | strategy={verticalListSortingStrategy} |
| 3763 | | > |
| 3764 | | {orderedPinnedThreads.map((thread) => { |
| 3765 | | const threadKey = scopedThreadKey( |
| 3766 | | scopeThreadRef(thread.environmentId, thread.id), |
| 3767 | | ); |
| 3768 | | if (!reorderablePinnedKeys.has(threadKey)) { |
| 3769 | | return renderThreadRow(thread, "pinned"); |
| 3770 | | } |
| 3771 | | return ( |
| 3772 | | <SortablePinnedThreadRow key={threadKey} id={threadKey}> |
| 3773 | | {(bag) => renderThreadRow(thread, "pinned", bag)} |
| 3774 | | </SortablePinnedThreadRow> |
| 3775 | | ); |
| 3776 | | })} |
| 3777 | | </SortableContext> |
| 3778 | | </DndContext>, |
| 3749 | pinnedThreads.length > 0 ? ( |
| 3750 | <li key="pinned-dnd" className="list-none"> |
| 3751 | <DndContext |
| 3752 | sensors={pinnedDndSensors} |
| 3753 | collisionDetection={closestCenter} |
| 3754 | modifiers={[restrictToVerticalAxis, restrictToFirstScrollableAncestor]} |
| 3755 | onDragEnd={handlePinnedDragEnd} |
| 3756 | > |
| 3757 | <SortableContext |
| 3758 | items={orderedPinnedThreads |
| 3759 | .map((thread) => |
| 3760 | scopedThreadKey(scopeThreadRef(thread.environmentId, thread.id)), |
| 3761 | ) |
| 3762 | .filter((threadKey) => reorderablePinnedKeys.has(threadKey))} |
| 3763 | strategy={verticalListSortingStrategy} |
| 3764 | > |
| 3765 | <ul |
| 3766 | role="list" |
| 3767 | aria-label="Pinned threads" |
| 3768 | className="flex flex-col gap-px" |
| 3769 | > |
| 3770 | {orderedPinnedThreads.map((thread) => { |
| 3771 | const threadKey = scopedThreadKey( |
| 3772 | scopeThreadRef(thread.environmentId, thread.id), |
| 3773 | ); |
| 3774 | if (!reorderablePinnedKeys.has(threadKey)) { |
| 3775 | return renderThreadRow(thread, "pinned"); |
| 3776 | } |
| 3777 | return ( |
| 3778 | <SortablePinnedThreadRow key={threadKey} id={threadKey}> |
| 3779 | {(bag) => renderThreadRow(thread, "pinned", bag)} |
| 3780 | </SortablePinnedThreadRow> |
| 3781 | ); |
| 3782 | })} |
| 3783 | </ul> |
| 3784 | </SortableContext> |
| 3785 | </DndContext> |
| 3786 | </li> |
| 3787 | ) : null, |
| 3779 | 3788 | ]; |
| 3780 | 3789 | if (pinnedThreads.length > 0) { |
| 3781 | 3790 | items.push( |