From e1ead0f53769b5864a65e698dc144c8da8f13c6a Mon Sep 17 00:00:00 2001 From: Fabrizio <135109076+fabrizio-grafana@users.noreply.github.com> Date: Wed, 17 Jan 2024 12:45:17 +0100 Subject: [PATCH] Tempo: Minor refactoring (#80701) --- .betterer.results | 14 ------ .../tempo/NativeSearch/NativeSearch.tsx | 14 +++--- .../SearchTraceQLEditor/GroupByField.tsx | 6 +-- .../tempo/SearchTraceQLEditor/SearchField.tsx | 6 +-- .../components/ConfigDescriptionLink.tsx | 47 ------------------- .../components/Divider.tsx | 25 ---------- .../components/NodeGraphSettings.tsx | 4 +- .../components/TraceView/SpanBarSettings.tsx | 4 +- .../app/plugins/datasource/tempo/package.json | 9 +--- yarn.lock | 7 --- 10 files changed, 16 insertions(+), 120 deletions(-) delete mode 100644 public/app/plugins/datasource/tempo/_importedDependencies/components/ConfigDescriptionLink.tsx delete mode 100644 public/app/plugins/datasource/tempo/_importedDependencies/components/Divider.tsx diff --git a/.betterer.results b/.betterer.results index 5e71c366204..444ed4c4f6f 100644 --- a/.betterer.results +++ b/.betterer.results @@ -5730,10 +5730,6 @@ exports[`better eslint`] = { [0, 0, 0, "Do not use any type assertions.", "0"], [0, 0, 0, "Do not use any type assertions.", "1"] ], - "public/app/plugins/datasource/tempo/NativeSearch/NativeSearch.tsx:5381": [ - [0, 0, 0, "Styles should be written using objects.", "0"], - [0, 0, 0, "Styles should be written using objects.", "1"] - ], "public/app/plugins/datasource/tempo/NativeSearch/TagsField/TagsField.tsx:5381": [ [0, 0, 0, "Styles should be written using objects.", "0"], [0, 0, 0, "Styles should be written using objects.", "1"] @@ -5741,12 +5737,6 @@ exports[`better eslint`] = { "public/app/plugins/datasource/tempo/SearchTraceQLEditor/DurationInput.tsx:5381": [ [0, 0, 0, "Styles should be written using objects.", "0"] ], - "public/app/plugins/datasource/tempo/SearchTraceQLEditor/GroupByField.tsx:5381": [ - [0, 0, 0, "Styles should be written using objects.", "0"] - ], - "public/app/plugins/datasource/tempo/SearchTraceQLEditor/SearchField.tsx:5381": [ - [0, 0, 0, "Styles should be written using objects.", "0"] - ], "public/app/plugins/datasource/tempo/SearchTraceQLEditor/TagsInput.tsx:5381": [ [0, 0, 0, "Styles should be written using objects.", "0"], [0, 0, 0, "Styles should be written using objects.", "1"] @@ -5763,10 +5753,6 @@ exports[`better eslint`] = { "public/app/plugins/datasource/tempo/_importedDependencies/components/AdHocFilter/AdHocFilterRenderer.tsx:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"] ], - "public/app/plugins/datasource/tempo/_importedDependencies/components/Divider.tsx:5381": [ - [0, 0, 0, "Styles should be written using objects.", "0"], - [0, 0, 0, "Styles should be written using objects.", "1"] - ], "public/app/plugins/datasource/tempo/_importedDependencies/components/NodeGraphSettings.tsx:5381": [ [0, 0, 0, "Styles should be written using objects.", "0"], [0, 0, 0, "Styles should be written using objects.", "1"], diff --git a/public/app/plugins/datasource/tempo/NativeSearch/NativeSearch.tsx b/public/app/plugins/datasource/tempo/NativeSearch/NativeSearch.tsx index 2d8d1ee4331..ae78da4318f 100644 --- a/public/app/plugins/datasource/tempo/NativeSearch/NativeSearch.tsx +++ b/public/app/plugins/datasource/tempo/NativeSearch/NativeSearch.tsx @@ -262,11 +262,11 @@ const NativeSearch = ({ datasource, query, onChange, onBlur, onRunQuery }: Props export default NativeSearch; const getStyles = (theme: GrafanaTheme2) => ({ - container: css` - max-width: 500px; - `, - alert: css` - max-width: 75ch; - margin-top: ${theme.spacing(2)}; - `, + container: css({ + maxWidth: '500px', + }), + alert: css({ + maxWidth: '75ch', + marginTop: theme.spacing(2), + }), }); diff --git a/public/app/plugins/datasource/tempo/SearchTraceQLEditor/GroupByField.tsx b/public/app/plugins/datasource/tempo/SearchTraceQLEditor/GroupByField.tsx index 93768010da0..27b7cb86590 100644 --- a/public/app/plugins/datasource/tempo/SearchTraceQLEditor/GroupByField.tsx +++ b/public/app/plugins/datasource/tempo/SearchTraceQLEditor/GroupByField.tsx @@ -129,7 +129,7 @@ export const GroupByField = (props: Props) => { }; const getStyles = (theme: GrafanaTheme2) => ({ - addFilter: css` - margin-left: ${theme.spacing(2)}; - `, + addFilter: css({ + marginLeft: theme.spacing(2), + }), }); diff --git a/public/app/plugins/datasource/tempo/SearchTraceQLEditor/SearchField.tsx b/public/app/plugins/datasource/tempo/SearchTraceQLEditor/SearchField.tsx index 3007a78615b..c16095acf0d 100644 --- a/public/app/plugins/datasource/tempo/SearchTraceQLEditor/SearchField.tsx +++ b/public/app/plugins/datasource/tempo/SearchTraceQLEditor/SearchField.tsx @@ -18,9 +18,9 @@ import { operators as allOperators, stringOperators, numberOperators, keywordOpe import { filterScopedTag, operatorSelectableValue } from './utils'; const getStyles = () => ({ - dropdown: css` - box-shadow: none; - `, + dropdown: css({ + boxShadow: 'none', + }), }); interface Props { diff --git a/public/app/plugins/datasource/tempo/_importedDependencies/components/ConfigDescriptionLink.tsx b/public/app/plugins/datasource/tempo/_importedDependencies/components/ConfigDescriptionLink.tsx deleted file mode 100644 index c2cecc84cd9..00000000000 --- a/public/app/plugins/datasource/tempo/_importedDependencies/components/ConfigDescriptionLink.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import { css } from '@emotion/css'; -import React from 'react'; - -import { GrafanaTheme2 } from '@grafana/data'; -import { useStyles2 } from '@grafana/ui'; - -type Props = { - description: string; - suffix: string; - feature: string; -}; - -export function ConfigDescriptionLink(props: Props) { - const { description, suffix, feature } = props; - const text = `Learn more about ${feature}`; - const styles = useStyles2(getStyles); - - return ( - - {description} - - {text} - - - ); -} - -const getStyles = (theme: GrafanaTheme2) => { - return { - container: css({ - color: theme.colors.text.secondary, - a: css({ - color: theme.colors.text.link, - textDecoration: 'underline', - marginLeft: '5px', - '&:hover': { - textDecoration: 'none', - }, - }), - }), - }; -}; diff --git a/public/app/plugins/datasource/tempo/_importedDependencies/components/Divider.tsx b/public/app/plugins/datasource/tempo/_importedDependencies/components/Divider.tsx deleted file mode 100644 index 7e062fd6165..00000000000 --- a/public/app/plugins/datasource/tempo/_importedDependencies/components/Divider.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import { css } from '@emotion/css'; -import React from 'react'; - -import { GrafanaTheme2 } from '@grafana/data'; -import { useStyles2 } from '@grafana/ui'; - -export const Divider = ({ hideLine = false }) => { - const styles = useStyles2(getStyles); - - if (hideLine) { - return
; - } - - return
; -}; - -const getStyles = (theme: GrafanaTheme2) => ({ - divider: css` - margin: ${theme.spacing(4, 0)}; - `, - dividerHideLine: css` - border: none; - margin: ${theme.spacing(3, 0)}; - `, -}); diff --git a/public/app/plugins/datasource/tempo/_importedDependencies/components/NodeGraphSettings.tsx b/public/app/plugins/datasource/tempo/_importedDependencies/components/NodeGraphSettings.tsx index 0dfe986323e..c6852da877e 100644 --- a/public/app/plugins/datasource/tempo/_importedDependencies/components/NodeGraphSettings.tsx +++ b/public/app/plugins/datasource/tempo/_importedDependencies/components/NodeGraphSettings.tsx @@ -7,11 +7,9 @@ import { GrafanaTheme2, updateDatasourcePluginJsonDataOption, } from '@grafana/data'; -import { ConfigSubSection } from '@grafana/experimental'; +import { ConfigSubSection, ConfigDescriptionLink } from '@grafana/experimental'; import { InlineField, InlineFieldRow, InlineSwitch, useStyles2 } from '@grafana/ui'; -import { ConfigDescriptionLink } from './ConfigDescriptionLink'; - export interface NodeGraphOptions { enabled?: boolean; } diff --git a/public/app/plugins/datasource/tempo/_importedDependencies/components/TraceView/SpanBarSettings.tsx b/public/app/plugins/datasource/tempo/_importedDependencies/components/TraceView/SpanBarSettings.tsx index 130eaa271df..0d759f4d312 100644 --- a/public/app/plugins/datasource/tempo/_importedDependencies/components/TraceView/SpanBarSettings.tsx +++ b/public/app/plugins/datasource/tempo/_importedDependencies/components/TraceView/SpanBarSettings.tsx @@ -8,11 +8,9 @@ import { toOption, updateDatasourcePluginJsonDataOption, } from '@grafana/data'; -import { ConfigSubSection } from '@grafana/experimental'; +import { ConfigSubSection, ConfigDescriptionLink } from '@grafana/experimental'; import { InlineField, InlineFieldRow, Input, Select, useStyles2 } from '@grafana/ui'; -import { ConfigDescriptionLink } from '../ConfigDescriptionLink'; - export interface SpanBarOptions { type?: string; tag?: string; diff --git a/public/app/plugins/datasource/tempo/package.json b/public/app/plugins/datasource/tempo/package.json index 0d5cd2acf9d..c25cb1ad469 100644 --- a/public/app/plugins/datasource/tempo/package.json +++ b/public/app/plugins/datasource/tempo/package.json @@ -40,10 +40,7 @@ "uuid": "9.0.0" }, "devDependencies": { - "@babel/core": "7.23.7", "@grafana/plugin-configs": "10.4.0-pre", - "@grafana/tsconfig": "^1.3.0-rc1", - "@swc/core": "1.3.38", "@testing-library/jest-dom": "6.1.4", "@testing-library/react": "14.0.0", "@testing-library/user-event": "14.5.2", @@ -55,14 +52,10 @@ "@types/react-dom": "18.2.7", "@types/semver": "7.5.6", "@types/uuid": "9.0.2", - "copy-webpack-plugin": "11.0.0", - "eslint-webpack-plugin": "4.0.1", "glob": "10.3.10", "react-select-event": "5.5.1", - "replace-in-file-webpack-plugin": "1.0.6", "ts-node": "10.9.1", - "typescript": "5.2.2", - "webpack": "5.89.0" + "typescript": "5.2.2" }, "peerDependencies": { "@grafana/runtime": "*" diff --git a/yarn.lock b/yarn.lock index 73fc652800c..a2f25be63ad 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3053,7 +3053,6 @@ __metadata: version: 0.0.0-use.local resolution: "@grafana-plugins/tempo@workspace:public/app/plugins/datasource/tempo" dependencies: - "@babel/core": "npm:7.23.7" "@emotion/css": "npm:11.11.2" "@grafana/data": "workspace:*" "@grafana/e2e-selectors": "workspace:*" @@ -3064,7 +3063,6 @@ __metadata: "@grafana/plugin-configs": "npm:10.4.0-pre" "@grafana/runtime": "workspace:*" "@grafana/schema": "workspace:*" - "@grafana/tsconfig": "npm:^1.3.0-rc1" "@grafana/ui": "workspace:*" "@lezer/common": "npm:1.2.1" "@lezer/lr": "npm:1.3.3" @@ -3072,7 +3070,6 @@ __metadata: "@opentelemetry/exporter-collector": "npm:0.25.0" "@opentelemetry/semantic-conventions": "npm:1.17.1" "@reduxjs/toolkit": "npm:1.9.5" - "@swc/core": "npm:1.3.38" "@testing-library/jest-dom": "npm:6.1.4" "@testing-library/react": "npm:14.0.0" "@testing-library/user-event": "npm:14.5.2" @@ -3085,8 +3082,6 @@ __metadata: "@types/semver": "npm:7.5.6" "@types/uuid": "npm:9.0.2" buffer: "npm:6.0.3" - copy-webpack-plugin: "npm:11.0.0" - eslint-webpack-plugin: "npm:4.0.1" events: "npm:3.3.0" glob: "npm:10.3.10" i18next: "npm:^22.0.0" @@ -3100,7 +3095,6 @@ __metadata: react-select-event: "npm:5.5.1" react-use: "npm:17.4.3" redux: "npm:4.2.1" - replace-in-file-webpack-plugin: "npm:1.0.6" rxjs: "npm:7.8.1" semver: "npm:7.5.4" stream-browserify: "npm:3.0.0" @@ -3109,7 +3103,6 @@ __metadata: tslib: "npm:2.6.0" typescript: "npm:5.2.2" uuid: "npm:9.0.0" - webpack: "npm:5.89.0" peerDependencies: "@grafana/runtime": "*" languageName: unknown