49 lines
1.7 KiB
TypeScript
49 lines
1.7 KiB
TypeScript
import React from 'react'
|
|
import { Paper, Grid, IconButton, Button, Box } from '@mui/material';
|
|
import { SaveRecording } from "./SaveRecording";
|
|
import { Circle, Add, Logout, Clear } from "@mui/icons-material";
|
|
import { useGlobalInfoStore } from '../../context/globalInfo';
|
|
import { stopRecording } from "../../api/recording";
|
|
import { Link, useLocation, useNavigate } from 'react-router-dom';
|
|
|
|
|
|
const BrowserRecordingSave = () => {
|
|
const { recordingName, browserId, setBrowserId, notify } = useGlobalInfoStore();
|
|
const navigate = useNavigate();
|
|
|
|
const goToMainMenu = async () => {
|
|
if (browserId) {
|
|
await stopRecording(browserId);
|
|
notify('warning', 'Current Recording was terminated');
|
|
setBrowserId(null);
|
|
}
|
|
navigate('/');
|
|
};
|
|
|
|
return (
|
|
<Grid container>
|
|
<Grid item xs={12} md={3} lg={3}>
|
|
<div style={{
|
|
marginLeft: '10px',
|
|
color: 'white',
|
|
position: 'absolute',
|
|
background: '#ff00c3',
|
|
border: 'none',
|
|
padding: '7.5px',
|
|
width: 'calc(100% - 20px)', // Ensure it takes full width but with padding
|
|
bottom: 0,
|
|
overflow: 'hidden',
|
|
display: 'flex',
|
|
justifyContent: 'space-between',
|
|
}}>
|
|
<Button onClick={goToMainMenu} variant="outlined" sx={{ marginLeft: "20px" }} size="small" color="error">
|
|
Discard
|
|
</Button>
|
|
<SaveRecording fileName={recordingName} />
|
|
</div>
|
|
</Grid>
|
|
</Grid>
|
|
);
|
|
}
|
|
|
|
export default BrowserRecordingSave |