Auto Update feature added to start.js and EntrySection.js and update.…

…js made for dialog modal on start checking the availablity of update files
devomid · May 29, 2024 · ed17e8b · ed17e8b
1 parent ef120cb
commit ed17e8b
Show file tree

Hide file tree

Showing 9 changed files with 136 additions and 21 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -5,7 +5,7 @@
   "author": "Omid Azad",
   "main": "src/start.js",
   "name": "frontend",
-  "version": "2.0.1",
+  "version": "2.1.0",
   "private": false,
   "dependencies": {
     "@emotion/react": "^11.11.4",
@@ -17,6 +17,7 @@
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
+    "electron-log": "^5.1.5",
     "electron-updater": "^6.1.8",
     "eslint": "^8.57.0",
     "eslint-config-airbnb": "^19.0.4",
@@ -113,4 +114,4 @@
       "allowToChangeInstallationDirectory": true
     }
   }
-}
+}
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/icon.ico b/public/icon.ico
diff --git a/public/index.html b/public/index.html
@@ -3,7 +3,7 @@
 
 <head>
   <meta charset="utf-8" />
-  <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+  <link rel="icon" href="%PUBLIC_URL%/icon.ico" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta http-equiv="Content-Security-Policy" content="script-src 'self'" />
   <meta name="theme-color" content="#000000" />

diff --git a/src/App.js b/src/App.js
@@ -44,9 +44,6 @@ function App() {
               <EntrySection />
             </Box>
 
-
-
-
           </Box>
 
         </div>

diff --git a/src/dialogs/update.js b/src/dialogs/update.js
@@ -0,0 +1,68 @@
+import { Box, Button, CircularProgress, Dialog, DialogActions, DialogContent, DialogTitle, LinearProgress, Stack, Typography } from "@mui/material";
+import { useState } from "react";
+const { ipcRenderer } = window.require('electron');
+
+
+const UpdateModal = ({open, setOpen}) => {
+    const [text, setText] = useState('');
+    const [progress, setProgress] = useState(0);
+    const [total, setTotal] = useState(0);
+    const [speed, setSpeed] = useState(0);
+
+    ipcRenderer.on('updateMsg', (event, message) => {
+        if (message.type === 'availaible'){
+            setText('ورژن شما به روز نیست. کمی صبر کنید تا بروزرسانی انجام شود')
+        }
+    });
+
+    ipcRenderer.on('updateMsg', (event, message) => {
+        if (message.type === 'notAvailable'){
+            setText('ورژن شما به روز است و احتیاجی به بروزرسانی نیست')
+            setTimeout(() => {
+                setOpen(false)
+            }, 1500);
+        }
+    });
+
+    ipcRenderer.on('updateMsg', (event, message) => {
+        if (message.type === 'error'){
+            setText('مشکلی در بروزرسانی پیش اومده')
+        }
+    });
+
+    ipcRenderer.on('updateMsg', (event, message) => {
+        if (message.type === 'progress'){
+            setTotal(message.progressObj.total)
+            setProgress(message.progressObj.percent)
+            setSpeed(message.progressObj.bytesPerSecond)
+        }
+    });
+
+
+
+    return (
+        <Box>
+            <Dialog sx={{ backgroundColor: 'rgba(252, 243, 224, 0.6)', backdropFilter: 'blur(12px) saturate(180%)' }} open={open} keepMounted onClose={() => setOpen(false)}>
+            <DialogTitle sx={{display:'flex', justifyContent:"center", alignItems:'center'}}>
+                <Typography>
+                    بروز رسانی نرم افزار
+                </Typography>
+            </DialogTitle>
+            <DialogContent sx={{width:400, height:150}} dividers>
+                <Stack spacing={5}>
+                    <Box sx={{mt:2, mb:4, display:'flex', justifyContent:"center", alignItems:'center' }}>
+                        <Typography variant="subtitle2">{text}</Typography>
+                    </Box>
+
+                    <Box sx={{display:'flex', justifyContent:"center", alignItems:'center'}}>
+                        <CircularProgress color="info"/>
+                    </Box>
+                </Stack>
+
+            </DialogContent>
+            </Dialog>
+        </Box>
+    );
+}
+
+export default UpdateModal;
diff --git a/src/pages/EntrySection.js b/src/pages/EntrySection.js
diff --git a/src/start.js b/src/start.js
@@ -1,6 +1,10 @@
-const { app, BrowserWindow, autoUpdater } = require('electron')
+const { app, BrowserWindow} = require('electron')
 const { ipcMain } = require('electron')
 const { protocol } = require('electron');
+const {autoUpdater} = require('electron-updater');
+const log = require('electron-log');
+
+log.log("app ver: " + app.getVersion())
 
 const path = require('path')
 const url = require('url');
@@ -26,7 +30,7 @@ function createWindow() {
 
     mainWindow.setMenuBarVisibility(false)
 
-    mainWindow.webContents.openDevTools()
+    // mainWindow.webContents.openDevTools()
 
     mainWindow.loadURL(
         process.env.ELECTRON_START_URL ||
@@ -43,20 +47,42 @@ function createWindow() {
     })
 }
 
-app.on('ready', createWindow)
+app.on('ready', () => {
+    createWindow()
+    autoUpdater.checkForUpdatesAndNotify()
+})
+
 
-autoUpdater.on('update-available', () => {
-    mainWindow.webContents.send('update-available');
-});
+autoUpdater.on("checking-for-update", () => {
+    mainWindow.webContents.send('updateMsg', { type: 'checking' })
+})
+
+autoUpdater.on("update-available", () => {
+    mainWindow.webContents.send('updateMsg', {type: 'availaible'})
+})
+
+autoUpdater.on('update-not-available', () => {
+    mainWindow.webContents.send('updateMsg', {type: 'notAvailable'})
+})
+
+autoUpdater.on('error', (err) => {
+    log.info(err);
+    mainWindow.webContents.send('updateMsg', { type: 'error', data: err })
+})
 
-autoUpdater.on('download-progress', (progressObj) => {
-    mainWindow.webContents.send('download-progress', progressObj);
+autoUpdater.on("download-progress", (progressObj) => {
+    mainWindow.webContents.send('updateMsg', { type: 'progress', data: progressObj })
 });
 
-autoUpdater.on('update-downloaded', () => {
-    mainWindow.webContents.send('update-downloaded');
+autoUpdater.on('update-cancelled', () => {
+    mainWindow.webContents.send('updateMsg', {type: 'cancelled'})
+})
+
+autoUpdater.on("update-downloaded", () => {
+    mainWindow.webContents.send('updateMsg', {type: 'success'})
     autoUpdater.quitAndInstall()
-});
+})
+
 
 ipcMain.on('bye', () => {
     app.quit()
-Original file line number
+Diff line change
@@ Expand Up / @@ -44,9 +44,6 @@ function App() { @@
                   <EntrySection />
                 </Box>
               </Box>
             </div>
@@ Expand Down @@