UI Cleanup
This commit is contained in:
@@ -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}
|
||||||
|
|||||||
Reference in New Issue
Block a user