From a18380a999fc4599caffd7ebfd56f371060a0215 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mat=C3=ADas=20Garc=C3=ADa=20Isa=C3=ADa?=
 <mgarcia@manas.tech>
Date: Tue, 12 Nov 2024 16:36:51 -0300
Subject: [PATCH] Style Download CSV files modal

See #2350
---
 assets/css/_card-modal.scss                   | 26 +++++++++++++++++--
 .../respondents/RespondentIndex.jsx           |  7 ++---
 .../controllers/respondent_controller.ex      | 15 +++++------
 locales/template/translation.json             |  1 +
 4 files changed, 36 insertions(+), 13 deletions(-)

diff --git a/assets/css/_card-modal.scss b/assets/css/_card-modal.scss
index 8bbf58b20..f74da9e9b 100644
--- a/assets/css/_card-modal.scss
+++ b/assets/css/_card-modal.scss
@@ -120,8 +120,13 @@
         display: flex;
         align-items: center;
         .switch {
-          display: inline-block;
-          vertical-align: middle;
+          display: flex;
+          align-items: center;
+          gap: 0.5rem;
+          label {
+            display: flex;
+            align-items: center;
+          }
           .lever {
             margin-left: 0;
           }
@@ -129,6 +134,8 @@
             @extend .grey-text;
             font-size: 1rem;
             margin-right: 0.5rem;
+            display: flex;
+            white-space: nowrap;
           }
         }
         .link {
@@ -144,6 +151,7 @@
             vertical-align: middle;
             width: 98%;
             overflow: hidden;
+            text-overflow: ellipsis;
             display: inline-block;
           }
           .buttons {
@@ -171,6 +179,20 @@
         .btn-icon-grey {
           margin-left: initial;
         }
+
+        .file-generation {
+          display: flex;
+          align-items: center;
+          gap: 0.5rem;
+        }
+
+        a {
+          display: inline-flex;
+        }
+
+        .material-icons {
+          display: inline-flex;
+        }
       }
       div.link {
         @extend .grey-text;
diff --git a/assets/js/components/respondents/RespondentIndex.jsx b/assets/js/components/respondents/RespondentIndex.jsx
index 253af800f..b15dc6fa5 100644
--- a/assets/js/components/respondents/RespondentIndex.jsx
+++ b/assets/js/components/respondents/RespondentIndex.jsx
@@ -484,25 +484,26 @@ class RespondentIndex extends Component<Props, State> {
 
       const fileExists = !!fileStatus?.created_at
 
+      const downloadButtonTooltip = fileExists ? t("Download file") : t("File not yet generated")
       const downloadButtonClass = fileExists ? "black-text" : "grey-text"
       const downloadButtonOnClick = fileExists ? item.onDownload : null
       const createdAtLabel = fileExists ? <TimeAgo date={(fileStatus?.created_at || 0) * 1000} formatter={this.timeFormatter} /> : null
 
       const fileCreating = !!fileStatus?.creating
-      const generateButtonClass = fileCreating ? "btn-icon-grey" : "black-text"
+      const generateButtonClass = fileCreating ? "grey-text" : "black-text"
       const generateButtonOnClick = fileCreating ? null : item.onGenerate
       const generatingFileLabel = fileCreating ? "Generating..." : ""
 
       // TODO: we could avoid generating the whole section for files that are not the current one
       const downloadButton = !currentFile ? null : (
         <div className="file-download">
-          <Tooltip text={t("Download file")}>
+          <Tooltip text={downloadButtonTooltip}>
             <a className={downloadButtonClass} onClick={downloadButtonOnClick}>
               <i className="material-icons">get_app</i>
             </a>
           </Tooltip>
           <span className="">{t("Download last generated file")}</span>
-          <span className="grey-text">
+          <span className="grey-text file-generation">
             { createdAtLabel }
             { generatingFileLabel }
             <Tooltip text={t("Regenerate file")}>
diff --git a/lib/ask_web/controllers/respondent_controller.ex b/lib/ask_web/controllers/respondent_controller.ex
index 1a4d62c32..48663938b 100644
--- a/lib/ask_web/controllers/respondent_controller.ex
+++ b/lib/ask_web/controllers/respondent_controller.ex
@@ -748,12 +748,11 @@ defmodule AskWeb.RespondentController do
     render(conn, "status.json", status: status)
   end
 
-  defp file_redirection(conn, survey, file_type) do
+  defp serve_file(conn, survey, file_type) do
     file_url = SurveyResults.file_path(survey, file_type)
 
-    render(conn, "file-redirect.json",
-      file_url: "/#{file_url}" # TODO: there may be better ways of avoiding relative URLs
-    )
+    # FIME: /priv/static is probably temporary
+    send_file(conn, 200, "./priv/static/" <> file_url)
   end
 
   def results_csv(conn, %{"project_id" => project_id, "survey_id" => survey_id} = params) do
@@ -765,7 +764,7 @@ defmodule AskWeb.RespondentController do
 
     ActivityLog.download(project, conn, survey, "survey_results") |> Repo.insert()
 
-    file_redirection(conn, survey, {:respondents_results, filter})
+    serve_file(conn, survey, {:respondents_results, filter})
   end
 
   def generate_results(conn, %{"project_id" => project_id, "survey_id" => survey_id} = params) do
@@ -822,7 +821,7 @@ defmodule AskWeb.RespondentController do
 
     ActivityLog.download(project, conn, survey, "disposition_history") |> Repo.insert()
 
-    file_redirection(conn, survey, :disposition_history)
+    serve_file(conn, survey, :disposition_history)
   end
 
   def incentives(conn, %{"project_id" => project_id, "survey_id" => survey_id}) do
@@ -838,7 +837,7 @@ defmodule AskWeb.RespondentController do
 
     ActivityLog.download(project, conn, survey, "incentives") |> Repo.insert()
 
-    file_redirection(conn, survey, :incentives)
+    serve_file(conn, survey, :incentives)
   end
 
   def generate_incentives(conn, %{"project_id" => project_id, "survey_id" => survey_id}) do
@@ -864,7 +863,7 @@ defmodule AskWeb.RespondentController do
 
     ActivityLog.download(project, conn, survey, "interactions") |> Repo.insert()
 
-    file_redirection(conn, survey, :interactions)
+    serve_file(conn, survey, :interactions)
   end
 
   def generate_interactions(conn, %{"project_id" => project_id, "survey_id" => survey_id}) do
diff --git a/locales/template/translation.json b/locales/template/translation.json
index 969cef9bc..5d0131673 100644
--- a/locales/template/translation.json
+++ b/locales/template/translation.json
@@ -184,6 +184,7 @@
   "Fallback delay": "",
   "Fallback delay is invalid": "",
   "Fallback mode": "",
+  "File not yet generated": "",
   "Filter using the following format": "",
   "Filtered survey results": "",
   "Flag": "",