Support GET /patron/v1/funding

app/gabsocial/actions/patron.js

@@ -0,0 +1,47 @@
+import api, { getLinks } from '../api';
+import openDB from '../storage/db';
+import { me } from 'gabsocial/initial_state';
+
+export const PATRON_FUNDING_FETCH_REQUEST = 'PATRON_FUNDING_FETCH_REQUEST';
+export const PATRON_FUNDING_FETCH_SUCCESS = 'PATRON_FUNDING_FETCH_SUCCESS';
+export const PATRON_FUNDING_FETCH_FAIL    = 'PATRON_FUNDING_FETCH_FAIL';
+export const PATRON_FUNDING_IMPORT        = 'PATRON_FUNDING_IMPORT';
+
+export function fetchFunding() {
+  return (dispatch, getState) => {
+    api(getState).get(`/patron/v1/funding`).then(response => {
+      dispatch(importFetchedFunding(response.data));
+    }).then(() => {
+      dispatch(fetchFundingSuccess());
+    }).catch(error => {
+      dispatch(fetchFundingFail(error));
+    });
+  };
+};
+
+export function importFetchedFunding(funding) {
+  return {
+    type: PATRON_FUNDING_IMPORT,
+    funding
+  };
+}
+
+export function fetchFundingRequest() {
+  return {
+    type: PATRON_FUNDING_FETCH_REQUEST,
+  };
+};
+
+export function fetchAccountSuccess() {
+  return {
+    type: PATRON_FUNDING_FETCH_SUCCESS,
+  };
+};
+
+export function fetchFundingFail(error) {
+  return {
+    type: PATRON_FUNDING_FETCH_FAIL,
+    error,
+    skipAlert: true,
+  };
+};

app/gabsocial/features/ui/components/funding_panel.js

@@ -5,19 +5,30 @@ import { injectIntl, FormattedMessage } from 'react-intl';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import ProgressBar from '../../../components/progress_bar';
-import { funding } from '../../../initial_state';
-
+import { fetchFunding } from 'gabsocial/actions/patron';
 
 class FundingPanel extends ImmutablePureComponent {
+
+  componentDidMount () {
+    this.props.dispatch(fetchFunding());
+  }
+
   render() {
-    const { goal, goal_text } = this.props;
-    const goal_reached = funding.amount >= goal;
+    const { funding } = this.props;
+
+    if (!funding) {
+      return null;
+    }
+
+    const goal = funding.getIn(['goals', '0', 'amount']);
+    const goal_text = funding.getIn(['goals', '0', 'text']);
+    const goal_reached = funding.get('amount') >= goal;
     let ratio_text;
 
     if (goal_reached) {
       ratio_text = <><strong>${Math.floor(goal/100)}</strong> per month<span className='funding-panel__reached'>&mdash; reached!</span></>;
     } else {
-      ratio_text = <><strong>${Math.floor(funding.amount/100)} out of ${Math.floor(goal/100)}</strong> per month</>;
+      ratio_text = <><strong>${Math.floor(funding.get('amount')/100)} out of ${Math.floor(goal/100)}</strong> per month</>;
     }
 
     return (
@@ -32,7 +43,7 @@ class FundingPanel extends ImmutablePureComponent {
           <div className='funding-panel__ratio'>
             {ratio_text}
           </div>
-          <ProgressBar progress={funding.amount/goal} />
+          <ProgressBar progress={funding.get('amount')/goal} />
           <div className='funding-panel__description'>
             {goal_text}
           </div>
@@ -43,9 +54,9 @@ class FundingPanel extends ImmutablePureComponent {
   }
 };
 
-
 const mapStateToProps = state => {
   return {
+    funding: state.getIn(['patron', 'funding'])
   };
 };
 

app/gabsocial/pages/home_page.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import { me, funding } from 'gabsocial/initial_state';
+import soapbox from 'soapbox/config';
 import PropTypes from 'prop-types';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import WhoToFollowPanel from '../features/ui/components/who_to_follow_panel';
@@ -21,7 +22,6 @@ export default @connect(mapStateToProps)
 class HomePage extends ImmutablePureComponent {
   render () {
     const {children, account} = this.props;
-    const hasFunding = funding && funding.goal && funding.goal.amount && funding.goal.text;
 
     return (
       <div className='page'>
@@ -31,7 +31,7 @@ class HomePage extends ImmutablePureComponent {
             <div className='columns-area__panels__pane columns-area__panels__pane--left'>
               <div className='columns-area__panels__pane__inner'>
                 <UserPanel />
-                {hasFunding && <FundingPanel goal={funding.goal.amount} goal_text={funding.goal.text} />}
+                {soapbox.features.patron && <FundingPanel />}
                 <PromoPanel />
                 <LinkFooter />
               </div>

app/gabsocial/reducers/index.js

@@ -37,6 +37,7 @@ import group_relationships from './group_relationships';
 import group_lists from './group_lists';
 import group_editor from './group_editor';
 import sidebar from './sidebar';
+import patron from './patron';
 
 const reducers = {
   dropdown_menu,
@@ -77,6 +78,7 @@ const reducers = {
   group_lists,
   group_editor,
   sidebar,
+  patron,
 };
 
 export default combineReducers(reducers);

app/gabsocial/reducers/patron.js

@@ -0,0 +1,13 @@
+import { PATRON_FUNDING_IMPORT } from '../actions/patron';
+import { Map as ImmutableMap, fromJS } from 'immutable';
+
+const initialState = ImmutableMap();
+
+export default function patron(state = initialState, action) {
+  switch(action.type) {
+  case PATRON_FUNDING_IMPORT:
+    return state.set('funding', fromJS(action.funding));
+  default:
+    return state;
+  }
+};

app/soapbox/config.js

@@ -0,0 +1,5 @@
+export default {
+  features: {
+    patron: true,
+  },
+}

webpack/development.js

@@ -10,6 +10,7 @@ const watchOptions = {};
 
 // TODO: Make this configurable
 const backendUrl = 'http://localhost:4000';
+const patronUrl  = 'http://localhost:5000';
 
 if (process.env.VAGRANT) {
   // If we are in Vagrant, we can't rely on inotify to update us with changed
@@ -68,6 +69,7 @@ module.exports = merge(sharedConfig, {
       '/socket': backendUrl,
       '/oauth/revoke': backendUrl,
       '/.well-known/webfinger': backendUrl,
+      '/patron': patronUrl,
     },
   },
 });