Add ledger web-ui integration

Adds the ability both to notify the webui of when a wallet is created and the ability for the webui to call a function to create wallets too

browser/ui/brave_pages.cc

@@ -4,8 +4,6 @@
 
 #include "brave/browser/ui/brave_pages.h"
 
-#include "brave/browser/payments/payments_service.h"
-#include "brave/browser/payments/payments_service_factory.h"
 #include "brave/common/webui_url_constants.h"
 #include "chrome/browser/ui/browser.h"
 #include "chrome/browser/ui/singleton_tabs.h"
@@ -25,15 +23,4 @@ void ShowBraveAdblock(Browser* browser) {
       GetSingletonTabNavigateParams(browser, GURL(kBraveUIAdblockURL)));
 }
 
-void ShowBravePayments(Browser* browser) {
-  payments::PaymentsService* payments_service =
-      PaymentsServiceFactory::GetForProfile(browser->profile());
-
-  if (payments_service) {
-    payments_service->CreateWallet();
-    // wallet is not created at this point. Ledger library needs to be updated
-    // to provide some kind of callback when it is actually finished
-  }
-}
-
 }  // namespace brave

browser/ui/brave_pages.h

@@ -11,7 +11,6 @@ namespace brave {
 
 void ShowBraveAdblock(Browser* browser);
 void ShowBraveRewards(Browser* browser);
-void ShowBravePayments(Browser* browser);
 
 }  // namespace brave
 

browser/ui/webui/brave_rewards_ui.cc

@@ -4,12 +4,87 @@
 
 #include "brave/browser/ui/webui/brave_rewards_ui.h"
 
+#include "brave/browser/payments/payments_service.h"
+#include "brave/browser/payments/payments_service_factory.h"
 #include "brave/common/webui_url_constants.h"
+#include "chrome/browser/profiles/profile.h"
 #include "components/grit/brave_components_resources.h"
+#include "content/public/browser/web_ui_message_handler.h"
+#include "content/public/common/bindings_policy.h"
+
+
+using content::WebUIMessageHandler;
+
+namespace {
+
+// The handler for Javascript messages for Brave about: pages
+class RewardsDOMHandler : public WebUIMessageHandler {
+ public:
+  RewardsDOMHandler() {
+  }
+  ~RewardsDOMHandler() override {}
+
+  void Init();
+
+  // WebUIMessageHandler implementation.
+  void RegisterMessages() override;
+
+ private:
+  void HandleCreateWalletRequested(const base::ListValue* args);
+  void OnWalletCreated();
+  void OnWalletCreateFailed();
+  DISALLOW_COPY_AND_ASSIGN(RewardsDOMHandler);
+};
+
+void RewardsDOMHandler::RegisterMessages() {
+  web_ui()->RegisterMessageCallback("createWalletRequested",
+      base::BindRepeating(&RewardsDOMHandler::HandleCreateWalletRequested,
+                          base::Unretained(this)));
+}
+
+void RewardsDOMHandler::Init() {
+}
+
+void RewardsDOMHandler::HandleCreateWalletRequested(const base::ListValue* args) {
+#if defined(BRAVE_PAYMENTS_ENABLED)
+  Profile* profile = Profile::FromWebUI(web_ui());
+  payments::PaymentsService* payments_service =
+      PaymentsServiceFactory::GetForProfile(profile);
+
+  if (payments_service) {
+    payments_service->CreateWallet();
+  }
+
+  // TODO(bbondy): Use an observer or client override for when the wallet is actually
+  // created once the native-ledger library supports it.
+  OnWalletCreated();
+#else
+  OnWalletCreateFailed();
+#endif
+}
+
+void RewardsDOMHandler::OnWalletCreated() {
+  if (0 != (web_ui()->GetBindings() & content::BINDINGS_POLICY_WEB_UI)) {
+    web_ui()->CallJavascriptFunctionUnsafe("brave_rewards.walletCreated");
+  }
+}
+
+void RewardsDOMHandler::OnWalletCreateFailed() {
+  if (0 != (web_ui()->GetBindings() & content::BINDINGS_POLICY_WEB_UI)) {
+    web_ui()->CallJavascriptFunctionUnsafe("brave_rewards.walletCreateFailed");
+  }
+}
+
+}  // namespace
 
 BraveRewardsUI::BraveRewardsUI(content::WebUI* web_ui, const std::string& name)
     : BasicUI(web_ui, name, kRewardsJS,
         IDR_BRAVE_REWARDS_JS, IDR_BRAVE_REWARDS_HTML) {
+
+  auto handler_owner = std::make_unique<RewardsDOMHandler>();
+  RewardsDOMHandler * handler = handler_owner.get();
+  web_ui->AddMessageHandler(std::move(handler_owner));
+  handler->Init();
 }
 
 BraveRewardsUI::~BraveRewardsUI() {

components/brave_rewards_ui/actions/rewards_actions.js

@@ -0,0 +1,17 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const types = require('../constants/rewards_types')
+
+export const createWalletRequested = () => ({
+  type: types.CREATE_WALLET_REQUESTED
+})
+
+export const walletCreated = () => ({
+  type: types.WALLET_CREATED
+})
+
+export const walletCreateFailed = () => ({
+  type: types.WALLET_CREATE_FAILED
+})

components/brave_rewards_ui/brave_rewards.html

@@ -5,8 +5,18 @@
 <meta name="viewport" content="width=device-width">
 <title>Rewards</title>
 <link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
+<link rel="import" href="chrome://resources/html/cr.html">
+<script src="chrome://resources/js/cr.js"></script>
+<script src="chrome://resources/js/load_time_data.js"></script>
+<script src="chrome://resources/js/util.js"></script>
+<script src="chrome://resources/js/i18n_template.js"></script>
 <script src="chrome://rewards/brave_rewards.js"></script>
+<script src="strings.js"></script>
+<style>
+  #root { height: 100%; }
+</style>
+</head>
 <body>
-  Brave Rewards
+<div id="root"></div>
 </body>
 </html>

components/brave_rewards_ui/brave_rewards.js

@@ -1 +1,46 @@
-console.log('brave_rewards.js loaded')
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const React = require('react')
+const { render } = require('react-dom')
+const { Provider } = require('react-redux')
+const App = require('./components/app')
+const { bindActionCreators } = require('redux')
+
+window.cr.define('brave_rewards', function () {
+  'use strict'
+
+  function initialize () {
+    const store = require('./store')
+    render(
+      <Provider store={store}>
+        <App />
+      </Provider>,
+      document.getElementById('root'))
+    window.i18nTemplate.process(window.document, window.loadTimeData)
+  }
+
+  function getActions () {
+    const store = require('./store')
+    const rewardsActions = require('./actions/rewards_actions')
+    return bindActionCreators(rewardsActions, store.dispatch.bind(store))
+  }
+
+  function walletCreated () {
+    getActions().walletCreated()
+  }
+
+  function walletCreateFailed () {
+    getActions().walletCreateFailed()
+  }
+
+  return {
+    initialize,
+    walletCreated,
+    walletCreateFailed
+  }
+})
+
+document.addEventListener('DOMContentLoaded', window.brave_rewards.initialize)
+

components/brave_rewards_ui/components/app.js

@@ -0,0 +1,59 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const React = require('react')
+const { bindActionCreators } = require('redux')
+const { connect } = require('react-redux')
+const rewardsActions = require('../actions/rewards_actions')
+
+const CreateWalletLink = (props) =>
+  <div>
+    <a href='#' onClick={props.createWalletClicked}>Create Wallet</a>
+  </div>
+
+class RewardsPage extends React.Component {
+  constructor (props) {
+    super(props)
+    this.onCreateWalletClicked = this.onCreateWalletClicked.bind(this)
+  }
+
+  onCreateWalletClicked() {
+    this.actions.createWalletRequested()
+  }
+
+  get actions () {
+    return this.props.actions
+  }
+
+  render () {
+    const { rewardsData } = this.props
+    return (
+      <div>
+        <CreateWalletLink createWalletClicked={this.onCreateWalletClicked} />
+        {
+          rewardsData.walletCreated
+          ? <div>Wallet Created!</div>
+          : null
+        }
+        {
+          rewardsData.walletCreateFailed
+          ? <div>Wallet Create Failed!</div>
+          : null
+        }
+      </div>)
+  }
+}
+
+const mapStateToProps = (state) => ({
+  rewardsData: state.rewardsData
+})
+
+const mapDispatchToProps = (dispatch) => ({
+  actions: bindActionCreators(rewardsActions, dispatch)
+})
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(RewardsPage)

components/brave_rewards_ui/constants/rewards_types.js

@@ -0,0 +1,7 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+export const CREATE_WALLET_REQUESTED = 'CREATE_WALLET_REQUESTED'
+export const WALLET_CREATED = 'WALLET_CREATED'
+export const WALLET_CREATE_FAILED = 'WALLET_CREATE_FAILED'

components/brave_rewards_ui/reducers/index.js

@@ -0,0 +1,12 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+import { combineReducers } from 'redux'
+import rewardsReducer from './rewards_reducer'
+
+const combinedReducer = combineReducers({
+  rewardsData: rewardsReducer
+})
+
+export default combinedReducer

components/brave_rewards_ui/reducers/rewards_reducer.js

@@ -0,0 +1,37 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/* global chrome */
+
+const types = require('../constants/rewards_types')
+const storage = require('../storage')
+
+const rewardsReducer = (state, action) => {
+  if (state === undefined) {
+    state = storage.load() || {}
+    state = Object.assign(storage.getInitialState(), state)
+  }
+  const startingState = state
+  switch (action.type) {
+    case types.CREATE_WALLET_REQUESTED:
+      chrome.send('createWalletRequested', []);
+      break
+    case types.WALLET_CREATED:
+        state = {... state}
+        state.walletCreated = true
+      break
+    case types.WALLET_CREATE_FAILED:
+        state = {... state}
+        state.walletCreateFailed = true
+      break
+  }
+
+  if (state !== startingState) {
+    storage.debouncedSave(state)
+  }
+
+  return state
+}
+
+export default rewardsReducer

components/brave_rewards_ui/storage.js

@@ -0,0 +1,30 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const debounce = require('../common/debounce')
+
+const keyName = 'rewards-data'
+
+const cleanData = (state) => ({})
+
+module.exports.getInitialState = () => cleanData({})
+
+module.exports.load = () => {
+  const data = window.localStorage.getItem(keyName)
+  let state
+  if (data) {
+    try {
+      state = JSON.parse(data)
+    } catch (e) {
+      console.error('Could not parse local storage data: ', e)
+    }
+  }
+  return cleanData(state)
+}
+
+module.exports.debouncedSave = debounce((data) => {
+  if (data) {
+    window.localStorage.setItem(keyName, JSON.stringify(cleanData(data)))
+  }
+}, 50)

components/brave_rewards_ui/store.js

@@ -0,0 +1,9 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+import { createStore } from 'redux'
+import reducers from './reducers'
+
+const store = createStore(reducers)
+module.exports = store

components/resources/BUILD.gn

@@ -21,6 +21,13 @@ transpile_includes = [
   "../brave_new_tab_ui/reducers/newTabReducer.js",
   # Brave Rewards
   "../brave_rewards_ui/brave_rewards.html",
+  "../brave_rewards_ui/components/app.js",
+  "../brave_rewards_ui/constants/rewards_types.js",
+  "../brave_rewards_ui/actions/rewards_actions.js",
+  "../brave_rewards_ui/storage.js",
+  "../brave_rewards_ui/store.js",
+  "../brave_rewards_ui/reducers/index.js",
+  "../brave_rewards_ui/reducers/rewards_reducer.js",
   # Brave welcome page
   "../brave_welcome_ui/brave_welcome.html",
   # Brave adblock page