front/src/requests/download.tsx

import React, { useState } from 'react';
import axios from 'axios';


const AudioDownloader = () => {

  const [downloadUrl, setDownloadUrl] = useState<string | null>(null);

  const fileId = localStorage.getItem('uploadId');
  console.log('Retrieved Upload ID:', fileId); 


  const handleDownload = async () => {
    try {
      const server = import.meta.env.VITE_API_URL;

      const response = await axios.get(`${server}/download/${fileId}`);
      
      // Assuming the response.data contains the URL
      const url = response.data.url;

      

      // Set the download URL in the state
      setDownloadUrl(`${server}/${url}`);
    } catch (error) {
      console.error('Error fetching download URL:', error);
    }
  };

  const handleClear = () => {
    // Clear the download URL from the state
    setDownloadUrl(null);
  };

  return (
    <div>
      <button onClick={handleDownload}>Download Audio</button>
      {downloadUrl && (
        <div>
          <a href={downloadUrl} download={`downloadUrl`}>
            Download Link
          </a>
          <button onClick={handleClear}>Clear Download Link</button>
        </div>
      )}
    </div>
  );
};

export default AudioDownloader;