chore: lint
This commit is contained in:
amhsirak
@@ -96,186 +96,186 @@ export const NavBar: React.FC<NavBarProps> = ({ recordingName, isRecording }) =>
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{isUpdateAvailable && (
|
{isUpdateAvailable && (
|
||||||
<Snackbar
|
<Snackbar
|
||||||
open={true}
|
open={true}
|
||||||
message={`New version ${latestVersion} available! Click "Upgrade Maxun" to update.`}
|
message={`New version ${latestVersion} available! Click "Upgrade Maxun" to update.`}
|
||||||
action={
|
action={
|
||||||
<Button color="secondary" size="small" onClick={handleUpdateOpen}>
|
<Button color="secondary" size="small" onClick={handleUpdateOpen}>
|
||||||
Upgrade
|
Upgrade
|
||||||
</Button>
|
</Button>
|
||||||
}
|
}
|
||||||
/>
|
|
||||||
)}
|
|
||||||
<NavBarWrapper>
|
|
||||||
<div style={{
|
|
||||||
display: 'flex',
|
|
||||||
justifyContent: 'flex-start',
|
|
||||||
}}>
|
|
||||||
<img src={MaxunLogo} width={45} height={40} style={{ borderRadius: '5px', margin: '5px 0px 5px 15px' }} />
|
|
||||||
<div style={{ padding: '11px' }}><ProjectName>Maxun</ProjectName></div>
|
|
||||||
<Chip
|
|
||||||
label={`${currentVersion}`}
|
|
||||||
color="primary"
|
|
||||||
variant="outlined"
|
|
||||||
sx={{ marginTop: '10px' }}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
)}
|
||||||
{
|
<NavBarWrapper>
|
||||||
user ? (
|
<div style={{
|
||||||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end' }}>
|
display: 'flex',
|
||||||
{!isRecording ? (
|
justifyContent: 'flex-start',
|
||||||
<>
|
}}>
|
||||||
<Button variant="outlined" onClick={handleUpdateOpen} sx={{
|
<img src={MaxunLogo} width={45} height={40} style={{ borderRadius: '5px', margin: '5px 0px 5px 15px' }} />
|
||||||
marginRight: '40px',
|
<div style={{ padding: '11px' }}><ProjectName>Maxun</ProjectName></div>
|
||||||
color: "#00000099",
|
<Chip
|
||||||
border: "#00000099 1px solid",
|
label={`${currentVersion}`}
|
||||||
'&:hover': { color: '#ff00c3', border: '#ff00c3 1px solid' }
|
color="primary"
|
||||||
}}>
|
variant="outlined"
|
||||||
<Update sx={{ marginRight: '5px' }} /> Upgrade Maxun
|
sx={{ marginTop: '10px' }}
|
||||||
</Button>
|
/>
|
||||||
<Modal open={open} onClose={handleUpdateClose}>
|
</div>
|
||||||
<Box
|
{
|
||||||
sx={{
|
user ? (
|
||||||
position: "absolute",
|
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end' }}>
|
||||||
top: "50%",
|
{!isRecording ? (
|
||||||
left: "50%",
|
<>
|
||||||
transform: "translate(-50%, -50%)",
|
<Button variant="outlined" onClick={handleUpdateOpen} sx={{
|
||||||
width: 500,
|
marginRight: '40px',
|
||||||
bgcolor: "background.paper",
|
color: "#00000099",
|
||||||
boxShadow: 24,
|
border: "#00000099 1px solid",
|
||||||
p: 4,
|
'&:hover': { color: '#ff00c3', border: '#ff00c3 1px solid' }
|
||||||
borderRadius: 2,
|
}}>
|
||||||
}}
|
<Update sx={{ marginRight: '5px' }} /> Upgrade Maxun
|
||||||
>
|
</Button>
|
||||||
{latestVersion === null ? (
|
<Modal open={open} onClose={handleUpdateClose}>
|
||||||
<Typography>Checking for updates...</Typography>
|
<Box
|
||||||
) : currentVersion === latestVersion ? (
|
sx={{
|
||||||
<Typography variant="h6" textAlign="center">
|
position: "absolute",
|
||||||
🎉 You're up to date!
|
top: "50%",
|
||||||
</Typography>
|
left: "50%",
|
||||||
) : (
|
transform: "translate(-50%, -50%)",
|
||||||
<>
|
width: 500,
|
||||||
<Typography variant="body1" textAlign="left" sx={{ marginLeft: '30px' }}>
|
bgcolor: "background.paper",
|
||||||
A new version is available: {latestVersion}. Upgrade to the latest version for bug fixes, enhancements and new features!
|
boxShadow: 24,
|
||||||
<br />
|
p: 4,
|
||||||
View all the new updates
|
borderRadius: 2,
|
||||||
<a href="https://github.com/getmaxun/maxun/releases/" target="_blank" style={{ textDecoration: 'none' }}>{' '}here.</a>
|
}}
|
||||||
|
>
|
||||||
|
{latestVersion === null ? (
|
||||||
|
<Typography>Checking for updates...</Typography>
|
||||||
|
) : currentVersion === latestVersion ? (
|
||||||
|
<Typography variant="h6" textAlign="center">
|
||||||
|
🎉 You're up to date!
|
||||||
</Typography>
|
</Typography>
|
||||||
<Tabs
|
) : (
|
||||||
value={tab}
|
<>
|
||||||
onChange={handleUpdateTabChange}
|
<Typography variant="body1" textAlign="left" sx={{ marginLeft: '30px' }}>
|
||||||
sx={{ marginTop: 2, marginBottom: 2 }}
|
A new version is available: {latestVersion}. Upgrade to the latest version for bug fixes, enhancements and new features!
|
||||||
centered
|
<br />
|
||||||
>
|
View all the new updates
|
||||||
<Tab label="Manual Setup Upgrade" />
|
<a href="https://github.com/getmaxun/maxun/releases/" target="_blank" style={{ textDecoration: 'none' }}>{' '}here.</a>
|
||||||
<Tab label="Docker Compose Setup Upgrade" />
|
</Typography>
|
||||||
</Tabs>
|
<Tabs
|
||||||
{tab === 0 && (
|
value={tab}
|
||||||
<Box sx={{ marginLeft: '30px', background: '#cfd0d1', padding: 1, borderRadius: 3 }}>
|
onChange={handleUpdateTabChange}
|
||||||
<code style={{ color: 'black' }}>
|
sx={{ marginTop: 2, marginBottom: 2 }}
|
||||||
<p>Run the commands below</p>
|
centered
|
||||||
# pull latest changes
|
>
|
||||||
<br />
|
<Tab label="Manual Setup Upgrade" />
|
||||||
git pull origin master
|
<Tab label="Docker Compose Setup Upgrade" />
|
||||||
<br />
|
</Tabs>
|
||||||
<br />
|
{tab === 0 && (
|
||||||
# install dependencies
|
<Box sx={{ marginLeft: '30px', background: '#cfd0d1', padding: 1, borderRadius: 3 }}>
|
||||||
<br />
|
<code style={{ color: 'black' }}>
|
||||||
npm install
|
<p>Run the commands below</p>
|
||||||
<br />
|
# pull latest changes
|
||||||
<br />
|
<br />
|
||||||
# start maxun
|
git pull origin master
|
||||||
<br />
|
<br />
|
||||||
npm run start
|
<br />
|
||||||
</code>
|
# install dependencies
|
||||||
</Box>
|
<br />
|
||||||
)}
|
npm install
|
||||||
{tab === 1 && (
|
<br />
|
||||||
<Box sx={{ marginLeft: '30px', background: '#cfd0d1', padding: 1, borderRadius: 3 }}>
|
<br />
|
||||||
<code style={{ color: 'black' }}>
|
# start maxun
|
||||||
<p>Run the commands below</p>
|
<br />
|
||||||
# pull latest docker images
|
npm run start
|
||||||
<br />
|
</code>
|
||||||
docker-compose pull
|
</Box>
|
||||||
<br />
|
)}
|
||||||
<br />
|
{tab === 1 && (
|
||||||
# start maxun
|
<Box sx={{ marginLeft: '30px', background: '#cfd0d1', padding: 1, borderRadius: 3 }}>
|
||||||
<br />
|
<code style={{ color: 'black' }}>
|
||||||
docker-compose up -d
|
<p>Run the commands below</p>
|
||||||
</code>
|
# pull latest docker images
|
||||||
</Box>
|
<br />
|
||||||
)}
|
docker-compose pull
|
||||||
</>
|
<br />
|
||||||
)}
|
<br />
|
||||||
</Box>
|
# start maxun
|
||||||
</Modal>
|
<br />
|
||||||
<iframe src="https://ghbtns.com/github-btn.html?user=getmaxun&repo=maxun&type=star&count=true&size=large" frameBorder="0" scrolling="0" width="170" height="30" title="GitHub"></iframe>
|
docker-compose up -d
|
||||||
<IconButton onClick={handleMenuOpen} sx={{
|
</code>
|
||||||
display: 'flex',
|
</Box>
|
||||||
alignItems: 'center',
|
)}
|
||||||
borderRadius: '5px',
|
</>
|
||||||
padding: '8px',
|
)}
|
||||||
marginRight: '10px',
|
</Box>
|
||||||
'&:hover': { backgroundColor: 'white', color: '#ff00c3' }
|
</Modal>
|
||||||
}}>
|
<iframe src="https://ghbtns.com/github-btn.html?user=getmaxun&repo=maxun&type=star&count=true&size=large" frameBorder="0" scrolling="0" width="170" height="30" title="GitHub"></iframe>
|
||||||
<AccountCircle sx={{ marginRight: '5px' }} />
|
<IconButton onClick={handleMenuOpen} sx={{
|
||||||
<Typography variant="body1">{user.email}</Typography>
|
display: 'flex',
|
||||||
</IconButton>
|
alignItems: 'center',
|
||||||
<Menu
|
borderRadius: '5px',
|
||||||
anchorEl={anchorEl}
|
padding: '8px',
|
||||||
open={Boolean(anchorEl)}
|
marginRight: '10px',
|
||||||
onClose={handleMenuClose}
|
'&:hover': { backgroundColor: 'white', color: '#ff00c3' }
|
||||||
anchorOrigin={{
|
|
||||||
vertical: 'bottom',
|
|
||||||
horizontal: 'right',
|
|
||||||
}}
|
|
||||||
transformOrigin={{
|
|
||||||
vertical: 'top',
|
|
||||||
horizontal: 'right',
|
|
||||||
}}
|
|
||||||
PaperProps={{ sx: { width: '180px' } }}
|
|
||||||
>
|
|
||||||
<MenuItem onClick={() => { handleMenuClose(); logout(); }}>
|
|
||||||
<Logout sx={{ marginRight: '5px' }} /> Logout
|
|
||||||
</MenuItem>
|
|
||||||
<MenuItem onClick={() => {
|
|
||||||
window.open('https://discord.gg/5GbPjBUkws', '_blank');
|
|
||||||
}}>
|
}}>
|
||||||
<DiscordIcon sx={{ marginRight: '5px' }} /> Discord
|
<AccountCircle sx={{ marginRight: '5px' }} />
|
||||||
</MenuItem>
|
<Typography variant="body1">{user.email}</Typography>
|
||||||
<MenuItem onClick={() => {
|
</IconButton>
|
||||||
window.open('https://www.youtube.com/@MaxunOSS/videos?ref=app', '_blank');
|
<Menu
|
||||||
|
anchorEl={anchorEl}
|
||||||
|
open={Boolean(anchorEl)}
|
||||||
|
onClose={handleMenuClose}
|
||||||
|
anchorOrigin={{
|
||||||
|
vertical: 'bottom',
|
||||||
|
horizontal: 'right',
|
||||||
|
}}
|
||||||
|
transformOrigin={{
|
||||||
|
vertical: 'top',
|
||||||
|
horizontal: 'right',
|
||||||
|
}}
|
||||||
|
PaperProps={{ sx: { width: '180px' } }}
|
||||||
|
>
|
||||||
|
<MenuItem onClick={() => { handleMenuClose(); logout(); }}>
|
||||||
|
<Logout sx={{ marginRight: '5px' }} /> Logout
|
||||||
|
</MenuItem>
|
||||||
|
<MenuItem onClick={() => {
|
||||||
|
window.open('https://discord.gg/5GbPjBUkws', '_blank');
|
||||||
|
}}>
|
||||||
|
<DiscordIcon sx={{ marginRight: '5px' }} /> Discord
|
||||||
|
</MenuItem>
|
||||||
|
<MenuItem onClick={() => {
|
||||||
|
window.open('https://www.youtube.com/@MaxunOSS/videos?ref=app', '_blank');
|
||||||
|
}}>
|
||||||
|
<YouTube sx={{ marginRight: '5px' }} /> YouTube
|
||||||
|
</MenuItem>
|
||||||
|
<MenuItem onClick={() => {
|
||||||
|
window.open('https://x.com/maxun_io?ref=app', '_blank');
|
||||||
|
}}>
|
||||||
|
<X sx={{ marginRight: '5px' }} /> Twiiter (X)
|
||||||
|
</MenuItem>
|
||||||
|
</Menu>
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<IconButton onClick={goToMainMenu} sx={{
|
||||||
|
borderRadius: '5px',
|
||||||
|
padding: '8px',
|
||||||
|
background: 'red',
|
||||||
|
color: 'white',
|
||||||
|
marginRight: '10px',
|
||||||
|
'&:hover': { color: 'white', backgroundColor: 'red' }
|
||||||
}}>
|
}}>
|
||||||
<YouTube sx={{ marginRight: '5px' }} /> YouTube
|
<Clear sx={{ marginRight: '5px' }} />
|
||||||
</MenuItem>
|
Discard
|
||||||
<MenuItem onClick={() => {
|
</IconButton>
|
||||||
window.open('https://x.com/maxun_io?ref=app', '_blank');
|
<SaveRecording fileName={recordingName} />
|
||||||
}}>
|
</>
|
||||||
<X sx={{ marginRight: '5px' }} /> Twiiter (X)
|
)}
|
||||||
</MenuItem>
|
</div>
|
||||||
</Menu>
|
) : ""
|
||||||
</>
|
}
|
||||||
) : (
|
</NavBarWrapper>
|
||||||
<>
|
|
||||||
<IconButton onClick={goToMainMenu} sx={{
|
|
||||||
borderRadius: '5px',
|
|
||||||
padding: '8px',
|
|
||||||
background: 'red',
|
|
||||||
color: 'white',
|
|
||||||
marginRight: '10px',
|
|
||||||
'&:hover': { color: 'white', backgroundColor: 'red' }
|
|
||||||
}}>
|
|
||||||
<Clear sx={{ marginRight: '5px' }} />
|
|
||||||
Discard
|
|
||||||
</IconButton>
|
|
||||||
<SaveRecording fileName={recordingName} />
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
) : ""
|
|
||||||
}
|
|
||||||
</NavBarWrapper>
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user