Skip to content

Commit

Permalink
[Uptime] Delete uptime eslint rule skip (elastic#50912)
Browse files Browse the repository at this point in the history
* Delete uptime eslint rules.

* Update hooks usage to adhere to new eslint rules.

* Delete code accidentally added during rebase.

* WIP trying things.

* Clean up types and hook usage to comply with kibana eslint rules.

* Clean up code.

* Update new useEffect hooks that are missing dependencies.

* Fix edits that broke a page.
  • Loading branch information
justinkambic committed Jan 8, 2020
1 parent a0ea5d3 commit 89482d9
Show file tree
Hide file tree
Showing 16 changed files with 61 additions and 67 deletions.
7 changes: 0 additions & 7 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -189,13 +189,6 @@ module.exports = {
'react-hooks/exhaustive-deps': 'off',
},
},
{
files: ['x-pack/legacy/plugins/uptime/**/*.{js,ts,tsx}'],
rules: {
'react-hooks/exhaustive-deps': 'off',
'react-hooks/rules-of-hooks': 'off',
},
},

/**
* Files that require Apache 2.0 headers, settings
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ export const DonutChart = ({ height, down, up, width }: DonutChartProps) => {
)
.attr('fill', (d: any) => color(d.data.key));
}
}, [chartElement.current, upCount, down]);
}, [danger, down, gray, height, upCount, width]);
return (
<EuiFlexGroup alignItems="center" responsive={false}>
<EuiFlexItem grow={false}>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,9 @@ export const SnapshotHistogramComponent: React.FC<Props> = ({
loading = false,
height,
}: Props) => {
const {
colors: { danger, gray },
} = useContext(UptimeSettingsContext);
if (!data || !data.queryResult)
/**
* TODO: the Fragment, EuiTitle, and EuiPanel should be extracted to a dumb component
Expand Down Expand Up @@ -94,10 +97,6 @@ export const SnapshotHistogramComponent: React.FC<Props> = ({
queryResult: { histogram, interval },
} = data;

const {
colors: { danger, gray },
} = useContext(UptimeSettingsContext);

const downMonitorsId = i18n.translate('xpack.uptime.snapshotHistogram.downMonitorsId', {
defaultMessage: 'Down Monitors',
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ export function KueryBar({ autocomplete }: Props) {
useEffect(() => {
getIndexPattern(basePath, (result: any) => setIndexPattern(toStaticIndexPattern(result)));
setIsLoadingIndexPattern(false);
}, []);
}, [basePath]);
const [getUrlParams, updateUrlParams] = useUrlParams();
const { search: kuery } = getUrlParams();

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,23 @@ const EmbeddedPanel = styled.div`

export const EmbeddedMap = ({ upPoints, downPoints }: EmbeddedMapProps) => {
const [embeddable, setEmbeddable] = useState<MapEmbeddable>();
const embeddableRoot: React.RefObject<HTMLDivElement> = React.createRef();
const factory = start.getEmbeddableFactory(MAP_SAVED_OBJECT_TYPE);

const input = {
id: uuid.v4(),
filters: [],
hidePanelTitles: true,
query: { query: '', language: 'kuery' },
refreshConfig: { value: 0, pause: false },
viewMode: 'view',
isLayerTOCOpen: false,
hideFilterActions: true,
mapCenter: { lon: 11, lat: 47, zoom: 0 },
disableInteractive: true,
disableTooltipControl: true,
hideToolbarOverlay: true,
};

useEffect(() => {
async function setupEmbeddable() {
Expand All @@ -59,38 +76,21 @@ export const EmbeddedMap = ({ upPoints, downPoints }: EmbeddedMapProps) => {
setEmbeddable(embeddableObject);
}
setupEmbeddable();
// we want this effect to execute exactly once after the component mounts
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

useEffect(() => {
if (embeddable) {
embeddable.setLayerList(getLayerList(upPoints, downPoints));
}
}, [upPoints, downPoints]);
}, [upPoints, downPoints, embeddable]);

useEffect(() => {
if (embeddableRoot.current && embeddable) {
embeddable.render(embeddableRoot.current);
}
}, [embeddable]);

const factory = start.getEmbeddableFactory(MAP_SAVED_OBJECT_TYPE);

const input = {
id: uuid.v4(),
filters: [],
hidePanelTitles: true,
query: { query: '', language: 'kuery' },
refreshConfig: { value: 0, pause: false },
viewMode: 'view',
isLayerTOCOpen: false,
hideFilterActions: true,
mapCenter: { lon: 11, lat: 47, zoom: 0 },
disableInteractive: true,
disableTooltipControl: true,
hideToolbarOverlay: true,
};

const embeddableRoot: React.RefObject<HTMLDivElement> = React.createRef();
}, [embeddable, embeddableRoot]);

return (
<EmbeddedPanel>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,12 +39,12 @@ export const MonitorChartsComponent = ({
dateRangeEnd,
loading,
}: Props) => {
const [getUrlParams] = useUrlParams();
if (data && data.monitorChartsData) {
const {
monitorChartsData: { locationDurationLines },
} = data;

const [getUrlParams] = useUrlParams();
const { absoluteDateRangeStart, absoluteDateRangeEnd } = getUrlParams();

return (
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -49,12 +49,16 @@ export function MonitorListDrawerComponent({
loadMonitorDetails,
monitorDetails,
}: MonitorListDrawerProps) {
const monitorId = summary?.monitor_id;
useEffect(() => {
if (monitorId) {
loadMonitorDetails(monitorId);
}
}, [loadMonitorDetails, monitorId]);

if (!summary || !summary.state.checks) {
return null;
}
useEffect(() => {
loadMonitorDetails(summary.monitor_id);
}, []);

const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export const MonitorStatusDetailsComponent = ({
}: MonitorStatusBarProps) => {
useEffect(() => {
loadMonitorLocations(monitorId);
}, [monitorId, dateStart, dateEnd]);
}, [loadMonitorLocations, monitorId, dateStart, dateEnd]);

return (
<EuiPanel>
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
Expand Up @@ -207,7 +207,6 @@ describe('PingList component', () => {
onPageCountChange={jest.fn()}
onSelectedLocationChange={(loc: EuiComboBoxOptionProps[]) => {}}
onSelectedStatusChange={jest.fn()}
onUpdateApp={jest.fn()}
pageSize={30}
selectedOption="down"
selectedLocation={BaseLocationOptions}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
* or more contributor license agreements. Licensed under the Elastic License;
* you may not use this file except in compliance with the Elastic License.
*/

import {
EuiBadge,
EuiBasicTable,
Expand All @@ -22,15 +23,14 @@ import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
import { get } from 'lodash';
import moment from 'moment';
import React, { Fragment, useEffect, useState } from 'react';
// @ts-ignore formatNumber
import { formatNumber } from '@elastic/eui/lib/services/format';
import React, { Fragment, useState } from 'react';
import { CriteriaWithPagination } from '@elastic/eui/src/components/basic_table/basic_table';
import { Ping, PingResults } from '../../../../common/graphql/types';
import { convertMicrosecondsToMilliseconds as microsToMillis } from '../../../lib/helper';
import { UptimeGraphQLQueryProps, withUptimeGraphQL } from '../../higher_order';
import { pingsQuery } from '../../../queries';
import { LocationName } from './../location_name';
import { Criteria, Pagination } from './../monitor_list';
import { Pagination } from './../monitor_list';
import { PingListExpandedRowComponent } from './expanded_row';

interface PingListQueryResult {
Expand All @@ -41,7 +41,6 @@ interface PingListProps {
onSelectedStatusChange: (status: string | null) => void;
onSelectedLocationChange: (location: EuiComboBoxOptionProps[]) => void;
onPageCountChange: (itemCount: number) => void;
onUpdateApp: () => void;
pageSize: number;
selectedOption: string;
selectedLocation: EuiComboBoxOptionProps[];
Expand Down Expand Up @@ -77,18 +76,13 @@ export const PingListComponent = ({
onPageCountChange,
onSelectedLocationChange,
onSelectedStatusChange,
onUpdateApp,
pageSize,
selectedOption,
selectedLocation,
}: Props) => {
const [itemIdToExpandedRowMap, setItemIdToExpandedRowMap] = useState<ExpandedRowMap>({});

useEffect(() => {
onUpdateApp();
}, [selectedOption]);

const statusOptions: EuiComboBoxOptionProps[] = [
const statusOptions = [
{
label: i18n.translate('xpack.uptime.pingList.statusOptions.allStatusOptionLabel', {
defaultMessage: 'All',
Expand Down Expand Up @@ -182,16 +176,16 @@ export const PingListComponent = ({
render: (error: string) => error ?? '-',
},
];

const pings: Ping[] = data?.allPings?.pings ?? [];

const hasStatus: boolean = pings.some(
(currentPing: Ping) => !!currentPing?.http?.response?.status_code
const hasStatus: boolean = pings.reduce(
(hasHttpStatus: boolean, currentPing: Ping) =>
hasHttpStatus || !!currentPing.http?.response?.status_code,
false
);
if (hasStatus) {
columns.push({
field: 'http.response.status_code',
align: 'center',
align: 'right',
name: i18n.translate('xpack.uptime.pingList.responseCodeColumnLabel', {
defaultMessage: 'Response code',
}),
Expand Down Expand Up @@ -309,7 +303,9 @@ export const PingListComponent = ({
itemId="id"
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
pagination={pagination}
onChange={(criteria: Criteria) => onPageCountChange(criteria.page!.size)}
onChange={(criteria: CriteriaWithPagination<Ping>) =>
onPageCountChange(criteria.page!.size)
}
/>
</EuiPanel>
</Fragment>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ export const Container: React.FC<Props> = ({
}: Props) => {
useEffect(() => {
loadSnapshotCount(dateRangeStart, dateRangeEnd, filters, statusFilter);
}, [dateRangeStart, dateRangeEnd, filters, lastRefresh, statusFilter]);
}, [dateRangeStart, dateRangeEnd, filters, lastRefresh, loadSnapshotCount, statusFilter]);
return <PresentationalComponent count={count} height={height} loading={loading} />;
};

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,9 @@ export function withUptimeGraphQL<T, P = {}>(WrappedComponent: any, query: any)
* reassign the update function to do nothing with the returned values.
*/
return () => {
// this component is planned to be deprecated, for the time being
// we will want to preserve this for the reason above.
// eslint-disable-next-line react-hooks/exhaustive-deps
updateState = () => {};
};
}, [variables, lastRefresh]);
Expand Down
12 changes: 6 additions & 6 deletions x-pack/legacy/plugins/uptime/public/pages/monitor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@ export const MonitorPage = ({
setHeadingText(heading);
}
});
}, [params]);
}, [monitorId, params, query, setBreadcrumbs, setHeadingText]);

const [selectedLocation, setSelectedLocation] = useState<EuiComboBoxOptionProps[]>(
BaseLocationOptions
Expand All @@ -79,7 +79,7 @@ export const MonitorPage = ({

useEffect(() => {
logMonitorPageLoad();
}, []);
}, [logMonitorPageLoad]);

useTrackPageview({ app: 'uptime', path: 'monitor' });
useTrackPageview({ app: 'uptime', path: 'monitor', delay: 15000 });
Expand All @@ -106,10 +106,10 @@ export const MonitorPage = ({
<PingList
onPageCountChange={setPingListPageCount}
onSelectedLocationChange={setSelectedLocation}
onSelectedStatusChange={(selectedStatus: string | null) =>
updateUrlParams({ selectedPingStatus: selectedStatus || '' })
}
onUpdateApp={refreshApp}
onSelectedStatusChange={(selectedStatus: string | undefined) => {
updateUrlParams({ selectedPingStatus: selectedStatus || '' });
refreshApp();
}}
pageSize={pingListPageCount}
selectedOption={selectedPingStatus}
selectedLocation={selectedLocation}
Expand Down
2 changes: 1 addition & 1 deletion x-pack/legacy/plugins/uptime/public/pages/overview.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ export const OverviewPage = ({
})
);
}
}, []);
}, [basePath, logOverviewPageLoad, setBreadcrumbs, setHeadingText]);

useTrackPageview({ app: 'uptime', path: 'overview' });
useTrackPageview({ app: 'uptime', path: 'overview', delay: 15000 });
Expand Down
2 changes: 1 addition & 1 deletion x-pack/legacy/plugins/uptime/public/uptime_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@ const Application = (props: UptimeAppProps) => {
}
: undefined
);
}, []);
}, [canSave, renderGlobalHelpControls, setBadge]);

const refreshApp = () => {
const refreshTime = Date.now();
Expand Down

0 comments on commit 89482d9

Please sign in to comment.