Added subs management (wip)

imports/ui/components/AuthenticatedNavigation/AuthenticatedNavigation.js

@@ -19,6 +19,9 @@ const AuthenticatedNavigation = ({ name, history, props }) => (
     <LinkContainer className="nav-item" anchorClassName="nav-link" to="/documents">
       <NavItem eventKey={5} href="/documents">Documents</NavItem>
     </LinkContainer>
+    <LinkContainer className="nav-item" anchorClassName="nav-link" to="/documents">
+      <NavItem eventKey={5.01} href="/subscriptions">Subscriptions</NavItem>
+    </LinkContainer>
     <LinkContainer className="nav-item" anchorClassName="nav-link" to="/profile">
       <NavItem eventKey={5.1} href="/profile">{name}</NavItem>
     </LinkContainer>
@@ -30,7 +33,7 @@ const AuthenticatedNavigation = ({ name, history, props }) => (
 );
 
 AuthenticatedNavigation.propTypes = {
-  name: PropTypes.string.isRequired,
+  name: PropTypes.string.isRequired
 
 };
 

imports/ui/components/SelectionMap/SelectionMap.js

@@ -33,7 +33,7 @@ class SelectionMap extends Component {
     this.updatePosition = this.updatePosition.bind(this);
     this.fit = this.fit.bind(this);
     this.addScale = this.addScale.bind(this);
-    this.doSubs = this.doSubs.bind(this);
+    this.onSubs = this.onSubs.bind(this);
   }
 
   componentDidMount() {
@@ -57,6 +57,13 @@ class SelectionMap extends Component {
     this.fit();
   }
 
+  onSubs() {
+    this.props.onSubs({
+      location: { lat: this.state.center[0], lon: this.state.center[1] },
+      distance: this.state.distance
+    });
+  }
+
   getMap() {
     return this.selectionMap.leafletElement;
   }
@@ -92,13 +99,6 @@ class SelectionMap extends Component {
     Leaflet.control.graphicScale([options]).addTo(map);
   }
 
-  doSubs() { // event param not used
-    this.props.history.push(
-      '/login',
-      { subscription: { center: this.state.center, distance: this.state.distance } }
-    );
-  }
-
   isValidState() {
     return this.state.center && this.state.center[0] && this.state.distance;
   }
@@ -152,9 +152,9 @@ class SelectionMap extends Component {
               <ButtonToolbar>
                 <Button
                     bsStyle="success"
-                    onClick={event => this.doSubs(event)}
+                    onClick={event => this.onSubs(event)}
                 >
-                  {this.props.t('Subscribirme a fuegos en este rádio')}
+                  {this.props.subsBtn}
                 </Button>
               </ButtonToolbar>
             </Control>
@@ -165,11 +165,12 @@ class SelectionMap extends Component {
 }
 
 SelectionMap.propTypes = {
-  history: PropTypes.object.isRequired,
   t: PropTypes.func.isRequired,
-  center: PropTypes.array,
+  center: PropTypes.arrayOf(PropTypes.number),
   distance: PropTypes.number,
-  onSelection: PropTypes.func.isRequired
+  onSelection: PropTypes.func.isRequired,
+  subsBtn: PropTypes.string.isRequired,
+  onSubs: PropTypes.func.isRequired
 };
 
 export default translate([], { wait: true })(withTracker(props => ({

imports/ui/components/SubscriptionEditor/SubscriptionEditor.js

@@ -0,0 +1,60 @@
+/* eslint-disable max-len, no-return-assign */
+/* eslint-disable react/jsx-indent */
+/* eslint-disable react/jsx-indent-props */
+/* eslint-disable import/no-absolute-path */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Meteor } from 'meteor/meteor';
+import { Bert } from 'meteor/themeteorchef:bert';
+import FireSubscription from '/imports/ui/pages/FireSubscription/FireSubscription';
+import { translate } from 'react-i18next';
+
+class SubscriptionEditor extends React.Component {
+  onSubs(value) {
+    const { t, history } = this.props;
+    const existingSubscription = this.props.doc && this.props.doc._id;
+    const methodToCall = existingSubscription ? 'subscriptions.update' : 'subscriptions.insert';
+    const doc = {
+      location: value.location,
+      distance: value.distance
+    };
+
+    if (existingSubscription) doc._id = existingSubscription;
+
+    Meteor.call(methodToCall, doc, (error, subscriptionId) => {
+      if (error) {
+        Bert.alert(error.reason, 'danger');
+      } else {
+        const confirmation = existingSubscription ? t('Suscripción actualizada') : t('Suscripción añadida');
+        Bert.alert(confirmation, 'success');
+        history.push(`/subscriptions/${subscriptionId}`);
+      }
+    });
+  }
+
+  render() {
+    const { doc, t } = this.props;
+    const isEdit = doc && doc._id;
+    return (
+      <FireSubscription
+          center={[doc.location.lat, doc.location.lon]}
+          distance={doc.distance}
+          focusInput={!isEdit}
+          subsBtn={isEdit ? t('Actualizar') : t('Subscribirme a fuegos en este rádio')}
+          onSubs={state => this.onSubs(state)}
+      />
+    );
+  }
+}
+SubscriptionEditor.defaultProps = {
+  doc: { location: { lat: null, lot: null }, distance: null }
+};
+
+SubscriptionEditor.propTypes = {
+  doc: PropTypes.object,
+  t: PropTypes.func.isRequired,
+  history: PropTypes.object.isRequired
+};
+
+export default translate([], { wait: true })(SubscriptionEditor);