diff --git a/packages/core/src/components/Button/Button.tsx b/packages/core/src/components/Button/Button.tsx
index 0cb73b5f37..1cbf3ab3f1 100644
--- a/packages/core/src/components/Button/Button.tsx
+++ b/packages/core/src/components/Button/Button.tsx
@@ -1,5 +1,5 @@
import { alpha, Button as BaseButton, ButtonProps as BaseButtonProps } from '@mui/material';
-import React from 'react';
+import React, { SyntheticEvent } from 'react';
import { useNavigate } from 'react-router-dom';
import styled from 'styled-components';
@@ -53,24 +53,57 @@ export default function Button(props: ButtonProps) {
const navigate = useNavigate();
- function handleClick(...args) {
- if (to) {
- navigate(to);
- }
+ const handleClick = React.useCallback(
+ (...args: any[]) => {
+ if (to) {
+ navigate(to);
+ }
+
+ if (onClick) {
+ onClick(...args);
+ }
+ },
+ [to, navigate, onClick],
+ );
- if (onClick) {
- onClick(...args);
+ const onAuxClick = React.useMemo(() => {
+ if (!rest.href) {
+ return undefined;
}
- }
+ return (event: SyntheticEvent, ...restArgs: any[]) => {
+ event.preventDefault();
+ handleClick(...restArgs);
+ };
+ }, [rest.href, handleClick]);
switch (color) {
case 'danger':
- return ;
+ return (
+
+ );
case 'primary':
- return ;
+ return (
+
+ );
case 'secondary':
- return ;
+ return (
+
+ );
default:
- return ;
+ return (
+
+ );
}
}
diff --git a/packages/core/src/components/Link/Link.tsx b/packages/core/src/components/Link/Link.tsx
index f4f88d64e8..4f3f6a6d11 100644
--- a/packages/core/src/components/Link/Link.tsx
+++ b/packages/core/src/components/Link/Link.tsx
@@ -29,19 +29,27 @@ export default function Link(props: Props) {
};
function handleClick(event: SyntheticEvent) {
+ event.preventDefault();
+
if (onClick) {
- event.preventDefault();
event.stopPropagation();
onClick(event);
return;
}
if (href && target === '_blank') {
- event.preventDefault();
event.stopPropagation();
openExternal(href);
}
}
- return ;
+ // `onAuxClick` is used to handle middle mouse click as well as other mouse buttons.
+ return (
+
+ );
}
diff --git a/packages/core/src/components/MenuItem/MenuItem.tsx b/packages/core/src/components/MenuItem/MenuItem.tsx
index 87d1125938..501f64a7c8 100644
--- a/packages/core/src/components/MenuItem/MenuItem.tsx
+++ b/packages/core/src/components/MenuItem/MenuItem.tsx
@@ -16,21 +16,34 @@ function MenuItem(props: MenuItemProps, ref: any) {
const menuContext: MenuContextInterface | undefined = useContext(MenuContext);
- async function handleClick(event: React.MouseEvent) {
- event.stopPropagation();
-
- if (close === true) {
- menuContext?.close(event, 'menuItemClick');
+ const handleClick = React.useCallback(
+ async (event: React.MouseEvent) => {
+ event.stopPropagation();
+
+ if (close === true) {
+ menuContext?.close(event, 'menuItemClick');
+ }
+
+ await onClick?.(event);
+
+ if (close === 'after') {
+ menuContext?.close(event, 'menuItemClick');
+ }
+ },
+ [close, menuContext, onClick],
+ );
+
+ const onAuxClick = React.useMemo(() => {
+ if (!rest.href) {
+ return undefined;
}
+ return (event: React.MouseEvent) => {
+ event.preventDefault();
+ return handleClick(event);
+ };
+ }, [rest.href, handleClick]);
- await onClick?.(event);
-
- if (close === 'after') {
- menuContext?.close(event, 'menuItemClick');
- }
- }
-
- const item = ;
+ const item = ;
if (tooltip) {
return {item};
diff --git a/packages/gui/src/components/notification/NotificationAnnouncementDialog.tsx b/packages/gui/src/components/notification/NotificationAnnouncementDialog.tsx
index 583139cef3..387af1c2b2 100644
--- a/packages/gui/src/components/notification/NotificationAnnouncementDialog.tsx
+++ b/packages/gui/src/components/notification/NotificationAnnouncementDialog.tsx
@@ -2,6 +2,7 @@ import { Flex, Link, DialogActions } from '@chia-network/core';
import { Trans } from '@lingui/macro';
import { Button, Dialog, DialogContent, DialogTitle, Typography } from '@mui/material';
import React from 'react';
+import isURL from 'validator/es/lib/isURL';
import useOpenUnsafeLink from '../../hooks/useOpenUnsafeLink';
@@ -15,17 +16,30 @@ export default function NotificationAnnouncementDialog(props: NotificationAnnoun
const openUnsafeLink = useOpenUnsafeLink();
- function handleClose() {
+ const handleClose = React.useCallback(() => {
onClose?.(false);
- }
+ }, [onClose]);
const message = 'message' in notification ? notification.message : undefined;
- const url = 'url' in notification ? notification.url : undefined;
+ const url = 'url' in notification && typeof notification.url === 'string' ? notification.url : undefined;
const from = 'from' in notification ? notification.from : undefined;
- async function handleURLClick() {
+ const handleURLClick = React.useCallback(() => {
+ if (!url) {
+ return;
+ }
openUnsafeLink(url);
- }
+ }, [url, openUnsafeLink]);
+
+ const urlLabel = React.useMemo(() => {
+ if (!url) {
+ return undefined;
+ }
+ if (!isURL(url)) {
+ return ##### Redacted for security reason #####;
+ }
+ return url;
+ }, [url]);
return (