diff --git a/src/FilterLists.Web.V2/src/components/LinkButton.tsx b/src/FilterLists.Web.V2/src/components/LinkButton.tsx
new file mode 100644
index 000000000..94d4da593
--- /dev/null
+++ b/src/FilterLists.Web.V2/src/components/LinkButton.tsx
@@ -0,0 +1,23 @@
+import { Button } from 'antd';
+import { ButtonType } from 'antd/lib/button';
+import React from 'react';
+
+interface Props {
+ url: string;
+ text: string;
+ title?: string;
+ type?: ButtonType;
+ icon?: string;
+};
+
+export const LinkButton = (props: Props) =>
+ ;
\ No newline at end of file
diff --git a/src/FilterLists.Web.V2/src/components/ListDetailsButton.tsx b/src/FilterLists.Web.V2/src/components/ListDetailsButton.tsx
index 18e90ff58..168e64a55 100644
--- a/src/FilterLists.Web.V2/src/components/ListDetailsButton.tsx
+++ b/src/FilterLists.Web.V2/src/components/ListDetailsButton.tsx
@@ -11,6 +11,7 @@ interface Props {
export const ListDetailsButton = (props: RouteComponentProps & Props) =>
;
\ No newline at end of file
diff --git a/src/FilterLists.Web.V2/src/components/ListDetailsDrawer.tsx b/src/FilterLists.Web.V2/src/components/ListDetailsDrawer.tsx
index e9228ada5..c37840f0e 100644
--- a/src/FilterLists.Web.V2/src/components/ListDetailsDrawer.tsx
+++ b/src/FilterLists.Web.V2/src/components/ListDetailsDrawer.tsx
@@ -1,4 +1,5 @@
-import { Drawer } from 'antd';
+import { Divider, Drawer } from 'antd';
+import ButtonGroup from 'antd/lib/button/button-group';
import React from 'react';
import { RouteComponentProps } from 'react-router-dom';
@@ -7,7 +8,8 @@ import { List } from '../interfaces/List';
import { Tag } from '../interfaces/Tag';
import { Description } from './Description';
import { LanguageCloud } from './languageCloud';
-import { SubscribeButton } from './subscribeButton';
+import { LinkButton } from './LinkButton';
+import { SubscribeButton } from './SubscribeButton';
import { TagCloud } from './tagCloud';
interface Props {
@@ -46,7 +48,55 @@ export class ListDetailsDrawer extends React.Component this.props.list.tagIds.includes(t.id))} showLabel={true} />
: null}
-
+
+
+ {this.props.list.viewUrl && }
+ {this.props.list.viewUrl &&
+ }
+ {this.props.list.homeUrl &&
+ }
+ {this.props.list.policyUrl &&
+ }
+ {this.props.list.emailAddress &&
+ }
+ {this.props.list.issuesUrl &&
+ }
+ {this.props.list.submissionUrl &&
+ }
+ {this.props.list.forumUrl &&
+ }
+ {this.props.list.chatUrl &&
+ }
+ {this.props.list.donateUrl &&
+ }
+
}
diff --git a/src/FilterLists.Web.V2/src/components/SubscribeButton.tsx b/src/FilterLists.Web.V2/src/components/SubscribeButton.tsx
new file mode 100644
index 000000000..2fc226c62
--- /dev/null
+++ b/src/FilterLists.Web.V2/src/components/SubscribeButton.tsx
@@ -0,0 +1,67 @@
+import { Button } from 'antd';
+import { ButtonProps, ButtonType } from 'antd/lib/button';
+import React from 'react';
+
+interface Props {
+ name: string;
+ viewUrl: string;
+ viewUrlMirrors: string[];
+};
+
+export const SubscribeButton = (props: Props): JSX.Element => {
+ const buttonProps = buildButtonProps(props.name, props.viewUrl);
+ return
+
+ {props.viewUrlMirrors && props.viewUrlMirrors.length &&
+ props.viewUrlMirrors.map((viewUrlMirror: string, i: number) => {
+ const buttonProps = buildButtonProps(props.name, viewUrlMirror);
+ return
+ })}
+
+};
+
+const buildButtonProps = (name: string, viewUrl: string): [ButtonProps, boolean] => {
+ let type: ButtonType = "primary";
+ let disabled: boolean = false;
+
+ const hrefLocation = `${encodeURIComponent(viewUrl)}`;
+ const hrefTitle = `${encodeURIComponent(name)}`;
+ let href = `abp:subscribe?location=${hrefLocation}&title=${hrefTitle}`;
+
+ let prefixes: string[] = [];
+ let message = `Subscribe to ${name} with a browser extension supporting the "abp:" protocol (e.g. uBlock Origin, Adblock Plus).`;
+
+ // HTTP protocols
+ if (viewUrl.includes(".onion/")) {
+ type = "dashed";
+ prefixes.push("TOR");
+ }
+ if (viewUrl.includes("http://")) {
+ type = "danger";
+ prefixes.push("INSECURE");
+ }
+
+ // Software protocols
+ if (viewUrl.includes(".tpl")) {
+ disabled = true; // IE not supported by FilterLists
+ }
+ if (viewUrl.includes(".lsrules") || viewUrl.includes("?hostformat=littlesnitch")) {
+ href = `x-littlesnitch:subscribe-rules?url=${hrefLocation}`;
+ message = `Subscribe to ${name} with Little Snitch's rule group subscription feature.`;
+ }
+
+ const title = `${prefixes.length ? prefixes.join(" | ") + " | " : ""}${message}`;
+
+ return [{ type, href, title }, disabled]
+}
diff --git a/src/FilterLists.Web.V2/src/components/subscribeButton/SubscribeButton.module.css b/src/FilterLists.Web.V2/src/components/subscribeButton/SubscribeButton.module.css
deleted file mode 100644
index 8cea8c069..000000000
--- a/src/FilterLists.Web.V2/src/components/subscribeButton/SubscribeButton.module.css
+++ /dev/null
@@ -1,14 +0,0 @@
-.sub_li {
- /* reduce vertical white space around dropdown items */
- height: 24px !important;
-}
-
-.sub_a {
- /* fix font color on dropdown buttons */
- color: #fff !important;
-}
-
-.single {
- /* make non-dropdown button equivalent width to dropdown */
- width: 106.81px;
-}
diff --git a/src/FilterLists.Web.V2/src/components/subscribeButton/SubscribeButton.tsx b/src/FilterLists.Web.V2/src/components/subscribeButton/SubscribeButton.tsx
deleted file mode 100644
index 41a587c36..000000000
--- a/src/FilterLists.Web.V2/src/components/subscribeButton/SubscribeButton.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-import { Button, Dropdown, Menu } from 'antd';
-import { ButtonProps, ButtonType } from 'antd/lib/button';
-import React from 'react';
-
-import styles from './SubscribeButton.module.css';
-
-//TODO: import DropdownButtonType from antd rather than redefining if they export the type
-//import { DropdownButtonType } from "antd/lib/dropdown";
-declare type DropdownButtonType = 'primary' | 'ghost' | 'dashed';
-
-interface Props {
- name: string;
- viewUrl: string;
- viewUrlMirrors: string[];
-};
-
-export const SubscribeButton = (props: Props): JSX.Element => {
- const buttonProps = buildButtonProps(props.name, props.viewUrl);
- return (props.viewUrlMirrors && props.viewUrlMirrors.length)
- ?
- :
-
-
-};
-
-const ButtonDropdown = (props: Props): JSX.Element => {
- const buttonProps = buildButtonProps(props.name, props.viewUrl);
- return }>
- Subscribe
- ;
-};
-
-interface DropdownOverlayProps {
- name: string;
- viewUrlMirrors: string[];
-};
-
-const DropdownOverlay = (props: DropdownOverlayProps): JSX.Element =>
- ;
-
-const buildButtonProps = (name: string, viewUrl: string): [ButtonProps, boolean] => {
- let type: ButtonType = "primary";
- let disabled: boolean = false;
-
- const hrefLocation = `${encodeURIComponent(viewUrl)}`;
- const hrefTitle = `${encodeURIComponent(name)}`;
- let href = `abp:subscribe?location=${hrefLocation}&title=${hrefTitle}`;
-
- let prefixes: string[] = [];
- let message = `Subscribe to ${name} with a browser extension supporting the "abp:" protocol (e.g. uBlock Origin, Adblock Plus).`;
-
- // HTTP protocols
- if (viewUrl.includes(".onion/")) {
- type = "dashed";
- prefixes.push("TOR");
- }
- if (viewUrl.includes("http://")) {
- type = "danger";
- prefixes.push("INSECURE");
- }
-
- // Software protocols
- if (viewUrl.includes(".tpl")) {
- disabled = true; // IE not supported by FilterLists
- }
- if (viewUrl.includes(".lsrules") || viewUrl.includes("?hostformat=littlesnitch")) {
- href = `x-littlesnitch:subscribe-rules?url=${hrefLocation}`;
- message = `Subscribe to ${name} with Little Snitch's rule group subscription feature.`;
- }
-
- const title = `${prefixes.length ? prefixes.join(" | ") + " | " : ""}${message}`;
-
- return [{ type, href, title }, disabled]
-}
diff --git a/src/FilterLists.Web.V2/src/components/subscribeButton/index.ts b/src/FilterLists.Web.V2/src/components/subscribeButton/index.ts
deleted file mode 100644
index 08f333155..000000000
--- a/src/FilterLists.Web.V2/src/components/subscribeButton/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-import { SubscribeButton } from './SubscribeButton';
-
-export { SubscribeButton }
\ No newline at end of file