Merge pull request #46 from amhsirak/develop

feat: show record & exit options based on user session
This commit is contained in:
Karishma Shukla
2024-09-30 16:08:36 +05:30
committed by GitHub

View File

@@ -61,69 +61,71 @@ export const NavBar = ({ newRecording, recordingName, isRecording }: NavBarProps
<RecordingIcon /> <RecordingIcon />
<div style={{ padding: '11px' }}><ProjectName>Maxun</ProjectName></div> <div style={{ padding: '11px' }}><ProjectName>Maxun</ProjectName></div>
</div> </div>
<div style={{ {
display: 'flex', user !== null ? (
justifyContent: 'flex-end', <>
}}> <div style={{
<IconButton display: 'flex',
aria-label="new" justifyContent: 'flex-end',
size={"small"} }}>
onClick={handleNewRecording} <IconButton
sx={{ aria-label="new"
width: isRecording ? '100px' : '130px', size={"small"}
borderRadius: '5px', onClick={handleNewRecording}
padding: '8px', sx={{
background: 'white', width: isRecording ? '100px' : '130px',
color: 'rgba(255,0,0,0.7)', borderRadius: '5px',
marginRight: '10px', padding: '8px',
fontFamily: '"Roboto","Helvetica","Arial",sans-serif', background: 'white',
fontWeight: '500', color: 'rgba(255,0,0,0.7)',
fontSize: '0.875rem', marginRight: '10px',
lineHeight: '1.75', fontFamily: '"Roboto","Helvetica","Arial",sans-serif',
letterSpacing: '0.02857em', fontWeight: '500',
'&:hover': { color: 'red', backgroundColor: 'white' } fontSize: '0.875rem',
} lineHeight: '1.75',
} letterSpacing: '0.02857em',
> '&:hover': { color: 'red', backgroundColor: 'white' }
<Circle sx={{ marginRight: '5px' }} /> {isRecording ? 'NEW' : 'RECORD'} }
</IconButton> }
{ >
recordingLength > 0 <Circle sx={{ marginRight: '5px' }} /> {isRecording ? 'NEW' : 'RECORD'}
? <SaveRecording fileName={recordingName} /> </IconButton>
: null {
} recordingLength > 0
{isRecording ? <Button sx={{ ? <SaveRecording fileName={recordingName} />
width: '100px', : null
background: '#fff',
color: 'rgba(25, 118, 210, 0.7)',
padding: '9px',
marginRight: '19px',
'&:hover': {
background: 'white',
color: 'rgb(25, 118, 210)',
}
}} onClick={goToMainMenu}>
<MeetingRoomIcon sx={{ marginRight: '5px' }} />
exit</Button>
: null}
{
user !== null ? (
<Button sx={{
width: '100px',
background: '#fff',
color: 'rgba(25, 118, 210, 0.7)',
padding: '9px',
marginRight: '19px',
'&:hover': {
background: 'white',
color: 'rgb(25, 118, 210)',
} }
}} onClick={logout}> {isRecording ? <Button sx={{
<MeetingRoomIcon sx={{ marginRight: '5px' }} /> width: '100px',
logout</Button> background: '#fff',
) : "" color: 'rgba(25, 118, 210, 0.7)',
} padding: '9px',
</div> marginRight: '19px',
'&:hover': {
background: 'white',
color: 'rgb(25, 118, 210)',
}
}} onClick={goToMainMenu}>
<MeetingRoomIcon sx={{ marginRight: '5px' }} />
exit</Button>
: null}
<Button sx={{
width: '100px',
background: '#fff',
color: 'rgba(25, 118, 210, 0.7)',
padding: '9px',
marginRight: '19px',
'&:hover': {
background: 'white',
color: 'rgb(25, 118, 210)',
}
}} onClick={logout}>
<MeetingRoomIcon sx={{ marginRight: '5px' }} />
logout</Button>
</div>
</>
) : ""
}
</NavBarWrapper> </NavBarWrapper>
); );