Commit cf348fc0 authored by Natalia Tepluhina's avatar Natalia Tepluhina Committed by Ezekiel Kigbo

Fix loading board lists on big screen size

parent 47db9b79
......@@ -142,6 +142,7 @@ export default {
},
onReachingListBottom() {
if (!this.loadingMore && this.hasNextPage) {
this.showCount = true;
this.loadNextPage();
}
},
......@@ -150,12 +151,19 @@ export default {
},
handleDragOnEnd(params) {
sortableEnd();
const { newIndex, oldIndex, from, to, item } = params;
const { oldIndex, from, to, item } = params;
let { newIndex } = params;
const { itemId, itemIid, itemPath } = item.dataset;
const { children } = to;
let { children } = to;
let moveBeforeId;
let moveAfterId;
children = Array.from(children).filter((card) => card.classList.contains('board-card'));
if (newIndex > children.length) {
newIndex = children.length;
}
const getItemId = (el) => Number(el.dataset.itemId);
// If item is being moved within the same list
......@@ -218,6 +226,7 @@ export default {
:data-board="list.id"
:data-board-type="list.listType"
:class="{ 'bg-danger-100': boardItemsSizeExceedsMax }"
draggable=".board-card"
class="board-list gl-w-full gl-h-full gl-list-style-none gl-mb-0 gl-p-2 js-board-list"
data-testid="tree-root-wrapper"
@start="handleDragOnStart"
......@@ -232,17 +241,17 @@ export default {
:item="item"
:disabled="disabled"
/>
<li v-if="showCount" class="board-list-count gl-text-center" data-issue-id="-1">
<gl-loading-icon
v-if="loadingMore"
:label="$options.i18n.loadingMoreboardItems"
data-testid="count-loading-icon"
/>
<span v-if="showingAllItems">{{ showingAllItemsText }}</span>
<gl-intersection-observer v-else @appear="onReachingListBottom">
<span>{{ paginatedIssueText }}</span>
</gl-intersection-observer>
</li>
<gl-intersection-observer @appear="onReachingListBottom">
<li v-if="showCount" class="board-list-count gl-text-center" data-issue-id="-1">
<gl-loading-icon
v-if="loadingMore"
:label="$options.i18n.loadingMoreboardItems"
data-testid="count-loading-icon"
/>
<span v-if="showingAllItems">{{ showingAllItemsText }}</span>
<span v-else>{{ paginatedIssueText }}</span>
</li>
</gl-intersection-observer>
</component>
</div>
</template>
......@@ -157,7 +157,7 @@ RSpec.describe 'Issue Boards', :js do
end
it 'moves to bottom of another list' do
drag(list_from_index: 1, list_to_index: 2, to_index: 2, duration: 1020)
drag(list_from_index: 1, list_to_index: 2, to_index: 3, duration: 1020)
wait_for_requests
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment