use png handler

resources/js/Pages/Dashboard.jsx

@@ -149,7 +149,7 @@ export default function Dashboard({ modelname }) {
               setOutputFilename(csv_filename);
               const file_response = await axios.get('/output-file-json/'+csv_filename);
               let shap_filename = csv_filename.replace("inference_output.csv", "shap_chart.png");
-              const shap_response = await axios.get('/output-file-bytes/'+shap_filename);
+              const shap_response = await axios.get('/output-file-png/'+shap_filename);
               // For the csv data used for histogram, store output as json instead of bytes.
               const x = 4;
               console.log('file_response', file_response);  
@@ -220,7 +220,7 @@ export default function Dashboard({ modelname }) {
               // Store file as json.
               setData(JSON.stringify(res.data));
                let shap_filename = csv_filename.replace("inference_output.csv", "shap_chart.png");
-              return axios.get('/output-file-bytes/'+shap_filename).then(res1 => {
+              return axios.get('/output-file-png/'+shap_filename).then(res1 => {
                 bytesToBase64(res1.data).then(blob => {
                   setShapImgBlob(blob);
                 });

routes/web.php

@@ -90,6 +90,7 @@ function () {
 // Since the filename may contain forward slashes, we have to explicitly use regex so Laravel can recognize this route.
 Route::middleware('auth')->get('/output-file-bytes/{filename}', [ApiController::class, 'fileBytes'])->where('filename','.*');
 Route::middleware('auth')->get('/output-file-json/{filename}', [ApiController::class, 'fileJson'])->where('filename','.*');
+Route::middleware('auth')->get('/output-file-png/{filename}', [ApiController::class, 'filePng'])->where('filename','.*');
 
 Route::middleware('auth')->get('/model/{model_name}', [ApiController::class, 'modelRuns']);
 // Data dictionary does not require logging in to view.