From f3501a3c6f46a2c230852fec52218308f485e38d Mon Sep 17 00:00:00 2001
From: Idir Chikhoune <idir.chikhoune@lisn.fr>
Date: Thu, 9 Apr 2026 12:54:15 +0200
Subject: [PATCH 1/5] Leaderboard Pagination. (#2319)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* pagination feature ready, needs to be tested

* set up 50 as default value for leaderboard pagination

* fix pagination in endpoint

* Fix indent in competitions.py

---------

Co-authored-by: Adrien Pavão <adrien.pavao@gmail.com>
---
 src/apps/api/views/competitions.py            |  32 +-
 src/static/js/ours/client.js                  |   4 +
 .../riot/competitions/detail/detail.tag       | 679 ++++++++++++++++--
 .../riot/competitions/detail/leaderboards.tag | 308 +++++---
 4 files changed, 883 insertions(+), 140 deletions(-)

diff --git a/src/apps/api/views/competitions.py b/src/apps/api/views/competitions.py
index 7cacb433b..53b9d2193 100644
--- a/src/apps/api/views/competitions.py
+++ b/src/apps/api/views/competitions.py
@@ -18,7 +18,7 @@
 from rest_framework.response import Response
 from rest_framework.renderers import JSONRenderer
 from rest_framework_csv.renderers import CSVRenderer
-from api.pagination import LargePagination
+from api.pagination import DynamicChoicePagination, LargePagination
 from api.renderers import ZipRenderer
 from rest_framework.viewsets import ModelViewSet
 from api.serializers.competitions import CompetitionSerializerSimple, PhaseSerializer, \
@@ -774,10 +774,17 @@ def rerun_submissions(self, request, pk):
     def get_leaderboard(self, request, pk):
         phase = self.get_object()
         if phase.competition.fact_sheet:
-            fact_sheet_keys = [(phase.competition.fact_sheet[question]['key'], phase.competition.fact_sheet[question]['title'])
-                               for question in phase.competition.fact_sheet if phase.competition.fact_sheet[question]['is_on_leaderboard'] == 'true']
+            fact_sheet_keys = [
+                (
+                    phase.competition.fact_sheet[question]['key'],
+                    phase.competition.fact_sheet[question]['title']
+                )
+                for question in phase.competition.fact_sheet
+                if phase.competition.fact_sheet[question]['is_on_leaderboard'] == 'true'
+            ]
         else:
             fact_sheet_keys = None
+
         query = LeaderboardPhaseSerializer(phase).data
         response = {
             'title': query['leaderboard']['title'],
@@ -787,9 +794,11 @@ def get_leaderboard(self, request, pk):
             'fact_sheet_keys': fact_sheet_keys or None,
             'primary_index': query['leaderboard']['primary_index']
         }
+
         columns = [col for col in query['columns']]
         submissions_keys = {}
         submission_detailed_results = {}
+
         for submission in query['submissions']:
             submission_key = f"{submission['owner']}{submission['parent'] or submission['id']}"
             # gather detailed result from submissions for each task
@@ -814,6 +823,7 @@ def get_leaderboard(self, request, pk):
                     'organization': submission['organization'],
                     'created_when': submission['created_when']
                 })
+
             for score in submission['scores']:
 
                 # to check if a column is found
@@ -851,6 +861,21 @@ def get_leaderboard(self, request, pk):
         for k, v in submissions_keys.items():
             response['submissions'][v]['detailed_results'] = submission_detailed_results[k]
 
+        # --- pagination addition ---
+        total_count = len(response['submissions'])
+        paginator = DynamicChoicePagination()
+        paginated_submissions = paginator.paginate_queryset(response['submissions'], request, view=self)
+        if paginated_submissions is None:
+            paginated_submissions = response['submissions']
+
+        response['submissions'] = paginated_submissions
+        response['count'] = total_count
+        response['page_size'] = getattr(paginator, 'requested_page_size', request.query_params.get('page_size', 50))
+        response['next'] = paginator.get_next_link()
+        response['previous'] = paginator.get_previous_link()
+        response['allowed_page_sizes'] = [50, 100, 500, 'all']
+        # --- end pagination addition ---
+
         for task in query['tasks']:
             # This can be used to rendered variable columns on each task
             tempTask = {
@@ -862,6 +887,7 @@ def get_leaderboard(self, request, pk):
             for col in columns:
                 tempTask['columns'].append(col)
             response['tasks'].append(tempTask)
+
         return Response(response)
 
 
diff --git a/src/static/js/ours/client.js b/src/static/js/ours/client.js
index f43bfaaa2..decd1d6f4 100644
--- a/src/static/js/ours/client.js
+++ b/src/static/js/ours/client.js
@@ -147,6 +147,10 @@ CODALAB.api = {
     get_leaderboard_for_render: function (phase_pk) {
         return CODALAB.api.request('GET', `${URLS.API}phases/${phase_pk}/get_leaderboard/`)
     },
+    get_leaderboard_for_render: function (phase_pk, params = {}) {
+        return CODALAB.api.request('GET', `${URLS.API}phases/${phase_pk}/get_leaderboard/`, params)
+    },
+
     update_submission_score: function (pk, data) {
         return CODALAB.api.request('PATCH', `${URLS.API}submission_scores/${pk}/`, data)
     },
diff --git a/src/static/riot/competitions/detail/detail.tag b/src/static/riot/competitions/detail/detail.tag
index f0c9418c1..f971675b3 100644
--- a/src/static/riot/competitions/detail/detail.tag
+++ b/src/static/riot/competitions/detail/detail.tag
@@ -1,65 +1,648 @@
 <competition-detail>
-    <comp-detail-header class="comp-detail-paragraph-text" competition="{ competition }"></comp-detail-header>
-    <comp-detail-timeline class="comp-detail-phases" competition="{ competition }"></comp-detail-timeline>
-    <comp-tabs class="comp-detail-paragraph-text" competition="{ competition }"></comp-tabs>
+    <div class="layout">
+        <div class="comp-content">
+            <comp-detail-header class="comp-detail-paragraph-text" competition="{ competition }"></comp-detail-header>
+            <comp-detail-timeline class="comp-detail-phases" competition="{ competition }"></comp-detail-timeline>
+            <comp-tabs class="comp-detail-paragraph-text" competition="{ competition }"></comp-tabs>
+        </div>
+
+        <button
+            if="{ canViewWorkersPanel }"
+            class="ui button primary workers-toggle-btn"
+            onclick="{ toggleWorkersPanel }">
+            <i class="server icon"></i>
+            { showWorkersPanel ? 'Hide workers' : 'Show workers' }
+        </button>
+
+        <aside if="{ canViewWorkersPanel && showWorkersPanel }"
+               class="workers-panel"
+               style="left: { panelLeft }px; top: { panelTop }px;">
+            <div class="workers-card">
+                <div class="workers-header workers-drag-handle" onmousedown="{ startPanelDrag }">
+                    <div class="workers-title">
+                        <i class="server icon"></i>
+                        <div class="workers-title-text">
+                            Compute Workers
+                            </br>
+                            <small><small><small>displayed only for competition organizers</small></small></small>
+                            <div class="workers-subtitle">
+                                <span class="workers-connection { wsState }">{ connectionLabel() }</span>
+                                <span class="workers-separator">•</span>
+                                Last update: { lastSyncLabel() }
+                            </div>
+                        </div>
+                    </div>
+                    <div class="workers-drag-hint">Drag to move</div>
+                </div>
+
+                <div class="workers-stats">
+                    <div class="stat-card">
+                        <div class="stat-value">{ totalCount() }</div>
+                        <div class="stat-label">Total</div>
+                    </div>
+                    <div class="stat-card">
+                        <div class="stat-value stat-green">{ availableCount() }</div>
+                        <div class="stat-label">Available</div>
+                    </div>
+                    <div class="stat-card">
+                        <div class="stat-value stat-yellow">{ busyCount() }</div>
+                        <div class="stat-label">Busy</div>
+                    </div>
+                    <div class="stat-card">
+                        <div class="stat-value stat-red">{ unavailableCount() }</div>
+                        <div class="stat-label">Down</div>
+                    </div>
+                </div>
+
+                <div class="workers-table-wrap">
+                    <table class="ui very compact selectable striped table workers-table">
+                        <thead>
+                            <tr>
+                                <th class="col-worker">Worker</th>
+                                <th class="col-status">Status</th>
+                                <th class="col-jobs">Jobs</th>
+                                <th class="col-lastseen">Last seen</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr each="{ worker in sortedWorkers() }">
+                                <td><strong>{ worker.hostname }</strong></td>
+                                <td>
+                                    <span class="ui tiny label worker-status { getStatusClass(worker) }">
+                                        <i class="{ getStatusIcon(worker) } icon"></i>
+                                        { getStatusText(worker) }
+                                    </span>
+                                </td>
+                                <td><span class="ui circular label">{ worker.running_jobs || 0 }</span></td>
+                                <td>{ formatLastSeen(worker.timestamp) }</td>
+                            </tr>
+                            <tr if="{ sortedWorkers().length === 0 }">
+                                <td colspan="4" class="center aligned">
+                                    <div class="workers-empty">
+                                        <div class="header">No compute workers detected</div>
+                                        <div class="description">Waiting for the first websocket snapshot.</div>
+                                    </div>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+
+                <div class="workers-footer">
+                    Green = available, yellow = busy, red = unavailable
+                </div>
+            </div>
+        </aside>
+    </div>
+
     <script>
-        var self = this
+        var self = this;
 
-        // Stops page load errors... although we shouldn't be using/referencing empty `competitions` object?
-        self.competition = {}
+        self.competition = {};
+        self.workers = [];
+        self.ws = null;
+        self.wsReconnectTimer = null;
+        self.wsState = 'disconnected';
+        self.lastSyncAt = null;
 
-        self.one("mount", function () {
-            // Setup tabs
-            $('.menu .item', self.root).tab()
+        self.canViewWorkersPanel = (self.opts.can_view_workers_panel === 'true');
+        self.showWorkersPanel = false
+
+        self.canViewWorkersPanel = String(self.opts.can_view_workers_panel || 'false') === 'true'
+        self.panelLeft = 24;
+        self.panelTop = 24;
+        self.panelWidth = 375;
+        self.draggingPanel = false;
+        self.dragOffsetX = 0;
+        self.dragOffsetY = 0;
+        self.panelStorageKey = 'codabench_workers_panel_position';
+        self.resizeListenerAttached = false;
+
+        self.toggleWorkersPanel = function () {
+            self.showWorkersPanel = !self.showWorkersPanel
+
+            if (self.showWorkersPanel) {
+                self.loadPanelPosition()
+                self.connect_workers_socket()
+            } else {
+                self.close_workers_socket()
+            }
+
+            self.update()
+        }
 
-            // Get the actual data
-            self.update_competition_data()
-        })
+        self.one('mount', function () {
+            $('.menu .item', self.root).tab();
+            self.update_competition_data();
+            if (self.canViewWorkersPanel) {
+                self.loadPanelPosition();
+                self.attachResizeListener();
+            }
+        });
+
+        self.close_workers_socket = function () {
+            if (self.wsReconnectTimer) {
+                clearTimeout(self.wsReconnectTimer)
+                self.wsReconnectTimer = null
+            }
+
+            if (self.ws) {
+                self.ws.onclose = null
+
+                try { self.ws.close() } catch (e) {}
+                self.ws = null
+            }
+
+            self.wsState = 'disconnected'
+        }
+
+        self.one('unmount', function () {
+            self.detachResizeListener();
+            if (self.wsReconnectTimer) {
+                clearTimeout(self.wsReconnectTimer);
+                self.wsReconnectTimer = null;
+            }
+            if (self.ws) {
+                try { self.ws.close(); } catch(e) {}
+                self.ws = null;
+            }
+            document.body.classList.remove('workers-panel-dragging');
+        });
 
         self.update_competition_data = function () {
             CODALAB.api.get_competition(self.opts.competition_pk, self.opts.secret_key)
                 .done(function (data) {
-                    self.competition = data
-                    CODALAB.events.trigger('competition_loaded', self.competition)
-                    let selected_phase_index = _.get(_.find(self.competition.phases, {'status': 'Current'}), 'id')
-                    if (selected_phase_index == null) {
-                        selected_phase_index = _.get(_.find(self.competition.phases, {is_final_phase: true}), 'id')
+                    self.competition = data;
+                    CODALAB.events.trigger('competition_loaded', self.competition);
+
+                    let currentPhase = _.find(self.competition.phases, { status: 'Current' });
+                    let selectedPhaseId = currentPhase ? currentPhase.id : null;
+                    if (selectedPhaseId === null) {
+                        let finalPhase = _.find(self.competition.phases, { is_final_phase: true });
+                        selectedPhaseId = finalPhase ? finalPhase.id : null;
                     }
-                    CODALAB.events.trigger('phase.selected',(_.find(self.competition.phases, {id: selected_phase_index})))
-                    self.update()
-                })
-                .fail(function (response) {
-                    toastr.error("Could not find benchmark")
+                    CODALAB.events.trigger(
+                        'phase.selected',
+                        (_.find(self.competition.phases, { id: selectedPhaseId }))
+                    );
+
+                    self.update();
                 })
-        }
+                .fail(function () {
+                    toastr.error("Could not find competition");
+                });
+        };
+
+        self.attachResizeListener = function () {
+            if (self.resizeListenerAttached) return;
+            window.addEventListener('resize', self.onWindowResize);
+            self.resizeListenerAttached = true;
+        };
+
+        self.detachResizeListener = function () {
+            if (!self.resizeListenerAttached) return;
+            window.removeEventListener('resize', self.onWindowResize);
+            self.resizeListenerAttached = false;
+        };
+
+        self.loadPanelPosition = function () {
+            try {
+                var raw = localStorage.getItem(self.panelStorageKey);
+                if (!raw) return;
+                var pos = JSON.parse(raw);
+                if (typeof pos.left === 'number') self.panelLeft = pos.left;
+                if (typeof pos.top === 'number') self.panelTop = pos.top;
+                self.clampPanelPosition();
+            } catch (e) {
+                console.warn('Could not load panel position', e);
+            }
+        };
+
+        self.savePanelPosition = function () {
+            try {
+                localStorage.setItem(self.panelStorageKey, JSON.stringify({
+                    left: self.panelLeft,
+                    top: self.panelTop
+                }));
+            } catch (e) {
+                console.warn('Could not save panel position', e);
+            }
+        };
+
+        self.clampPanelPosition = function () {
+            var minLeft = 8, minTop = 8;
+            var maxLeft = Math.max(minLeft, window.innerWidth - self.panelWidth - 8);
+            var maxTop = Math.max(minTop, window.innerHeight - 80);
+            self.panelLeft = Math.min(Math.max(minLeft, self.panelLeft), maxLeft);
+            self.panelTop = Math.min(Math.max(minTop, self.panelTop), maxTop);
+        };
+
+        self.onWindowResize = function () {
+            self.clampPanelPosition();
+            self.update();
+        };
+
+        self.startPanelDrag = function (e) {
+            if (e.button !== 0) return;
+            var panel = self.root.querySelector('.workers-panel');
+            if (!panel) return;
+            var rect = panel.getBoundingClientRect();
+            self.draggingPanel = true;
+            self.dragOffsetX = e.clientX - rect.left;
+            self.dragOffsetY = e.clientY - rect.top;
+            document.body.classList.add('workers-panel-dragging');
+            window.addEventListener('mousemove', self.onPanelDragMove);
+            window.addEventListener('mouseup', self.stopPanelDrag);
+            e.preventDefault(); e.stopPropagation();
+        };
+
+        self.onPanelDragMove = function (e) {
+            if (!self.draggingPanel) return;
+            var minLeft = 8, minTop = 8;
+            var maxLeft = Math.max(minLeft, window.innerWidth - self.panelWidth - 8);
+            var maxTop = Math.max(minTop, window.innerHeight - 80);
+            var newLeft = e.clientX - self.dragOffsetX;
+            var newTop = e.clientY - self.dragOffsetY;
+            self.panelLeft = Math.min(Math.max(minLeft, newLeft), maxLeft);
+            self.panelTop = Math.min(Math.max(minTop, newTop), maxTop);
+            self.update();
+        };
+
+        self.stopPanelDrag = function () {
+            if (!self.draggingPanel) return;
+            self.draggingPanel = false;
+            document.body.classList.remove('workers-panel-dragging');
+            window.removeEventListener('mousemove', self.onPanelDragMove);
+            window.removeEventListener('mouseup', self.stopPanelDrag);
+            self.savePanelPosition();
+            self.update();
+        };
+
+        self.connect_workers_socket = function () {
+            if (self.ws) {
+                try { self.ws.close(); } catch (e) {}
+                self.ws = null;
+            }
+            var scheme = window.location.protocol === 'https:' ? 'wss' : 'ws';
+            var url = scheme + '://' + window.location.host + '/ws/workers/';
+            self.wsState = 'connecting';
+            self.update();
+            self.ws = new WebSocket(url);
+
+            self.ws.onopen = function () {
+                self.wsState = 'connected';
+                self.update();
+            };
+            self.ws.onmessage = function (event) {
+                try {
+                    var message = JSON.parse(event.data);
+                    if (message.type === 'workers.snapshot') {
+                        self.workers = message.workers || [];
+                        self.lastSyncAt = Date.now();
+                        self.update();
+                    }
+                    if (message.type === 'worker.health' && message.worker) {
+                        self.upsertWorker(message.worker);
+                        self.lastSyncAt = Date.now();
+                        self.update();
+                    }
+                } catch (e) {
+                    console.error('Invalid websocket payload:', e);
+                }
+            };
+
+            self.ws.onerror = function () {
+                self.wsState = 'error'
+                self.update()
+            }
+
+            self.ws.onclose = function () {
+                self.wsState = 'disconnected'
+                self.update()
+
+                if (!self.showWorkersPanel) return
+
+                if (self.wsReconnectTimer) {
+                    clearTimeout(self.wsReconnectTimer)
+                }
+
+                self.wsReconnectTimer = setTimeout(function () {
+                    self.connect_workers_socket()
+                }, 2000)
+            }
+        };
+
+        self.normalizeWorker = function (worker) {
+            worker = worker || {};
+            return {
+                hostname: worker.hostname || 'unknown',
+                status: worker.status || 'unavailable',
+                running_jobs: typeof worker.running_jobs === 'number' ? worker.running_jobs : 0,
+                timestamp: worker.timestamp || null
+            };
+        };
+
+        self.normalizeWorkers = function (workers) {
+            return (workers || [])
+                .filter(function (w) { return w && w.hostname; })
+                .map(self.normalizeWorker);
+        };
+
+        self.upsertWorker = function (worker) {
+            worker = self.normalizeWorker(worker);
+            if (!worker.hostname || worker.hostname === 'unknown') return;
+            var idx = _.findIndex(self.workers, { hostname: worker.hostname });
+            if (idx === -1) {
+                self.workers.push(worker);
+            } else {
+                self.workers[idx] = worker;
+            }
+            self.workers = self.workers.slice();
+        };
 
-        // This is triggered when a new submission is uploaded
-        // This gets the updated submissions to refresh the used submissions count
-        CODALAB.events.on('new_submission_created', function (new_submission_data) {
-            self.update_competition_data()
-        })
+        self.sortedWorkers = function () {
+            var order = { available: 0, busy: 1, unavailable: 2 };
+            return (self.workers || []).slice().sort(function (a, b) {
+                var sa = self.displayStatus(a), sb = self.displayStatus(b);
+                var oa = order[sa] || 99, ob = order[sb] || 99;
+                if (oa !== ob) return oa - ob;
+                if ((b.running_jobs || 0) !== (a.running_jobs || 0)) {
+                    return (b.running_jobs || 0) - (a.running_jobs || 0);
+                }
+                return (a.hostname || '').localeCompare(b.hostname || '');
+            });
+        };
 
+        self.displayStatus = function (worker) {
+            return worker && worker.status ? worker.status : 'unavailable';
+        };
+        self.getStatusClass = function (worker) {
+            var status = self.displayStatus(worker);
+            if (status === 'available') return 'green';
+            if (status === 'busy') return 'yellow';
+            return 'red';
+        };
+        self.getStatusIcon = function (worker) {
+            var status = self.displayStatus(worker);
+            if (status === 'available') return 'check circle';
+            if (status === 'busy') return 'clock';
+            return 'times circle';
+        };
+        self.getStatusText = function (worker) {
+            var status = self.displayStatus(worker);
+            if (status === 'available') return 'Available';
+            if (status === 'busy') return 'Busy';
+            return 'Unavailable';
+        };
+
+        self.formatLastSeen = function (timestamp) {
+            if (!timestamp) return '—';
+            var age = Math.round((Date.now()/1000) - timestamp);
+            if (age < 5) return 'just now';
+            if (age < 60) return age + 's ago';
+            var minutes = Math.floor(age/60);
+            if (minutes < 60) return minutes + 'm ago';
+            return Math.floor(minutes/60) + 'h ago';
+        };
+
+        self.lastSyncLabel = function () {
+            if (!self.lastSyncAt) return 'never';
+            var age = Math.round((Date.now() - self.lastSyncAt)/1000);
+            if (age < 5) return 'just now';
+            if (age < 60) return age + 's ago';
+            var minutes = Math.floor(age/60);
+            return minutes + 'm ago';
+        };
+
+        self.totalCount = function () { return (self.workers || []).length; };
+        self.availableCount = function () {
+            return (self.workers || []).filter(w => self.displayStatus(w) === 'available').length;
+        };
+        self.busyCount = function () {
+            return (self.workers || []).filter(w => self.displayStatus(w) === 'busy').length;
+        };
+        self.unavailableCount = function () {
+            return (self.workers || []).filter(w => self.displayStatus(w) === 'unavailable').length;
+        };
+        self.connectionLabel = function () {
+            if (self.wsState === 'connected') return 'Connected';
+            if (self.wsState === 'connecting') return 'Connecting';
+            if (self.wsState === 'error') return 'Error';
+            return 'Disconnected';
+        };
+
+        CODALAB.events.on('new_submission_created', function () {
+            self.update_competition_data();
+        });
     </script>
+
     <style type="text/stylus">
-        .comp-detail-paragraph-text
-            font-size 16px !important
-            line-height 20px !important
-        :scope
-            display block
-            width 100%
-            height 100%
-
-        .ui.inverted.table
-            background #44586b
-
-        .ui.modal
-            margin 20px
-
-        .ui.table
-            color $blue !important
-
-            thead > tr > th
-                color $blue !important
-                background-color $lightblue !important
+        .comp-detail-paragraph-text {
+            font-size: 16px !important;
+            line-height: 20px !important;
+        }
+        :scope { display: block; width: 100%; height: 100%; }
+        .layout { position: relative; display: block; }
+        .comp-content { min-width: 0; padding-right: 0; }
+
+        .workers-panel {
+            position: fixed;
+            top: 24px;
+            right: 24px;
+            width: 375px;
+            z-index: 25;
+            background: #fff;
+            overflow: auto;
+            max-height: calc(100vh - 48px);
+        }
+
+        .workers-card {
+            background: #fff;
+            border: 1px solid rgba(0,0,0,0.1);
+            border-radius: 16px;
+            box-shadow: 0 8px 24px rgba(0,0,0,0.08);
+            padding: 12px;
+        }
+        .workers-header { margin-bottom: 12px; }
+        .workers-title { display: flex; align-items: flex-start; gap: 10px; }
+        .workers-title .icon { margin-top: 2px; }
+        .workers-title-text { font-size: 18px; font-weight: 700; color: #1f2937; line-height: 1.2; }
+        .workers-subtitle {
+            margin-top: 4px;
+            font-size: 12px;
+            color: #6b7280;
+            display: flex;
+            align-items: center;
+            gap: 6px;
+        }
+
+        .workers-toggle-btn
+            z-index 10
+            position relative
+            top 10%
+            right 100vh
+            background #576671 !important
+            color white !important
+            
+        .workers-connection {
+            display: inline-flex;
+            align-items: center;
+            padding: 3px 8px;
+            border-radius: 999px;
+            font-weight: 700;
+            font-size: 11px;
+            text-transform: uppercase;
+            background: #f3f4f6;
+            color: #6b7280;
+        }
+        .workers-connection.connected {
+            background: rgba(33,186,69,.12);
+            color: #21ba45;
+        }
+        .workers-connection.connecting {
+            background: rgba(251,189,8,.14);
+            color: #b58105;
+        }
+        .workers-connection.error {
+            background: rgba(219,40,40,.12);
+            color: #db2828;
+        }
+        .workers-connection.disconnected {
+            background: rgba(219,40,40,.12);
+            color: #db2828;
+        }
+        .workers-separator { opacity: .6; }
+        .workers-drag-hint { margin-top: 4px; font-size: 11px; color: #9ca3af; white-space: nowrap; }
+
+        .workers-stats {
+            display: grid;
+            grid-template-columns: repeat(4, 1fr);
+            gap: 8px;
+            margin: 10px 0 15px 0 !important;
+        }
+        .stat-card {
+            background: #f9fafb;
+            border: 1px solid rgba(0,0,0,0.06);
+            border-radius: 12px;
+            padding: 10px 8px;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+        .stat-value {
+            font-size: 18px;
+            font-weight: 800;
+            color: #111827;
+            margin-bottom: 4px;
+            min-width: 1ch;
+        }
+        .stat-green { color: #21ba45; }
+        .stat-yellow { color: #b58105; }
+        .stat-red { color: #db2828; }
+        .stat-label {
+            font-size: 11px;
+            font-weight: 700;
+            text-transform: uppercase;
+            color: #6b7280;
+            letter-spacing: .04em;
+        }
+
+        .workers-table-wrap {
+            max-height: calc(100vh - 240px);
+            overflow: auto;
+            border-radius: 12px;
+        }
+        .workers-table {
+            margin: 0 !important;
+            width: 100%;
+            table-layout: auto;
+            font-size: 13px;
+        }
+        .workers-table thead th {
+            position: sticky;
+            top: 0;
+            background: #f8fafc !important;
+            color: #374151 !important;
+            font-weight: 700 !important;
+            font-size: 12px;
+            text-transform: uppercase;
+        }
+        .workers-table td, .workers-table th {
+            vertical-align: middle !important;
+        }
+        .worker-hostname {
+            font-size: 13px;
+            font-weight: 700;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+        .worker-jobs {
+            text-align: center;
+        }
+        .worker-lastseen {
+            color: #6b7280;
+            font-size: 12px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+        .worker-status {
+            border-radius: 999px !important;
+            font-weight: 700 !important;
+            display: inline-flex !important;
+            align-items: center;
+            gap: 6px;
+            white-space: nowrap;
+        }
+        .workers-empty {
+            padding: 24px 12px;
+            text-align: center;
+            color: #6b7280;
+        }
+        .workers-empty .header {
+            font-weight: 700;
+            color: #374151;
+            margin-bottom: 4px;
+        }
+        .workers-footer {
+            margin-top: 12px;
+            font-size: 12px;
+            color: #6b7280;
+        }
+        .ui.label.green {
+            background-color: #21ba45 !important;
+            color: white !important;
+        }
+        .ui.label.yellow {
+            background-color: #f2c037 !important;
+            color: black !important;
+        }
+        .ui.label.red {
+            background-color: #db2828 !important;
+            color: white !important;
+        }
+        body.workers-panel-dragging {
+            user-select: none;
+        }
+
+        @media (max-width: 1400px) {
+            .workers-panel {
+                position: static;
+                width: 100%;
+                max-height: none;
+                margin-top: 16px;
+            }
+            .workers-table-wrap {
+                max-height: none;
+            }
+        }
+        @media (max-width: 768px) {
+            .workers-stats {
+                grid-template-columns: repeat(2, 1fr);
+            }
+        }
     </style>
 </competition-detail>
diff --git a/src/static/riot/competitions/detail/leaderboards.tag b/src/static/riot/competitions/detail/leaderboards.tag
index 32050a480..80af465c4 100644
--- a/src/static/riot/competitions/detail/leaderboards.tag
+++ b/src/static/riot/competitions/detail/leaderboards.tag
@@ -41,38 +41,70 @@
         </thead>
         <!--  Always show leaderboard  -->
         <tbody>
-        <tr if="{_.isEmpty(selected_leaderboard.submissions)}" class="center aligned">
-            <td colspan="100%">
-                <em>No submissions have been added to this leaderboard yet!</em>
-            </td>
-        </tr>
-        <tr each="{ submission, index in selected_leaderboard.submissions}">
-            <td class="collapsing index-column center aligned">
-                <gold-medal if="{index + 1 === 1}"></gold-medal>
-                <silver-medal if="{index + 1 === 2}"></silver-medal>
-                <bronze-medal if="{index + 1 === 3}"></bronze-medal>
-                <fourth-place-medal if="{index + 1 === 4}"></fourth-place-medal>
-                <fifth-place-medal if="{index + 1 === 5}"></fifth-place-medal>
-                <virtual if="{index + 1 > 5}">{index + 1}</virtual>
-            </td>
-            <td if="{submission.organization === null}"><a href="{submission.slug_url}">{ submission.owner }</a></td>
-            <td if="{submission.organization !== null}"><a href="{submission.organization.url}">{ submission.organization.name }</a></td>
-            <td data-sort="{ sort_date_value(submission.created_when) }"
-                data-sort-value="{ sort_date_value(submission.created_when) }"
-            >
-                { pretty_date(submission.created_when) }
-            </td>
-            <td>{submission.id}</td>
-            <td each="{ column in filtered_columns }">
-                <a if="{column.title == 'Detailed Results'}" href="detailed_results/{get_detailed_result_submisison_id(column, submission)}" target="_blank" class="eye-icon-link">
-                    <i class="icon grey eye eye-icon"></i>
-                </a>
-                <span if="{column.title != 'Detailed Results'}" class="{bold_class(column, submission)}">{get_score(column, submission)}</span>
-            </td>
-        </tr>
+            <tr if="{_.isEmpty(paginated_submissions)}" class="center aligned">
+                <td colspan="100%">
+                    <em>No submissions have been added to this leaderboard yet!</em>
+                </td>
+            </tr>
+
+            <tr each="{ submission, index in paginated_submissions}">
+                <td class="collapsing index-column center aligned">
+                    <gold-medal if="{get_row_number(index) === 1}"></gold-medal>
+                    <silver-medal if="{get_row_number(index) === 2}"></silver-medal>
+                    <bronze-medal if="{get_row_number(index) === 3}"></bronze-medal>
+                    <fourth-place-medal if="{get_row_number(index) === 4}"></fourth-place-medal>
+                    <fifth-place-medal if="{get_row_number(index) === 5}"></fifth-place-medal>
+                    <virtual if="{get_row_number(index) > 5}">{get_row_number(index)}</virtual>
+                </td>
+                <td if="{submission.organization === null}"><a href="{submission.slug_url}">{ submission.owner }</a></td>
+                <td if="{submission.organization !== null}"><a href="{submission.organization.url}">{ submission.organization.name }</a></td>
+                <td data-sort="{ sort_date_value(submission.created_when) }"
+                    data-sort-value="{ sort_date_value(submission.created_when) }">
+                    { pretty_date(submission.created_when) }
+                </td>
+                <td>{submission.id}</td>
+                <td each="{ column in filtered_columns }">
+                    <a if="{column.title == 'Detailed Results'}" href="detailed_results/{get_detailed_result_submisison_id(column, submission)}" target="_blank" class="eye-icon-link">
+                        <i class="icon grey eye eye-icon"></i>
+                    </a>
+                    <span if="{column.title != 'Detailed Results'}" class="{bold_class(column, submission)}">{get_score(column, submission)}</span>
+                </td>
+            </tr>
         </tbody>
     </table>
 
+    <div class="ui pagination menu" style="display:flex; align-items:center; justify-content:space-between; margin-top: 12px;">
+        <div style="display:flex; align-items:center; gap:8px;">
+            <button class="ui button" onclick="{ go_to_page.bind(this, page - 1) }" disabled="{ page <= 1 }">
+                <i class="icon chevron left"></i> Previous
+            </button>
+
+            <div style="display:flex; align-items:center; gap:6px;">
+                <span>Page</span>
+                <input type="number" min="1" value="{ page }" onkeydown="{ handle_page_enter }" style="width:70px; text-align:center;" />
+                <span> / { total_pages || 1 }</span>
+            </div>
+
+            <button class="ui button" onclick="{ go_to_page.bind(this, page + 1) }" disabled="{ page >= total_pages }">
+                Next <i class="icon chevron right"></i>
+            </button>
+        </div>
+
+        <div style="display:flex; align-items:center; gap:8px;">
+            <label>Per page</label>
+            <select class="ui dropdown" value="{ page_size }" onchange="{ change_page_size.bind(this) }">
+                <option value="50">50</option>
+                <option value="100">100</option>
+                <option value="500">500</option>
+                <option value="all">all</option>
+            </select>
+
+            <div style="margin-right: 10px; color: #8c8c8c;">
+                <small>{ total_count || 0 } total</small>
+            </div>
+        </div>
+    </div>
+
 
     <script>
         let self = this
@@ -85,6 +117,102 @@
         self.enable_detailed_results = false
         self.show_detailed_results_in_leaderboard = false
 
+        self.page = 1
+        self.page_size = 50
+        self.total_count = 0
+        self.total_pages = 1
+        self.paginated_submissions = []
+
+        self.get_page_size_value = function () {
+            if (String(self.page_size).toLowerCase() === 'all') {
+                return self.total_count || 1
+            }
+
+            var n = parseInt(self.page_size, 10)
+            if (isNaN(n) || n <= 0) {
+                return 50
+            }
+
+            return n
+        }
+
+        self.get_row_number = function (index) {
+            if (String(self.page_size).toLowerCase() === 'all') {
+                return index + 1
+            }
+
+            return ((self.page - 1) * self.get_page_size_value()) + index + 1
+        }
+
+        self.update_pagination = function () {
+            var submissions = _.get(self.selected_leaderboard, 'submissions', [])
+
+            self.total_count = parseInt(_.get(self.selected_leaderboard, 'count', submissions.length), 10) || submissions.length
+
+            var raw_page_size = _.get(self.selected_leaderboard, 'page_size', self.page_size)
+
+            if (String(raw_page_size).toLowerCase() === 'all') {
+                self.page_size = 'all'
+                self.total_pages = 1
+                self.page = 1
+            } else {
+                var page_size_value = parseInt(raw_page_size, 10)
+                if (isNaN(page_size_value) || page_size_value <= 0) {
+                    page_size_value = self.get_page_size_value()
+                }
+
+                self.page_size = page_size_value
+                self.total_pages = Math.max(1, Math.ceil(self.total_count / page_size_value))
+
+                if (self.page > self.total_pages) {
+                    self.page = self.total_pages
+                }
+            }
+
+            self.paginated_submissions = submissions
+        }
+
+        self.go_to_page = function (p) {
+            if (String(self.page_size).toLowerCase() === 'all') {
+                return
+            }
+
+            var newPage = parseInt(p, 10)
+            if (isNaN(newPage) || newPage < 1) newPage = 1
+            if (newPage > self.total_pages) newPage = self.total_pages
+            if (newPage === self.page) return
+
+            self.page = newPage
+            self.update_leaderboard()
+        }
+
+        self.handle_page_enter = function (e) {
+            if (e.key !== 'Enter' && e.keyCode !== 13) {
+                return
+            }
+
+            e.preventDefault()
+            self.go_to_page(e.target.value)
+        }
+
+        self.change_page_size = function (e) {
+            var raw = (e && e.target && typeof e.target.value !== 'undefined')
+                ? String(e.target.value).toLowerCase()
+                : String(self.page_size).toLowerCase()
+
+            if (raw === 'all') {
+                self.page_size = 'all'
+            } else {
+                var val = parseInt(raw, 10)
+                if (isNaN(val) || val <= 0) return
+                if ([50, 100, 500].indexOf(val) === -1) return
+                self.page_size = val
+            }
+
+            self.page = 1
+            self.update_leaderboard()
+        }
+
         self.pretty_date = function (date_string) {
             if (!!date_string) {
                 return luxon.DateTime.fromISO(date_string).toFormat('yyyy-MM-dd HH:mm')
@@ -98,22 +226,20 @@
             const dt = luxon.DateTime.fromISO(date_string)
             return dt.isValid ? dt.toMillis() : 0
         }
-       
+
         self.bold_class = function(column, submission){
-            // Return `text-bold` if submission has 
-            // more than one scores and score index  == leaderbaord.primary_index
-            // otherwise return empty string
-            return_class = '' // default class value
-            if(column.task_id != -1){ // factsheet check
-                if(submission.scores.length > 1){ // score length check
+            return_class = ''
+            if(column.task_id != -1){
+                if(submission.scores.length > 1){
                     let column_index = _.get(column, 'index')
-                    if(column_index === self.selected_leaderboard.primary_index){ // column index check
+                    if(column_index === self.selected_leaderboard.primary_index){
                         return_class = 'text-bold'
                     }
                 }
             }
             return return_class
         }
+
         self.get_score = function(column, submission) {
             if(column.task_id === -1){
                 return _.get(submission, 'fact_sheet_answers[' + column.key + ']', 'n/a')
@@ -126,7 +252,7 @@
             return 'n/a'
         }
 
-        self.on("mount" , function () {
+        self.on("mount", function () {
             this.refs.leaderboardFilter.onkeyup = function (e) {
                 self.filter_columns()
             }
@@ -138,95 +264,99 @@
 
         self.filter_columns = () => {
             let search_key = self.refs.leaderboardFilter.value.toLowerCase()
-            self.filtered_tasks = JSON.parse(JSON.stringify(self.selected_leaderboard.tasks))
-            if(search_key){
+            self.filtered_tasks = JSON.parse(JSON.stringify(self.selected_leaderboard.tasks || []))
+
+            if (search_key) {
                 self.filtered_columns = []
-                for (const column of self.columns){
-                    let key = column.key.toLowerCase()
-                    let title = column.title.toLowerCase()
-                    if((key.includes(search_key) || title.includes(search_key))) {
+                for (const column of self.columns) {
+                    let key = (column.key || '').toLowerCase()
+                    let title = (column.title || '').toLowerCase()
+                    if ((key.includes(search_key) || title.includes(search_key))) {
                         self.filtered_columns.push(column)
-                    }
-                    else {
+                    } else {
                         let task = _.find(self.filtered_tasks, {id: column.task_id})
-                        task.colWidth -= 1
+                        if (task) task.colWidth -= 1
                     }
                 }
                 self.filtered_tasks = self.filtered_tasks.filter(task => task.colWidth > 0)
             } else {
                 self.filtered_columns = self.columns
             }
+
             self.update()
         }
 
         self.update_leaderboard = () => {
-            CODALAB.api.get_leaderboard_for_render(self.phase_id)
-                .done(responseData => {
-                    self.selected_leaderboard = responseData
-                    self.columns = []
-                    // Make fake task and columns for Metadata so it can be filtered like columns
-                    if(self.selected_leaderboard.fact_sheet_keys){
-                        let fake_metadata_task = {
-                            id: -1,
-                            colWidth: self.selected_leaderboard.fact_sheet_keys.length,
-                            columns: [],
-                            name: "Fact Sheet Answers"
-                        }
-                        for(question of self.selected_leaderboard.fact_sheet_keys){
-                            fake_metadata_task.columns.push({
-                                key: question[0],
-                                title: question[1],
-                            })
-                        }
-                        self.selected_leaderboard.tasks.unshift(fake_metadata_task)
+            CODALAB.api.get_leaderboard_for_render(self.phase_id, {
+                page: self.page,
+                page_size: self.page_size
+            })
+            .done(responseData => {
+                self.selected_leaderboard = responseData
+                self.columns = []
+
+                if (self.selected_leaderboard.fact_sheet_keys) {
+                    let fake_metadata_task = {
+                        id: -1,
+                        colWidth: self.selected_leaderboard.fact_sheet_keys.length,
+                        columns: [],
+                        name: "Fact Sheet Answers"
+                    }
+                    for (question of self.selected_leaderboard.fact_sheet_keys) {
+                        fake_metadata_task.columns.push({
+                            key: question[0],
+                            title: question[1],
+                        })
+                    }
+                    self.selected_leaderboard.tasks.unshift(fake_metadata_task)
+                }
+
+                for (task of self.selected_leaderboard.tasks) {
+                    for (column of task.columns) {
+                        column.task_id = task.id
+                        self.columns.push(column)
                     }
-                    for(task of self.selected_leaderboard.tasks){
-
-                        for(column of task.columns){
-                            column.task_id = task.id
-                            self.columns.push(column)
-                        }
-                        // -1 id is used for fact sheet answers
-                        if(self.enable_detailed_results & self.show_detailed_results_in_leaderboard & task.id != -1){
-                            self.columns.push({
-                              task_id: task.id,
-                              title: "Detailed Results"
-                            })
-                            task.colWidth += 1
-                        }
+                    if (self.enable_detailed_results & self.show_detailed_results_in_leaderboard & task.id != -1) {
+                        self.columns.push({
+                            task_id: task.id,
+                            title: "Detailed Results"
+                        })
+                        task.colWidth += 1
                     }
-                    self.filter_columns()
-                    $('#leaderboardTable').tablesort()
-                    self.update()
-                })
+                }
+
+                self.filter_columns()
+                self.update_pagination()
+                $('#leaderboardTable').tablesort()
+                self.update()
+            })
         }
 
         self.get_detailed_result_submisison_id = function(column, submisison){
             for (index in submisison.detailed_results) {
-                if(column.task_id == submisison.detailed_results[index].task){
+                if (column.task_id == submisison.detailed_results[index].task) {
                     return submisison.detailed_results[index].id
                 }
             }
         }
 
-
         CODALAB.events.on('phase_selected', data => {
             self.phase_id = data.id
+            self.page = 1
             self.update_leaderboard()
         })
 
         CODALAB.events.on('competition_loaded', (competition) => {
             self.competition_id = competition.id
             self.participant_status = competition.participant_status
-            self.opts.is_admin ? self.show_download = "visible": self.show_download = "hidden"
+            self.opts.is_admin ? self.show_download = "visible" : self.show_download = "hidden"
             self.enable_detailed_results = competition.enable_detailed_results
             self.show_detailed_results_in_leaderboard = competition.show_detailed_results_in_leaderboard
-            
         })
 
         CODALAB.events.on('submission_changed_on_leaderboard', self.update_leaderboard)
-
     </script>
+    
     <style type="text/stylus">
         :scope
             display: block

From e7a3260e64e4c6eb373eadcf826d1104b891a3d0 Mon Sep 17 00:00:00 2001
From: Ihsan Ullah <ihsan2131@gmail.com>
Date: Thu, 2 Apr 2026 09:00:40 +0500
Subject: [PATCH 2/5] refactored bundle_management code

---
 .../riot/competitions/bundle_management.tag   | 77 ++++++++++---------
 1 file changed, 40 insertions(+), 37 deletions(-)

diff --git a/src/static/riot/competitions/bundle_management.tag b/src/static/riot/competitions/bundle_management.tag
index 635bc9f99..b7253dc5a 100644
--- a/src/static/riot/competitions/bundle_management.tag
+++ b/src/static/riot/competitions/bundle_management.tag
@@ -4,13 +4,13 @@
         <input type="text" placeholder="Search..." ref="search" onkeyup="{ filter.bind(this, undefined) }">
         <i class="search icon"></i>
     </div>
-    <button class="ui red right floated labeled icon button {disabled: marked_datasets.length === 0}" onclick="{delete_datasets}">
+    <button class="ui red right floated labeled icon button {disabled: marked_competition_bundles.length === 0}" onclick="{delete_competition_bundles}">
         <i class="icon delete"></i>
         Delete Selected
     </button>
 
     <!-- Data Table -->
-    <table id="bundlesTable" class="ui {selectable: datasets.length > 0} celled compact sortable table">
+    <table id="bundlesTable" class="ui {selectable: competition_bundles.length > 0} celled compact sortable table">
         <thead>
             <tr>
                 <th>File Name</th>
@@ -23,32 +23,32 @@
         </thead>
 
         <tbody>
-            <tr each="{ dataset, index in datasets }"
+            <tr each="{ bundle, index in competition_bundles }"
                 class="dataset-row"
-                onclick="{show_info_modal.bind(this, dataset)}">
-                <td>{ dataset.name }</td>
+                onclick="{show_info_modal.bind(this, bundle)}">
+                <td>{ bundle.name }</td>
                 <td>
-                    <div if="{dataset.competition}" class="ui fitted">
-                        <a id="competitionLink" href="{URLS.COMPETITION_DETAIL(dataset.competition.id)}" target="_blank">{dataset.competition.title}</a>
+                    <div if="{bundle.competition}" class="ui fitted">
+                        <a id="competitionLink" href="{URLS.COMPETITION_DETAIL(bundle.competition.id)}" target="_blank">{bundle.competition.title}</a>
                     </div>
                 </td>
-                <td>{ pretty_bytes(dataset.file_size) }</td>
-                <td>{ timeSince(Date.parse(dataset.created_when)) } ago</td>
+                <td>{ pretty_bytes(bundle.file_size) }</td>
+                <td>{ timeSince(Date.parse(bundle.created_when)) } ago</td>
                 <td class="center aligned">
-                    <button show="{dataset.created_by === CODALAB.state.user.username}" class="ui mini button red icon" onclick="{ delete_dataset.bind(this, dataset) }">
+                    <button show="{bundle.created_by === CODALAB.state.user.username}" class="ui mini button red icon" onclick="{ delete_competition_bundle.bind(this, bundle) }">
                         <i class="icon delete"></i>
                     </button>
                 </td>
                 <td class="center aligned">
-                    <div show="{dataset.created_by === CODALAB.state.user.username}" class="ui fitted checkbox">
-                        <input type="checkbox" name="delete_checkbox" onclick="{ mark_dataset_for_deletion.bind(this, dataset) }">
+                    <div show="{bundle.created_by === CODALAB.state.user.username}" class="ui fitted checkbox">
+                        <input type="checkbox" name="delete_checkbox" onclick="{ mark_competition_bundle_for_deletion.bind(this, bundle) }">
                         <label></label>
                     </div>
                 </td>
             </tr>
-            <tr if="{datasets.length === 0}">
+            <tr if="{competition_bundles.length === 0}">
                 <td class="center aligned" colspan="6">
-                    <em>No Datasets Yet!</em>
+                    <em>No Competition Bundles Yet!</em>
                 </td>
             </tr>
         </tbody>
@@ -56,8 +56,8 @@
         <tfoot>
             <!-- Pagination -->
             <tr>
-                <th colspan="8" if="{datasets.length > 0}">
-                    <div class="ui right floated pagination menu" if="{datasets.length > 0}">
+                <th colspan="8" if="{competition_bundles.length > 0}">
+                    <div class="ui right floated pagination menu" if="{competition_bundles.length > 0}">
                         <a show="{!!_.get(pagination, 'previous')}" class="icon item" onclick="{previous_page}">
                             <i class="left chevron icon"></i>
                         </a>
@@ -125,8 +125,8 @@
          Init
         ---------------------------------------------------------------------*/
 
-        self.datasets = []
-        self.marked_datasets = []
+        self.competition_bundles = []
+        self.marked_competition_bundles = []
         self.selected_row = {}
         self.page = 1
 
@@ -134,7 +134,7 @@
             $(".ui.dropdown", self.root).dropdown()
             $(".ui.checkbox", self.root).checkbox()
             $('#bundlesTable').tablesort()
-            self.update_datasets()
+            self.update_competition_bundles()
         })
 
         /*---------------------------------------------------------------------
@@ -150,7 +150,7 @@
                 page: 1,
             })
             self.page = filters.page
-            self.update_datasets(filters)
+            self.update_competition_bundles(filters)
         }
 
         self.next_page = function () {
@@ -171,12 +171,12 @@
             }
         }
 
-        self.update_datasets = function (filters) {
+        self.update_competition_bundles = function (filters) {
             filters = filters || {}
             filters._type = "bundle"
             CODALAB.api.get_datasets(filters)
                 .done(function (data) {
-                    self.datasets = data.results
+                    self.competition_bundles = data.results
                     self.pagination = {
                         "count": data.count,
                         "next": data.next,
@@ -185,16 +185,16 @@
                     self.update()
                 })
                 .fail(function (response) {
-                    toastr.error("Could not load datasets...")
+                    toastr.error("Could not load competition bundles...")
                 })
         }
 
-        self.delete_dataset = function (dataset, e) {
-            if (confirm(`Are you sure you want to delete '${dataset.name}'?`)) {
-                CODALAB.api.delete_dataset(dataset.id)
+        self.delete_competition_bundle = function (bundle, e) {
+            if (confirm(`Are you sure you want to delete '${bundle.name}'?`)) {
+                CODALAB.api.delete_dataset(bundle.id)
                     .done(function () {
-                        self.update_datasets()
-                        toastr.success("Dataset deleted successfully!")
+                        self.update_competition_bundles()
+                        toastr.success("Competition bundle deleted successfully!")
                         CODALAB.events.trigger('reload_quota_cleanup')
                     })
                     .fail(function (response) {
@@ -204,13 +204,13 @@
             event.stopPropagation()
         }
 
-        self.delete_datasets = function () {
-            if (confirm(`Are you sure you want to delete multiple datasets?`)) {
-                CODALAB.api.delete_datasets(self.marked_datasets)
+        self.delete_competition_bundles = function () {
+            if (confirm(`Are you sure you want to delete multiple competition bundles?`)) {
+                CODALAB.api.delete_datasets(self.marked_competition_bundles)
                     .done(function () {
-                        self.update_datasets()
-                        toastr.success("Dataset deleted successfully!")
-                        self.marked_datasets = []
+                        self.update_competition_bundles()
+                        toastr.success("Competition bundles deleted successfully!")
+                        self.marked_competition_bundles = []
                         CODALAB.events.trigger('reload_quota_cleanup')
                     })
                     .fail(function (response) {
@@ -222,12 +222,12 @@
             event.stopPropagation()
         }
 
-        self.mark_dataset_for_deletion = function(dataset, e) {
+        self.mark_competition_bundle_for_deletion = function(bundle, e) {
             if (e.target.checked) {
-                self.marked_datasets.push(dataset.id)
+                self.marked_competition_bundles.push(bundle.id)
             }
             else {
-                self.marked_datasets.splice(self.marked_datasets.indexOf(dataset.id), 1)
+                self.marked_competition_bundles.splice(self.marked_competition_bundles.indexOf(bundle.id), 1)
             }
         }
 
@@ -241,6 +241,9 @@
             $(self.refs.info_modal).modal('show')
         }
 
+        // Update bundles on unused bundles delete
+        CODALAB.events.on('reload_competition_bundles', self.update_competition_bundles)
+
 
     </script>
 

From f508da4f02d24d081f0d99ea76e30a913a586fe2 Mon Sep 17 00:00:00 2001
From: Ihsan Ullah <ihsan2131@gmail.com>
Date: Thu, 9 Apr 2026 19:14:27 +0500
Subject: [PATCH 3/5] Quota Cleanup - Updates to remove unused starting kits
 and bundles and exclude starting kit and public data from unused datasets
 (#2313)

* quota cleanup updated to allow users to remove unused starting kits and competition bundles. Starting kit and public data are not included in unused datasets anymore

* Merge conflicts

* Merge conflict

---------

Co-authored-by: didayolo <adrien.pavao@gmail.com>
---
 src/apps/api/tests/test_cleanup.py   | 47 +++++++++++++++++-
 src/apps/api/urls.py                 |  2 +
 src/apps/api/views/quota.py          | 72 +++++++++++++++++++++++++--
 src/static/js/ours/client.js         |  6 +++
 src/static/riot/quota_management.tag | 74 +++++++++++++++++++++++++++-
 5 files changed, 195 insertions(+), 6 deletions(-)

diff --git a/src/apps/api/tests/test_cleanup.py b/src/apps/api/tests/test_cleanup.py
index a927800af..1dd67a2ce 100644
--- a/src/apps/api/tests/test_cleanup.py
+++ b/src/apps/api/tests/test_cleanup.py
@@ -56,8 +56,19 @@ def setUp(self):
             DataFactory(created_by=user, type=Data.INGESTION_PROGRAM),
             DataFactory(created_by=user, type=Data.SCORING_PROGRAM),
             DataFactory(created_by=user, type=Data.INPUT_DATA),
-            DataFactory(created_by=user, type=Data.REFERENCE_DATA),
-            DataFactory(created_by=user, type=Data.PUBLIC_DATA)
+            DataFactory(created_by=user, type=Data.REFERENCE_DATA)
+        ]
+
+        # Create unused starting kits
+        self.unused_starting_kits = [
+            DataFactory(created_by=user, type=Data.STARTING_KIT),
+            DataFactory(created_by=user, type=Data.STARTING_KIT)
+        ]
+
+        # Create unused competition bundles
+        self.unused_competition_bundles = [
+            DataFactory(created_by=user, type=Data.COMPETITION_BUNDLE),
+            DataFactory(created_by=user, type=Data.COMPETITION_BUNDLE)
         ]
 
         self.client.login(username='test_user', password='test_user')
@@ -72,6 +83,8 @@ def test_cleanup_stats(self):
         assert content["unused_datasets_programs"] == len(self.unused_datasets_programs)
         assert content["unused_submissions"] == len(self.unused_submissions)
         assert content["failed_submissions"] == len(self.failed_submissions)
+        assert content["unused_starting_kits"] == len(self.unused_starting_kits)
+        assert content["unused_competition_bundles"] == len(self.unused_competition_bundles)
 
     def test_delete_unused_tasks(self):
 
@@ -132,3 +145,33 @@ def test_delete_failed_submissions(self):
         assert resp.status_code == 200
         content = json.loads(resp.content)
         assert content["failed_submissions"] == 0
+
+    def test_delete_unused_starting_kits(self):
+
+        url = reverse('delete_unused_starting_kits')
+        resp = self.client.delete(url)
+        assert resp.status_code == 200
+        content = json.loads(resp.content)
+        assert content["success"]
+        assert content["message"] == "Unused starting kits deleted successfully"
+
+        url = reverse('user_quota_cleanup')
+        resp = self.client.get(url)
+        assert resp.status_code == 200
+        content = json.loads(resp.content)
+        assert content["unused_starting_kits"] == 0
+
+    def test_delete_unused_competition_bundles(self):
+
+        url = reverse('delete_unused_competition_bundles')
+        resp = self.client.delete(url)
+        assert resp.status_code == 200
+        content = json.loads(resp.content)
+        assert content["success"]
+        assert content["message"] == "Unused competition bundles deleted successfully"
+
+        url = reverse('user_quota_cleanup')
+        resp = self.client.get(url)
+        assert resp.status_code == 200
+        content = json.loads(resp.content)
+        assert content["unused_competition_bundles"] == 0
diff --git a/src/apps/api/urls.py b/src/apps/api/urls.py
index cad6fde62..640b8a954 100644
--- a/src/apps/api/urls.py
+++ b/src/apps/api/urls.py
@@ -54,6 +54,8 @@
     path('delete_unused_datasets/', quota.delete_unused_datasets, name="delete_unused_datasets"),
     path('delete_unused_submissions/', quota.delete_unused_submissions, name="delete_unused_submissions"),
     path('delete_failed_submissions/', quota.delete_failed_submissions, name="delete_failed_submissions"),
+    path('delete_unused_starting_kits/', quota.delete_unused_starting_kits, name="delete_unused_starting_kits"),
+    path('delete_unused_competition_bundles/', quota.delete_unused_competition_bundles, name="delete_unused_competition_bundles"),
 
     # User account
     path('delete_account/', profiles.delete_account, name="delete_account"),
diff --git a/src/apps/api/views/quota.py b/src/apps/api/views/quota.py
index 0b99ff3a2..6cc927517 100644
--- a/src/apps/api/views/quota.py
+++ b/src/apps/api/views/quota.py
@@ -21,7 +21,9 @@ def user_quota_cleanup(request):
     unused_datasets_programs = Data.objects.filter(
         Q(created_by=request.user) &
         ~Q(type=Data.SUBMISSION) &
-        ~Q(type=Data.COMPETITION_BUNDLE)
+        ~Q(type=Data.COMPETITION_BUNDLE) &
+        ~Q(type=Data.PUBLIC_DATA) &
+        ~Q(type=Data.STARTING_KIT)
     ).exclude(
         Q(task_ingestion_programs__isnull=False) |
         Q(task_input_datas__isnull=False) |
@@ -42,11 +44,29 @@ def user_quota_cleanup(request):
         Q(status=Submission.FAILED)
     ).count()
 
+    # Get unused starting kits count
+    unused_starting_kits = Data.objects.filter(
+        Q(created_by=request.user) &
+        Q(type=Data.STARTING_KIT) &
+        Q(competition__isnull=True) &
+        Q(phase_starting_kit__isnull=True)
+    ).count()
+
+    # Get unused competition bundles
+    unused_competition_bundles = Data.objects.filter(
+        Q(created_by=request.user) &
+        Q(type=Data.COMPETITION_BUNDLE) &
+        Q(competition__isnull=True) &
+        Q(competition_bundles__isnull=True)
+    ).count()
+
     return Response({
         "unused_tasks": unused_tasks,
         "unused_datasets_programs": unused_datasets_programs,
         "unused_submissions": unused_submissions,
-        "failed_submissions": failed_submissions
+        "failed_submissions": failed_submissions,
+        "unused_starting_kits": unused_starting_kits,
+        "unused_competition_bundles": unused_competition_bundles
     })
 
 
@@ -84,7 +104,9 @@ def delete_unused_datasets(request):
         Data.objects.filter(
             Q(created_by=request.user) &
             ~Q(type=Data.SUBMISSION) &
-            ~Q(type=Data.COMPETITION_BUNDLE)
+            ~Q(type=Data.COMPETITION_BUNDLE) &
+            ~Q(type=Data.PUBLIC_DATA) &
+            ~Q(type=Data.STARTING_KIT)
         ).exclude(
             Q(task_ingestion_programs__isnull=False) |
             Q(task_input_datas__isnull=False) |
@@ -144,3 +166,47 @@ def delete_failed_submissions(request):
             "success": False,
             "message": f"{e}"
         })
+
+
+@api_view(['DELETE'])
+def delete_unused_starting_kits(request):
+    try:
+        Data.objects.filter(
+            Q(created_by=request.user) &
+            Q(type=Data.STARTING_KIT) &
+            Q(competition__isnull=True) &
+            Q(phase_starting_kit__isnull=True)
+        ).delete()
+
+        return Response({
+            "success": True,
+            "message": "Unused starting kits deleted successfully"
+        })
+    except Exception as e:
+        logger.error(f"UNUSED STARTING KITS DELETION --- {e}")
+        return Response({
+            "success": False,
+            "message": f"{e}"
+        })
+
+
+@api_view(['DELETE'])
+def delete_unused_competition_bundles(request):
+    try:
+        Data.objects.filter(
+            Q(created_by=request.user) &
+            Q(type=Data.COMPETITION_BUNDLE) &
+            Q(competition__isnull=True) &
+            Q(competition_bundles__isnull=True)
+        ).delete()
+
+        return Response({
+            "success": True,
+            "message": "Unused competition bundles deleted successfully"
+        })
+    except Exception as e:
+        logger.error(f"UNUSED COMPETITION BUNDLES DELETION --- {e}")
+        return Response({
+            "success": False,
+            "message": f"{e}"
+        })
diff --git a/src/static/js/ours/client.js b/src/static/js/ours/client.js
index decd1d6f4..fa169c5a8 100644
--- a/src/static/js/ours/client.js
+++ b/src/static/js/ours/client.js
@@ -392,6 +392,12 @@ CODALAB.api = {
     delete_failed_submissions: () => {
         return CODALAB.api.request('DELETE', `${URLS.API}delete_failed_submissions/`)
     },
+    delete_unused_starting_kits: () => {
+        return CODALAB.api.request('DELETE', `${URLS.API}delete_unused_starting_kits/`)
+    },
+    delete_unused_competition_bundles: () => {
+        return CODALAB.api.request('DELETE', `${URLS.API}delete_unused_competition_bundles/`)
+    },
     /*---------------------------------------------------------------------
          User Account
     ---------------------------------------------------------------------*/
diff --git a/src/static/riot/quota_management.tag b/src/static/riot/quota_management.tag
index f4102e738..b97b82a45 100644
--- a/src/static/riot/quota_management.tag
+++ b/src/static/riot/quota_management.tag
@@ -54,6 +54,26 @@
                     </button>
                     </td>
                 </tr>
+                <!--  Unused Starting Kits  -->
+                <tr>
+                    <td>Unused Starting Kits <span show="{unused_starting_kits > 0}">(<b>{unused_starting_kits}</b>)</span></td>
+                    <td>
+                        <button class="ui red right floated labeled icon button {disabled: unused_starting_kits === 0}" onclick="{delete_unused_starting_kits}">
+                        <i class="icon trash"></i>
+                        Delete unused starting kits
+                    </button>
+                    </td>
+                </tr>
+                <!--  Unused Competition Bundles  -->
+                <tr>
+                    <td>Unused Competition Bundles <span show="{unused_competition_bundles > 0}">(<b>{unused_competition_bundles}</b>)</span></td>
+                    <td>
+                        <button class="ui red right floated labeled icon button {disabled: unused_competition_bundles === 0}" onclick="{delete_unused_competition_bundles}">
+                        <i class="icon trash"></i>
+                        Delete unused competition bundles
+                    </button>
+                    </td>
+                </tr>
             </tbody>
             
         </table>
@@ -66,6 +86,8 @@
         self.unused_datasets_programs = 0
         self.unused_submissions = 0
         self.failed_submissions = 0
+        self.unused_starting_kits = 0
+        self.unused_competition_bundles = 0
         self.quota = 0
         self.storage_used = 0
 
@@ -84,6 +106,8 @@
                     self.unused_datasets_programs = data.unused_datasets_programs
                     self.unused_submissions = data.unused_submissions
                     self.failed_submissions = data.failed_submissions
+                    self.unused_starting_kits = data.unused_starting_kits
+                    self.unused_competition_bundles = data.unused_competition_bundles
                     self.update()
                 })
                 .fail(function (response) {
@@ -119,7 +143,7 @@
                             self.update()
                             CODALAB.events.trigger('reload_tasks')
                             CODALAB.events.trigger('reload_datasets')
-                            self.get_cleanup()
+                            CODALAB.events.trigger('reload_quota_cleanup')
                         }else{
                             toastr.error(data.message)
                         }
@@ -141,6 +165,7 @@
                             toastr.success(data.message)
                             self.update()
                             CODALAB.events.trigger('reload_datasets')
+                            CODALAB.events.trigger('reload_quota_cleanup')
                         }else{
                             toastr.error(data.message)
                         }
@@ -162,6 +187,7 @@
                             toastr.success(data.message)
                             self.update()
                             CODALAB.events.trigger('reload_submissions')
+                            CODALAB.events.trigger('reload_quota_cleanup')
                         }else{
                             toastr.error(data.message)
                         }
@@ -183,6 +209,7 @@
                             toastr.success(data.message)
                             self.update()
                             CODALAB.events.trigger('reload_submissions')
+                            CODALAB.events.trigger('reload_quota_cleanup')
                         }else{
                             toastr.error(data.message)
                         }
@@ -193,6 +220,51 @@
             }
         }
 
+        // Delete unused starting kits
+        self.delete_unused_starting_kits = function(){
+            if (confirm(`Are you sure you want to permanently delete all unused starting kits?`)) {
+
+                CODALAB.api.delete_unused_starting_kits()
+                    .done(function (data) {
+                        if(data.success){
+                            self.unused_starting_kits = 0
+                            toastr.success(data.message)
+                            self.update()
+                            CODALAB.events.trigger('reload_datasets')
+                            CODALAB.events.trigger('reload_quota_cleanup')
+                        }else{
+                            toastr.error(data.message)
+                        }
+                    })
+                    .fail(function (response) {
+                        toastr.error("Unused starting kits deletion failed!")
+                    })
+            }
+        }
+
+        // Delete unused competition bundles
+        self.delete_unused_competition_bundles = function(){
+            if (confirm(`Are you sure you want to permanently delete all unused competition bundles?`)) {
+
+                CODALAB.api.delete_unused_competition_bundles()
+                    .done(function (data) {
+                        if(data.success){
+                            self.unused_competition_bundles = 0
+                            toastr.success(data.message)
+                            self.update()
+                            CODALAB.events.trigger('reload_competition_bundles')
+                            CODALAB.events.trigger('reload_quota_cleanup')
+                        }else{
+                            toastr.error(data.message)
+                        }
+                    })
+                    .fail(function (response) {
+                        toastr.error("Unused starting kits deletion failed!")
+                    })
+            }
+        }
+
+
         CODALAB.events.on('reload_quota_cleanup', self.get_cleanup)
 
     </script>

From 9dca3d9d16d095fa9d85045887a29f11ac442278 Mon Sep 17 00:00:00 2001
From: Obada Haddad <obada.haddad@lisn.fr>
Date: Thu, 9 Apr 2026 16:55:54 +0200
Subject: [PATCH 4/5] fix pg_dump.py not using the new container names

---
 bin/pg_dump.py | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/bin/pg_dump.py b/bin/pg_dump.py
index 88f93d548..9d266a6d3 100755
--- a/bin/pg_dump.py
+++ b/bin/pg_dump.py
@@ -17,7 +17,7 @@
 call([
     'docker',
     'exec',
-    'codabench-db-1',
+    'db',
     'bash',
     '-c',
     f'PGPASSWORD=$DB_PASSWORD pg_dump -Fc -U $DB_USERNAME $DB_NAME > /app/backups/{dump_name}'
@@ -25,5 +25,5 @@
 
 # Push/destroy dump
 call([
-    'docker', 'exec', 'codabench-django-1', 'python', 'manage.py', 'upload_backup', f'{dump_name}'
+    'docker', 'exec', 'django', 'python', 'manage.py', 'upload_backup', f'{dump_name}'
 ])

From 5524a49ff95d47448a87b76891da83122ebee502 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 14 Apr 2026 02:57:47 +0000
Subject: [PATCH 5/5] Bump pytest from 9.0.2 to 9.0.3

Bumps [pytest](https://github.com/pytest-dev/pytest) from 9.0.2 to 9.0.3.
- [Release notes](https://github.com/pytest-dev/pytest/releases)
- [Changelog](https://github.com/pytest-dev/pytest/blob/main/CHANGELOG.rst)
- [Commits](https://github.com/pytest-dev/pytest/compare/9.0.2...9.0.3)

---
updated-dependencies:
- dependency-name: pytest
  dependency-version: 9.0.3
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 pyproject.toml | 2 +-
 uv.lock        | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/pyproject.toml b/pyproject.toml
index 9662fa05c..c007d2d88 100644
--- a/pyproject.toml
+++ b/pyproject.toml
@@ -81,7 +81,7 @@ dev = [
     "django-querycount==0.7.0",
     "django-debug-toolbar==6.2.0",
     "flake8==7.3.0",
-    "pytest==9.0.2",
+    "pytest==9.0.3",
     "pytest-django==4.12.0",
 ]
 [tool.pytest.ini_options]
diff --git a/uv.lock b/uv.lock
index 8345ca747..7a4416a10 100644
--- a/uv.lock
+++ b/uv.lock
@@ -501,7 +501,7 @@ dev = [
     { name = "django-debug-toolbar", specifier = "==6.2.0" },
     { name = "django-querycount", specifier = "==0.7.0" },
     { name = "flake8", specifier = "==7.3.0" },
-    { name = "pytest", specifier = "==9.0.2" },
+    { name = "pytest", specifier = "==9.0.3" },
     { name = "pytest-django", specifier = "==4.12.0" },
 ]
 
@@ -1501,7 +1501,7 @@ wheels = [
 
 [[package]]
 name = "pytest"
-version = "9.0.2"
+version = "9.0.3"
 source = { registry = "https://pypi.org/simple" }
 dependencies = [
     { name = "colorama", marker = "sys_platform == 'win32'" },
@@ -1510,9 +1510,9 @@ dependencies = [
     { name = "pluggy" },
     { name = "pygments" },
 ]
-sdist = { url = "https://files.pythonhosted.org/packages/d1/db/7ef3487e0fb0049ddb5ce41d3a49c235bf9ad299b6a25d5780a89f19230f/pytest-9.0.2.tar.gz", hash = "sha256:75186651a92bd89611d1d9fc20f0b4345fd827c41ccd5c299a868a05d70edf11", size = 1568901, upload-time = "2025-12-06T21:30:51.014Z" }
+sdist = { url = "https://files.pythonhosted.org/packages/7d/0d/549bd94f1a0a402dc8cf64563a117c0f3765662e2e668477624baeec44d5/pytest-9.0.3.tar.gz", hash = "sha256:b86ada508af81d19edeb213c681b1d48246c1a91d304c6c81a427674c17eb91c", size = 1572165, upload-time = "2026-04-07T17:16:18.027Z" }
 wheels = [
-    { url = "https://files.pythonhosted.org/packages/3b/ab/b3226f0bd7cdcf710fbede2b3548584366da3b19b5021e74f5bde2a8fa3f/pytest-9.0.2-py3-none-any.whl", hash = "sha256:711ffd45bf766d5264d487b917733b453d917afd2b0ad65223959f59089f875b", size = 374801, upload-time = "2025-12-06T21:30:49.154Z" },
+    { url = "https://files.pythonhosted.org/packages/d4/24/a372aaf5c9b7208e7112038812994107bc65a84cd00e0354a88c2c77a617/pytest-9.0.3-py3-none-any.whl", hash = "sha256:2c5efc453d45394fdd706ade797c0a81091eccd1d6e4bccfcd476e2b8e0ab5d9", size = 375249, upload-time = "2026-04-07T17:16:16.13Z" },
 ]
 
 [[package]]