Show User Agent in System->Tasks for externally triggered commands (#6327)

* Show User Agent in System->Tasks for externally triggered commands

(cherry picked from commit fe8f319f7bfdadb7218b6313ada6cae1d2a35ad8)

* Translations

Co-authored-by: Taloth Saldono <Taloth@users.noreply.github.com>

frontend/src/System/Tasks/Queued/QueuedTaskRow.css

@@ -10,6 +10,15 @@
   width: 100%;
 }
 
+.commandName {
+  display: inline-block;
+  min-width: 220px;
+}
+
+.userAgent {
+  color: #b0b0b0;
+}
+
 .queued,
 .started,
 .ended {

frontend/src/System/Tasks/Queued/QueuedTaskRow.js

@@ -157,6 +157,7 @@ class QueuedTaskRow extends Component {
       status,
       duration,
       message,
+      clientUserAgent,
       longDateFormat,
       timeFormat,
       onCancelPress
@@ -192,7 +193,17 @@ class QueuedTaskRow extends Component {
           </span>
         </TableRowCell>
 
-        <TableRowCell>{commandName}</TableRowCell>
+        <TableRowCell>
+          <span className={styles.commandName}>
+            {commandName}
+          </span>
+          {
+            clientUserAgent &&
+              <span className={styles.userAgent} title={translate('TaskUserAgentTooltip')}>
+                {translate('from')}: {clientUserAgent}
+              </span>
+          }
+        </TableRowCell>
 
         <TableRowCell
           className={styles.queued}
@@ -256,6 +267,7 @@ QueuedTaskRow.propTypes = {
   status: PropTypes.string.isRequired,
   duration: PropTypes.string,
   message: PropTypes.string,
+  clientUserAgent: PropTypes.string,
   showRelativeDates: PropTypes.bool.isRequired,
   shortDateFormat: PropTypes.string.isRequired,
   longDateFormat: PropTypes.string.isRequired,