diff --git a/thirdeye-ui/src/app/components/admin-page/recent-failures/recent-failures.component.tsx b/thirdeye-ui/src/app/components/admin-page/recent-failures/recent-failures.component.tsx index 755e6abf8a..0d95d35089 100644 --- a/thirdeye-ui/src/app/components/admin-page/recent-failures/recent-failures.component.tsx +++ b/thirdeye-ui/src/app/components/admin-page/recent-failures/recent-failures.component.tsx @@ -12,7 +12,7 @@ * See the License for the specific language governing permissions and limitations under * the License. */ -import { Box, Grid, Link, Typography } from "@material-ui/core"; +import { Box, Grid, Link } from "@material-ui/core"; import { sortBy } from "lodash"; import React, { FunctionComponent, useMemo } from "react"; import { useTranslation } from "react-i18next"; @@ -235,20 +235,7 @@ export const RecentFailures: FunctionComponent = () => { return ( <> - - - {t("label.recent-anomaly-detection-failures")} - - - } - > - {t("label.latest-errors-in-your-alerts")} - - - + { - + { } > - + disableSearch disableSelection diff --git a/thirdeye-ui/src/app/components/anomalies-page-header/anomalies-page-header.component.tsx b/thirdeye-ui/src/app/components/anomalies-page-header/anomalies-page-header.component.tsx index cb8b6d12de..5fb854dad8 100644 --- a/thirdeye-ui/src/app/components/anomalies-page-header/anomalies-page-header.component.tsx +++ b/thirdeye-ui/src/app/components/anomalies-page-header/anomalies-page-header.component.tsx @@ -20,10 +20,8 @@ import { Link as RouterLink, useLocation } from "react-router-dom"; import { PageHeaderActionsV1 } from "../../platform/components"; import { AppRouteRelative, - getAnomaliesAllPath, getAnomaliesCreatePath, } from "../../utils/routes/routes.util"; -import { Crumb } from "../breadcrumbs/breadcrumbs.interfaces"; import { anomaliesBasicHelpCards } from "../help-drawer-v1/help-drawer-card-contents.utils"; import { HelpDrawerV1 } from "../help-drawer-v1/help-drawer-v1.component"; import { PageHeader } from "../page-header/page-header.component"; @@ -31,22 +29,6 @@ import { PageHeader } from "../page-header/page-header.component"; export const AnomaliesPageHeader: FunctionComponent = () => { const { search, pathname } = useLocation(); const { t } = useTranslation(); - const crumbs: Crumb[] = [ - { - label: t("label.anomalies"), - link: getAnomaliesAllPath(), - }, - ]; - - if (pathname.indexOf(AppRouteRelative.ANOMALIES_METRICS_REPORT) > -1) { - crumbs.push({ - label: t("label.metrics-report"), - }); - } else if (pathname.indexOf(AppRouteRelative.ANOMALIES_LIST) > -1) { - crumbs.push({ - label: t("label.anomalies-list"), - }); - } const selectedSubNavigation: number = [ @@ -57,7 +39,6 @@ export const AnomaliesPageHeader: FunctionComponent = () => { return ( <> ({ fontWeight: "500", }, }, + + "& .MuiDataGrid-columnSeparator": { + display: "none", + }, }, })); diff --git a/thirdeye-ui/src/app/components/home-page/latest-active-alerts/latest-active-alerts.component.tsx b/thirdeye-ui/src/app/components/home-page/latest-active-alerts/latest-active-alerts.component.tsx index 7be5c8151a..e2b4a6df2f 100644 --- a/thirdeye-ui/src/app/components/home-page/latest-active-alerts/latest-active-alerts.component.tsx +++ b/thirdeye-ui/src/app/components/home-page/latest-active-alerts/latest-active-alerts.component.tsx @@ -14,6 +14,7 @@ */ import { Box, + Grid, Link, TableBody, TableCell, @@ -48,9 +49,26 @@ export const LatestActiveAlerts: React.FunctionComponent - - {t("label.latest-active-alerts")} - + + + + {t("label.latest-active-alerts")} + + + + + {t("label.view-all-entities", { + entity: t("label.alerts"), + })} + + + + + @@ -143,16 +161,6 @@ export const LatestActiveAlerts: React.FunctionComponent - - {t("label.view-all-entities", { - entity: t("label.alerts"), - })} - - ); }; diff --git a/thirdeye-ui/src/app/components/home-page/latest-subscription-groups/latest-subscription-groups.component.tsx b/thirdeye-ui/src/app/components/home-page/latest-subscription-groups/latest-subscription-groups.component.tsx index ee1f4f8ad2..1b1d03a87e 100644 --- a/thirdeye-ui/src/app/components/home-page/latest-subscription-groups/latest-subscription-groups.component.tsx +++ b/thirdeye-ui/src/app/components/home-page/latest-subscription-groups/latest-subscription-groups.component.tsx @@ -14,6 +14,7 @@ */ import { Box, + Grid, Link, TableBody, TableCell, @@ -83,11 +84,28 @@ export const LatestSubscriptionGroups: React.FunctionComponent - - {t("label.latest-entity", { - entity: t("label.subscription-groups"), - })} - + + + + {t("label.latest-entity", { + entity: t("label.subscription-groups"), + })} + + + + + {t("label.view-all-entities", { + entity: t("label.subscriptions"), + })} + + + + + @@ -160,16 +178,6 @@ export const LatestSubscriptionGroups: React.FunctionComponent - - {t("label.show-entities", { - entity: t("label.subscriptions"), - })} - - ); }; diff --git a/thirdeye-ui/src/app/components/home-page/recent-anomalies-v2/recent-anomalies-v2.component.tsx b/thirdeye-ui/src/app/components/home-page/recent-anomalies-v2/recent-anomalies-v2.component.tsx index 5028e235b0..7b53d4c6b0 100644 --- a/thirdeye-ui/src/app/components/home-page/recent-anomalies-v2/recent-anomalies-v2.component.tsx +++ b/thirdeye-ui/src/app/components/home-page/recent-anomalies-v2/recent-anomalies-v2.component.tsx @@ -12,7 +12,7 @@ * See the License for the specific language governing permissions and limitations under * the License. */ -import { Box, Button, Grid, Link, Typography } from "@material-ui/core"; +import { Box, Grid, Link, Typography } from "@material-ui/core"; import TableCell from "@material-ui/core/TableCell"; import TableRow from "@material-ui/core/TableRow"; import { capitalize, sortBy } from "lodash"; @@ -32,9 +32,12 @@ import { } from "../title-card-table/title-card-table.component"; import { AnomalyRowV2 } from "./anomaly-row-v2/anomaly-row-v2.component"; import { useFetchQuery } from "../../../rest/hooks/useFetchQuery"; +import { useLatestSubscriptionGroupsStyles } from "../latest-subscription-groups/latest-subscription-groups.styles"; +import { ArrowForward } from "@material-ui/icons"; export const RecentAnomaliesV2: FunctionComponent = () => { const { t } = useTranslation(); + const styles = useLatestSubscriptionGroupsStyles(); const startTime = DateTime.local() .minus({ month: 1 }) @@ -67,7 +70,7 @@ export const RecentAnomaliesV2: FunctionComponent = () => { return ( <> - + {t("label.recent-entity", { @@ -76,12 +79,15 @@ export const RecentAnomaliesV2: FunctionComponent = () => { - - + + {t("label.view-all-entities", { + entity: t("label.anomalies"), + })} + diff --git a/thirdeye-ui/src/app/components/home-page/recommended-documentation-v2/recommended-documentation-v2.component.tsx b/thirdeye-ui/src/app/components/home-page/recommended-documentation-v2/recommended-documentation-v2.component.tsx index 2df9ac617c..07057061de 100644 --- a/thirdeye-ui/src/app/components/home-page/recommended-documentation-v2/recommended-documentation-v2.component.tsx +++ b/thirdeye-ui/src/app/components/home-page/recommended-documentation-v2/recommended-documentation-v2.component.tsx @@ -23,11 +23,13 @@ import CreateAlertImage from "../../../../assets/images/create-alert.png"; import GettingStartedImage from "../../../../assets/images/getting-started.png"; import InvestigateAnomaliesImage from "../../../../assets/images/investigate-anomalies.png"; import { THIRDEYE_DOC_LINK } from "../../../utils/constants/constants.util"; +import { useLatestSubscriptionGroupsStyles } from "../latest-subscription-groups/latest-subscription-groups.styles"; import { useRecommendedDocumentationV2Styles } from "./recommended-documentation-v2.styles"; export const RecommendedDocumentationV2: FunctionComponent = () => { const { t } = useTranslation(); const styles = useRecommendedDocumentationV2Styles(); + const linkStyles = useLatestSubscriptionGroupsStyles(); const items = useMemo( () => [ @@ -80,25 +82,24 @@ export const RecommendedDocumentationV2: FunctionComponent = () => { - + + + + diff --git a/thirdeye-ui/src/app/components/home-page/title-card-table/title-card-table.styles.ts b/thirdeye-ui/src/app/components/home-page/title-card-table/title-card-table.styles.ts index dd7087a45e..cd181ee4ab 100644 --- a/thirdeye-ui/src/app/components/home-page/title-card-table/title-card-table.styles.ts +++ b/thirdeye-ui/src/app/components/home-page/title-card-table/title-card-table.styles.ts @@ -19,6 +19,8 @@ export const useTitleCardTableStyles = makeStyles((theme) => ({ table: { borderRadius: theme.shape.borderRadius, border: `1px solid ${PaletteV1.BorderColorGrey}`, + borderCollapse: "separate", + overflow: "hidden", }, header: { backgroundColor: PaletteV1.BackgroundColorLight, diff --git a/thirdeye-ui/src/app/components/page-header/page-header.component.tsx b/thirdeye-ui/src/app/components/page-header/page-header.component.tsx index f9fb562fe8..d2707d3960 100644 --- a/thirdeye-ui/src/app/components/page-header/page-header.component.tsx +++ b/thirdeye-ui/src/app/components/page-header/page-header.component.tsx @@ -120,7 +120,7 @@ export const PageHeader: FunctionComponent = ({ {title && ( - {title} + {title} )} {children} diff --git a/thirdeye-ui/src/app/locale/languages/en-us.json b/thirdeye-ui/src/app/locale/languages/en-us.json index d423a5db4d..a5ed65b9e8 100644 --- a/thirdeye-ui/src/app/locale/languages/en-us.json +++ b/thirdeye-ui/src/app/locale/languages/en-us.json @@ -90,7 +90,7 @@ "add-to-chart": "Add to Chart", "additional-chart-items": "Additional Chart Items", "admin": "Admin", - "admin-dashboard": "Admin dashboard", + "admin-dashboard": "Admin Dashboard", "advanced": "Advanced", "advanced-alert": "Advanced Alert", "advanced-alert-old": "Advanced Alert", @@ -247,6 +247,7 @@ "delete": "Delete", "delete-entity": "Delete {{entity}}", "description": "Description", + "deselect-all": "Deselect All", "details": "Details", "detection-algorithm": "Detection algorithm", "detection-configuration": "Detection Configuration", @@ -897,7 +898,7 @@ "select-a-date-range-to-filter-data-by": "Select a date range to filter the data by", "select-a-dimension-to-generate-the-anomaly-preview": "Select a dimension to generate the anomaly preview", "select-a-metric": "Select a metric", - "select-a-metric-to-detect-anomalies": "Select a metric to detect anomalies", + "select-a-metric-to-detect-anomalies": "A metric is a column of the dataset", "select-a-template-to-monitor-an-detect-anomalies": "Select a template to monitor an detect anomalies", "select-a-template-to-preview": "Select a template to preview the alert", "select-aggregation-function": "Select aggregation function", diff --git a/thirdeye-ui/src/app/pages/alerts-create-page/alerts-create-easy-page/alerts-create-easy-page.component.tsx b/thirdeye-ui/src/app/pages/alerts-create-page/alerts-create-easy-page/alerts-create-easy-page.component.tsx index 295c7a9a19..46cf51eb69 100644 --- a/thirdeye-ui/src/app/pages/alerts-create-page/alerts-create-easy-page/alerts-create-easy-page.component.tsx +++ b/thirdeye-ui/src/app/pages/alerts-create-page/alerts-create-easy-page/alerts-create-easy-page.component.tsx @@ -1133,7 +1133,7 @@ export const AlertsCreateEasyPage: FunctionComponent = () => { ) => m.name ); - a.unshift( + a.push( t( "label.custom-metric-aggregation" ) diff --git a/thirdeye-ui/src/app/pages/welcome-page/create-datasource/create-datasource-page.component.tsx b/thirdeye-ui/src/app/pages/welcome-page/create-datasource/create-datasource-page.component.tsx index 145bacda5c..469ee11da6 100644 --- a/thirdeye-ui/src/app/pages/welcome-page/create-datasource/create-datasource-page.component.tsx +++ b/thirdeye-ui/src/app/pages/welcome-page/create-datasource/create-datasource-page.component.tsx @@ -13,7 +13,7 @@ * the License. */ -import { Box, Button, Grid, Typography } from "@material-ui/core"; +import { Box, Grid, Typography } from "@material-ui/core"; import React, { FunctionComponent, useMemo } from "react"; import { useTranslation } from "react-i18next"; import { Outlet, useLocation } from "react-router-dom"; @@ -73,7 +73,6 @@ export const WelcomeOnboardDatasourceWizard: FunctionComponent = () => { {t("label.help")}} subtitle={t( "message.connect-to-startree-cloud-data-or-add-your-own-pinot-datasource" )} diff --git a/thirdeye-ui/src/app/pages/welcome-page/create-datasource/onboard-datasets/onboard-datasets-page.component.tsx b/thirdeye-ui/src/app/pages/welcome-page/create-datasource/onboard-datasets/onboard-datasets-page.component.tsx index 278a7941f9..6922bb91a1 100644 --- a/thirdeye-ui/src/app/pages/welcome-page/create-datasource/onboard-datasets/onboard-datasets-page.component.tsx +++ b/thirdeye-ui/src/app/pages/welcome-page/create-datasource/onboard-datasets/onboard-datasets-page.component.tsx @@ -256,22 +256,48 @@ export const WelcomeSelectDatasets: FunctionComponent = () => { mt={2} > - + + + + + + + + {tables?.map((dataset) => ( diff --git a/thirdeye-ui/src/app/platform/utils/material-ui/dimension.util.ts b/thirdeye-ui/src/app/platform/utils/material-ui/dimension.util.ts index 83e2e1a85b..f35ee09dbe 100644 --- a/thirdeye-ui/src/app/platform/utils/material-ui/dimension.util.ts +++ b/thirdeye-ui/src/app/platform/utils/material-ui/dimension.util.ts @@ -26,7 +26,7 @@ export const DimensionV1 = { PopoverElevation: 5, PopoverBorderRadius: 0, CardBorderRadius: 0, - BorderRadiusDefault: 4, + BorderRadiusDefault: 8, GridSpacingDefault: 2, PageGridSpacing: 3, ToolbarHeight: 56,