diff --git a/src/FilterLists.Web.V2/src/components/LicenseTag.tsx b/src/FilterLists.Web.V2/src/components/LicenseTag.tsx
index ff752dbaa..c96f25892 100644
--- a/src/FilterLists.Web.V2/src/components/LicenseTag.tsx
+++ b/src/FilterLists.Web.V2/src/components/LicenseTag.tsx
@@ -18,12 +18,7 @@ export const LicenseTag = (props: Props) =>
>
: null;
-interface TagContentsProps {
- name: string;
- descriptionUrl: string;
-};
-
-const TagContents = (props: TagContentsProps) =>
+const TagContents = (props: Props) =>
props.descriptionUrl
? {
-
+ {props.license &&
+ }
+ {props.syntax &&
+ }
diff --git a/src/FilterLists.Web.V2/src/components/SyntaxTag.tsx b/src/FilterLists.Web.V2/src/components/SyntaxTag.tsx
new file mode 100644
index 000000000..ccf9d174c
--- /dev/null
+++ b/src/FilterLists.Web.V2/src/components/SyntaxTag.tsx
@@ -0,0 +1,30 @@
+import { Tag } from 'antd';
+import * as React from 'react';
+
+interface Props {
+ name: string;
+ definitionUrl: string;
+};
+
+export const SyntaxTag = (props: Props) =>
+ props.name
+ ? <>
+ Syntax:
+
+
+
+ >
+ : null;
+
+const TagContents = (props: Props) =>
+ props.definitionUrl
+ ?
+ {props.name}
+
+ : <>
+ {props.name}
+ >;
\ No newline at end of file
diff --git a/src/FilterLists.Web.V2/src/components/listsTable/ListDrawer.tsx b/src/FilterLists.Web.V2/src/components/listsTable/ListDrawer.tsx
index 81a3224e8..3cb1ae641 100644
--- a/src/FilterLists.Web.V2/src/components/listsTable/ListDrawer.tsx
+++ b/src/FilterLists.Web.V2/src/components/listsTable/ListDrawer.tsx
@@ -5,6 +5,7 @@ import { Language } from '../../interfaces/Language';
import { License } from '../../interfaces/License';
import { List } from '../../interfaces/List';
import { Software } from '../../interfaces/Software';
+import { Syntax } from '../../interfaces/Syntax';
import { Tag } from '../../interfaces/Tag';
import { ListInfoDrawer } from '../ListInfoDrawer';
@@ -13,6 +14,7 @@ interface Props {
languages: Language[];
licenses: License[];
software: Software[];
+ syntaxes: Syntax[];
tags: Tag[];
};
@@ -23,8 +25,9 @@ export const ListDrawer = (props: Props) => {
? list.languageIds.includes(l.id))}
- license={(list.licenseId ? props.licenses.find((l: License) => list.licenseId === l.id) : props.licenses.find((l: License) => l.id === 5)) as License}
+ license={list.licenseId ? props.licenses.find((l: License) => list.licenseId === l.id) : props.licenses.find((l: License) => l.id === 5)}
software={list.syntaxId ? props.software.filter((s: Software) => s.syntaxIds.includes(list.syntaxId)) : []}
+ syntax={list.syntaxId ? props.syntaxes.find(s => s.id === list.syntaxId) : undefined}
tags={list.tagIds && props.tags.filter((t: Tag) => list.tagIds.includes(t.id))}
{...rp} />
: (props.lists && props.lists.length && ) || null;
diff --git a/src/FilterLists.Web.V2/src/components/listsTable/ListsTableHoc.tsx b/src/FilterLists.Web.V2/src/components/listsTable/ListsTableHoc.tsx
index e176c2c1e..1c0c39481 100644
--- a/src/FilterLists.Web.V2/src/components/listsTable/ListsTableHoc.tsx
+++ b/src/FilterLists.Web.V2/src/components/listsTable/ListsTableHoc.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import { RouteComponentProps } from 'react-router-dom';
-import { useLanguages, useLicenses, useLists, useSoftware, useTags } from '../../hooks';
+import { useLanguages, useLicenses, useLists, useSoftware, useSyntaxes, useTags } from '../../hooks';
import { ListDrawer } from './ListDrawer';
import { ListsTable } from './ListsTable';
@@ -10,6 +10,7 @@ export const ListsTableHoc = (props: RouteComponentProps) => {
const languages = useLanguages();
const licenses = useLicenses();
const software = useSoftware();
+ const syntaxes = useSyntaxes();
const tags = useTags();
return (
<>
@@ -25,6 +26,7 @@ export const ListsTableHoc = (props: RouteComponentProps) => {
languages={languages}
licenses={licenses}
software={software}
+ syntaxes={syntaxes}
tags={tags} />
>
);
diff --git a/src/FilterLists.Web.V2/src/hooks/index.ts b/src/FilterLists.Web.V2/src/hooks/index.ts
index 019cb850b..97fc591b9 100644
--- a/src/FilterLists.Web.V2/src/hooks/index.ts
+++ b/src/FilterLists.Web.V2/src/hooks/index.ts
@@ -2,7 +2,16 @@ import { useLanguages } from './useLanguages';
import { useLicenses } from './useLicenses';
import { useLists } from './useLists';
import { useSoftware } from './useSoftware';
+import { useSyntaxes } from './useSyntaxes';
import { useTablePageSizer } from './useTablePageSizer';
import { useTags } from './useTags';
-export { useLanguages, useLicenses, useLists, useSoftware, useTablePageSizer, useTags };
\ No newline at end of file
+export {
+ useLanguages,
+ useLicenses,
+ useLists,
+ useSoftware,
+ useSyntaxes,
+ useTablePageSizer,
+ useTags
+};
\ No newline at end of file
diff --git a/src/FilterLists.Web.V2/src/hooks/useSyntaxes.tsx b/src/FilterLists.Web.V2/src/hooks/useSyntaxes.tsx
new file mode 100644
index 000000000..24415f461
--- /dev/null
+++ b/src/FilterLists.Web.V2/src/hooks/useSyntaxes.tsx
@@ -0,0 +1,4 @@
+import { Syntax } from '../interfaces/Syntax';
+import { useApiData } from './useApiData';
+
+export const useSyntaxes = () => useApiData("/api/v1/syntaxes") || [];
\ No newline at end of file
diff --git a/src/FilterLists.Web.V2/src/interfaces/Syntax.ts b/src/FilterLists.Web.V2/src/interfaces/Syntax.ts
new file mode 100644
index 000000000..c2eea02d4
--- /dev/null
+++ b/src/FilterLists.Web.V2/src/interfaces/Syntax.ts
@@ -0,0 +1,7 @@
+export interface Syntax {
+ id: number;
+ definitionUrl: string;
+ filterListIds: number[];
+ name: string;
+ softwareIds: number[];
+};
\ No newline at end of file