Display protocol for indexers in UI

frontend/src/Settings/Indexers/Indexers/Indexer.tsx

@@ -1,4 +1,5 @@
 import React, { useCallback, useState } from 'react';
+import ProtocolLabel from 'Activity/Queue/ProtocolLabel';
 import Card from 'Components/Card';
 import Label from 'Components/Label';
 import IconButton from 'Components/Link/IconButton';
@@ -19,6 +20,7 @@ interface IndexerProps extends IndexerModel {
 function Indexer({
   id,
   name,
+  protocol,
   enableRss,
   enableAutomaticSearch,
   enableInteractiveSearch,
@@ -79,6 +81,8 @@ function Indexer({
       </div>
 
       <div className={styles.enabled}>
+        <ProtocolLabel protocol={protocol} />
+
         {supportsRss && enableRss ? (
           <Label kind={kinds.SUCCESS}>{translate('Rss')}</Label>
         ) : null}

frontend/src/Settings/Indexers/Indexers/Manage/ManageIndexersModalContent.tsx

@@ -39,6 +39,12 @@ const COLUMNS: Column[] = [
     isSortable: true,
     isVisible: true,
   },
+  {
+    name: 'protocol',
+    label: () => translate('Protocol'),
+    isSortable: true,
+    isVisible: true,
+  },
   {
     name: 'implementation',
     label: () => translate('Implementation'),

frontend/src/Settings/Indexers/Indexers/Manage/ManageIndexersModalRow.css

@@ -1,4 +1,5 @@
 .name,
+.protocol,
 .tags,
 .enableRss,
 .enableAutomaticSearch,

frontend/src/Settings/Indexers/Indexers/Manage/ManageIndexersModalRow.css.d.ts

@@ -7,6 +7,7 @@ interface CssExports {
   'implementation': string;
   'name': string;
   'priority': string;
+  'protocol': string;
   'seasonSearchMaximumSingleEpisodeAge': string;
   'tags': string;
 }

frontend/src/Settings/Indexers/Indexers/Manage/ManageIndexersModalRow.tsx

@@ -1,4 +1,5 @@
 import React, { useCallback } from 'react';
+import ProtocolLabel from 'Activity/Queue/ProtocolLabel';
 import { useSelect } from 'App/Select/SelectContext';
 import Label from 'Components/Label';
 import SeriesTagList from 'Components/SeriesTagList';
@@ -6,6 +7,7 @@ import TableRowCell from 'Components/Table/Cells/TableRowCell';
 import TableSelectCell from 'Components/Table/Cells/TableSelectCell';
 import Column from 'Components/Table/Column';
 import TableRow from 'Components/Table/TableRow';
+import DownloadProtocol from 'DownloadClient/DownloadProtocol';
 import { kinds } from 'Helpers/Props';
 import { IndexerModel } from 'Settings/Indexers/useIndexers';
 import { SelectStateInputProps } from 'typings/props';
@@ -15,6 +17,7 @@ import styles from './ManageIndexersModalRow.css';
 interface ManageIndexersModalRowProps {
   id: number;
   name: string;
+  protocol: DownloadProtocol;
   enableRss: boolean;
   enableAutomaticSearch: boolean;
   enableInteractiveSearch: boolean;
@@ -29,6 +32,7 @@ function ManageIndexersModalRow(props: ManageIndexersModalRowProps) {
   const {
     id,
     name,
+    protocol,
     enableRss,
     enableAutomaticSearch,
     enableInteractiveSearch,
@@ -62,6 +66,10 @@ function ManageIndexersModalRow(props: ManageIndexersModalRowProps) {
 
       <TableRowCell className={styles.name}>{name}</TableRowCell>
 
+      <TableRowCell className={styles.protocol}>
+        <ProtocolLabel protocol={protocol} />
+      </TableRowCell>
+
       <TableRowCell className={styles.implementation}>
         {implementation}
       </TableRowCell>