New: Write metadata to tags, with UI for previewing changes (#633)

frontend/src/Activity/History/Details/HistoryDetails.js

@@ -7,6 +7,8 @@ import DescriptionList from 'Components/DescriptionList/DescriptionList';
 import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
 import DescriptionListItemTitle from 'Components/DescriptionList/DescriptionListItemTitle';
 import DescriptionListItemDescription from 'Components/DescriptionList/DescriptionListItemDescription';
+import { icons } from 'Helpers/Props';
+import Icon from 'Components/Icon';
 import styles from './HistoryDetails.css';
 
 function getDetailedList(statusMessages) {
@@ -36,6 +38,19 @@ function getDetailedList(statusMessages) {
   );
 }
 
+function formatMissing(value) {
+  if (value === undefined || value === 0 || value === '0') {
+    return (<Icon name={icons.BAN} size={12} />);
+  }
+  return value;
+}
+
+function formatChange(oldValue, newValue) {
+  return (
+    <div> {formatMissing(oldValue)} <Icon name={icons.ARROW_RIGHT_NO_CIRCLE} size={12} /> {formatMissing(newValue)} </div>
+  );
+}
+
 function HistoryDetails(props) {
   const {
     eventType,
@@ -259,6 +274,37 @@ function HistoryDetails(props) {
     );
   }
 
+  if (eventType === 'trackFileRetagged') {
+    const {
+      diff,
+      tagsScrubbed
+    } = data;
+
+    return (
+      <DescriptionList>
+        <DescriptionListItem
+          title="Path"
+          data={sourceTitle}
+        />
+        {
+          JSON.parse(diff).map(({ field, oldValue, newValue }) => {
+            return (
+              <DescriptionListItem
+                key={field}
+                title={field}
+                data={formatChange(oldValue, newValue)}
+              />
+            );
+          })
+        }
+        <DescriptionListItem
+          title="Existing tags scrubbed"
+          data={tagsScrubbed === 'True' ? <Icon name={icons.CHECK} /> : <Icon name={icons.REMOVE} />}
+        />
+      </DescriptionList>
+    );
+  }
+
   if (eventType === 'albumImportIncomplete') {
     const {
       statusMessages

frontend/src/Activity/History/Details/HistoryDetailsModal.js

@@ -23,6 +23,8 @@ function getHeaderTitle(eventType) {
       return 'Track File Deleted';
     case 'trackFileRenamed':
       return 'Track File Renamed';
+    case 'trackFileRetagged':
+      return 'Track File Tags Updated';
     case 'albumImportIncomplete':
       return 'Album Import Incomplete';
     case 'downloadImported':

frontend/src/Activity/History/HistoryEventTypeCell.js

@@ -19,6 +19,8 @@ function getIconName(eventType) {
       return icons.DELETE;
     case 'trackFileRenamed':
       return icons.ORGANIZE;
+    case 'trackFileRetagged':
+      return icons.RETAG;
     case 'albumImportIncomplete':
       return icons.DOWNLOADED;
     case 'downloadImported':
@@ -53,6 +55,8 @@ function getTooltip(eventType, data) {
       return 'Track file deleted';
     case 'trackFileRenamed':
       return 'Track file renamed';
+    case 'trackFileRetagged':
+      return 'Track file tags updated';
     case 'albumImportIncomplete':
       return 'Files downloaded but not all could be imported';
     case 'downloadImported':