chore: cleanup some devtool console warnings (#7988)

This commit is contained in:
Joshua Eilers 2023-05-09 15:16:11 -07:00 committed by GitHub
parent a68833769e
commit a9bf1abaf8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
23 changed files with 129 additions and 127 deletions

View File

@ -67,7 +67,7 @@
"react-color": "^2.19.3",
"react-dom": "^17.0.0",
"react-email-share-link": "^1.0.3",
"react-helmet": "^6.1.0",
"react-helmet-async": "^1.3.0",
"react-highlighter": "^0.4.3",
"react-icons": "4.3.1",
"react-js-cron": "^2.1.0",

View File

@ -5,7 +5,7 @@ import { BrowserRouter as Router } from 'react-router-dom';
import { ApolloClient, ApolloProvider, createHttpLink, InMemoryCache, ServerError } from '@apollo/client';
import { onError } from '@apollo/client/link/error';
import { ThemeProvider } from 'styled-components';
import { Helmet } from 'react-helmet';
import { Helmet, HelmetProvider } from 'react-helmet-async';
import './App.less';
import { Routes } from './app/Routes';
import EntityRegistry from './app/entity/EntityRegistry';
@ -118,18 +118,20 @@ const App: React.VFC = () => {
}, []);
return (
<ThemeProvider theme={dynamicThemeConfig}>
<Router>
<Helmet>
<title>{dynamicThemeConfig.content.title}</title>
</Helmet>
<EntityRegistryContext.Provider value={entityRegistry}>
<ApolloProvider client={client}>
<Routes />
</ApolloProvider>
</EntityRegistryContext.Provider>
</Router>
</ThemeProvider>
<HelmetProvider>
<ThemeProvider theme={dynamicThemeConfig}>
<Router>
<Helmet>
<title>{dynamicThemeConfig.content.title}</title>
</Helmet>
<EntityRegistryContext.Provider value={entityRegistry}>
<ApolloProvider client={client}>
<Routes />
</ApolloProvider>
</EntityRegistryContext.Provider>
</Router>
</ThemeProvider>
</HelmetProvider>
);
};

View File

@ -1,9 +1,5 @@
import React from 'react';
import {
DatasetStatsSummary as DatasetStatsSummaryObj,
DatasetProfile,
Operation,
} from '../../../../../../types.generated';
import { DatasetStatsSummary as DatasetStatsSummaryObj } from '../../../../../../types.generated';
import { useBaseEntity } from '../../../../shared/EntityContext';
import { GetDatasetQuery } from '../../../../../../graphql/dataset.generated';
import { DatasetStatsSummary } from '../../../shared/DatasetStatsSummary';
@ -13,10 +9,11 @@ export const DatasetStatsSummarySubHeader = () => {
const dataset = result?.dataset;
const maybeStatsSummary = dataset?.statsSummary as DatasetStatsSummaryObj;
const maybeLastProfile =
((dataset?.datasetProfiles?.length || 0) > 0 && (dataset?.datasetProfiles![0] as DatasetProfile)) || undefined;
const maybeLastOperation =
((dataset?.operations?.length || 0) > 0 && (dataset?.operations![0] as Operation)) || undefined;
dataset?.datasetProfiles && dataset.datasetProfiles.length ? dataset.datasetProfiles[0] : undefined;
const maybeLastOperation = dataset?.operations && dataset.operations.length ? dataset.operations[0] : undefined;
const rowCount = maybeLastProfile?.rowCount;
const columnCount = maybeLastProfile?.columnCount;

View File

@ -1,6 +1,6 @@
import React, { useState } from 'react';
import { MoreOutlined, UserAddOutlined, UserDeleteOutlined } from '@ant-design/icons';
import { Col, Dropdown, Menu, message, Modal, Pagination, Row, Empty, Button, Typography } from 'antd';
import { Col, Dropdown, message, Modal, Pagination, Row, Empty, Button, Typography, MenuProps } from 'antd';
import { Link } from 'react-router-dom';
import styled from 'styled-components';
import { useGetAllGroupMembersQuery, useRemoveGroupMembersMutation } from '../../../graphql/group.generated';
@ -155,28 +155,28 @@ export default function GroupMembers({ urn, pageSize, isExternalGroup, onChangeM
const total = relationships?.total || 0;
const groupMembers = relationships?.relationships?.map((rel) => rel.entity as CorpUser) || [];
const onMemberMenuClick = (e, urnID) => {
// TODO: add for make owner if required, else remove it
if (e.key === 'remove') {
onRemoveMember(urnID);
}
};
const menu = (urnID) => {
return (
<Menu onClick={(e) => onMemberMenuClick(e, urnID)}>
<Menu.Item disabled key="make">
const getItems = (urnID: string): MenuProps['items'] => {
return [
{
key: 'make',
disabled: true,
label: (
<span>
<UserAddOutlined /> Make owner
</span>
</Menu.Item>
<Menu.Item disabled={isExternalGroup} key="remove">
),
},
{
key: 'remove',
disabled: isExternalGroup,
onClick: () => onRemoveMember(urnID),
label: (
<span>
<UserDeleteOutlined /> Remove from Group
</span>
</Menu.Item>
</Menu>
);
),
},
];
};
return (
@ -210,7 +210,7 @@ export default function GroupMembers({ urn, pageSize, isExternalGroup, onChangeM
</MemberColumn>
<MemberColumn xl={1} lg={1} md={1} sm={1} xs={1}>
<MemberEditIcon>
<Dropdown overlay={menu(item.urn)}>
<Dropdown menu={{ items: getItems(item.urn) }}>
<MoreOutlined />
</Dropdown>
</MemberEditIcon>

View File

@ -46,7 +46,7 @@ export default function GroupMembersSideBarSection({ total, relationships, onSee
const user = item.entity as CorpUser;
const name = entityRegistry.getDisplayName(EntityType.CorpUser, user);
return (
<MemberTag>
<MemberTag key={user.urn}>
<Link to={`${entityRegistry.getEntityUrl(EntityType.CorpUser, user.urn)}`}>
<CustomAvatar
name={name}

View File

@ -40,7 +40,7 @@ function EntityName(props: Props) {
const [updateName] = useUpdateNameMutation();
const handleSaveName = async (name: string) => {
const handleSaveName = (name: string) => {
setUpdatedName(name);
updateName({ variables: { input: { name, urn } } })
.then(() => {

View File

@ -108,7 +108,7 @@ export const ContainerSelectModal = ({ onCloseModal, defaultValues, onOkOverride
setSelectedContainers(selectedContainers?.filter((container) => container.urn !== val.value));
};
const onOk = async () => {
const onOk = () => {
if (!selectedContainers) {
return;
}

View File

@ -108,7 +108,7 @@ export const SetDomainModal = ({ urns, onCloseModal, refetch, defaultValue, onOk
setSelectedDomain(undefined);
};
const onOk = async () => {
const onOk = () => {
if (!selectedDomain) {
return;
}

View File

@ -1,4 +1,4 @@
import React, { useEffect, useRef, useState } from 'react';
import React, { ReactNode, useEffect, useRef, useState } from 'react';
import { Button, Form, message, Modal, Select, Tag, Typography } from 'antd';
import styled from 'styled-components';
@ -199,21 +199,22 @@ export const EditOwnersModal = ({
setSelectedOwnerType(newType);
};
const tagRender = (props) => {
// eslint-disable-next-line react/prop-types
const { label, closable, onClose } = props;
const onPreventMouseDown = (event) => {
event.preventDefault();
event.stopPropagation();
};
const tagRender = ({ closable, label, onClose }: { closable: boolean; label: ReactNode; onClose: () => void }) => {
return (
<StyleTag onMouseDown={onPreventMouseDown} closable={closable} onClose={onClose}>
<StyleTag
onMouseDown={(event) => {
event.preventDefault();
event.stopPropagation();
}}
closable={closable}
onClose={onClose}
>
{label}
</StyleTag>
);
};
const emitAnalytics = async () => {
const emitAnalytics = () => {
if (urns.length > 1) {
analytics.event({
type: EventType.BatchEntityActionEvent,
@ -287,7 +288,7 @@ export const EditOwnersModal = ({
};
// Function to handle the modal action's
const onOk = async () => {
const onOk = () => {
if (selectedOwners.length === 0) {
return;
}

View File

@ -105,7 +105,7 @@ export const SelectPlatformModal = ({ onCloseModal, defaultValues, onOk, titleOv
setSelectedPlatforms(selectedPlatforms?.filter((platform) => platform.urn !== val.value));
};
const handleOk = async () => {
const handleOk = () => {
if (!selectedPlatforms) {
return;
}

View File

@ -23,7 +23,7 @@ const NameText = styled(Typography.Text)`
color: ${ANTD_GRAY[9]};
`;
const isPresent = (val: any) => {
const isPresent = (val?: string | number | null): val is string | number => {
return val !== undefined && val !== null;
};
@ -41,10 +41,10 @@ export default function ColumnStats({ columnStats }: Props) {
mean: doc.mean,
median: doc.median,
stdev: doc.stdev,
nullCount: isPresent(doc.nullCount) && doc.nullCount!.toString(),
nullPercentage: isPresent(doc.nullProportion) && decimalToPercentStr(doc.nullProportion!, 2),
distinctCount: isPresent(doc.uniqueCount) && doc.uniqueCount!.toString(),
distinctPercentage: isPresent(doc.uniqueProportion) && decimalToPercentStr(doc.uniqueProportion!, 2),
nullCount: isPresent(doc.nullCount) && doc.nullCount.toString(),
nullPercentage: isPresent(doc.nullProportion) && decimalToPercentStr(doc.nullProportion, 2),
distinctCount: isPresent(doc.uniqueCount) && doc.uniqueCount.toString(),
distinctPercentage: isPresent(doc.uniqueProportion) && decimalToPercentStr(doc.uniqueProportion, 2),
sampleValues: doc.sampleValues,
})) || [],
[columnStats],

View File

@ -150,7 +150,9 @@ export const DatasetAssertionDetails = ({ urn, lastEvaluatedAtMillis }: Props) =
result: result?.type !== AssertionResultType.Failure,
title: (
<>
{/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
<AssertionResultIcon>{getResultIcon(result!.type)}</AssertionResultIcon>
{/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
<Typography.Text strong>{getResultText(result!.type)}</Typography.Text>
</>
),

View File

@ -204,11 +204,10 @@ export const HomePageRecommendations = ({ user }: Props) => {
recommendationModules
.filter((module) => module.renderType !== RecommendationRenderType.DomainSearchList)
.map((module) => (
<RecommendationContainer id={getStepId(module.moduleId)}>
<RecommendationContainer id={getStepId(module.moduleId)} key={module.moduleId}>
<RecommendationTitle level={4}>{module.title}</RecommendationTitle>
<ThinDivider />
<RecommendationModule
key={module.moduleId}
module={module as RecommendationModuleType}
scenarioType={scenario}
showTitle={false}

View File

@ -63,7 +63,7 @@ export const SecretsList = () => {
const totalSecrets = data?.listSecrets?.total || 0;
const secrets = data?.listSecrets?.secrets || [];
const deleteSecret = async (urn: string) => {
const deleteSecret = (urn: string) => {
deleteSecretMutation({
variables: { urn },
})

View File

@ -254,7 +254,7 @@ export const IngestionSourceList = () => {
setPage(newPage);
};
const deleteIngestionSource = async (urn: string) => {
const deleteIngestionSource = (urn: string) => {
removeFromListIngestionSourcesCache(client, urn, page, pageSize, query);
removeIngestionSourceMutation({
variables: { urn },

View File

@ -91,6 +91,7 @@ export default function PolicyBuilderModal({ policy, setPolicy, visible, onClose
content: (
<PolicyPrivilegeForm
policyType={policy.type}
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
resources={policy.resources!}
setResources={(resources: ResourceFilter) => {
setPolicy({ ...policy, resources });

View File

@ -94,6 +94,7 @@ export default function PolicyDetailsModal({ policy, visible, onClose, privilege
<Link
target="_blank"
rel="noopener noreferrer"
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
to={() => `${entityRegistry.getEntityUrl(criterionValue.entity!.type, criterionValue.value)}`}
>
{getDisplayName(criterionValue.entity)}

View File

@ -54,8 +54,8 @@ export const TagSearchList = ({ content, onClick }: Props) => {
return (
<TagSearchListContainer>
{tags.map((tag, index) => (
<TagContainer>
<TagButton type="link" key={tag.urn} onClick={() => onClickTag(tag, index)}>
<TagContainer key={tag.urn}>
<TagButton type="link" onClick={() => onClickTag(tag, index)}>
<StyledTag $colorHash={tag?.urn} $color={tag?.properties?.colorHex} closable={false}>
{entityRegistry.getDisplayName(EntityType.Tag, tag)}
</StyledTag>

View File

@ -1,6 +1,6 @@
import { FolderOpenOutlined } from '@ant-design/icons';
import { Typography } from 'antd';
import React from 'react';
import React, { Fragment } from 'react';
import styled from 'styled-components/macro';
import { Container, EntityType } from '../../../types.generated';
import { useEntityRegistry } from '../../useEntityRegistry';
@ -31,26 +31,26 @@ interface Props {
export default function ParentContainers({ parentContainers }: Props) {
const entityRegistry = useEntityRegistry();
const visibleContainers = parentContainers.slice(parentContainers.length - NUM_VISIBLE_CONTAINERS);
const numHiddenContainers = parentContainers.length - NUM_VISIBLE_CONTAINERS;
const visibleIndex = Math.max(parentContainers.length - NUM_VISIBLE_CONTAINERS, 0);
const visibleContainers = parentContainers.slice(visibleIndex);
const hiddenContainers = parentContainers.slice(0, visibleIndex);
return (
<ParentContainersWrapper>
{numHiddenContainers > 0 &&
[...Array(numHiddenContainers)].map(() => (
<>
<FolderOpenOutlined />
<ArrowWrapper>{'>'}</ArrowWrapper>
</>
))}
{hiddenContainers.map((container) => (
<Fragment key={container.urn}>
<FolderOpenOutlined />
<ArrowWrapper>{'>'}</ArrowWrapper>
</Fragment>
))}
{visibleContainers.map((container, index) => (
<>
<Fragment key={container.urn}>
<FolderOpenOutlined />
<ParentContainer ellipsis={{ tooltip: '' }}>
{entityRegistry.getDisplayName(EntityType.Container, container)}
</ParentContainer>
{index !== visibleContainers.length - 1 && <ArrowWrapper>{'>'}</ArrowWrapper>}
</>
</Fragment>
))}
</ParentContainersWrapper>
);

View File

@ -8,7 +8,7 @@ import { getQuickFilterDetails } from './utils';
import { ANTD_GRAY } from '../../../entity/shared/constants';
import analytics, { Event, EventType } from '../../../analytics';
const QuickFilterWrapper = styled(Button)<{ isSelected: boolean }>`
const QuickFilterWrapper = styled(Button)<{ selected: boolean }>`
border: 1px solid ${ANTD_GRAY[4]};
border-radius: 16px;
box-shadow: none;
@ -26,7 +26,7 @@ const QuickFilterWrapper = styled(Button)<{ isSelected: boolean }>`
}
${(props) =>
props.isSelected &&
props.selected &&
`
border: 1px solid ${props.theme.styles['primary-color-dark']};
background-color: ${props.theme.styles['primary-color-light']};
@ -72,7 +72,7 @@ export default function QuickFilter({ quickFilter }: Props) {
return (
<QuickFilterWrapper
onClick={handleClick}
isSelected={isSelected}
selected={isSelected}
data-testid={`quick-filter-${quickFilter.value}`}
>
{icon}

View File

@ -1,5 +1,5 @@
import React from 'react';
import { Helmet } from 'react-helmet';
import { Helmet } from 'react-helmet-async';
import { useEntityData } from '../entity/shared/EntityContext';
import { useEntityRegistry } from '../useEntityRegistry';
import { capitalizeFirstLetterOnly } from './textUtil';

View File

@ -2,6 +2,7 @@ import React, { useMemo } from 'react';
import { MemoryRouter } from 'react-router';
import { ThemeProvider } from 'styled-components';
import { HelmetProvider } from 'react-helmet-async';
import { CLIENT_AUTH_COOKIE } from '../../conf/Global';
import { DatasetEntity } from '../../app/entity/dataset/DatasetEntity';
import { DataFlowEntity } from '../../app/entity/dataFlow/DataFlowEntity';
@ -53,33 +54,35 @@ export default ({ children, initialEntries }: Props) => {
jest.mock('js-cookie', () => ({ get: () => 'urn:li:corpuser:2' }));
return (
<ThemeProvider theme={defaultThemeConfig}>
<MemoryRouter initialEntries={initialEntries}>
<EntityRegistryContext.Provider value={entityRegistry}>
<UserContextProvider>
<LineageExplorerContext.Provider
value={{
expandTitles: false,
showColumns: false,
collapsedColumnsNodes: {},
setCollapsedColumnsNodes: null,
fineGrainedMap: {},
selectedField: null,
setSelectedField: () => {},
highlightedEdges: [],
setHighlightedEdges: () => {},
visibleColumnsByUrn: {},
setVisibleColumnsByUrn: () => {},
columnsByUrn: {},
setColumnsByUrn: () => {},
refetchCenterNode: () => {},
}}
>
{children}
</LineageExplorerContext.Provider>
</UserContextProvider>
</EntityRegistryContext.Provider>
</MemoryRouter>
</ThemeProvider>
<HelmetProvider>
<ThemeProvider theme={defaultThemeConfig}>
<MemoryRouter initialEntries={initialEntries}>
<EntityRegistryContext.Provider value={entityRegistry}>
<UserContextProvider>
<LineageExplorerContext.Provider
value={{
expandTitles: false,
showColumns: false,
collapsedColumnsNodes: {},
setCollapsedColumnsNodes: null,
fineGrainedMap: {},
selectedField: null,
setSelectedField: () => {},
highlightedEdges: [],
setHighlightedEdges: () => {},
visibleColumnsByUrn: {},
setVisibleColumnsByUrn: () => {},
columnsByUrn: {},
setColumnsByUrn: () => {},
refetchCenterNode: () => {},
}}
>
{children}
</LineageExplorerContext.Provider>
</UserContextProvider>
</EntityRegistryContext.Provider>
</MemoryRouter>
</ThemeProvider>
</HelmetProvider>
);
};

View File

@ -16115,10 +16115,10 @@ react-error-overlay@^6.0.9:
resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.9.tgz#3c743010c9359608c375ecd6bc76f35d93995b0a"
integrity sha512-nQTTcUu+ATDbrSD1BZHr5kgSD4oF8OFjxun8uAaL8RwPBacGBNPf/yAuVVdx17N8XNzRDMrZ9XcKZHCjPW+9ew==
react-fast-compare@^3.1.1:
version "3.2.0"
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb"
integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==
react-fast-compare@^3.2.0:
version "3.2.1"
resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.1.tgz#53933d9e14f364281d6cba24bfed7a4afb808b5f"
integrity sha512-xTYf9zFim2pEif/Fw16dBiXpe0hoy5PxcD8+OwBnTtNLfIm3g6WxhKNurY+6OmdH1u6Ta/W/Vl6vjbYP1MFnDg==
react-focus-lock@2.5.2:
version "2.5.2"
@ -16132,15 +16132,16 @@ react-focus-lock@2.5.2:
use-callback-ref "^1.2.5"
use-sidecar "^1.0.5"
react-helmet@^6.1.0:
version "6.1.0"
resolved "https://registry.yarnpkg.com/react-helmet/-/react-helmet-6.1.0.tgz#a750d5165cb13cf213e44747502652e794468726"
integrity sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==
react-helmet-async@^1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/react-helmet-async/-/react-helmet-async-1.3.0.tgz#7bd5bf8c5c69ea9f02f6083f14ce33ef545c222e"
integrity sha512-9jZ57/dAn9t3q6hneQS0wukqC2ENOBgMNVEhb/ZG9ZSxUetzVIw4iAmEU38IaVg3QGYauQPhSeUTuIUtFglWpg==
dependencies:
object-assign "^4.1.1"
"@babel/runtime" "^7.12.5"
invariant "^2.2.4"
prop-types "^15.7.2"
react-fast-compare "^3.1.1"
react-side-effect "^2.1.0"
react-fast-compare "^3.2.0"
shallowequal "^1.1.0"
react-highlighter@^0.4.3:
version "0.4.3"
@ -16296,11 +16297,6 @@ react-scripts@4.0.3:
optionalDependencies:
fsevents "^2.1.3"
react-side-effect@^2.1.0:
version "2.1.2"
resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-2.1.2.tgz#dc6345b9e8f9906dc2eeb68700b615e0b4fe752a"
integrity sha512-PVjOcvVOyIILrYoyGEpDN3vmYNLdy1CajSFNt4TDsVQC5KpTijDvWVoR+/7Rz2xT978D8/ZtFceXxzsPwZEDvw==
react-syntax-highlighter@^15.4.4:
version "15.4.4"
resolved "https://registry.yarnpkg.com/react-syntax-highlighter/-/react-syntax-highlighter-15.4.4.tgz#dc9043f19e7bd063ff3ea78986d22a6eaa943b2a"