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