From 1266003e37fbe03b9a2c48a2bba10755fec64efa Mon Sep 17 00:00:00 2001
From: Bin-Huang <tohuangbin@gmail.com>
Date: Thu, 9 Mar 2023 12:53:19 +0800
Subject: [PATCH] feat: version update checking(simple)

---
 src/devtools/App.tsx | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/devtools/App.tsx b/src/devtools/App.tsx
index 996c516c..6dc39010 100644
--- a/src/devtools/App.tsx
+++ b/src/devtools/App.tsx
@@ -4,7 +4,7 @@ import Block from './Block'
 import * as client from './client'
 import SessionItem from './SessionItem'
 import {
-    Toolbar, AppBar, Card, Box,
+    Toolbar, AppBar, Card, Box, Badge,
     List, ListSubheader, ListItem, ListItemButton, ListItemText, ListItemAvatar, MenuList,
     Avatar, IconButton, Button, Stack, Grid, MenuItem, ListItemIcon, Typography, Divider,
     Dialog, DialogContent, DialogActions, DialogTitle, DialogContentText, TextField,
@@ -24,6 +24,8 @@ const { useEffect, useState } = React
 function App() {
     const store = useStore()
 
+    const [needCheckUpdate, setNeedCheckUpdate] = useState(true)
+
     const listRef = useRef<any>(null)
     useEffect(() => {
         if (listRef.current) {
@@ -188,18 +190,22 @@ function App() {
                         </MenuItem>
 
                         <MenuItem onClick={() => {
+                            setNeedCheckUpdate(false)
                             openLink('https://github.com/Bin-Huang/chatbox/releases')
                         }}>
                             <ListItemIcon>
-                                <IconButton><InfoOutlinedIcon fontSize="small" /></IconButton>
+                                <IconButton>
+                                    <InfoOutlinedIcon fontSize="small" />
+                                </IconButton>
                             </ListItemIcon>
                             <ListItemText>
                                 <Typography color="GrayText">
-                                    Version: {store.version}
+                                    <Badge color="primary" variant="dot" invisible={!needCheckUpdate} sx={{ padding: '0 8px' }} >
+                                        Version: {store.version}
+                                    </Badge>
                                 </Typography>
                             </ListItemText>
                         </MenuItem>
-
                     </Stack>
 
                 </Grid>
@@ -276,7 +282,7 @@ function App() {
                     close={() => setOpenSettingWindow(false)}
                 />
             </Grid>
-        </Box>
+        </Box >
     );
 }
 
@@ -315,7 +321,7 @@ function MessageInput(props: {
                     flexDirection: 'column',
                 }} >
                     <Typography variant='button'>SEND</Typography>
-                    <Typography variant='caption' style={{opacity: 0.5}}>Ctrl↵</Typography>
+                    <Typography variant='caption' style={{ opacity: 0.5 }}>Ctrl↵</Typography>
                 </Button>
             </Stack>
         </form>