mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 01:38:56 -04:00
[Observability Solution][Maintenance] Move to Emotion CSS, enable Telemetry and i18n ESLint rules for all Obs plugins (#177785)
## Summary This does two things: * Moves to Emotion CSS from .scss files * Enables Telemetry and i18n ESLint rules for all Observability apps ## Why? **Move to Emotion CSS** There were four .scss files total in the 17 Observability plugins. Two of them were empty. The remaining two had one class each. By removing the two empty files and moving to Emotion, we can remove the lines pertaining to .scss files in the CODEOWNERS file. **Enabling Telemetry and i18n ESLint rules for all Observability apps** One of the reasons for consolidating Obs apps into one folder was to create a more consistent development experience across apps in the Observability org. By changing the eslint rule config to enable the [Telemetry](https://github.com/elastic/kibana/tree/main/packages/kbn-eslint-plugin-telemetry) and [i18n](https://github.com/elastic/kibana/tree/main/packages/kbn-eslint-plugin-i18n) ESLint rules on all `.ts` and `tsx` files in `observability_solution`, we enable the rule for 5 apps that did not have them enabled before and we ensure that the rule will immediately be enabled on new Observability applications at the moment of creation. ## Related PRs: - [x] [Move APM ](https://github.com/elastic/kibana/pull/177433) - [x] [Move Data Quality](https://github.com/elastic/kibana/pull/177456) - [x] [Move Exploratory View](https://github.com/elastic/kibana/pull/177440) - [x] [Move Infra](https://github.com/elastic/kibana/pull/177443) - [X] Move Logs Explorer - [x] [Move Logs Shared](https://github.com/elastic/kibana/pull/177735) - [x] [Move Observability AI Assistant](https://github.com/elastic/kibana/pull/177427) - [x] [Move Observability App](https://github.com/elastic/kibana/pull/177437) - [x] [Move Observability Onboarding](https://github.com/elastic/kibana/pull/177458) - [x] [Move Observability Shared](https://github.com/elastic/kibana/pull/177463) - [x] [Move Profiling](https://github.com/elastic/kibana/pull/177453) - [x] [Move Synthetics](https://github.com/elastic/kibana/pull/177464) - [x] [Move Uptime](https://github.com/elastic/kibana/pull/177466) - [x] [Move UX](https://github.com/elastic/kibana/pull/177470) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Marco Antonio Ghiani <marcoantonio.ghiani01@gmail.com>
This commit is contained in:
Coen Warmer
GitHub
parent
98aff217e1
commit
fbc544da36
17 changed files with 34 additions and 41 deletions
25
.eslintrc.js
25
.eslintrc.js
|
|
@ -911,19 +911,7 @@ module.exports = {
|
|||
{
|
||||
files: [
|
||||
'x-pack/plugins/aiops/**/*.tsx',
|
||||
'x-pack/plugins/infra/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/apm/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/dataset_quality/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/exploratory_view/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/infra/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/observability/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/observability_ai_assistant/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/observability_onboarding/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/observability_shared/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/profiling/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/synthetics/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/uptime/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/ux/**/*.tsx',
|
||||
'x-pack/plugins/observability_solution/**/*.tsx',
|
||||
'src/plugins/ai_assistant_management/**/*.tsx',
|
||||
],
|
||||
rules: {
|
||||
|
|
@ -932,16 +920,7 @@ module.exports = {
|
|||
},
|
||||
{
|
||||
files: [
|
||||
'x-pack/plugins/observability_solution/apm/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/exploratory_view/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/infra/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/observability/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/observability_ai_assistant/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/observability_onboarding/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/observability_shared/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/profiling/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/synthetics/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/ux/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'x-pack/plugins/observability_solution/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
'src/plugins/ai_assistant_management/**/!(*.stories.tsx|*.test.tsx|*.storybook_decorator.tsx|*.mock.tsx)',
|
||||
],
|
||||
rules: {
|
||||
|
|
|
|||
3
.github/CODEOWNERS
vendored
3
.github/CODEOWNERS
vendored
|
|
@ -1543,8 +1543,6 @@ x-pack/plugins/security_solution/server/lib/security_integrations @elastic/secur
|
|||
**/*.scss @elastic/kibana-design
|
||||
|
||||
# Observability design
|
||||
/x-pack/plugins/observability_solution/apm/**/*.scss @elastic/observability-design
|
||||
/x-pack/plugins/observability_solution/infra/**/*.scss @elastic/observability-design
|
||||
/x-pack/plugins/fleet/**/*.scss @elastic/observability-design
|
||||
/x-pack/plugins/monitoring/**/*.scss @elastic/observability-design
|
||||
|
||||
|
|
@ -1556,7 +1554,6 @@ x-pack/plugins/security_solution/server/lib/security_integrations @elastic/secur
|
|||
/x-pack/plugins/security_solution/**/*.scss @elastic/security-design
|
||||
/x-pack/plugins/security_solution_ess/**/*.scss @elastic/security-design
|
||||
/x-pack/plugins/security_solution_serverless/**/*.scss @elastic/security-design
|
||||
/x-pack/plugins/observability_solution/logs_explorer/**/*.scss @elastic/observability-design
|
||||
|
||||
# Logstash
|
||||
#CC# /x-pack/plugins/logstash/ @elastic/logstash
|
||||
|
|
|
|||
|
|
@ -12,7 +12,6 @@ import ReactDOM from 'react-dom';
|
|||
import { Router, Routes, Route } from '@kbn/shared-ux-router';
|
||||
import { AppMountParameters } from '@kbn/core/public';
|
||||
import { Storage } from '@kbn/kibana-utils-plugin/public';
|
||||
import '../index.scss';
|
||||
import { LinkToLogsPage } from '../pages/link_to/link_to_logs';
|
||||
import { LogsPage } from '../pages/logs';
|
||||
import { InfraClientStartDeps, InfraClientStartExports } from '../types';
|
||||
|
|
|
|||
|
|
@ -12,7 +12,6 @@ import ReactDOM from 'react-dom';
|
|||
import { Router, Routes, Route } from '@kbn/shared-ux-router';
|
||||
import { AppMountParameters } from '@kbn/core/public';
|
||||
import { Storage } from '@kbn/kibana-utils-plugin/public';
|
||||
import '../index.scss';
|
||||
import { InfraPublicConfig } from '../../common/plugin_config_types';
|
||||
import { LinkToMetricsPage } from '../pages/link_to/link_to_metrics';
|
||||
import { InfrastructurePage } from '../pages/metrics';
|
||||
|
|
|
|||
|
|
@ -37,7 +37,12 @@ export const AddDataButton: React.FunctionComponent<{}> = ({}) => {
|
|||
});
|
||||
|
||||
return (
|
||||
<EuiButtonEmpty {...onboardingLinkProps} iconType="plusInCircleFilled" size="xs">
|
||||
<EuiButtonEmpty
|
||||
data-test-subj="logsExplorerAddDataButtonButton"
|
||||
{...onboardingLinkProps}
|
||||
iconType="plusInCircleFilled"
|
||||
size="xs"
|
||||
>
|
||||
{addDataLabel}
|
||||
</EuiButtonEmpty>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -60,7 +60,11 @@ export const ListStatus = ({
|
|||
}}
|
||||
/>
|
||||
}
|
||||
actions={[<EuiButton onClick={onRetry}>{noDataRetryLabel}</EuiButton>]}
|
||||
actions={[
|
||||
<EuiButton data-test-subj="logsExplorerListStatusButton" onClick={onRetry}>
|
||||
{noDataRetryLabel}
|
||||
</EuiButton>,
|
||||
]}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ export const SearchControls = ({ search, onSearch, onSort, isLoading }: SearchCo
|
|||
<EuiFlexGroup gutterSize="xs" responsive={false}>
|
||||
<EuiFlexItem>
|
||||
<EuiFieldSearch
|
||||
data-test-subj="logsExplorerSearchControlsFieldSearch"
|
||||
compressed
|
||||
incremental
|
||||
value={search.name}
|
||||
|
|
|
|||
|
|
@ -41,6 +41,7 @@ export function HighlightSection({ title, children, columns, ...props }: Highlig
|
|||
const showMoreButtonLabel = flyoutAccordionShowMoreText(hiddenCount);
|
||||
const showMoreButton = (
|
||||
<EuiButtonEmpty
|
||||
data-test-subj="logsExplorerHighlightSectionShowMoreButton"
|
||||
size="xs"
|
||||
flush="left"
|
||||
css={{ width: '80px' }}
|
||||
|
|
|
|||
|
|
@ -72,6 +72,7 @@ export const HoverActionPopover = ({
|
|||
{hoverActions.map((action) => (
|
||||
<EuiToolTip content={action.tooltipContent} key={action.id}>
|
||||
<EuiButtonIcon
|
||||
data-test-subj="logsExplorerHoverActionPopoverButton"
|
||||
size="xs"
|
||||
iconType={action.iconType}
|
||||
aria-label={action.tooltipContent as string}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,9 @@
|
|||
*/
|
||||
|
||||
import React, { useMemo } from 'react';
|
||||
import { css } from '@emotion/css';
|
||||
import { EuiButtonIcon, EuiText } from '@elastic/eui';
|
||||
import { euiThemeVars } from '@kbn/ui-theme';
|
||||
import type { DataGridCellValueElementProps } from '@kbn/unified-data-table';
|
||||
import { getShouldShowFieldHandler } from '@kbn/discover-utils';
|
||||
import { i18n } from '@kbn/i18n';
|
||||
|
|
@ -16,7 +18,6 @@ import { useDocDetail, getMessageWithFallbacks } from '../../hooks/use_doc_detai
|
|||
import { LogDocument } from '../../../common/document';
|
||||
import { LogLevel } from '../common/log_level';
|
||||
import * as constants from '../../../common/constants';
|
||||
import './virtual_column.scss';
|
||||
|
||||
const SourceDocument = dynamic(
|
||||
() => import('@kbn/unified-data-table/src/components/source_document')
|
||||
|
|
@ -26,6 +27,11 @@ const DiscoverSourcePopoverContent = dynamic(
|
|||
() => import('@kbn/unified-data-table/src/components/source_popover_content')
|
||||
);
|
||||
|
||||
const sourceDocumentClassName = css`
|
||||
display: inline !important;
|
||||
margin-left: ${euiThemeVars.euiSizeXS};
|
||||
`;
|
||||
|
||||
const LogMessage = ({ field, value }: { field?: string; value: string }) => {
|
||||
const renderFieldPrefix = field && field !== constants.MESSAGE_FIELD;
|
||||
return (
|
||||
|
|
@ -115,7 +121,7 @@ export const Content = ({
|
|||
shouldShowFieldHandler={shouldShowFieldHandler}
|
||||
maxEntries={50}
|
||||
dataTestSubj="logsExplorerCellDescriptionList"
|
||||
className="logsExplorerVirtualColumn__sourceDocument"
|
||||
className={sourceDocumentClassName}
|
||||
/>
|
||||
)}
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
.logsExplorerVirtualColumn__sourceDocument {
|
||||
display: inline !important;
|
||||
margin-left: $euiSizeXS;
|
||||
}
|
||||
|
|
@ -29,6 +29,7 @@ export const DataSearchProgress: React.FC<{
|
|||
{onCancel ? (
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiButtonIcon
|
||||
data-test-subj="logsSharedDataSearchProgressButton"
|
||||
color="danger"
|
||||
iconType="cross"
|
||||
onClick={onCancel}
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
.obsNewsFeed__itemImg {
|
||||
@include euiBottomShadowSmall;
|
||||
}
|
||||
|
|
@ -15,17 +15,22 @@ import {
|
|||
EuiText,
|
||||
EuiTitle,
|
||||
} from '@elastic/eui';
|
||||
import { css } from '@emotion/css';
|
||||
import { i18n } from '@kbn/i18n';
|
||||
import { truncate } from 'lodash';
|
||||
import React, { useContext } from 'react';
|
||||
import { ThemeContext } from 'styled-components';
|
||||
import { NewsItem as INewsItem } from './helpers/get_news_feed';
|
||||
import './news_feed.scss';
|
||||
|
||||
interface Props {
|
||||
items: INewsItem[];
|
||||
}
|
||||
|
||||
const imageClassName = css`
|
||||
box-shadow: 0 0.7px 1.4px rgba(0, 0, 0, 0.07), 0 1.9px 4px rgba(0, 0, 0, 0.05),
|
||||
0 4.5px 10px rgba(0, 0, 0, 0.05);
|
||||
`;
|
||||
|
||||
export function NewsFeed({ items }: Props) {
|
||||
return (
|
||||
// The news feed is manually added/edited, to prevent any errors caused by typos or missing fields,
|
||||
|
|
@ -98,7 +103,7 @@ function NewsItem({ item }: { item: INewsItem }) {
|
|||
height={48}
|
||||
alt={item.title.en}
|
||||
src={item.image_url.en}
|
||||
className="obsNewsFeed__itemImg"
|
||||
className={imageClassName}
|
||||
/>
|
||||
</EuiFlexItem>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -77,6 +77,7 @@ export function NavControl({}: {}) {
|
|||
return (
|
||||
<>
|
||||
<EuiButton
|
||||
data-test-subj="observabilityAiAssistantAppNavControlButton"
|
||||
css={buttonCss}
|
||||
onClick={() => {
|
||||
service.conversations.openNewConversation({
|
||||
|
|
|
|||
|
|
@ -228,6 +228,7 @@ export const AlertsPopover = () => {
|
|||
<EuiPopover
|
||||
button={
|
||||
<EuiButtonEmpty
|
||||
data-test-subj="observabilityLogsExplorerAlertsPopoverAlertsButton"
|
||||
onClick={togglePopover}
|
||||
iconType="arrowDown"
|
||||
iconSide="right"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue