Add external links for indexer history

frontend/src/App/State/HistoryAppState.ts

@@ -1,8 +1,10 @@
 import AppSectionState from 'App/State/AppSectionState';
+import Column from 'Components/Table/Column';
 import History from 'typings/History';
 
 interface HistoryAppState extends AppSectionState<History> {
   pageSize: number;
+  columns: Column[];
 }
 
 export default HistoryAppState;

frontend/src/History/HistoryRowParameter.js

@@ -1,43 +0,0 @@
-import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import styles from './HistoryRowParameter.css';
-
-class HistoryRowParameter extends Component {
-
-  //
-  // Render
-
-  render() {
-    const {
-      title,
-      value
-    } = this.props;
-
-    return (
-      <div className={styles.parameter}>
-        <div className={styles.info}>
-          <span>
-            {
-              title
-            }
-          </span>
-        </div>
-
-        <div
-          className={styles.value}
-        >
-          {
-            value
-          }
-        </div>
-      </div>
-    );
-  }
-}
-
-HistoryRowParameter.propTypes = {
-  title: PropTypes.string.isRequired,
-  value: PropTypes.string.isRequired
-};
-
-export default HistoryRowParameter;

frontend/src/History/HistoryRowParameter.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import Link from 'Components/Link/Link';
+import styles from './HistoryRowParameter.css';
+
+interface HistoryRowParameterProps {
+  title: string;
+  value: string;
+}
+
+function HistoryRowParameter(props: HistoryRowParameterProps) {
+  const { title, value } = props;
+
+  const type = title.toLowerCase();
+
+  let link = null;
+
+  if (type === 'imdb') {
+    link = <Link to={`https://imdb.com/title/${value}/`}>{value}</Link>;
+  } else if (type === 'tmdb') {
+    link = (
+      <Link to={`https://www.themoviedb.org/movie/${value}`}>{value}</Link>
+    );
+  } else if (type === 'tvdb') {
+    link = (
+      <Link to={`https://www.thetvdb.com/?tab=series&id=${value}`}>
+        {value}
+      </Link>
+    );
+  } else if (type === 'tvmaze') {
+    link = <Link to={`https://www.tvmaze.com/shows/${value}/_`}>{value}</Link>;
+  }
+
+  return (
+    <div className={styles.parameter}>
+      <div className={styles.info}>
+        <span>{title}</span>
+      </div>
+
+      <div className={styles.value}>{link ? link : value}</div>
+    </div>
+  );
+}
+
+export default HistoryRowParameter;

frontend/src/Indexer/Info/History/IndexerHistoryRow.tsx

@@ -67,7 +67,7 @@ function IndexerHistoryRow(props: IndexerHistoryRowProps) {
               <HistoryRowParameter
                 key={parameter.key}
                 title={parameter.title}
-                value={data[parameter.key as keyof HistoryData]}
+                value={data[parameter.key as keyof HistoryData].toString()}
               />
             );
           })}