From 513d01351ef3fbff8b379a29bad3d13c39606298 Mon Sep 17 00:00:00 2001 From: "Collin M. Barrett" Date: Fri, 2 Aug 2019 00:07:09 +0000 Subject: [PATCH] wip refactoring buttons (#891) * wip towards using react-bootstrap buttons * further button refactoring * ren IProps to Props per TS conventions * ren ILanguage -> Language --- src/FilterLists.Web/src/Layout.tsx | 4 ++-- src/FilterLists.Web/src/modules/home/Home.tsx | 10 ++++---- .../src/modules/home/HomeContainer.tsx | 6 ++--- .../modules/home/components/IListDetails.ts | 4 ++-- .../src/modules/home/components/Oneliner.tsx | 4 ++-- .../src/modules/home/components/TagGroup.tsx | 4 ++-- .../detailsExpander/DetailsExpander.tsx | 4 ++-- .../detailsExpander/LinkButtonGroup.tsx | 12 +++++----- .../detailsExpander/infoCard/Description.tsx | 4 ++-- .../detailsExpander/infoCard/InfoCard.tsx | 8 +++---- .../detailsExpander/infoCard/Languages.tsx | 10 ++++---- .../detailsExpander/infoCard/License.tsx | 4 ++-- .../infoCard/PublishedDate.tsx | 4 ++-- .../detailsExpander/infoCard/RuleCount.tsx | 4 ++-- .../detailsExpander/infoCard/Syntax.tsx | 4 ++-- .../detailsExpander/infoCard/UpdatedDate.tsx | 4 ++-- .../MaintainerAdditionalLists.tsx | 4 ++-- .../MaintainerInfoCard.tsx | 4 ++-- .../MaintainerLinkButtonGroup.tsx | 4 ++-- .../MaintainersInfoCard.tsx | 4 ++-- .../components/linkButtons/ChatButton.tsx | 4 ++-- .../components/linkButtons/DonateButton.tsx | 6 ++--- .../components/linkButtons/EmailButton.tsx | 4 ++-- .../components/linkButtons/ForumButton.tsx | 4 ++-- .../components/linkButtons/HomeButton.tsx | 4 ++-- .../components/linkButtons/IssuesButton.tsx | 4 ++-- .../components/linkButtons/LinkButton.tsx | 17 ++++++------- .../components/linkButtons/PolicyButton.tsx | 4 ++-- .../components/linkButtons/SubmitButton.tsx | 4 ++-- .../{ => SubscribeButton}/SubscribeButton.tsx | 24 +++++++++---------- .../SubscribeButton/SubscribeButtonGroup.tsx | 16 +++++++++++++ .../SubscribeButtonGroupDropdown.tsx} | 20 +++------------- .../linkButtons/SubscribeButton/index.ts | 5 ++++ .../components/linkButtons/TwitterButton.tsx | 4 ++-- .../{ => ViewButton}/ViewButton.tsx | 6 ++--- .../ViewButton/ViewButtonGroup.tsx | 16 +++++++++++++ .../ViewButtonGroupDropdown.tsx} | 19 +++------------ .../linkButtons/ViewButton/index.ts | 5 ++++ .../home/components/linkButtons/button.css | 11 --------- .../home/components/linkButtons/index.ts | 8 +++---- .../home/components/listsTable/ListsTable.tsx | 12 +++++----- .../listsTable/columns/DetailsButton.tsx | 1 - .../listsTable/columns/Languages.tsx | 18 +++++++------- .../listsTable/columns/SubscribeButton.tsx | 4 ++-- .../components/softwareIcon/SoftwareIcon.tsx | 4 ++-- .../interfaces/{ILanguage.ts => Language.ts} | 2 +- 46 files changed, 168 insertions(+), 164 deletions(-) rename src/FilterLists.Web/src/modules/home/components/linkButtons/{ => SubscribeButton}/SubscribeButton.tsx (81%) create mode 100644 src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/SubscribeButtonGroup.tsx rename src/FilterLists.Web/src/modules/home/components/linkButtons/{SubscribeButtonGroup.tsx => SubscribeButton/SubscribeButtonGroupDropdown.tsx} (63%) create mode 100644 src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/index.ts rename src/FilterLists.Web/src/modules/home/components/linkButtons/{ => ViewButton}/ViewButton.tsx (87%) create mode 100644 src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/ViewButtonGroup.tsx rename src/FilterLists.Web/src/modules/home/components/linkButtons/{ViewButtonGroup.tsx => ViewButton/ViewButtonGroupDropdown.tsx} (62%) create mode 100644 src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/index.ts delete mode 100644 src/FilterLists.Web/src/modules/home/components/linkButtons/button.css rename src/FilterLists.Web/src/modules/home/interfaces/{ILanguage.ts => Language.ts} (72%) diff --git a/src/FilterLists.Web/src/Layout.tsx b/src/FilterLists.Web/src/Layout.tsx index f8fbfc9d4..e98fe8ded 100644 --- a/src/FilterLists.Web/src/Layout.tsx +++ b/src/FilterLists.Web/src/Layout.tsx @@ -1,10 +1,10 @@ import * as React from "react"; -interface IProps { +interface Props { children?: React.ReactNode; }; -export const Layout = (props: IProps) => +export const Layout = (props: Props) =>
diff --git a/src/FilterLists.Web/src/modules/home/Home.tsx b/src/FilterLists.Web/src/modules/home/Home.tsx index 8bfeb94fa..83283c303 100644 --- a/src/FilterLists.Web/src/modules/home/Home.tsx +++ b/src/FilterLists.Web/src/modules/home/Home.tsx @@ -1,6 +1,6 @@ import * as React from "react"; import { IColumnVisibility } from "./interfaces/IColumnVisibility"; -import { ILanguage } from "./interfaces/ILanguage"; +import { Language } from "./interfaces/Language"; import { ILicense } from "./interfaces/ILicense"; import { IList } from "./interfaces/IList"; import { IMaintainer } from "./interfaces/IMaintainer"; @@ -20,8 +20,8 @@ const columnVisibilityDefaults: IColumnVisibility[] = [ { column: "Subscribe", visible: false } ]; -interface IProps { - languages: ILanguage[]; +interface Props { + languages: Language[]; licenses: ILicense[]; lists: IList[]; maintainers: IMaintainer[]; @@ -36,8 +36,8 @@ interface IState { pageSize: number; }; -export class Home extends React.Component { - constructor(props: IProps) { +export class Home extends React.Component { + constructor(props: Props) { super(props); this.state = { columnVisibility: columnVisibilityDefaults, diff --git a/src/FilterLists.Web/src/modules/home/HomeContainer.tsx b/src/FilterLists.Web/src/modules/home/HomeContainer.tsx index d782f1c5b..e32d98fc9 100644 --- a/src/FilterLists.Web/src/modules/home/HomeContainer.tsx +++ b/src/FilterLists.Web/src/modules/home/HomeContainer.tsx @@ -1,6 +1,6 @@ import * as React from "react"; import axios from "axios"; -import { ILanguage } from "./interfaces/ILanguage"; +import { Language } from "./interfaces/Language"; import { ILicense } from "./interfaces/ILicense"; import { IList } from "./interfaces/IList"; import { IMaintainer } from "./interfaces/IMaintainer"; @@ -10,7 +10,7 @@ import { ITag } from "./interfaces/ITag"; import { Home } from "./Home"; interface IState { - languages: ILanguage[]; + languages: Language[]; licenses: ILicense[]; lists: IList[]; maintainers: IMaintainer[]; @@ -46,7 +46,7 @@ export class HomeContainer extends React.Component<{}, IState> { }; fetchLanguages() { - axios.request({ url: "/api/v1/languages" }) + axios.request({ url: "/api/v1/languages" }) .then(l => { this.setState({ languages: l.data }); }) }; diff --git a/src/FilterLists.Web/src/modules/home/components/IListDetails.ts b/src/FilterLists.Web/src/modules/home/components/IListDetails.ts index 742d5c788..e9f6065cf 100644 --- a/src/FilterLists.Web/src/modules/home/components/IListDetails.ts +++ b/src/FilterLists.Web/src/modules/home/components/IListDetails.ts @@ -1,4 +1,4 @@ -import { ILanguage } from "../interfaces/ILanguage"; +import { Language } from "../interfaces/Language"; import { ILicense } from "../interfaces/ILicense"; import { IMaintainer } from "../interfaces/IMaintainer"; import { ISyntax } from "../interfaces/ISyntax"; @@ -14,7 +14,7 @@ export interface IListDetails { forumUrl: string; homeUrl: string; issuesUrl: string; - languages: ILanguage[]; + languages: Language[]; license: ILicense; maintainers: IMaintainer[]; name: string; diff --git a/src/FilterLists.Web/src/modules/home/components/Oneliner.tsx b/src/FilterLists.Web/src/modules/home/components/Oneliner.tsx index aa87adc52..5a587c494 100644 --- a/src/FilterLists.Web/src/modules/home/components/Oneliner.tsx +++ b/src/FilterLists.Web/src/modules/home/components/Oneliner.tsx @@ -1,11 +1,11 @@ import * as React from "react"; -interface IProps { +interface Props { listCount: number; //ruleCount: number; }; -export const Oneliner = (props: IProps) => +export const Oneliner = (props: Props) => props.listCount > 0/* && props.ruleCount > 0*/ ?

The independent, comprehensive directory of {/*}{props.ruleCount.toLocaleString() diff --git a/src/FilterLists.Web/src/modules/home/components/TagGroup.tsx b/src/FilterLists.Web/src/modules/home/components/TagGroup.tsx index 0b4eb85dd..de4dad5f4 100644 --- a/src/FilterLists.Web/src/modules/home/components/TagGroup.tsx +++ b/src/FilterLists.Web/src/modules/home/components/TagGroup.tsx @@ -2,11 +2,11 @@ import * as React from "react"; import { ITag } from "../interfaces/ITag"; import { getContrast } from "../../../utils"; -interface IProps { +interface Props { tags: ITag[]; }; -export const TagGroup = (props: IProps) => +export const TagGroup = (props: Props) => props.tags && props.tags.length > 0 ?

{props.tags.map((t: ITag, i: number) => )} diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/DetailsExpander.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/DetailsExpander.tsx index 1193b7e05..585e00a01 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/DetailsExpander.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/DetailsExpander.tsx @@ -6,13 +6,13 @@ import { InfoCard } from "./infoCard"; import { LinkButtonGroup } from "./LinkButtonGroup"; import { MaintainersInfoCard } from "./maintainersInfoCard"; -interface IProps { +interface Props { columnVisibility: IColumnVisibility[]; list: IListDetails; software: ISoftware[]; }; -export const DetailsExpander = (props: IProps) => +export const DetailsExpander = (props: Props) =>
diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/LinkButtonGroup.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/LinkButtonGroup.tsx index 98bbfade8..b3540eefe 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/LinkButtonGroup.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/LinkButtonGroup.tsx @@ -8,11 +8,11 @@ import { IssuesButton, PolicyButton, SubmitButton, - SubscribeButtonGroup, - ViewButtonGroup + SubscribeButton, + ViewButton } from "../linkButtons"; -interface IProps { +interface Props { chatUrl: string; donateUrl: string; emailAddress: string; @@ -26,10 +26,10 @@ interface IProps { viewUrlMirrors: string[]; }; -export const LinkButtonGroup = (props: IProps) => +export const LinkButtonGroup = (props: Props) =>
- - + + diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Description.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Description.tsx index a65ec9f28..93a782295 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Description.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Description.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import "./description.css"; -interface IProps { +interface Props { description: string; url: string; }; -export const Description = (props: IProps) => +export const Description = (props: Props) => props.description ?

{props.url diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/InfoCard.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/InfoCard.tsx index 6a9b3e84c..9ec730152 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/InfoCard.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/InfoCard.tsx @@ -1,6 +1,6 @@ import * as React from "react"; import { IColumnVisibility } from "../../../interfaces/IColumnVisibility"; -import { ILanguage } from "../../../interfaces/ILanguage"; +import { Language } from "../../../interfaces/Language"; import { ILicense, } from "../../../interfaces/ILicense"; import { ISoftware, } from "../../../interfaces/ISoftware"; import { ISyntax, } from "../../../interfaces/ISyntax"; @@ -15,11 +15,11 @@ import { Syntax } from "./Syntax"; import { TagGroup } from "../../TagGroup" // import { UpdatedDate } from "./UpdatedDate"; -interface IProps { +interface Props { columnVisibility: IColumnVisibility[]; description: string; descriptionSourceUrl: string; - languages: ILanguage[]; + languages: Language[]; license: ILicense; name: string; publishedDate: string; @@ -30,7 +30,7 @@ interface IProps { //updatedDate: string; }; -export const InfoCard = (props: IProps) => +export const InfoCard = (props: Props) =>
{props.columnVisibility.filter((c: IColumnVisibility) => c.column === "Tags")[0].visible ? null diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Languages.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Languages.tsx index dfccffeee..cb3989273 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Languages.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Languages.tsx @@ -1,17 +1,17 @@ import * as React from "react"; -import { ILanguage } from "../../../interfaces/ILanguage"; +import { Language } from "../../../interfaces/Language"; -interface IProps { - languages: ILanguage[]; +interface Props { + languages: Language[]; }; -export const Languages = (props: IProps) => +export const Languages = (props: Props) => props.languages && props.languages.length > 0 ? props.languages.length > 1 ?

  • Languages:

      - {props.languages.map((language: ILanguage, i: number) =>
    • {language.name}
      • )} + {props.languages.map((language: Language, i: number) =>
    • {language.name}
      • )}
    • :
  • diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/License.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/License.tsx index 7b97326cc..0c2c51776 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/License.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/License.tsx @@ -1,11 +1,11 @@ import * as React from "react"; import { ILicense } from "../../../interfaces/ILicense"; -interface IProps { +interface Props { license: ILicense; }; -export const License = (props: IProps) => +export const License = (props: Props) => props.license.name ? (props.license.descriptionUrl ?
  • diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/PublishedDate.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/PublishedDate.tsx index 8a5cff81a..53a56f3e1 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/PublishedDate.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/PublishedDate.tsx @@ -1,11 +1,11 @@ import * as React from "react"; import moment from 'moment'; -interface IProps { +interface Props { date: string; }; -export const PublishedDate = (props: IProps) => +export const PublishedDate = (props: Props) => props.date ?

  • Published: {moment(props.date).format("l")}

    diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/RuleCount.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/RuleCount.tsx index 4fff08cba..1d57aeb87 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/RuleCount.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/RuleCount.tsx @@ -1,10 +1,10 @@ import * as React from "react"; -interface IProps { +interface Props { ruleCount: number; }; -export const RuleCount = (props: IProps) => +export const RuleCount = (props: Props) => props.ruleCount > 0 ?

  • Rule Count: {props.ruleCount.toLocaleString()}

    diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Syntax.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Syntax.tsx index 3a4a23d05..473590ff3 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Syntax.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/Syntax.tsx @@ -1,11 +1,11 @@ import * as React from "react"; import { ISyntax } from "../../../interfaces/ISyntax"; -interface IProps { +interface Props { syntax: ISyntax; }; -export const Syntax = (props: IProps) => +export const Syntax = (props: Props) => props.syntax ? (props.syntax.definitionUrl ?
  • diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/UpdatedDate.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/UpdatedDate.tsx index efc654452..ff4a64754 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/UpdatedDate.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/infoCard/UpdatedDate.tsx @@ -1,11 +1,11 @@ import * as React from "react"; import moment from 'moment'; -interface IProps { +interface Props { updatedDate: string; }; -export const UpdatedDate = (props: IProps) => +export const UpdatedDate = (props: Props) => props.updatedDate ?

  • Updated: {moment(props.updatedDate).isValid() diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerAdditionalLists.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerAdditionalLists.tsx index 96cc74f85..042d91060 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerAdditionalLists.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerAdditionalLists.tsx @@ -1,11 +1,11 @@ import * as React from "react"; -//interface IProps { +//interface Props { // name: string; // additionalLists: IMaintainerAdditionalListDto[]; //}; -export const MaintainerAdditionalLists = (/*props: IProps*/) => +export const MaintainerAdditionalLists = (/*props: Props*/) =>

    { /*props.additionalLists && props.additionalLists.length > 0 ?
    diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerInfoCard.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerInfoCard.tsx index 6378b5325..b8d5d09e0 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerInfoCard.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerInfoCard.tsx @@ -3,11 +3,11 @@ import { IMaintainer } from "../../../interfaces/IMaintainer"; import { MaintainerAdditionalLists } from "./MaintainerAdditionalLists"; import { MaintainerLinkButtonGroup } from "./MaintainerLinkButtonGroup"; -interface IProps { +interface Props { maintainer: IMaintainer; }; -export const MaintainerInfoCard = (props: IProps) => +export const MaintainerInfoCard = (props: Props) => props.maintainer.name ?
    diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerLinkButtonGroup.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerLinkButtonGroup.tsx index b4af33292..2d16f7b86 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerLinkButtonGroup.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainerLinkButtonGroup.tsx @@ -1,14 +1,14 @@ import * as React from "react"; import { EmailButton, HomeButton, TwitterButton } from "../../linkButtons"; -interface IProps { +interface Props { emailAddress: string; homeUrl: string; name: string; twitterHandle: string; }; -export const MaintainerLinkButtonGroup = (props: IProps) => +export const MaintainerLinkButtonGroup = (props: Props) =>
    diff --git a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainersInfoCard.tsx b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainersInfoCard.tsx index 11f0f8e18..dc31c5772 100644 --- a/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainersInfoCard.tsx +++ b/src/FilterLists.Web/src/modules/home/components/detailsExpander/maintainersInfoCard/MaintainersInfoCard.tsx @@ -2,11 +2,11 @@ import * as React from "react"; import { IMaintainer } from "../../../interfaces/IMaintainer"; import { MaintainerInfoCard } from "./MaintainerInfoCard"; -interface IProps { +interface Props { maintainers: IMaintainer[]; }; -export const MaintainersInfoCard = (props: IProps) => +export const MaintainersInfoCard = (props: Props) => props.maintainers && props.maintainers.length > 0 ?
    {props.maintainers.map((m: IMaintainer, i: number) => )} diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/ChatButton.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/ChatButton.tsx index dbec3d0b2..573a4a1b3 100644 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/ChatButton.tsx +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/ChatButton.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import { LinkButton } from "./LinkButton"; -interface IProps { +interface Props { name: string; url: string; }; -export const ChatButton = (props: IProps) => +export const ChatButton = (props: Props) => props.url ? +export const DonateButton = (props: Props) => props.url ? - : null; + : null; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/EmailButton.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/EmailButton.tsx index 1fdc06b09..0b7e6f8bc 100644 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/EmailButton.tsx +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/EmailButton.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import { LinkButton } from "./LinkButton"; -interface IProps { +interface Props { name: string; emailAddress: string; }; -export const EmailButton = (props: IProps) => +export const EmailButton = (props: Props) => props.emailAddress ? +export const ForumButton = (props: Props) => props.url ? +export const HomeButton = (props: Props) => props.url ? +export const IssuesButton = (props: Props) => props.url ? +export const LinkButton = (props: Props) => props.href - ? + ? : null; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/PolicyButton.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/PolicyButton.tsx index 8369d5f3b..0107e7200 100644 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/PolicyButton.tsx +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/PolicyButton.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import { LinkButton } from "./LinkButton"; -interface IProps { +interface Props { name: string; url: string; }; -export const PolicyButton = (props: IProps) => +export const PolicyButton = (props: Props) => props.url ? +export const SubmitButton = (props: Props) => props.url ? { - let buttonClass: string | undefined; +export const SubscribeButton = (props: Props) => { + let buttonVariant: ButtonProps["variant"]; let titlePrefix: string; if (props.url.indexOf(".onion/") > 0) { - buttonClass = "btn-success"; + buttonVariant = "success"; titlePrefix = "Tor address - "; } else if (props.url.indexOf("http://") === 0) { - buttonClass = "btn-danger"; + buttonVariant = "danger"; titlePrefix = "Not Secure - "; } else { - buttonClass = undefined; + buttonVariant = undefined; titlePrefix = ""; } @@ -34,8 +35,6 @@ export const SubscribeButton = (props: IProps) => { href = `abp:subscribe?location=${encodeURIComponent(props.url)}&title=${hrefTitle}`; }; - - let title; if (props.url.indexOf(".tpl") > 0) { title = `${titlePrefix}Subscribe to ${props.name} with Internet Explorer's Tracking Protection List feature.`; @@ -48,9 +47,10 @@ export const SubscribeButton = (props: IProps) => { }; return props.url - ? : null; -}; +}; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/SubscribeButtonGroup.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/SubscribeButtonGroup.tsx new file mode 100644 index 000000000..095144fbc --- /dev/null +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/SubscribeButtonGroup.tsx @@ -0,0 +1,16 @@ +import * as React from "react"; +import { SubscribeButtonGroupDropdown } from "./SubscribeButtonGroupDropdown"; +import { SubscribeButton } from "./SubscribeButton"; + +interface Props { + name: string; + url: string; + urlMirrors?: string[]; +}; + +export const SubscribeButtonGroup = (props: Props) => + props.url + ? (props.urlMirrors && props.urlMirrors.length > 0) + ? + : + : null; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButtonGroup.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/SubscribeButtonGroupDropdown.tsx similarity index 63% rename from src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButtonGroup.tsx rename to src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/SubscribeButtonGroupDropdown.tsx index 1ed43421e..2fa2cae3e 100644 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButtonGroup.tsx +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/SubscribeButtonGroupDropdown.tsx @@ -2,27 +2,13 @@ import * as React from "react"; import { DropdownButton, Dropdown } from "react-bootstrap"; import { SubscribeButton } from "./SubscribeButton"; -interface IProps { - name: string; - url: string; - urlMirrors?: string[]; -}; - -export const SubscribeButtonGroup = (props: IProps) => - props.url - ? (props.urlMirrors && props.urlMirrors.length > 0) - ? - : - : null; - -interface ISubscribeButtonGroupDropdownProps { +interface Props { name: string; url: string; urlMirrors: string[]; }; -const SubscribeButtonGroupDropdown = (props: ISubscribeButtonGroupDropdownProps) => { +export const SubscribeButtonGroupDropdown = (props: Props) => { let firstButtonText: string = "Original"; let mirrorIndex: number = 0; @@ -41,4 +27,4 @@ const SubscribeButtonGroupDropdown = (props: ISubscribeButtonGroupDropdownProps) )} ; -}; +}; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/index.ts b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/index.ts new file mode 100644 index 000000000..a9dbacd3d --- /dev/null +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButton/index.ts @@ -0,0 +1,5 @@ +import { SubscribeButtonGroup } from "./SubscribeButtonGroup"; + +export { + SubscribeButtonGroup as SubscribeButton +}; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/TwitterButton.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/TwitterButton.tsx index 6f5e00cd2..e632dc519 100644 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/TwitterButton.tsx +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/TwitterButton.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import { LinkButton } from "./LinkButton"; -interface IProps { +interface Props { name: string; twitterHandle: string; }; -export const TwitterButton = (props: IProps) => +export const TwitterButton = (props: Props) => props.twitterHandle ? { +export const ViewButton = (props: Props) => { let title; if (props.url.indexOf(".onion/") > 0) { title = `Tor address - View ${props.name} in its raw format.`; } diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/ViewButtonGroup.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/ViewButtonGroup.tsx new file mode 100644 index 000000000..67412484e --- /dev/null +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/ViewButtonGroup.tsx @@ -0,0 +1,16 @@ +import * as React from "react"; +import { ViewButtonGroupDropdown } from "./ViewButtonGroupDropdown"; +import { ViewButton } from "./ViewButton"; + +interface Props { + name: string; + url: string; + urlMirrors?: string[]; +}; + +export const ViewButtonGroup = (props: Props) => + props.url + ? (props.urlMirrors && props.urlMirrors.length > 0) + ? + : + : null; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButtonGroup.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/ViewButtonGroupDropdown.tsx similarity index 62% rename from src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButtonGroup.tsx rename to src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/ViewButtonGroupDropdown.tsx index 005416e25..906538d2e 100644 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButtonGroup.tsx +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/ViewButtonGroupDropdown.tsx @@ -2,26 +2,13 @@ import * as React from "react"; import { DropdownButton, Dropdown } from "react-bootstrap"; import { ViewButton } from "./ViewButton"; -interface IProps { - name: string; - url: string; - urlMirrors?: string[]; -}; - -export const ViewButtonGroup = (props: IProps) => - props.url - ? (props.urlMirrors && props.urlMirrors.length > 0) - ? - : - : null; - -interface IViewButtonGroupDropdownProps { +interface Props { name: string; url: string; urlMirrors: string[]; }; -const ViewButtonGroupDropdown = (props: IViewButtonGroupDropdownProps) => { +export const ViewButtonGroupDropdown = (props: Props) => { let firstButtonText: string = "Original"; let mirrorIndex: number = 0; @@ -30,7 +17,7 @@ const ViewButtonGroupDropdown = (props: IViewButtonGroupDropdownProps) => { mirrorIndex++; } - return + return diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/index.ts b/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/index.ts new file mode 100644 index 000000000..29a37b647 --- /dev/null +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButton/index.ts @@ -0,0 +1,5 @@ +import { ViewButtonGroup } from "./ViewButtonGroup"; + +export { + ViewButtonGroup as ViewButton +}; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/button.css b/src/FilterLists.Web/src/modules/home/components/linkButtons/button.css deleted file mode 100644 index 58febdf12..000000000 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/button.css +++ /dev/null @@ -1,11 +0,0 @@ -.fl-btn-link { - margin-bottom: .2rem; - max-width: 100px; - width: 100px; -} - -.dropdown-item { - border: 0; - min-width: 0; - padding: 0; -} \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/index.ts b/src/FilterLists.Web/src/modules/home/components/linkButtons/index.ts index b5255a105..83a8d58f2 100644 --- a/src/FilterLists.Web/src/modules/home/components/linkButtons/index.ts +++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/index.ts @@ -6,9 +6,9 @@ import { HomeButton } from "./HomeButton"; import { IssuesButton } from "./IssuesButton"; import { PolicyButton } from "./PolicyButton"; import { SubmitButton } from "./SubmitButton"; -import { SubscribeButtonGroup } from "./SubscribeButtonGroup"; +import { SubscribeButton } from "./SubscribeButton"; import { TwitterButton } from "./TwitterButton"; -import { ViewButtonGroup } from "./ViewButtonGroup"; +import { ViewButton } from "./ViewButton"; export { ChatButton, @@ -19,7 +19,7 @@ export { IssuesButton, PolicyButton, SubmitButton, - SubscribeButtonGroup, + SubscribeButton, TwitterButton, - ViewButtonGroup + ViewButton }; \ No newline at end of file diff --git a/src/FilterLists.Web/src/modules/home/components/listsTable/ListsTable.tsx b/src/FilterLists.Web/src/modules/home/components/listsTable/ListsTable.tsx index 2baf84e95..b46e9fb6d 100644 --- a/src/FilterLists.Web/src/modules/home/components/listsTable/ListsTable.tsx +++ b/src/FilterLists.Web/src/modules/home/components/listsTable/ListsTable.tsx @@ -1,6 +1,6 @@ import * as React from "react"; import { IColumnVisibility } from "../../interfaces/IColumnVisibility"; -import { ILanguage } from "../../interfaces/ILanguage"; +import { Language } from "../../interfaces/Language"; import { ILicense } from "../../interfaces/ILicense"; import { IList } from "../../interfaces/IList"; import { IMaintainer } from "../../interfaces/IMaintainer"; @@ -26,8 +26,8 @@ import { import { IListDetails } from "../IListDetails"; import { DetailsExpander } from "../../components"; -interface IProps { - languages: ILanguage[]; +interface Props { + languages: Language[]; licenses: ILicense[]; lists: IList[]; maintainers: IMaintainer[]; @@ -38,7 +38,7 @@ interface IProps { pageSize: number; }; -export const ListsTable = (props: IProps) => +export const ListsTable = (props: Props) => props.languages.length > 0 && props.lists.length > 0 && props.software.length > 0 && props.tags.length > 0 ? interface ICreateListDtoProps { list: IList; - languages: ILanguage[]; + languages: Language[]; licenses: ILicense[]; maintainers: IMaintainer[]; syntaxes: ISyntax[]; @@ -92,7 +92,7 @@ const mapListDetails = (props: ICreateListDtoProps): IListDetails => homeUrl: props.list.homeUrl, issuesUrl: props.list.issuesUrl, languages: props.list.languageIds - ? props.languages.filter((l: ILanguage) => props.list.languageIds.indexOf(l.id) > -1) + ? props.languages.filter((l: Language) => props.list.languageIds.indexOf(l.id) > -1) : undefined, license: props.licenses.filter((l: ILicense) => props.list.licenseId === l.id)[0], maintainers: props.list.maintainerIds diff --git a/src/FilterLists.Web/src/modules/home/components/listsTable/columns/DetailsButton.tsx b/src/FilterLists.Web/src/modules/home/components/listsTable/columns/DetailsButton.tsx index 26d405b06..d1b364d79 100644 --- a/src/FilterLists.Web/src/modules/home/components/listsTable/columns/DetailsButton.tsx +++ b/src/FilterLists.Web/src/modules/home/components/listsTable/columns/DetailsButton.tsx @@ -1,6 +1,5 @@ import * as React from "react"; import { Column, RowRenderProps } from "react-table"; -import "../../linkButtons/button.css"; export const DetailsButton = { Header: Details, diff --git a/src/FilterLists.Web/src/modules/home/components/listsTable/columns/Languages.tsx b/src/FilterLists.Web/src/modules/home/components/listsTable/columns/Languages.tsx index a0ac54d34..6d8a1e782 100644 --- a/src/FilterLists.Web/src/modules/home/components/listsTable/columns/Languages.tsx +++ b/src/FilterLists.Web/src/modules/home/components/listsTable/columns/Languages.tsx @@ -1,9 +1,9 @@ import * as React from "react"; import { Column, Filter } from "react-table"; import { IColumnVisibility } from "../../../interfaces/IColumnVisibility"; -import { ILanguage } from "../../../interfaces/ILanguage"; +import { Language } from "../../../interfaces/Language"; -export const Languages = (columnVisibility: IColumnVisibility[], languages: ILanguage[]) => { +export const Languages = (columnVisibility: IColumnVisibility[], languages: Language[]) => { const languagesSorted = languages.sort((a, b) => a.name.localeCompare(b.name)); return ({ Header: Languages, @@ -27,27 +27,27 @@ const filterMethod = (f: Filter, r: any[]): boolean => { : f.value === "none"); }; -const filterLanguages = (props: any, languages: ILanguage[]) => +const filterLanguages = (props: any, languages: Language[]) => ; -const sortMethod = (a: number[], b: number[], languages: ILanguage[]) => { +const sortMethod = (a: number[], b: number[], languages: Language[]) => { if (a && a.length > 0) { if (b && b.length > 0) { const aLanguageNames = - languages.filter((l: ILanguage) => a.indexOf(l.id) > -1).map((l: ILanguage) => l.name).join(); + languages.filter((l: Language) => a.indexOf(l.id) > -1).map((l: Language) => l.name).join(); const bLanguageNames = - languages.filter((l: ILanguage) => b.indexOf(l.id) > -1).map((l: ILanguage) => l.name).join(); + languages.filter((l: Language) => b.indexOf(l.id) > -1).map((l: Language) => l.name).join(); return aLanguageNames.toLowerCase() > bLanguageNames.toLowerCase() ? 1 : -1; } else { return -1; @@ -57,11 +57,11 @@ const sortMethod = (a: number[], b: number[], languages: ILanguage[]) => { } }; -const Cell = (languageIds: number[], languages: ILanguage[]) => +const Cell = (languageIds: number[], languages: Language[]) => languageIds ?
    {languageIds.map((id: number, i: number) => { - const language = languages.filter((l: ILanguage) => l.id === id)[0]; + const language = languages.filter((l: Language) => l.id === id)[0]; return diff --git a/src/FilterLists.Web/src/modules/home/components/listsTable/columns/SubscribeButton.tsx b/src/FilterLists.Web/src/modules/home/components/listsTable/columns/SubscribeButton.tsx index 078ed91fe..42e89260b 100644 --- a/src/FilterLists.Web/src/modules/home/components/listsTable/columns/SubscribeButton.tsx +++ b/src/FilterLists.Web/src/modules/home/components/listsTable/columns/SubscribeButton.tsx @@ -1,7 +1,7 @@ import * as React from "react"; import { Column, Filter } from "react-table"; import { IColumnVisibility } from "../../../interfaces/IColumnVisibility"; -import { SubscribeButtonGroup } from "../../linkButtons"; +import { SubscribeButton as SubscribeButtonBase } from "../../linkButtons"; export const SubscribeButton = (columnVisibility: IColumnVisibility[]) => ({ Header: @@ -11,7 +11,7 @@ export const SubscribeButton = (columnVisibility: IColumnVisibility[]) => ({ filterable: true, filterMethod: (f: Filter, r: any[]) => filterMethod(f, r), sortMethod: (a: string, b: string) => sortMethod(a, b), - Cell: (c: any) => , + Cell: (c: any) => , style: { textAlign: "center" }, width: 110, show: columnVisibility.filter((c: IColumnVisibility) => c.column === "Subscribe")[0].visible diff --git a/src/FilterLists.Web/src/modules/home/components/softwareIcon/SoftwareIcon.tsx b/src/FilterLists.Web/src/modules/home/components/softwareIcon/SoftwareIcon.tsx index 116ade61e..ca0c002a5 100644 --- a/src/FilterLists.Web/src/modules/home/components/softwareIcon/SoftwareIcon.tsx +++ b/src/FilterLists.Web/src/modules/home/components/softwareIcon/SoftwareIcon.tsx @@ -35,11 +35,11 @@ import { img34 } from "./imgs"; -interface IProps { +interface Props { id: number; }; -export const SoftwareIcon = (props: IProps) => +export const SoftwareIcon = (props: Props) => icons[props.id] ?