diff --git a/ui/admin/app/routes/scopes/scope/session-recordings.js b/ui/admin/app/routes/scopes/scope/session-recordings.js index 2c4d3eb04..7d81c6d93 100644 --- a/ui/admin/app/routes/scopes/scope/session-recordings.js +++ b/ui/admin/app/routes/scopes/scope/session-recordings.js @@ -5,6 +5,7 @@ import Route from '@ember/routing/route'; import { inject as service } from '@ember/service'; +import orderBy from 'lodash/orderBy'; export default class ScopesScopeSessionRecordingsRoute extends Route { // =services @@ -43,6 +44,13 @@ export default class ScopesScopeSessionRecordingsRoute extends Route { recursive: true, }); + // Sort sessions by created time descending (newest on top) + const sortedSessionRecordings = orderBy( + sessionRecordings, + 'created_time', + 'desc', + ); + // Storage buckets could fail for a number of reasons, including that // the user isn't authorized to access them. try { @@ -55,7 +63,7 @@ export default class ScopesScopeSessionRecordingsRoute extends Route { } return { - sessionRecordings, + sessionRecordings: sortedSessionRecordings, storageBuckets, }; } diff --git a/ui/admin/app/routes/scopes/scope/sessions.js b/ui/admin/app/routes/scopes/scope/sessions.js index 1883dfe34..92e8b692a 100644 --- a/ui/admin/app/routes/scopes/scope/sessions.js +++ b/ui/admin/app/routes/scopes/scope/sessions.js @@ -11,6 +11,7 @@ import runEvery from 'ember-pollster/decorators/route/run-every'; import { notifySuccess, notifyError } from 'core/decorators/notify'; import config from '../../../config/environment'; import { resourceFilter } from 'core/decorators/resource-filter'; +import orderBy from 'lodash/orderBy'; const POLL_TIMEOUT_SECONDS = config.sessionPollingTimeoutSeconds; @@ -79,12 +80,19 @@ export default class ScopesScopeSessionsRoute extends Route { ), ); + // Sort sessions by created time descending (newest on top) + let sortedSessionAggregates = orderBy( + sessionAggregates, + 'created_time', + 'desc', + ); + // Move active sessions to the top... - const sortedSessionAggregates = [ - ...sessionAggregates.filter( + sortedSessionAggregates = [ + ...sortedSessionAggregates.filter( (aggregate) => aggregate.session.status === 'active', ), - ...sessionAggregates.filter( + ...sortedSessionAggregates.filter( (aggregate) => aggregate.session.status !== 'active', ), ]; diff --git a/ui/desktop/app/controllers/scopes/scope/projects/sessions/index.js b/ui/desktop/app/controllers/scopes/scope/projects/sessions/index.js index 17bf44ceb..19d130784 100644 --- a/ui/desktop/app/controllers/scopes/scope/projects/sessions/index.js +++ b/ui/desktop/app/controllers/scopes/scope/projects/sessions/index.js @@ -4,6 +4,7 @@ */ import Controller from '@ember/controller'; +import orderBy from 'lodash/orderBy'; export default class ScopesScopeProjectsSessionsIndexController extends Controller { // =attributes @@ -15,11 +16,13 @@ export default class ScopesScopeProjectsSessionsIndexController extends Controll */ get sorted() { const sessions = this.model; + // Sort sessions by created time descending (newest on top) + const sortedSessions = orderBy(sessions, 'created_time', 'desc'); return [ // then move active sessions to the top - ...sessions.filter((session) => session.isAvailable), + ...sortedSessions.filter((session) => session.isAvailable), // and all others to the end - ...sessions.filter((session) => !session.isAvailable), + ...sortedSessions.filter((session) => !session.isAvailable), ]; } }