From fd675a41517b9afa1c212c7fddc0eb9ad7cda58a Mon Sep 17 00:00:00 2001
From: "Collin M. Barrett" <collinbarrett@users.noreply.github.com>
Date: Sun, 28 Jul 2019 19:26:39 -0500
Subject: [PATCH] pseudo fix multi-url Subscribe and View drop-left buttons,
 still needs CSS cleanup

ref #884
---
 src/FilterLists.Web/package-lock.json         | Bin 511285 -> 522401 bytes
 src/FilterLists.Web/package.json              |   1 +
 .../linkButtons/SubscribeButtonGroup.tsx      |  28 ++++++----------
 .../linkButtons/ViewButtonGroup.tsx           |  30 +++++++-----------
 .../home/components/linkButtons/button.css    |   2 +-
 5 files changed, 23 insertions(+), 38 deletions(-)

diff --git a/src/FilterLists.Web/package-lock.json b/src/FilterLists.Web/package-lock.json
index 0afdf1f95e55a7b69e4c161a0d903b6f080b802d..2d2ebe9fdc3eaccfaa938e34e2b33e5766c8b014 100644
GIT binary patch
delta 5542
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
SvJRg6v2kN-EL*?%;Qs=fM=oFh

delta 145
zcmV;C0B--G@gKFCAF!C%lQ82Flb`7nlStoPlYib3gKyrqZ{7hjleY_V0)be!%gh4U
z6Stb-0wI65p=1NkueYET1bnWy(ZmFDVYitl1&(32B8ml<o3~OZ216RR{ze9+5VxOU
z2HX(0#&rf+?w92c1RR%uMgatu104i1w{v9&WC6F^X9t%9w_t7uS1h;an+LgEo7+Gh

diff --git a/src/FilterLists.Web/package.json b/src/FilterLists.Web/package.json
index 07fa0c127..3f4481b7a 100644
--- a/src/FilterLists.Web/package.json
+++ b/src/FilterLists.Web/package.json
@@ -14,6 +14,7 @@
     "es6-promise": "^4.2.8",
     "moment": "^2.24.0",
     "react": "^16.8.6",
+    "react-bootstrap": "^1.0.0-beta.10",
     "react-dom": "^16.8.6",
     "react-router-dom": "^5.0.1",
     "react-scripts": "3.0.1",
diff --git a/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButtonGroup.tsx b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButtonGroup.tsx
index 1a9e4604e..af45b3d5f 100644
--- a/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButtonGroup.tsx
+++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/SubscribeButtonGroup.tsx
@@ -1,4 +1,5 @@
 import * as React from "react";
+import { DropdownButton, Dropdown } from "react-bootstrap";
 import { SubscribeButton } from "./SubscribeButton";
 
 interface IProps {
@@ -30,23 +31,14 @@ const SubscribeButtonGroupDropdown = (props: ISubscribeButtonGroupDropdownProps)
         mirrorIndex++;
     }
 
-    return <div className="btn-group-vertical dropleft fl-btn-link" role="group">
-        <BtnGroupDropSubscribe />
-        <div className="dropdown-menu" aria-labelledby="btnGroupDropSubscribe">
+    return <DropdownButton id="subscribe-dropdown" drop="left" variant="primary" title="Subscribe" className="fl-btn-link">
+        <Dropdown.Item >
             <SubscribeButton {...props} text={firstButtonText} />
-            {props.urlMirrors.map(
-                (m: string, i: number) =>
-                    <SubscribeButton {...props} url={m} text={`Mirror ${i + 1 + mirrorIndex}`} key={i} />)}
-        </div>
-    </div>;
+        </Dropdown.Item>
+        {props.urlMirrors.map(
+            (m: string, i: number) =>
+                <Dropdown.Item key={i}>
+                    <SubscribeButton {...props} url={m} text={`Mirror ${i + 1 + mirrorIndex}`} />
+                </Dropdown.Item>)}
+    </DropdownButton>;
 };
-
-const BtnGroupDropSubscribe = () =>
-    <button id="btnGroupDropSubscribe"
-        type="button"
-        className="btn btn-primary dropdown-toggle"
-        data-toggle="dropdown"
-        aria-haspopup="true"
-        aria-expanded="false">
-        Subscribe
-    </button>;
\ 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/ViewButtonGroup.tsx
index 51949f317..8f049ab5b 100644
--- a/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButtonGroup.tsx
+++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/ViewButtonGroup.tsx
@@ -1,4 +1,5 @@
 import * as React from "react";
+import { DropdownButton, Dropdown } from "react-bootstrap";
 import { ViewButton } from "./ViewButton";
 
 interface IProps {
@@ -29,23 +30,14 @@ const ViewButtonGroupDropdown = (props: IViewButtonGroupDropdownProps) => {
         mirrorIndex++;
     }
 
-    return <div className="btn-group-vertical dropleft fl-btn-link" role="group">
-        <BtnGroupDropView />
-        <div className="dropdown-menu" aria-labelledby="btnGroupDropView">
+    return <DropdownButton id="view-dropdown" drop="left" variant="primary" title="View" className="fl-btn-link">
+        <Dropdown.Item >
             <ViewButton {...props} text={firstButtonText} />
-            {props.urlMirrors.map(
-                (m: string, i: number) =>
-                    <ViewButton {...props} url={m} text={`Mirror ${i + 1 + mirrorIndex}`} key={i} />)}
-        </div>
-    </div>;
-};
-
-const BtnGroupDropView = () =>
-    <button id="btnGroupDropView"
-        type="button"
-        className="btn btn-primary dropdown-toggle"
-        data-toggle="dropdown"
-        aria-haspopup="true"
-        aria-expanded="false">
-        View
-    </button>;
\ No newline at end of file
+        </Dropdown.Item>
+        {props.urlMirrors.map(
+            (m: string, i: number) =>
+                <Dropdown.Item key={i}>
+                    <ViewButton {...props} url={m} text={`Mirror ${i + 1 + mirrorIndex}`} />
+                </Dropdown.Item>)}
+    </DropdownButton>;
+};
\ 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
index bace69595..58febdf12 100644
--- a/src/FilterLists.Web/src/modules/home/components/linkButtons/button.css
+++ b/src/FilterLists.Web/src/modules/home/components/linkButtons/button.css
@@ -4,7 +4,7 @@
     width: 100px;
 }
 
-.dropdown-menu {
+.dropdown-item {
     border: 0;
     min-width: 0;
     padding: 0;