From e6760d3dfc9ef24a5b685d2097ac822842ae4c12 Mon Sep 17 00:00:00 2001
From: Tom Butcher <thomasbutcher15@gmail.com>
Date: Sat, 1 Aug 2026 16:40:33 +0100
Subject: [PATCH] Add SoftwareUpdateIcon component and integrate into About and
 AppUpdateProgress

- Created SoftwareUpdateIcon component using SVG for software update representation.
- Replaced DownloadIcon with SoftwareUpdateIcon in the About component's update actions for better visual context.
- Enhanced AppUpdateProgress modal title with SoftwareUpdateIcon for improved user interface clarity.
- Updated imports and styling in relevant components to accommodate the new icon.
---
 assets/icons/softwareupdateicon.svg                       | 8 ++++++++
 src/components/Dashboard/Management/About.jsx             | 7 +++----
 .../Dashboard/Management/AppUpdates/AppUpdateProgress.jsx | 3 ++-
 src/components/Dashboard/context/AppUpdateContext.jsx     | 8 ++++++--
 src/components/Icons/SoftwareUpdateIcon.jsx               | 8 ++++++++
 5 files changed, 27 insertions(+), 7 deletions(-)
 create mode 100644 assets/icons/softwareupdateicon.svg
 create mode 100644 src/components/Icons/SoftwareUpdateIcon.jsx

diff --git a/assets/icons/softwareupdateicon.svg b/assets/icons/softwareupdateicon.svg
new file mode 100644
index 0000000..ebe6497
--- /dev/null
+++ b/assets/icons/softwareupdateicon.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(0.800063,0,0,0.800063,1,5.597937)">
+        <path d="M75.036,26.688L59.489,26.688C57.02,26.688 56.427,28.797 57.739,30.578L65.442,40.938C66.427,42.266 68.099,42.281 69.083,40.938L76.802,30.594C78.145,28.797 77.52,26.688 75.036,26.688ZM38.755,8.219C52.458,8.219 63.536,19.297 63.536,33.031C63.536,35.281 65.38,37.125 67.661,37.125C69.911,37.125 71.739,35.297 71.755,33.047C71.739,14.75 56.974,0 38.755,0C30.599,0 23.161,3.078 17.583,8.094C15.364,9.812 15.552,12.531 16.974,14.109C18.239,15.547 20.395,16.141 22.802,14.391C26.974,10.547 32.583,8.219 38.755,8.219ZM2.458,39.312L18.02,39.312C20.474,39.312 21.067,37.188 19.77,35.422L12.052,25.047C11.067,23.734 9.411,23.719 8.427,25.047L0.692,35.406C-0.651,37.188 -0.026,39.312 2.458,39.312ZM38.755,57.781C25.052,57.781 13.958,46.703 13.958,32.969C13.958,30.703 12.114,28.859 9.833,28.859C7.583,28.859 5.755,30.688 5.739,32.938C5.755,51.234 20.52,66 38.755,66C46.911,66 54.349,62.922 59.911,57.906C62.13,56.156 61.942,53.469 60.52,51.875C59.255,50.453 57.099,49.844 54.692,51.594C50.52,55.422 44.911,57.781 38.755,57.781Z" style="fill-rule:nonzero;"/>
+        <path d="M37.411,48.156L39.974,48.156C40.927,48.156 41.661,47.578 41.864,46.641L42.552,43.812C42.942,43.656 43.317,43.516 43.661,43.344L46.145,44.875C46.942,45.375 47.911,45.297 48.552,44.625L50.317,42.844C50.989,42.172 51.083,41.188 50.567,40.391L49.067,37.938C49.224,37.594 49.38,37.234 49.489,36.875L52.349,36.203C53.27,35.984 53.864,35.25 53.864,34.266L53.864,31.781C53.864,30.828 53.27,30.094 52.349,29.891L49.52,29.219C49.395,28.812 49.224,28.438 49.083,28.109L50.599,25.625C51.114,24.812 51.036,23.859 50.349,23.188L48.536,21.406C47.88,20.797 46.989,20.641 46.192,21.109L43.661,22.672C43.317,22.516 42.974,22.359 42.567,22.219L41.864,19.344C41.645,18.406 40.927,17.828 39.974,17.828L37.411,17.828C36.458,17.828 35.739,18.406 35.52,19.359L34.833,22.188C34.442,22.328 34.052,22.484 33.692,22.656L31.192,21.109C30.38,20.641 29.505,20.766 28.833,21.406L27.02,23.188C26.349,23.859 26.27,24.812 26.77,25.625L28.286,28.109C28.145,28.438 28.005,28.812 27.849,29.219L25.02,29.891C24.099,30.094 23.52,30.828 23.52,31.781L23.52,34.266C23.52,35.25 24.099,35.984 25.02,36.203L27.88,36.875C28.02,37.234 28.145,37.594 28.302,37.938L26.833,40.391C26.302,41.188 26.395,42.172 27.067,42.844L28.817,44.625C29.489,45.297 30.442,45.375 31.239,44.875L33.708,43.344C34.067,43.516 34.442,43.656 34.833,43.812L35.52,46.641C35.739,47.578 36.458,48.156 37.411,48.156ZM38.692,37.797C36.02,37.797 33.849,35.641 33.849,32.969C33.849,30.312 36.02,28.125 38.692,28.125C41.349,28.125 43.52,30.312 43.52,32.969C43.52,35.641 41.349,37.797 38.692,37.797Z" style="fill-rule:nonzero;"/>
+    </g>
+</svg>
diff --git a/src/components/Dashboard/Management/About.jsx b/src/components/Dashboard/Management/About.jsx
index b460d92..6c3257a 100644
--- a/src/components/Dashboard/Management/About.jsx
+++ b/src/components/Dashboard/Management/About.jsx
@@ -21,6 +21,7 @@ import { ElectronContext } from '../context/ElectronContext'
 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
 
 const About = () => {
@@ -53,7 +54,7 @@ const About = () => {
     actions.unshift(
       {
         label: 'Check for Updates',
-        icon: <DownloadIcon />,
+        icon: <SoftwareUpdateIcon />,
         onClick: checkForUpdates
       },
       { type: 'divider' }
@@ -126,9 +127,7 @@ const About = () => {
             collapseKey='purchaseOrderStats'
           >
             <Flex gap='large'>
-              <FarmControlAppIcon
-                style={{ width: '200px', height: '200px' }}
-              />
+              <FarmControlAppIcon style={{ width: '200px', height: '200px' }} />
               <Flex vertical gap='small' justify='center'>
                 <Flex gap='middle' align='center'>
                   <Title level={2} style={{ margin: 0 }}>
diff --git a/src/components/Dashboard/Management/AppUpdates/AppUpdateProgress.jsx b/src/components/Dashboard/Management/AppUpdates/AppUpdateProgress.jsx
index 8fe8d15..482c3f8 100644
--- a/src/components/Dashboard/Management/AppUpdates/AppUpdateProgress.jsx
+++ b/src/components/Dashboard/Management/AppUpdates/AppUpdateProgress.jsx
@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types'
 import { useState } from 'react'
-import { Button, Flex, Modal, Progress, Typography, theme } from 'antd'
+import { Button, Flex, Modal, Progress, Typography, theme, Divider } from 'antd'
 
 import CloudIcon from '../../../Icons/CloudIcon'
 import HostIcon from '../../../Icons/HostIcon'
@@ -188,6 +188,7 @@ const AppUpdateProgress = ({ progress, update, onClose }) => {
         {update?.branch ? `${update.branch}` : 'unknown'}...
       </Text>
 
+      <Divider style={{ margin: '4px 0' }} />
       <Flex vertical gap='middle'>
         <UpdateStage
           stage='download'
diff --git a/src/components/Dashboard/context/AppUpdateContext.jsx b/src/components/Dashboard/context/AppUpdateContext.jsx
index 91bf26f..dbcea60 100644
--- a/src/components/Dashboard/context/AppUpdateContext.jsx
+++ b/src/components/Dashboard/context/AppUpdateContext.jsx
@@ -7,7 +7,7 @@ import {
   useState
 } from 'react'
 import PropTypes from 'prop-types'
-import { Button, Modal, Space, Typography } from 'antd'
+import { Button, Modal, Space, Typography, Flex } from 'antd'
 import { LoadingOutlined } from '@ant-design/icons'
 import { version as appVersion } from '../../../../package.json'
 import { ApiServerContext } from './ApiServerContext'
@@ -15,6 +15,7 @@ import { AuthContext } from './AuthContext'
 import { ElectronContext } from './ElectronContext'
 import NewAppUpdate from '../Management/AppUpdates/NewAppUpdate'
 import AppUpdateProgress from '../Management/AppUpdates/AppUpdateProgress'
+import SoftwareUpdateIcon from '../../Icons/SoftwareUpdateIcon'
 
 const { Text } = Typography
 
@@ -310,7 +311,10 @@ export const AppUpdateProvider = ({ children }) => {
       </Modal>
       <Modal
         title={
-          installingUpdate ? 'Software Update' : 'Software Update Available'
+          <Flex align='center' gap='middle'>
+            <SoftwareUpdateIcon style={{ fontSize: 18 }} />
+            {installingUpdate ? 'Software Update' : 'Software Update Available'}
+          </Flex>
         }
         open={updateModalOpen}
         footer={null}
diff --git a/src/components/Icons/SoftwareUpdateIcon.jsx b/src/components/Icons/SoftwareUpdateIcon.jsx
new file mode 100644
index 0000000..546a8e5
--- /dev/null
+++ b/src/components/Icons/SoftwareUpdateIcon.jsx
@@ -0,0 +1,8 @@
+import Icon from '@ant-design/icons'
+import CustomIconSvg from '../../../assets/icons/softwareupdateicon.svg?react'
+
+const SoftwareUpdateIcon = (props) => (
+  <Icon component={CustomIconSvg} {...props} />
+)
+
+export default SoftwareUpdateIcon