UI Cleanup

This commit is contained in:
Joel Mathew Thomas
2025-03-18 16:11:42 +05:30
parent 7222a8198e
commit 84c848109f
+19 -5
View File
@@ -75,11 +75,11 @@ function ResultsPage() {
<Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', p: 4, bgcolor: 'rgba(0, 0, 0, 0.04)', borderRadius: 2 }}> <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', p: 4, bgcolor: 'rgba(0, 0, 0, 0.04)', borderRadius: 2 }}>
<VolumeUpIcon color="primary" sx={{ fontSize: 80, mb: 2 }} /> <VolumeUpIcon color="primary" sx={{ fontSize: 80, mb: 2 }} />
<Typography variant="h6" gutterBottom> <Typography variant="h6" gutterBottom>
{mediaFile.name} (Processed) {mediaFile.name} (Original)
</Typography> </Typography>
<Box sx={{ width: '100%', mt: 2, mb: 2 }}> <Box sx={{ width: '100%', mt: 2, mb: 2 }}>
<Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}> <Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}>
Original: {mediaFile.name} {mediaFile.name}
</Typography> </Typography>
<audio <audio
ref={mediaFileRef} ref={mediaFileRef}
@@ -89,7 +89,13 @@ function ResultsPage() {
/> />
</Box> </Box>
{audioClass === "Music" ? ( {audioClass === "Music" ? (
extractedFiles.map((file, index) => ( <>
<Box sx={{ width: '100%', mt: 2 }}>
<Typography variant="h6" color="textPrimary" sx={{ mb: 1 }}>
Processed Files
</Typography>
</Box>
{extractedFiles.map((file, index) => (
<Box key={index} sx={{ width: '100%', mt: 2 }}> <Box key={index} sx={{ width: '100%', mt: 2 }}>
<Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}> <Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}>
{file.name} {file.name}
@@ -101,8 +107,15 @@ function ResultsPage() {
controls controls
/> />
</Box> </Box>
)) ))}
</>
) : ( ) : (
<>
<Box sx={{ width: '100%', mt: 2 }}>
<Typography variant="h6" color="textPrimary" sx={{ mb: 1 }}>
Processed File
</Typography>
</Box>
<Box sx={{ width: '100%', mt: 2 }}> <Box sx={{ width: '100%', mt: 2 }}>
<Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}> <Typography variant="body2" color="textSecondary" sx={{ mb: 1 }}>
{mediaFile?.name} {mediaFile?.name}
@@ -114,6 +127,7 @@ function ResultsPage() {
controls controls
/> />
</Box> </Box>
</>
)} )}
</Box> </Box>
)} )}
@@ -127,7 +141,7 @@ function ResultsPage() {
File Details File Details
</Typography> </Typography>
<Typography variant="body2" color="textSecondary"> <Typography variant="body2" color="textSecondary">
<strong>Name:</strong> {mediaFile.name} (Processed) <strong>Name:</strong> {mediaFile.name}
</Typography> </Typography>
<Typography variant="body2" color="textSecondary"> <Typography variant="body2" color="textSecondary">
<strong>Type:</strong> {mediaFile.type} <strong>Type:</strong> {mediaFile.type}