Skip to content

Commit 244da16

Browse files
peruukkiperuukki
authored
chore: Convert EuiCustomLink to TypeScript in /ui (#5059)
This was the last JavaScript component, convert it to TypeScript too. The `href` prop was never used, so we omit it from the props type definition, and no longer pass it to the component. We could also have chosen to drop the `to` prop and use `href` instead, but `to` is used by React Router's Link (https://reactrouter.com/6.29.0/components/link), and it makes sense to use the same name in EuiCustomLink since we pass it to React Router's `navigate` function; the naming hints that it's tied to React Router and not just a regular URL path. Signed-off-by: Harri Lehtola <peruukki@hotmail.com>
1 parent 4373cbf commit 244da16

14 files changed

+15
-25
lines changed

ui/src/components/EuiCustomLink.jsx renamed to ui/src/components/EuiCustomLink.tsx

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,26 @@
1-
// File name: "EuiCustomLink.js".
21
import React from "react";
3-
import { EuiLink } from "@elastic/eui";
4-
import { useNavigate, useHref } from "react-router-dom";
2+
import { EuiLink, type EuiLinkAnchorProps } from "@elastic/eui";
3+
import { useNavigate, useHref, type To } from "react-router-dom";
54

6-
const isModifiedEvent = (event) =>
5+
interface EuiCustomLinkProps extends Omit<EuiLinkAnchorProps, 'href'> {
6+
to: To;
7+
}
8+
9+
const isModifiedEvent = (event: React.MouseEvent) =>
710
!!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey);
811

9-
const isLeftClickEvent = (event) => event.button === 0;
12+
const isLeftClickEvent = (event: React.MouseEvent) => event.button === 0;
1013

11-
const isTargetBlank = (event) => {
12-
const target = event.target.getAttribute("target");
14+
const isTargetBlank = (event: React.MouseEvent) => {
15+
const target = (event.target as Element).getAttribute("target");
1316
return target && target !== "_self";
1417
};
1518

16-
export default function EuiCustomLink({ to, ...rest }) {
19+
export default function EuiCustomLink({ to, ...rest }: EuiCustomLinkProps) {
1720
// This is the key!
1821
const navigate = useNavigate();
1922

20-
function onClick(event) {
23+
const onClick: React.MouseEventHandler<HTMLAnchorElement> = (event) => {
2124
if (event.defaultPrevented) {
2225
return;
2326
}
@@ -41,6 +44,5 @@ export default function EuiCustomLink({ to, ...rest }) {
4144
// Generate the correct link href (with basename accounted for)
4245
const href = useHref(to);
4346

44-
const props = { ...rest, href, onClick };
45-
return <EuiLink {...props} />;
47+
return <EuiLink {...rest} href={href} onClick={onClick} />;
4648
}

‎ui/src/components/FeaturesInServiceDisplay.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ const FeaturesInServiceList = ({ featureViews }: FeatureViewsListInterace) => {
2929
render: (name: string) => {
3030
return (
3131
<EuiCustomLink
32-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${name}`}
3332
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${name}`}
3433
>
3534
{name}

‎ui/src/components/FeaturesListDisplay.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ const FeaturesList = ({
2121
field: "name",
2222
render: (item: string) => (
2323
<EuiCustomLink
24-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${featureViewName}/feature/${item}`}
2524
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${featureViewName}/feature/${item}`}
2625
>
2726
{item}

‎ui/src/pages/data-sources/DataSourcesListingTable.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ const DatasourcesListingTable = ({
2121
render: (name: string) => {
2222
return (
2323
<EuiCustomLink
24-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/data-source/${name}`}
2524
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/data-source/${name}`}
2625
>
2726
{name}

‎ui/src/pages/entities/EntitiesListingTable.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ const EntitiesListingTable = ({ entities }: EntitiesListingTableProps) => {
2121
render: (name: string) => {
2222
return (
2323
<EuiCustomLink
24-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/entity/${name}`}
2524
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/entity/${name}`}
2625
>
2726
{name}

‎ui/src/pages/entities/FeatureViewEdgesList.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,6 @@ const FeatureViewEdgesList = ({ fvNames }: FeatureViewEdgesListInterace) => {
5454
render: ({ name }: { name: string }) => {
5555
return (
5656
<EuiCustomLink
57-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${name}`}
5857
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${name}`}
5958
>
6059
{name}

‎ui/src/pages/feature-services/FeatureServiceListingTable.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,6 @@ const FeatureServiceListingTable = ({
3131
render: (name: string) => {
3232
return (
3333
<EuiCustomLink
34-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-service/${name}`}
3534
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-service/${name}`}
3635
>
3736
{name}

‎ui/src/pages/feature-views/ConsumingFeatureServicesList.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ const ConsumingFeatureServicesList = ({
1919
render: ({ name }: { name: string }) => {
2020
return (
2121
<EuiCustomLink
22-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-service/${name}`}
2322
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-service/${name}`}
2423
>
2524
{name}

‎ui/src/pages/feature-views/FeatureViewListingTable.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,6 @@ const FeatureViewListingTable = ({
3232
render: (name: string, item: genericFVType) => {
3333
return (
3434
<EuiCustomLink
35-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${name}`}
3635
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/feature-view/${name}`}
3736
>
3837
{name} {(item.type === "ondemand" && <EuiBadge>ondemand</EuiBadge>) || (item.type === "stream" && <EuiBadge>stream</EuiBadge>)}

‎ui/src/pages/feature-views/StreamFeatureViewOverviewTab.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,6 @@ const StreamFeatureViewOverviewTab = ({
9696
</EuiText>
9797
<EuiTitle size="s">
9898
<EuiCustomLink
99-
href={`${process.env.PUBLIC_URL || ""}/p/${projectName}/data-source/${inputGroup?.name}`}
10099
to={`${process.env.PUBLIC_URL || ""}/p/${projectName}/data-source/${inputGroup?.name}`}
101100
>
102101
{inputGroup?.name}

0 commit comments

Comments
 (0)