CEC-3863: Link azure file download (#309)

Co-authored-by: Alexander Andrews <aandrews@fiskerinc.com>

src/components/Controls/TRexLogs/index.jsx

@@ -140,7 +140,7 @@ const TRexLogsTable = ({ vin, token, classes }) => {
     return pageSize * pageIndex + pageSize
   }
   const getReadPercentage = () => {
-    return (currentOffset * 100 / blobSize).toFixed(2);
+    return (currentOffset * 100 / blobSize);
   }
   const getFilteredLogs = (logs) => {
     return logs.filter(log => currectLogLevels[log.level] === true)
@@ -182,6 +182,19 @@ const TRexLogsTable = ({ vin, token, classes }) => {
     return fetched
   }
 
+  const downloadFile = async () => {
+    let day = formatTwoDigit(selectedDate.getDate())
+    let month = formatTwoDigit(selectedDate.getMonth() + 1)// 0 Indexed
+    let year = selectedDate.getFullYear()
+
+    let result = await api.getLogFileLink({ vin, year, month, day }, token)
+    window.open(result['Link'], '_blank')
+  }
+
+  const formatTwoDigit = (num) => {
+    return num < 10 ? '0' + num : '' + num
+  }
+
   useEffect(() => {
     (async () => {
       try {
@@ -267,10 +280,11 @@ const TRexLogsTable = ({ vin, token, classes }) => {
               />
             </MuiPickersUtilsProvider>
           </TableCell>
+
           <TableCell align="center">
             {
               blobSize === 0 ? `No logs for ${fromatDateForRequest(selectedDate)}` :
-                `Read ${getReadPercentage()}% of logs`
+                `Read ${getReadPercentage().toFixed(2)}% of logs`
             }
             {
               <LinearProgress
@@ -278,6 +292,8 @@ const TRexLogsTable = ({ vin, token, classes }) => {
                 align="center"
                 value={getReadPercentage()} />
             }
+            <br></br>
+            <button onClick={downloadFile} disabled={blobSize === 0}>Download Log File</button>
           </TableCell>
         </TableRow>
       </Table>

src/services/vehiclesAPI.js

@@ -197,6 +197,18 @@ const vehiclesAPI = {
       .then(fetchRespHandler)
       .catch(errorHandler)
   },
+
+  getLogFileLink: async ({vin, year, month, day}, token) => {
+      const u = `${API_ENDPOINT}/vehicle/${vin}/trex-logs-link?year=${year}&month=${month}&day=${day}`
+      return fetch(u, {
+        method: "GET",
+        headers: Object.assign(
+          { "Content-Type": "application/json" },
+          getAuthHeaderOptions(token)
+        ),
+      }).then(fetchRespHandler)
+      .catch(errorHandler)
+  },
 };
 
 export default vehiclesAPI;