From b8980c00d363ea2fffc160ed9471c20bb4079127 Mon Sep 17 00:00:00 2001
From: Jeremy Kauffman <kauffj@gmail.com>
Date: Tue, 3 Oct 2017 17:52:53 -0400
Subject: [PATCH] update upgrade message

---
 CHANGELOG.md                      |  1 +
 ui/js/actions/app.js              |  7 ++++---
 ui/js/component/splash/view.jsx   |  7 +++++--
 ui/js/modal/modalRouter/view.jsx  |  2 +-
 ui/js/modal/modalUpgrade/view.jsx | 21 +++++++++++++++++----
 5 files changed, 28 insertions(+), 10 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f4b65d531..ced8f2502 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@ Web UI version numbers should always match the corresponding version of LBRY App
   * Updated the daemon from 0.16.1 to [0.16.3](https://github.com/lbryio/lbry/releases/tag/v0.16.3) to improve download performance and download issue detection.
   * There is no longer a minimum channel length (#645)
   * Changed the File page to make it clearer how to to open the folder for a file
+  * The upgrade message is now friendlier and includes a link to the release notes.
 
 ### Fixed
   * Improve layout (and implementation) of the icon panel in file tiles and cards
diff --git a/ui/js/actions/app.js b/ui/js/actions/app.js
index 0fb877573..0ccc6a977 100644
--- a/ui/js/actions/app.js
+++ b/ui/js/actions/app.js
@@ -10,6 +10,7 @@ import { doFetchDaemonSettings } from "actions/settings";
 import { doBalanceSubscribe } from "actions/wallet";
 import { doAuthenticate } from "actions/user";
 import { doFetchFileInfosAndPublishedClaims } from "actions/file_info";
+import * as modals from "constants/modal_types";
 
 const { remote, ipcRenderer, shell } = require("electron");
 const path = require("path");
@@ -96,7 +97,7 @@ export function doDownloadUpgrade() {
     dispatch({
       type: types.OPEN_MODAL,
       data: {
-        modal: "downloading",
+        modal: modals.DOWNLOADING,
       },
     });
   };
@@ -140,7 +141,7 @@ export function doCheckUpgradeAvailable() {
         dispatch({
           type: types.OPEN_MODAL,
           data: {
-            modal: "upgrade",
+            modal: modals.UPGRADE,
           },
         });
       }
@@ -166,7 +167,7 @@ export function doAlertError(errorList) {
     dispatch({
       type: types.OPEN_MODAL,
       data: {
-        modal: "error",
+        modal: modals.ERROR,
         modalProps: { error: errorList },
       },
     });
diff --git a/ui/js/component/splash/view.jsx b/ui/js/component/splash/view.jsx
index 7d6952b16..d785911f5 100644
--- a/ui/js/component/splash/view.jsx
+++ b/ui/js/component/splash/view.jsx
@@ -4,6 +4,7 @@ import LoadScreen from "../load_screen.js";
 import ModalIncompatibleDaemon from "modal/modalIncompatibleDaemon";
 import ModalUpgrade from "modal/modalUpgrade";
 import ModalDownloading from "modal/modalDownloading";
+import * as modals from "constants/modal_types";
 
 export class SplashScreen extends React.PureComponent {
   static propTypes = {
@@ -111,8 +112,10 @@ export class SplashScreen extends React.PureComponent {
         {modal == "incompatibleDaemon" &&
           this.state.isRunning &&
           <ModalIncompatibleDaemon />}
-        {modal == "upgrade" && this.state.isRunning && <ModalUpgrade />}
-        {modal == "downloading" && this.state.isRunning && <ModalDownloading />}
+        {modal == modals.UPGRADE && this.state.isRunning && <ModalUpgrade />}
+        {modal == modals.DOWNLOADING &&
+          this.state.isRunning &&
+          <ModalDownloading />}
       </div>
     );
   }
diff --git a/ui/js/modal/modalRouter/view.jsx b/ui/js/modal/modalRouter/view.jsx
index 8d2bf912e..710c3907e 100644
--- a/ui/js/modal/modalRouter/view.jsx
+++ b/ui/js/modal/modalRouter/view.jsx
@@ -103,7 +103,7 @@ class ModalRouter extends React.PureComponent {
   render() {
     const { modal, modalProps } = this.props;
 
-    switch (modal) {
+    switch ("upgrade") {
       case modals.UPGRADE:
         return <ModalUpgrade {...modalProps} />;
       case modals.DOWNLOADING:
diff --git a/ui/js/modal/modalUpgrade/view.jsx b/ui/js/modal/modalUpgrade/view.jsx
index a55d9ae31..a02789331 100644
--- a/ui/js/modal/modalUpgrade/view.jsx
+++ b/ui/js/modal/modalUpgrade/view.jsx
@@ -1,5 +1,6 @@
 import React from "react";
 import { Modal } from "modal/modal";
+import Link from "component/link";
 
 class ModalUpgrade extends React.PureComponent {
   render() {
@@ -8,16 +9,28 @@ class ModalUpgrade extends React.PureComponent {
     return (
       <Modal
         isOpen={true}
-        contentLabel={__("Update available")}
+        contentLabel={__("Upgrade available")}
         type="confirm"
         confirmButtonLabel={__("Upgrade")}
         abortButtonLabel={__("Skip")}
         onConfirmed={downloadUpgrade}
         onAborted={skipUpgrade}
       >
-        {__(
-          "Your version of LBRY is out of date and may be unreliable or insecure."
-        )}
+        <h3 className="text-center">{__("LBRY Just Got BTTR")}</h3>
+        <br />
+        <p>
+          {__("An updated version of LBRY is now available.")}
+          {" "}
+          {__("Your version is out of date and may be unreliable or insecure.")}
+        </p>
+        <p className="meta text-center">
+          {__("Want to know what has changed?")}
+          {" "} See the{" "}
+          <Link
+            label={__("release notes")}
+            href="https://github.com/lbryio/lbry-app/releases"
+          />.
+        </p>
       </Modal>
     );
   }