diff --git a/changes/12999-platforms-column b/changes/12999-platforms-column
new file mode 100644
index 0000000000..3affe1d53a
--- /dev/null
+++ b/changes/12999-platforms-column
@@ -0,0 +1 @@
+* Update the "Platforms" column to the more explicit "Compatible with"
diff --git a/frontend/components/TableContainer/DataTable/PlatformCell/PlatformCell.tsx b/frontend/components/TableContainer/DataTable/PlatformCell/PlatformCell.tsx
index 43cbef73bf..61a875cd5f 100644
--- a/frontend/components/TableContainer/DataTable/PlatformCell/PlatformCell.tsx
+++ b/frontend/components/TableContainer/DataTable/PlatformCell/PlatformCell.tsx
@@ -1,6 +1,7 @@
import React from "react";
import Icon from "components/Icon";
import { SupportedPlatform } from "interfaces/platform";
+import { DEFAULT_EMPTY_CELL_VALUE } from "utilities/constants";
interface IPlatformCellProps {
platforms: SupportedPlatform[];
@@ -42,7 +43,9 @@ const PlatformCell = ({ platforms }: IPlatformCellProps): JSX.Element => {
) : null;
})
) : (
- ---
+
+ {DEFAULT_EMPTY_CELL_VALUE}
+
)}
);
diff --git a/frontend/interfaces/schedulable_query.ts b/frontend/interfaces/schedulable_query.ts
index 6568689711..9d86c98b85 100644
--- a/frontend/interfaces/schedulable_query.ts
+++ b/frontend/interfaces/schedulable_query.ts
@@ -1,6 +1,6 @@
import { IFormField } from "./form_field";
import { IPack } from "./pack";
-import { SelectedPlatformString } from "./platform";
+import { SelectedPlatformString, SupportedPlatform } from "./platform";
// Query itself
export interface ISchedulableQuery {
@@ -24,6 +24,11 @@ export interface ISchedulableQuery {
packs: IPack[];
stats: ISchedulableQueryStats;
}
+
+export interface IEnhancedQuery extends ISchedulableQuery {
+ performance: string;
+ platforms: SupportedPlatform[];
+}
export interface ISchedulableQueryStats {
user_time_p50?: number;
user_time_p95?: number;
diff --git a/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx b/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx
index 1884828cd8..58e124b908 100644
--- a/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx
+++ b/frontend/pages/queries/ManageQueriesPage/ManageQueriesPage.tsx
@@ -16,12 +16,12 @@ import { performanceIndicator } from "utilities/helpers";
import { SupportedPlatform } from "interfaces/platform";
import { API_ALL_TEAMS_ID } from "interfaces/team";
import {
+ IEnhancedQuery,
IQueryKeyQueriesLoadAll,
ISchedulableQuery,
} from "interfaces/schedulable_query";
import queriesAPI from "services/entities/queries";
import PATHS from "router/paths";
-import { DEFAULT_EMPTY_CELL_VALUE } from "utilities/constants";
import checkPlatformCompatibility from "utilities/sql_tools";
import Button from "components/buttons/Button";
import Spinner from "components/Spinner";
@@ -52,17 +52,10 @@ interface IManageQueriesPageProps {
};
}
-interface IEnhancedQuery extends ISchedulableQuery {
- performance: string;
- platforms: SupportedPlatform[] | typeof DEFAULT_EMPTY_CELL_VALUE[];
-}
-
-const getPlatforms = (
- queryString: string
-): SupportedPlatform[] | typeof DEFAULT_EMPTY_CELL_VALUE[] => {
+const getPlatforms = (queryString: string): SupportedPlatform[] => {
const { platforms } = checkPlatformCompatibility(queryString);
- return platforms || [DEFAULT_EMPTY_CELL_VALUE];
+ return platforms ?? [];
};
const enhanceQuery = (q: ISchedulableQuery): IEnhancedQuery => {
diff --git a/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx b/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx
index abb55b687e..f5ad0b06f6 100644
--- a/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx
+++ b/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTable.tsx
@@ -285,7 +285,7 @@ const QueriesTable = ({
variant: "text-icon",
onActionButtonClick: onDeleteQueryClick,
}}
- selectedDropdownFilter={platform}
+ selectedDropdownFilter={!isInherited ? platform : undefined}
/>
) : (
diff --git a/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTableConfig.tsx b/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTableConfig.tsx
index b8ab7431ff..744a829bc6 100644
--- a/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTableConfig.tsx
+++ b/frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTableConfig.tsx
@@ -9,7 +9,10 @@ import PATHS from "router/paths";
import permissionsUtils from "utilities/permissions";
import { IUser } from "interfaces/user";
import { secondsToDhms } from "utilities/helpers";
-import { ISchedulableQuery } from "interfaces/schedulable_query";
+import {
+ IEnhancedQuery,
+ ISchedulableQuery,
+} from "interfaces/schedulable_query";
import { SupportedPlatform } from "interfaces/platform";
import Icon from "components/Icon";
@@ -48,7 +51,7 @@ interface IHeaderProps {
}
interface IRowProps {
row: {
- original: ISchedulableQuery;
+ original: IEnhancedQuery;
getToggleRowSelectedProps: () => IGetToggleAllRowsSelectedProps;
toggleRowSelected: () => void;
};
@@ -108,9 +111,6 @@ const generateTableHeaders = ({
isInherited = false,
}: IGenerateTableHeaders): IDataColumn[] => {
const isOnlyObserver = permissionsUtils.isOnlyObserver(currentUser);
- const isAnyTeamMaintainerOrTeamAdmin = permissionsUtils.isAnyTeamMaintainerOrTeamAdmin(
- currentUser
- );
const tableHeaders: IDataColumn[] = [
{
@@ -163,18 +163,11 @@ const generateTableHeaders = ({
},
{
title: "Platform",
- Header: "Platform",
+ Header: "Compatible with",
disableSortBy: true,
accessor: "platforms",
Cell: (cellProps: IPlatformCellProps): JSX.Element => {
- // translate the SelectedPlatformString into an array of `SupportedPlatform`s
- const platformIconsToRender = (cellProps.row.original.platform === ""
- ? ["darwin", "windows", "linux", "chrome"]
- : cellProps.row.original.platform
- ?.split(",")
- .filter((platform) => platform !== "")) as SupportedPlatform[];
-
- return ;
+ return ;
},
},
{