feature: clickable filter link (#81)

web/src/screens/Dashboard.tsx

@@ -401,6 +401,12 @@ export function ReleaseCell({ value, column, row }: any) {
   )
 }
 
+export function IndexerCell({ value, column, row }: any) {
+    return (
+        <div className="text-sm font-medium text-gray-900 dark:text-gray-500" title={value}>{value}</div>
+    )
+}
+
 function Table({ columns, data }: any) {
   // Use the state and functions returned from useTable to build your UI
   const {
@@ -668,6 +674,7 @@ function DataTablee() {
     {
       Header: "Indexer",
       accessor: 'indexer',
+      Cell: IndexerCell,
       Filter: SelectColumnFilter,  // new
       filter: 'includes',
     },

web/src/screens/Releases.tsx

@@ -145,6 +145,12 @@ export function ReleaseStatusCell({ value, column, row }: ReleaseStatusCellProps
     )
 }
 
+export function IndexerCell({ value, column, row }: any) {
+    return (
+        <div className="text-sm font-medium text-gray-900 dark:text-gray-500" title={value}>{value}</div>
+    )
+}
+
 const initialState = {
     queryPageIndex: 0,
     queryPageSize: 10,
@@ -202,6 +208,7 @@ function Table() {
         {
             Header: "Indexer",
             accessor: 'indexer',
+            Cell: IndexerCell,
             Filter: SelectColumnFilter,  // new
             filter: 'includes',
         },

web/src/screens/filters/list.tsx

@@ -155,7 +155,11 @@ function FilterListItem({ filter, idx }: FilterListItemProps) {
                     />
                 </Switch>
             </td>
-            <td className="px-6 py-4 w-full whitespace-nowrap text-sm font-medium text-gray-900 dark:text-gray-100">{filter.name}</td>
+            <td className="px-6 w-full whitespace-nowrap text-sm font-medium text-gray-900 dark:text-gray-100">
+                <Link to={`filters/${filter.id.toString()}`} className="dark:hover:text-gray-400 w-full py-4 flex">
+                {filter.name}
+                </Link>
+                </td>
             <td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">{filter.indexers && filter.indexers.map(t =>
                 <span key={t.id} className="mr-2 inline-flex items-center px-2.5 py-0.5 rounded-md text-sm font-medium bg-gray-100 dark:bg-gray-800 text-gray-800 dark:text-gray-400">{t.name}</span>)}</td>
             <td className="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">