TorrentListColumns: add "Finished" column (#565)

client/src/javascript/components/torrent-list/SortDropdown.tsx

@@ -21,6 +21,7 @@ const SORT_PROPERTIES = [
   'upTotal',
   'sizeBytes',
   'dateAdded',
+  'dateFinished',
 ] as const;
 
 interface SortDropdownProps {

client/src/javascript/components/torrent-list/TorrentListCell.tsx

@@ -5,6 +5,7 @@ import {observer} from 'mobx-react';
 import {Trans, useLingui} from '@lingui/react';
 
 import {
+  CalendarFinished,
   CalendarCreated,
   Calendar,
   CheckmarkThick,
@@ -40,6 +41,7 @@ const ICONS: Partial<Record<TorrentListColumn, JSX.Element>> = {
   hash: <Hash />,
   dateAdded: <Calendar />,
   dateCreated: <CalendarCreated />,
+  dateFinished: <CalendarFinished />,
   isPrivate: <Lock />,
   message: <TrackerMessage />,
   percentComplete: <DownloadThick />,
@@ -116,6 +118,8 @@ const DefaultTorrentListCellContent: FC<TorrentListCellContentProps> = observer(
         return <DateCell date={torrent[column]} />;
       case 'dateCreated':
         return <DateCell date={torrent[column]} />;
+      case 'dateFinished':
+        return <DateCell date={torrent[column]} />;
       case 'downRate':
         return <Size value={torrent[column]} isSpeed />;
       case 'upRate':

client/src/javascript/constants/SortDirections.ts

@@ -2,6 +2,7 @@
 
 const SortDirections: Record<string, 'asc' | 'desc'> = {
   dateAdded: 'desc',
+  dateFinished: 'desc',
   downRate: 'desc',
   downTotal: 'desc',
   upRate: 'desc',

client/src/javascript/constants/TorrentListColumns.ts

@@ -1,5 +1,6 @@
 const TorrentListColumns = {
   dateAdded: 'torrents.properties.date.added',
+  dateFinished: 'torrents.properties.date.finished',
   downRate: 'torrents.properties.download.speed',
   downTotal: 'torrents.properties.download.total',
   eta: 'torrents.properties.eta',

client/src/javascript/i18n/strings/en.json

@@ -346,6 +346,7 @@
   "torrents.properties.comment": "Comment",
   "torrents.properties.date.added": "Added",
   "torrents.properties.date.created": "Created",
+  "torrents.properties.date.finished": "Finished",
   "torrents.properties.directory": "Location",
   "torrents.properties.download.speed": "Download Speed",
   "torrents.properties.download.total": "Downloaded",

client/src/javascript/ui/icons/CalendarFinished.tsx

@@ -0,0 +1,18 @@
+import classnames from 'classnames';
+import {FC, memo} from 'react';
+
+interface CalendarFinishedProps {
+  className?: string;
+}
+
+const CalendarFinished: FC<CalendarFinishedProps> = memo(({className}: CalendarFinishedProps) => (
+  <svg className={classnames('icon', 'icon--calendarFinished', className)} viewBox="0 0 60 60">
+    <path d="M436 160H12c-6.627 0-12-5.373-12-12v-36c0-26.51 21.49-48 48-48h48V12c0-6.627 5.373-12 12-12h40c6.627 0 12 5.373 12 12v52h128V12c0-6.627 5.373-12 12-12h40c6.627 0 12 5.373 12 12v52h48c26.51 0 48 21.49 48 48v36c0 6.627-5.373 12-12 12zM12 192h424c6.627 0 12 5.373 12 12v260c0 26.51-21.49 48-48 48H48c-26.51 0-48-21.49-48-48V204c0-6.627 5.373-12 12-12zm333.296 95.947l-28.169-28.398c-4.667-4.705-12.265-4.736-16.97-.068L194.12 364.665l-45.98-46.352c-4.667-4.705-12.266-4.736-16.971-.068l-28.397 28.17c-4.705 4.667-4.736 12.265-.068 16.97l82.601 83.269c4.667 4.705 12.265 4.736 16.97.068l142.953-141.805c4.705-4.667 4.736-12.265.068-16.97z" />
+  </svg>
+));
+
+CalendarFinished.defaultProps = {
+  className: undefined,
+};
+
+export default CalendarFinished;

client/src/javascript/ui/icons/index.tsx

@@ -3,6 +3,7 @@ export {default as Add} from './Add';
 export {default as AddMini} from './AddMini';
 export {default as All} from './All';
 export {default as Arrow} from './Arrow';
+export {default as CalendarFinished} from './CalendarFinished';
 export {default as CalendarCreated} from './CalendarCreated';
 export {default as Calendar} from './Calendar';
 export {default as Checkmark} from './Checkmark';