diff --git a/src/FilterLists.Web.V2/src/components/listsTable/ListsTable.tsx b/src/FilterLists.Web.V2/src/components/listsTable/ListsTable.tsx
index a86cdf68d..ca7dd9c64 100644
--- a/src/FilterLists.Web.V2/src/components/listsTable/ListsTable.tsx
+++ b/src/FilterLists.Web.V2/src/components/listsTable/ListsTable.tsx
@@ -1,4 +1,4 @@
-import { Table } from 'antd';
+import { Table, Tag } from 'antd';
import React from 'react';
import { RouteComponentProps } from 'react-router';
@@ -7,7 +7,7 @@ import { Language } from '../../interfaces/Language';
import { License } from '../../interfaces/License';
import { List } from '../../interfaces/List';
import { Software } from '../../interfaces/Software';
-import { Tag } from '../../interfaces/Tag';
+import { Tag as TagInterface } from '../../interfaces/Tag';
import { nameof } from '../../utils';
import { Description } from '../Description';
import { LanguageCloud } from '../languageCloud';
@@ -22,7 +22,7 @@ interface Props {
languages: Language[];
licenses: License[];
software: Software[];
- tags: Tag[];
+ tags: TagInterface[];
};
export const ListsTable = (props: RouteComponentProps & Props) => {
@@ -107,6 +107,16 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
sorter={(a, b) => arraySorter(a.languageIds, b.languageIds, languages)}
width={125}
className={styles.nogrow}
+ filters={languages.map(l => ({
+ text: <>
+ {l.iso6391}
+ {l.name}
+ >,
+ value: l.id.toString()
+ }))}
+ onFilter={(value, record) => record.languageIds
+ ? record.languageIds.includes(+value)
+ : false}
render={(languageIds: number[]) =>
languageIds
? languageIds.includes(l.id))} />
@@ -121,7 +131,7 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
className={styles.nogrow}
render={(tagIds: number[]) =>
tagIds
- ? tagIds.includes(t.id))} />
+ ? tagIds.includes(t.id))} />
: null} />}
);