lint all GUI for consistency

This commit is contained in:
Collin M. Barrett 2018-09-27 17:39:58 -05:00
parent 4a2e49cbf3
commit 898e37269d
46 changed files with 362 additions and 396 deletions

View file

@ -4,7 +4,7 @@ import "./site.css";
interface IProps {
children?: React.ReactNode;
}
};
export const Layout = (props: IProps) =>
<div className="container">

View file

@ -26,26 +26,26 @@ export class HomeContainer extends React.Component<{}, IState> {
}
componentDidMount() {
this.fetchLists();
this.fetchLanguages();
this.fetchLists();
this.fetchMaintainers();
this.fetchSoftware();
this.fetchTags();
this.fetchRuleCount();
};
fetchLists() {
fetch("https://filterlists.com/api/v1/lists")
.then(r => r.json() as Promise<IList[]>)
.then(p => { this.setState({ lists: p }); });
};
fetchLanguages() {
fetch("https://filterlists.com/api/v1/languages")
.then(r => r.json() as Promise<ILanguage[]>)
.then(p => { this.setState({ languages: p }); });
};
fetchLists() {
fetch("https://filterlists.com/api/v1/lists")
.then(r => r.json() as Promise<IList[]>)
.then(p => { this.setState({ lists: p }); });
};
fetchMaintainers() {
fetch("https://filterlists.com/api/v1/maintainers")
.then(r => r.json() as Promise<IMaintainer[]>)

View file

@ -4,18 +4,17 @@ import { InfoCard } from "./infoCard";
import { LinkButtonGroup } from "./LinkButtonGroup";
import { MaintainersInfoCard } from "./maintainersInfoCard";
export const DetailsExpander = (props: IListDetails) => {
return <div className="card border-primary">
<div className="card-body p-2">
<div className="container m-0">
<div className="row">
<InfoCard {...props}/>
<LinkButtonGroup {...props}/>
</div>
<div className="row">
<MaintainersInfoCard maintainers={props.maintainers}/>
</div>
</div>
</div>
</div>;
};
export const DetailsExpander = (props: IListDetails) =>
<div className="card border-primary">
<div className="card-body p-2">
<div className="container m-0">
<div className="row">
<InfoCard {...props}/>
<LinkButtonGroup {...props}/>
</div>
<div className="row">
<MaintainersInfoCard maintainers={props.maintainers}/>
</div>
</div>
</div>
</div>;

View file

@ -6,10 +6,10 @@ import { DetailsExpander } from "./DetailsExpander";
interface IProps {
list: IListDetails;
}
};
interface IState {
}
};
export class DetailsExpanderContainer extends React.Component<IProps, IState> {
constructor(props: IProps) {
@ -22,4 +22,4 @@ export class DetailsExpanderContainer extends React.Component<IProps, IState> {
? <DetailsExpander {...this.props.list}/>
: <div className="loader">Loading...</div>;;
}
}
};

View file

@ -24,21 +24,21 @@ export interface IListDetails {
updatedDate: string;
viewUrl: string;
viewUrlMirrors: string[];
}
};
export interface IListLicense {
descriptionUrl: string;
name: string;
}
};
export interface IListSyntax {
definitionUrl: string;
name: string;
supportedSoftware: ISyntaxSupportedSoftware[];
}
};
export interface ISyntaxSupportedSoftware {
homeUrl: string;
id: number;
name: string;
}
};

View file

@ -24,19 +24,18 @@ interface IProps {
submissionUrl: string;
viewUrl: string;
viewUrlMirrors: string[];
}
};
export const LinkButtonGroup = (props: IProps) => {
return <div className="col-3 p-0 btn-group-vertical justify-content-start d-flex align-items-end">
<SubscribeButtonGroup name={props.name} url={props.viewUrl} urlMirrors={props.viewUrlMirrors}/>
<ViewButtonGroup name={props.name} url={props.viewUrl} urlMirrors={props.viewUrlMirrors}/>
<HomeButton name={props.name} url={props.homeUrl}/>
<PolicyButton name={props.name} url={props.policyUrl}/>
<DonateButton name={props.name} url={props.donateUrl}/>
<IssuesButton name={props.name} url={props.issuesUrl}/>
<ForumButton name={props.name} url={props.forumUrl}/>
<ChatButton name={props.name} url={props.chatUrl}/>
<SubmitButton name={props.name} url={props.submissionUrl}/>
<EmailButton name={props.name} emailAddress={props.emailAddress}/>
</div>;
};
export const LinkButtonGroup = (props: IProps) =>
<div className="col-3 p-0 btn-group-vertical justify-content-start d-flex align-items-end">
<SubscribeButtonGroup name={props.name} url={props.viewUrl} urlMirrors={props.viewUrlMirrors}/>
<ViewButtonGroup name={props.name} url={props.viewUrl} urlMirrors={props.viewUrlMirrors}/>
<HomeButton name={props.name} url={props.homeUrl}/>
<PolicyButton name={props.name} url={props.policyUrl}/>
<DonateButton name={props.name} url={props.donateUrl}/>
<IssuesButton name={props.name} url={props.issuesUrl}/>
<ForumButton name={props.name} url={props.forumUrl}/>
<ChatButton name={props.name} url={props.chatUrl}/>
<SubmitButton name={props.name} url={props.submissionUrl}/>
<EmailButton name={props.name} emailAddress={props.emailAddress}/>
</div>;

View file

@ -4,14 +4,13 @@ import "./description.css";
interface IProps {
description: string;
url: string;
}
};
export const Description = (props: IProps) => {
return props.description
? <h3 className="card-header fl-description">
{props.url
? <blockquote cite={props.url} className="m-0">{props.description}</blockquote>
: props.description}
</h3>
: null;
};
export const Description = (props: IProps) =>
props.description
? <h3 className="card-header fl-description">
{props.url
? <blockquote cite={props.url} className="m-0">{props.description}</blockquote>
: props.description}
</h3>
: null;

View file

@ -3,12 +3,11 @@ import * as moment from "moment";
interface IProps {
date: string;
}
};
export const DiscontinuedDate = (props: IProps) => {
return props.date
? <li className="list-group-item">
<p>Discontinued: {moment(props.date).format("l")}</p>
</li>
: null;
};
export const DiscontinuedDate = (props: IProps) =>
props.date
? <li className="list-group-item">
<p>Discontinued: {moment(props.date).format("l")}</p>
</li>
: null;

View file

@ -24,18 +24,17 @@ interface IProps {
syntax: IListSyntax;
tags: ITag[];
updatedDate: string;
}
};
export const InfoCard = (props: IProps) => {
return <div className="col-9">
export const InfoCard = (props: IProps) =>
<div className="col-9">
<TagGroup tags={props.tags}/>
<div className="d-md-none">
{props.syntax
? props.syntax.supportedSoftware.map(
(s: ISyntaxSupportedSoftware, i: number) =>
<a href={s.homeUrl} key={i}>
<SoftwareIcon id={s.id} key={i}/>
</a>)
(s: ISyntaxSupportedSoftware, i: number) => <a href={s.homeUrl} key={i}>
<SoftwareIcon id={s.id} key={i}/>
</a>)
: null}
</div>
<Description {...props} url={props.descriptionSourceUrl}/>
@ -48,5 +47,4 @@ export const InfoCard = (props: IProps) => {
<Syntax {...props.syntax}/>
<License {...props.license}/>
</ul>
</div>;
};
</div>;

View file

@ -3,19 +3,18 @@ import { ILanguage } from "../../../interfaces";
interface IProps {
languages: ILanguage[];
}
};
export const Languages = (props: IProps) => {
return props.languages && props.languages.length > 0
? props.languages.length > 1
? <li className="list-group-item">
<p className="m-0">Languages:</p>
<ul>
{props.languages.map((language: ILanguage, i: number) => <li key={i}>{language.name}</li>)}
</ul>
</li>
: <li className="list-group-item">
<p>Language: {props.languages[0].name}</p>
</li>
: null;
};
export const Languages = (props: IProps) =>
props.languages && props.languages.length > 0
? props.languages.length > 1
? <li className="list-group-item">
<p className="m-0">Languages:</p>
<ul>
{props.languages.map((language: ILanguage, i: number) => <li key={i}>{language.name}</li>)}
</ul>
</li>
: <li className="list-group-item">
<p>Language: {props.languages[0].name}</p>
</li>
: null;

View file

@ -1,14 +1,13 @@
import * as React from "react";
import { IListLicense as IListLicenseDto } from "../IListDetails";
export const License = (props: IListLicenseDto) => {
return props.name
? (props.descriptionUrl
? <li className="list-group-item">
<p>License: <a href={props.descriptionUrl}>{props.name}</a></p>
</li>
: <li className="list-group-item">
<p>License: {props.name}</p>
</li>)
: null;
};
export const License = (props: IListLicenseDto) =>
props.name
? (props.descriptionUrl
? <li className="list-group-item">
<p>License: <a href={props.descriptionUrl}>{props.name}</a></p>
</li>
: <li className="list-group-item">
<p>License: {props.name}</p>
</li>)
: null;

View file

@ -3,12 +3,11 @@ import * as moment from "moment";
interface IProps {
date: string;
}
};
export const PublishedDate = (props: IProps) => {
return props.date
? <li className="list-group-item">
<p>Published: {moment(props.date).format("l")}</p>
</li>
: null;
};
export const PublishedDate = (props: IProps) =>
props.date
? <li className="list-group-item">
<p>Published: {moment(props.date).format("l")}</p>
</li>
: null;

View file

@ -2,12 +2,11 @@ import * as React from "react";
interface IProps {
ruleCount: number;
}
};
export const RuleCount = (props: IProps) => {
return props.ruleCount > 0
? <li className="list-group-item">
<p>Rule Count: {props.ruleCount.toLocaleString()}</p>
</li>
: null;
};
export const RuleCount = (props: IProps) =>
props.ruleCount > 0
? <li className="list-group-item">
<p>Rule Count: {props.ruleCount.toLocaleString()}</p>
</li>
: null;

View file

@ -1,14 +1,13 @@
import * as React from "react";
import { IListSyntax as IListSyntaxDto } from "../IListDetails";
export const Syntax = (props: IListSyntaxDto) => {
return props.name
? (props.definitionUrl
? <li className="list-group-item">
<p>Syntax: <a href={props.definitionUrl}>{props.name}</a></p>
</li>
: <li className="list-group-item">
<p>Syntax: {props.name}</p>
</li>)
: null;
};
export const Syntax = (props: IListSyntaxDto) =>
props.name
? (props.definitionUrl
? <li className="list-group-item">
<p>Syntax: <a href={props.definitionUrl}>{props.name}</a></p>
</li>
: <li className="list-group-item">
<p>Syntax: {props.name}</p>
</li>)
: null;

View file

@ -4,16 +4,15 @@ import * as moment from "moment";
interface IProps {
discontinuedDate: string;
updatedDate: string;
}
};
export const UpdatedDate = (props: IProps) => {
return props.discontinuedDate
? null
: props.updatedDate
? <li className="d-md-none list-group-item">
<p>Updated: {moment(props.updatedDate).isValid()
? moment(props.updatedDate).format("l")
: "N/A"}</p>
</li>
: null;
};
export const UpdatedDate = (props: IProps) =>
props.discontinuedDate
? null
: props.updatedDate
? <li className="d-md-none list-group-item">
<p>Updated: {moment(props.updatedDate).isValid()
? moment(props.updatedDate).format("l")
: "N/A"}</p>
</li>
: null;

View file

@ -3,11 +3,11 @@ import * as React from "react";
//interface IProps {
// name: string;
// additionalLists: IMaintainerAdditionalListDto[];
//}
//};
export const MaintainerAdditionalLists = (/*props: IProps*/) => {
return <div className="col-9">
{ /*props.additionalLists && props.additionalLists.length > 0
export const MaintainerAdditionalLists = (/*props: IProps*/) =>
<div className="col-9">
{ /*props.additionalLists && props.additionalLists.length > 0
? <div>
<h4>More by {props.name}:</h4>
<ul>
@ -17,5 +17,4 @@ export const MaintainerAdditionalLists = (/*props: IProps*/) => {
</div>
: null*/ }
</div>;
};
</div>;

View file

@ -5,7 +5,7 @@ import { MaintainerLinkButtonGroup } from "./MaintainerLinkButtonGroup";
interface IProps {
maintainer: IMaintainer;
}
};
export const MaintainerInfoCard = (props: IProps) =>
props.maintainer.name

View file

@ -6,7 +6,7 @@ interface IProps {
homeUrl: string;
name: string;
twitterHandle: string;
}
};
export const MaintainerLinkButtonGroup = (props: IProps) =>
<div className="col-3 p-0 btn-group-vertical justify-content-start d-flex align-items-end" role="group">

View file

@ -4,7 +4,7 @@ import { MaintainerInfoCard } from "./MaintainerInfoCard";
interface IProps {
maintainers: IMaintainer[];
}
};
export const MaintainersInfoCard = (props: IProps) =>
props.maintainers && props.maintainers.length > 0

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
url: string;
}
};
export const ChatButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`Enter the chat room for ${props.name}.`}
text="Chat"/>
: null;
};;
export const ChatButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`Enter the chat room for ${props.name}.`}
text="Chat"/>
: null;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
url: string;
}
};
export const DonateButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`Donate to ${props.name}.`}
text="Donate"/>
: null;
};
export const DonateButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`Donate to ${props.name}.`}
text="Donate"/>
: null;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
emailAddress: string;
}
};
export const EmailButton = (props: IProps) => {
return props.emailAddress
? <LinkButton href={`mailto:${props.emailAddress}`}
title={`Email ${props.name}.`}
text="Email"/>
: null;
};
export const EmailButton = (props: IProps) =>
props.emailAddress
? <LinkButton href={`mailto:${props.emailAddress}`}
title={`Email ${props.name}.`}
text="Email"/>
: null;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
url: string;
}
};
export const ForumButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`View the forum for ${props.name}.`}
text="Forum"/>
: null;
};
export const ForumButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`View the forum for ${props.name}.`}
text="Forum"/>
: null;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
url: string;
}
};
export const HomeButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`View ${props.name}'s homepage.`}
text="Home"/>
: null;
};
export const HomeButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`View ${props.name}'s homepage.`}
text="Home"/>
: null;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
url: string;
}
};
export const IssuesButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`View the GitHub Issues for ${props.name}.`}
text="GH Issues"/>
: null;
};
export const IssuesButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`View the GitHub Issues for ${props.name}.`}
text="GH Issues"/>
: null;

View file

@ -6,14 +6,13 @@ interface IProps {
title?: string;
buttonClass?: string;
text: string;
}
};
export const LinkButton = (props: IProps) => {
return props.href
? <a href={props.href}
title={props.title}
className={`btn ${props.buttonClass || "btn-primary"} fl-btn-link`}>
{props.text}
</a>
: null;
};
export const LinkButton = (props: IProps) =>
props.href
? <a href={props.href}
title={props.title}
className={`btn ${props.buttonClass || "btn-primary"} fl-btn-link`}>
{props.text}
</a>
: null;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
url: string;
}
};
export const PolicyButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`View the types of rules that ${props.name} includes.`}
text="Policy"/>
: null;
};
export const PolicyButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`View the types of rules that ${props.name} includes.`}
text="Policy"/>
: null;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
url: string;
}
};
export const SubmitButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`Submit a new rule to be included in ${props.name}.`}
text="Submit"/>
: null;
};
export const SubmitButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`Submit a new rule to be included in ${props.name}.`}
text="Submit"/>
: null;

View file

@ -5,7 +5,7 @@ interface IProps {
name: string;
url: string;
text?: string;
}
};
export const SubscribeButton = (props: IProps) => {
let buttonClass: string | undefined;

View file

@ -5,21 +5,21 @@ interface IProps {
name: string;
url: string;
urlMirrors?: string[];
}
export const SubscribeButtonGroup = (props: IProps) => {
return props.url
? (props.urlMirrors && props.urlMirrors.length > 0)
? <SubscribeButtonGroupDropdown {...props} urlMirrors={props.urlMirrors}/>
: <SubscribeButton {...props}/>
: null;
};
export const SubscribeButtonGroup = (props: IProps) =>
props.url
? (props.urlMirrors && props.urlMirrors.length > 0)
? <SubscribeButtonGroupDropdown {...props} urlMirrors={props
.urlMirrors}/>
: <SubscribeButton {...props}/>
: null;
interface ISubscribeButtonGroupDropdownProps {
name: string;
url: string;
urlMirrors: string[];
}
};
const SubscribeButtonGroupDropdown = (props: ISubscribeButtonGroupDropdownProps) => {
let firstButtonText: string = "Original";
@ -41,13 +41,12 @@ const SubscribeButtonGroupDropdown = (props: ISubscribeButtonGroupDropdownProps)
</div>;
};
const BtnGroupDropSubscribe = () => {
return <button id="btnGroupDropSubscribe"
type="button"
className="btn btn-primary dropdown-toggle"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false">
Subscribe
</button>;
};
const BtnGroupDropSubscribe = () =>
<button id="btnGroupDropSubscribe"
type="button"
className="btn btn-primary dropdown-toggle"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false">
Subscribe
</button>;

View file

@ -4,12 +4,11 @@ import { LinkButton } from "./LinkButton";
interface IProps {
name: string;
twitterHandle: string;
}
};
export const TwitterButton = (props: IProps) => {
return props.twitterHandle
? <LinkButton href={`https://twitter.com/${props.twitterHandle}`}
title={`View ${props.name}'s Twitter profile.`}
text="Twitter"/>
: null;
};
export const TwitterButton = (props: IProps) =>
props.twitterHandle
? <LinkButton href={`https://twitter.com/${props.twitterHandle}`}
title={`View ${props.name}'s Twitter profile.`}
text="Twitter"/>
: null;

View file

@ -5,12 +5,11 @@ interface IProps {
name: string;
url: string;
text?: string;
}
};
export const ViewButton = (props: IProps) => {
return props.url
? <LinkButton href={props.url}
title={`View ${props.name} in its raw format.`}
text={props.text || "View"}/>
: null;
};
export const ViewButton = (props: IProps) =>
props.url
? <LinkButton href={props.url}
title={`View ${props.name} in its raw format.`}
text={props.text || "View"}/>
: null;

View file

@ -5,21 +5,20 @@ interface IProps {
name: string;
url: string;
urlMirrors?: string[];
}
export const ViewButtonGroup = (props: IProps) => {
return props.url
? (props.urlMirrors && props.urlMirrors.length > 0)
? <ViewButtonGroupDropdown {...props} urlMirrors={props.urlMirrors}/>
: <ViewButton {...props}/>
: null;
};
export const ViewButtonGroup = (props: IProps) =>
props.url
? (props.urlMirrors && props.urlMirrors.length > 0)
? <ViewButtonGroupDropdown {...props} urlMirrors={props.urlMirrors}/>
: <ViewButton {...props}/>
: null;
interface IViewButtonGroupDropdownProps {
name: string;
url: string;
urlMirrors: string[];
}
};
const ViewButtonGroupDropdown = (props: IViewButtonGroupDropdownProps) => {
let firstButtonText: string = "Original";
@ -41,13 +40,12 @@ const ViewButtonGroupDropdown = (props: IViewButtonGroupDropdownProps) => {
</div>;
};
const BtnGroupDropView = () => {
return <button id="btnGroupDropView"
type="button"
className="btn btn-primary dropdown-toggle"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false">
View
</button>;
};
const BtnGroupDropView = () =>
<button id="btnGroupDropView"
type="button"
className="btn btn-primary dropdown-toggle"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false">
View
</button>;

View file

@ -1,8 +1,8 @@
import * as React from "react";
import { IColumnVisibility, ILanguage, IList, IMaintainer, ISoftware, ITag } from "../../interfaces";
import "../../../../utils/loader.css";
import ReactTable from "react-table"
import "react-table/react-table.css"
import ReactTable from "react-table";
import "react-table/react-table.css";
import "./listsTable.css";
import { DetailsButton, Languages, Name, Software, Tags, UpdatedDate } from "./columns";
import { IListDetails } from "../../components/detailsExpander";
@ -49,34 +49,33 @@ interface ICreateListDtoProps {
tags: ITag[];
};
const mapListDetails = (props: ICreateListDtoProps): IListDetails => {
return {
id: props.list.id,
chatUrl: props.list.chatUrl,
description: props.list.description,
descriptionSourceUrl: props.list.descriptionSourceUrl,
discontinuedDate: props.list.discontinuedDate,
donateUrl: props.list.donateUrl,
emailAddress: props.list.emailAddress,
forumUrl: props.list.forumUrl,
homeUrl: props.list.homeUrl,
issuesUrl: props.list.issuesUrl,
languages: props.list.languageIds
? props.languages.filter((l: ILanguage) => props.list.languageIds.indexOf(l.id) > -1)
: undefined,
//license:,
maintainers: props.list.maintainerIds
? props.maintainers.filter((m: IMaintainer) => props.list.maintainerIds.indexOf(m.id) > -1)
: undefined,
name: props.list.name,
policyUrl: props.list.policyUrl,
publishedDate: props.list.publishedDate,
ruleCount: props.list.ruleCount,
submissionUrl: props.list.submissionUrl,
//syntax:,
tags: props.list.tagIds ? props.tags.filter((t: ITag) => props.list.tagIds.indexOf(t.id) > -1) : undefined,
updatedDate: props.list.updatedDate,
viewUrl: props.list.viewUrl,
viewUrlMirrors: props.list.viewUrlMirrors
} as IListDetails;
};
const mapListDetails = (props: ICreateListDtoProps): IListDetails =>
({
id: props.list.id,
chatUrl: props.list.chatUrl,
description: props.list.description,
descriptionSourceUrl: props.list.descriptionSourceUrl,
discontinuedDate: props.list.discontinuedDate,
donateUrl: props.list.donateUrl,
emailAddress: props.list.emailAddress,
forumUrl: props.list.forumUrl,
homeUrl: props.list.homeUrl,
issuesUrl: props.list.issuesUrl,
languages: props.list.languageIds
? props.languages.filter((l: ILanguage) => props.list.languageIds.indexOf(l.id) > -1)
: undefined,
//license:,
maintainers: props.list.maintainerIds
? props.maintainers.filter((m: IMaintainer) => props.list.maintainerIds.indexOf(m.id) > -1)
: undefined,
name: props.list.name,
policyUrl: props.list.policyUrl,
publishedDate: props.list.publishedDate,
ruleCount: props.list.ruleCount,
submissionUrl: props.list.submissionUrl,
//syntax:,
tags: props.list.tagIds ? props.tags.filter((t: ITag) => props.list.tagIds.indexOf(t.id) > -1) : undefined,
updatedDate: props.list.updatedDate,
viewUrl: props.list.viewUrl,
viewUrlMirrors: props.list.viewUrlMirrors
} as IListDetails);

View file

@ -2,22 +2,21 @@ import * as React from "react";
import { Column, Filter } from "react-table";
import { IColumnVisibility, ILanguage } from "../../../interfaces";
export const Languages = (columnVisibility: IColumnVisibility[], languages: ILanguage[]) => {
return {
Header: "Languages",
accessor: "languageIds",
filterable: true,
filterMethod: (f: Filter, r: any[]) => filterMethod(f, r),
Filter: ({ onChange, filter }: any) => Filter({ onChange, filter }, languages),
sortable: false,
Cell: (c: any) => Cell(c.value, languages),
style: { whiteSpace: "inherit" },
width: 95,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Languages")[0].visible
} as Column;
};
export const Languages = (columnVisibility: IColumnVisibility[], languages: ILanguage[]) =>
({
Header: "Languages",
accessor: "languageIds",
filterable: true,
filterMethod: (f: Filter, r: any[]) => filterMethod(f, r),
Filter: ({ onChange, filter }: any) => Filter({ onChange, filter }, languages),
sortable: false,
Cell: (c: any) => Cell(c.value, languages),
style: { whiteSpace: "inherit" },
width: 95,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Languages")[0].visible
} as Column);
const filterMethod = (f: Filter, r: any[]): boolean => {
const listLanguageIds = r[f.id as any];

View file

@ -3,21 +3,19 @@ import { Column, Filter } from "react-table";
import { IColumnVisibility, ISoftware } from "../../../interfaces";
import { SoftwareIcon } from "../../softwareIcon";
export const Software = (columnVisibility: IColumnVisibility[], software: ISoftware[]) => {
return {
Header: "Software",
accessor: "syntaxId",
filterable: true,
filterMethod: (f: Filter, r: any[]) => filterMethod(f, r, software),
Filter: ({ filter, onChange }: any) => Filter({ onChange, filter }, software),
sortable: false,
Cell: (c: any) => Cell(c.value, software),
width: 155,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Software")[0].visible
} as Column;
};
export const Software = (columnVisibility: IColumnVisibility[], software: ISoftware[]) => ({
Header: "Software",
accessor: "syntaxId",
filterable: true,
filterMethod: (f: Filter, r: any[]) => filterMethod(f, r, software),
Filter: ({ filter, onChange }: any) => Filter({ onChange, filter }, software),
sortable: false,
Cell: (c: any) => Cell(c.value, software),
width: 155,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Software")[0].visible
} as Column);
const filterMethod = (f: Filter, r: any[], software: ISoftware[]): boolean => {
const isAny = f.value === "any";

View file

@ -1,22 +1,21 @@
import * as React from "react";
import { Column, Filter } from "react-table";
import { TagGroup } from "../../TagGroup"
import { TagGroup } from "../../TagGroup";
import { IColumnVisibility, ITag } from "../../../interfaces";
export const Tags = (columnVisibility: IColumnVisibility[], tags: ITag[]) => {
return {
Header: "Tags",
accessor: "tagIds",
filterable: true,
filterMethod: (f: Filter, r: any[]) => filterMethod(f, r, tags),
sortMethod: (a: number[], b: number[]) => sortMethod(a, b),
Cell: (c: any) => Cell(c.value, tags),
width: 215,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Tags")[0].visible
} as Column;
};
export const Tags = (columnVisibility: IColumnVisibility[], tags: ITag[]) =>
({
Header: "Tags",
accessor: "tagIds",
filterable: true,
filterMethod: (f: Filter, r: any[]) => filterMethod(f, r, tags),
sortMethod: (a: number[], b: number[]) => sortMethod(a, b),
Cell: (c: any) => Cell(c.value, tags),
width: 215,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Tags")[0].visible
} as Column);
const filterMethod = (f: Filter, r: any[], tags: ITag[]): boolean => {
const listTagIds = r[f.id as any];

View file

@ -3,19 +3,18 @@ import { Column } from "react-table";
import * as moment from "moment";
import { IColumnVisibility } from "../../../interfaces";
export const UpdatedDate = (columnVisibility: IColumnVisibility[]) => {
return {
Header: "Updated",
accessor: "updatedDate",
sortMethod: (a: string, b: string) => sortMethod(a, b),
Cell: (c: any) => Cell(c.value),
style: { whiteSpace: "inherit" },
width: 100,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Updated Date")[0].visible
} as Column;
};
export const UpdatedDate = (columnVisibility: IColumnVisibility[]) =>
({
Header: "Updated",
accessor: "updatedDate",
sortMethod: (a: string, b: string) => sortMethod(a, b),
Cell: (c: any) => Cell(c.value),
style: { whiteSpace: "inherit" },
width: 100,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Updated Date")[0].visible
} as Column);
const sortMethod = (a: string, b: string) =>
a && moment(a).isValid()

View file

@ -22,21 +22,20 @@ import {
interface IProps {
id: number;
}
export const SoftwareIcon = (props: IProps) => {
return icons[props.id]
? <img src={icons[props.id].image}
width="20"
alt={icons[props.id].imageTitle}
title={icons[props.id].imageTitle}/>
: null;
};
export const SoftwareIcon = (props: IProps) =>
icons[props.id]
? <img src={icons[props.id].image}
width="20"
alt={icons[props.id].imageTitle}
title={icons[props.id].imageTitle}/>
: null;
interface IIcon {
image: any;
imageTitle: string;
}
};
const icons: { [id: number]: IIcon; } = {
1: { image: img1, imageTitle: "uBlock Origin" },

View file

@ -36,4 +36,4 @@ export {
img19,
img20,
img21
};
};

View file

@ -3,4 +3,4 @@
filterListIds: number[];
iso6391: string;
name: string;
}
};

View file

@ -22,4 +22,4 @@
updatedDate: string;
viewUrl: string;
viewUrlMirrors: string[];
}
};

View file

@ -5,4 +5,4 @@
homeUrl: string;
name: string;
twitterHandle: string;
}
};

View file

@ -4,4 +4,4 @@
isAbpSubscribable: boolean;
name: string;
syntaxIds: number[];
}
};

View file

@ -3,4 +3,4 @@
description: string;
filterListIds: number[];
name: string;
}
};

View file

@ -85,7 +85,7 @@
"@types/webpack-env": {
"version": "1.13.6",
"resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.6.tgz",
"integrity": "sha512-5Th3OsZ4gTRdr9Mho83BQ23cex4sRhOR4XTG+m+cJc0FhtUBK9Vn62hBJ+pnQYnSxoPOsKoAPOx6FcphxBC8ng==",
"integrity": "sha1-Eo0WhafDTTHtFwEPyH1qEsHeaXY=",
"dev": true
},
"acorn": {
@ -496,7 +496,7 @@
"bootstrap": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.1.3.tgz",
"integrity": "sha512-rDFIzgXcof0jDyjNosjv4Sno77X4KuPeFxG2XZZv1/Kc8DRVGVADdoQyyOVDwPqL36DDmtCQbrpMCqvpPLJQ0w==",
"integrity": "sha1-DrNxryyESOjCEEEdDLgkpkCaEr4=",
"dev": true
},
"brace-expansion": {
@ -1735,7 +1735,7 @@
"extract-text-webpack-plugin": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/extract-text-webpack-plugin/-/extract-text-webpack-plugin-3.0.2.tgz",
"integrity": "sha512-bt/LZ4m5Rqt/Crl2HiKuAl/oqg0psx1tsTLkvWbJen1CtD+fftkZhMaQ9HOtY2gWsl2Wq+sABmMVi9z3DhKWQQ==",
"integrity": "sha1-XwQ+qgL5dQqSWLeMCm4NwUCPsvc=",
"dev": true,
"requires": {
"async": "^2.4.1",
@ -2892,7 +2892,7 @@
"history": {
"version": "4.7.2",
"resolved": "https://registry.npmjs.org/history/-/history-4.7.2.tgz",
"integrity": "sha512-1zkBRWW6XweO0NBcjiphtVJVsIQ+SXF29z9DVkceeaSLVMFXHool+fdCZD4spDCfZJCILPILc3bm7Bc+HRi0nA==",
"integrity": "sha1-IrXH8xYzxbgCHH9KipVKwTnujVs=",
"dev": true,
"requires": {
"invariant": "^2.2.1",
@ -2927,7 +2927,7 @@
"hoist-non-react-statics": {
"version": "2.5.5",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz",
"integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw==",
"integrity": "sha1-xZA89AnA39kI84jmGdhrnBF0y0c=",
"dev": true
},
"hosted-git-info": {
@ -3059,7 +3059,7 @@
"invariant": {
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
"integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
"integrity": "sha1-YQ88ksk1nOHbYW5TgAjSP/NRWOY=",
"dev": true,
"requires": {
"loose-envify": "^1.0.0"
@ -3297,7 +3297,7 @@
"jquery": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.3.1.tgz",
"integrity": "sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg==",
"integrity": "sha1-lYzinoHJeQ8xvneS311NlfxX+8o=",
"dev": true
},
"js-base64": {
@ -3331,7 +3331,7 @@
"json-loader": {
"version": "0.5.7",
"resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.7.tgz",
"integrity": "sha512-QLPs8Dj7lnf3e3QYS1zkCo+4ZwqOiF9d/nZnYozTISxXWCfNs9yuky5rJw4/W34s7POaNlbZmQGaB5NiXCbP4w==",
"integrity": "sha1-3KFKcCNf+C8KyaOr62DTN6NlGF0=",
"dev": true
},
"json-schema-traverse": {
@ -4829,7 +4829,7 @@
"react-router": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-4.3.1.tgz",
"integrity": "sha512-yrvL8AogDh2X42Dt9iknk4wF4V8bWREPirFfS9gLU1huk6qK41sg7Z/1S81jjTrGHxa3B8R3J6xIkDAA6CVarg==",
"integrity": "sha1-qtpK7xTICcsuaGsFzuR0IjRQbE4=",
"dev": true,
"requires": {
"history": "^4.7.2",
@ -4844,7 +4844,7 @@
"react-router-dom": {
"version": "4.3.1",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-4.3.1.tgz",
"integrity": "sha512-c/MlywfxDdCp7EnB7YfPMOfMD3tOtIjrQlj/CKfNMBxdmpJP8xcz5P/UAFn3JbnQCNUxsHyVVqllF9LhgVyFCA==",
"integrity": "sha1-TCYZ/CTE+ofJ/Rj0+0pD/mP71cY=",
"dev": true,
"requires": {
"history": "^4.7.2",
@ -5021,7 +5021,7 @@
"resolve-pathname": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-2.2.0.tgz",
"integrity": "sha512-bAFz9ld18RzJfddgrO2e/0S2O81710++chRMUxHjXOYKF6jTAMrUNZrEZ1PvV0zlhfjidm08iRPdTLPno1FuRg==",
"integrity": "sha1-fpriHtgV/WOrGJre7mTcgx7vqHk=",
"dev": true
},
"resolve-url": {
@ -6123,7 +6123,7 @@
"value-equal": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/value-equal/-/value-equal-0.4.0.tgz",
"integrity": "sha512-x+cYdNnaA3CxvMaTX0INdTCN8m8aF2uY9BvEqmxuYp8bL09cs/kWVQPVGcA35fMktdOsP69IgU7wFj/61dJHEw==",
"integrity": "sha1-xb3S9U7gk8BIOdcc4uR1imiQq8c=",
"dev": true
},
"vendors": {
@ -6144,7 +6144,7 @@
"warning": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/warning/-/warning-4.0.1.tgz",
"integrity": "sha512-rAVtTNZw+cQPjvGp1ox0XC5Q2IBFyqoqh+QII4J/oguyu83Bax1apbo2eqB8bHRS+fqYUBagys6lqUoVwKSmXQ==",
"integrity": "sha1-Zs43a3+/6KiHwivfDnNJ1z05d0U=",
"dev": true,
"requires": {
"loose-envify": "^1.0.0"