diff --git a/src/components/Dashboard/Management/About.jsx b/src/components/Dashboard/Management/About.jsx
index a7022e48..e97fbeb0 100644
--- a/src/components/Dashboard/Management/About.jsx
+++ b/src/components/Dashboard/Management/About.jsx
@@ -21,7 +21,8 @@ import { AppUpdateContext } from '../context/AppUpdateContext'
import { useMediaQuery } from 'react-responsive'
import FarmControlAppIcon from '../../Logos/FarmControlAppIcon'
import SoftwareUpdateIcon from '../../Icons/SoftwareUpdateIcon'
-const { Title, Text, Link } = Typography
+import ExternalLink from '../common/ExternalLink'
+const { Title, Text } = Typography
const About = () => {
const [collapseState, updateCollapseState] = useCollapseState('About', {
@@ -171,11 +172,13 @@ const About = () => {
Development
)}
-
+
Jenkins
-
+
- GitHub
+
+ Git
+
diff --git a/src/components/Dashboard/common/ExternalLink.jsx b/src/components/Dashboard/common/ExternalLink.jsx
new file mode 100644
index 00000000..71e7295c
--- /dev/null
+++ b/src/components/Dashboard/common/ExternalLink.jsx
@@ -0,0 +1,40 @@
+import { useContext } from 'react'
+import PropTypes from 'prop-types'
+import { Typography } from 'antd'
+import { ElectronContext } from '../context/ElectronContext'
+
+const { Link } = Typography
+
+const ExternalLink = ({ href, children, onClick, ...props }) => {
+ const { isElectron, openExternalUrl } = useContext(ElectronContext)
+
+ const handleClick = (event) => {
+ onClick?.(event)
+ if (event.defaultPrevented) return
+
+ if (isElectron) {
+ event.preventDefault()
+ openExternalUrl(href)
+ }
+ }
+
+ return (
+
+ {children}
+
+ )
+}
+
+ExternalLink.propTypes = {
+ href: PropTypes.string.isRequired,
+ children: PropTypes.node,
+ onClick: PropTypes.func
+}
+
+export default ExternalLink
diff --git a/src/components/Dashboard/common/UrlDisplay.jsx b/src/components/Dashboard/common/UrlDisplay.jsx
index a48128c3..6328aa0c 100644
--- a/src/components/Dashboard/common/UrlDisplay.jsx
+++ b/src/components/Dashboard/common/UrlDisplay.jsx
@@ -4,8 +4,9 @@ import Tooltip from './Tooltip'
import LinkIcon from '../../Icons/LinkIcon'
import CopyButton from './CopyButton'
import ElipsisText from './ElipsisText'
+import ExternalLink from './ExternalLink'
-const { Text, Link } = Typography
+const { Text } = Typography
const UrlDisplay = ({ url, showCopy = true, showLink = false }) => {
if (!url) return n/a
@@ -14,10 +15,8 @@ const UrlDisplay = ({ url, showCopy = true, showLink = false }) => {
<>
{showLink ? (
- {
{url}
-
+
) : (
<>