Add sorting to analytics dashboards DataTable

What does this MR do and why?

Add sorting to DataTable

• Use GlTable when at least one field has been marked as sortable
• Expose noLocalSorting to allow backend sorting
• Pass sortBy and sortDesc to the table component
• Override data source query params when sorting changes

References

How to set up and validate locally

This isn't active on any existing dashboards, so here's a diff to mock it up for the MR analytics dashboard. Once applied, navigate to the MR analytics dashboard and try sorting the different columns. Clicking the column headers will trigger a change to the data source, which will log the sorting changes to the console:

diff --git a/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/merge_requests.js b/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/merge_requests.js
index 7955026ea1ba..53cea6365235 100644
--- a/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/merge_requests.js
+++ b/ee/app/assets/javascripts/analytics/analytics_dashboards/data_sources/merge_requests.js
@@ -114,12 +114,17 @@ const fetchMergeRequests = async ({
 
 export default function fetch({
   namespace,
-  query: { dateRange = DATE_RANGE_OPTION_LAST_365_DAYS, pagination },
+  query: { dateRange = DATE_RANGE_OPTION_LAST_365_DAYS, pagination, sortBy, sortDesc },
   queryOverrides = {},
   filters: { startDate: filtersStartDate, endDate = startOfTomorrow, searchFilters } = {},
 }) {
   const startDate = filtersStartDate || getStartDate(dateRange);
 
+  console.log({
+    sortBy: queryOverrides.sortBy ?? sortBy,
+    sortDesc: queryOverrides.sortDesc ?? sortDesc,
+  });
+
   return fetchMergeRequests({
     namespace,
     startDate,
diff --git a/ee/lib/gitlab/analytics/merge_requests/visualizations/merge_requests_throughput_table.yaml b/ee/lib/gitlab/analytics/merge_requests/visualizations/merge_requests_throughput_table.yaml
index 5065cb42a9cb..1334850f485a 100644
--- a/ee/lib/gitlab/analytics/merge_requests/visualizations/merge_requests_throughput_table.yaml
+++ b/ee/lib/gitlab/analytics/merge_requests/visualizations/merge_requests_throughput_table.yaml
@@ -5,22 +5,28 @@ data:
   type: merge_requests
   query:
     dateRange: 365d
+    sortBy: link
+    sortDesc: false
 options:
   responsive: false
   fixed: true
   stacked: md
+  refetchOnSort: true
   fields:
     - key: link
       label: Merge Request
       component: MergeRequestLink
       thClass: gl-w-1/4
+      sortable: true
     - key: dateMerged
       label: Date Merged
       thClass: gl-w-1/8
+      sortable: true
       component: FormatTime
     - key: timeToMerge
       label: Time to merge
       component: FormatTimeRange
+      sortable: true
     - key: milestone
       label: Milestone
       component: MilestoneLink
@@ -32,6 +38,7 @@ options:
       label: Line changes
       component: DiffLineChanges
       thClass: gl-w-1/8
+      sortable: true
     - key: assignees
       label: Assignees
       component: AssigneeAvatars

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #582093 (closed)