(feat) referral notifications view added

__tests__/notifications/notification/view/ReferralCompleteView.js

+import 'react-native';
+import React from 'react';
+import { Text, TouchableOpacity } from "react-native";
+import { shallow } from 'enzyme';
+import ReferralCompleteView from '../../../../src/notifications/notification/view/ReferralCompleteView';
+import styles from '../../../../src/notifications/notification/style';
+
+// fake data generation
+import boostNotificationFactory from '../../../../__mocks__/fake/notifications/BoostNotificationFactory';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+
+  const entity = boostNotificationFactory('referral_complete');
+
+  const notification = renderer.create(
+    <ReferralCompleteView styles={styles} entity={entity}/>
+  ).toJSON();
+
+  expect(notification).toMatchSnapshot();
+});
\ No newline at end of file

__tests__/notifications/notification/view/ReferralPEndingView.js

+import 'react-native';
+import React from 'react';
+import { Text, TouchableOpacity } from "react-native";
+import { shallow } from 'enzyme';
+import ReferralPendingView from '../../../../src/notifications/notification/view/ReferralPendingView';
+import styles from '../../../../src/notifications/notification/style';
+
+// fake data generation
+import boostNotificationFactory from '../../../../__mocks__/fake/notifications/BoostNotificationFactory';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+
+  const entity = boostNotificationFactory('referral_pending');
+
+  const notification = renderer.create(
+    <ReferralPendingView styles={styles} entity={entity}/>
+  ).toJSON();
+
+  expect(notification).toMatchSnapshot();
+});
\ No newline at end of file

__tests__/notifications/notification/view/ReferralPingView.js

+import 'react-native';
+import React from 'react';
+import { Text, TouchableOpacity } from "react-native";
+import { shallow } from 'enzyme';
+import ReferralPingView from '../../../../src/notifications/notification/view/ReferralPingView';
+import styles from '../../../../src/notifications/notification/style';
+
+// fake data generation
+import boostNotificationFactory from '../../../../__mocks__/fake/notifications/BoostNotificationFactory';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+
+  const entity = boostNotificationFactory('referral_ping');
+
+  const notification = renderer.create(
+    <ReferralPingView styles={styles} entity={entity}/>
+  ).toJSON();
+
+  expect(notification).toMatchSnapshot();
+});
\ No newline at end of file

__tests__/notifications/notification/view/__snapshots__/ReferralCompleteView.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders correctly 1`] = `
+<View
+  style={
+    Object {
+      "flexDirection": "row",
+      "flexWrap": "wrap",
+    }
+  }
+>
+  <Text
+    onPress={[Function]}
+  >
+    You've earned tokens for the completed referral of 
+    <Text
+      style={
+        Object {
+          "color": "#444",
+          "fontWeight": "bold",
+        }
+      }
+    >
+      someUser
+    </Text>
+    
+  </Text>
+</View>
+`;

__tests__/notifications/notification/view/__snapshots__/ReferralPEndingView.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders correctly 1`] = `
+<View
+  style={
+    Object {
+      "flexDirection": "row",
+      "flexWrap": "wrap",
+    }
+  }
+>
+  <Text
+    onPress={[Function]}
+  >
+    You have a pending referral! 
+    <Text
+      style={
+        Object {
+          "color": "#444",
+          "fontWeight": "bold",
+        }
+      }
+    >
+      someUser
+    </Text>
+     used your referral link when they signed up for Minds. You'll get tokens once they join the rewards program and set up their wallet
+  </Text>
+</View>
+`;

__tests__/notifications/notification/view/__snapshots__/ReferralPingView.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders correctly 1`] = `
+<View
+  style={
+    Object {
+      "flexDirection": "row",
+      "flexWrap": "wrap",
+    }
+  }
+>
+  <Text
+    onPress={[Function]}
+  >
+    Free tokens are waiting for you! Once you join the rewards program by setting up your Minds wallet, both you and 
+    <Text
+      style={
+        Object {
+          "color": "#444",
+          "fontWeight": "bold",
+        }
+      }
+    >
+      someUser
+    </Text>
+     will earn tokens for your referral
+  </Text>
+</View>
+`;

locales/en.json

@@ -315,6 +315,9 @@
     "errorRemoving":"Error removing comment"
   },
   "notification":{
+    "referralPing":"Free tokens are waiting for you! Once you join the rewards program by setting up your Minds wallet, both you and &{user}& will earn tokens for your referral",
+    "referralPending":"You have a pending referral! &{user}& used your referral link when they signed up for Minds. You'll get tokens once they join the rewards program and set up their wallet",
+    "referralComplete":"You've earned tokens for the completed referral of &{user}&",
     "boostAccepted":"{{count}} tokens &{description}& were accepted.",
     "boostCompleted":"{{impressions}}/{{impressions}} views &{description}& have been met.",
     "boostGiftView":"{{name}} gifted you {{impressions}} views &{description}&",

src/notifications/notification/Notification.js

@@ -45,12 +45,15 @@ import WelcomePointsView from './view/WelcomePointsView';
 import WireHappenedView from './view/WireHappenedView';
 import ReportActionedView from './view/ReportActionedView';
 import MessengerInviteView from './view/MessengerInviteView';
+import RewardsStateIncreaseView from './view/RewardsStateIncreaseView';
+import RewardsStateDecreaseView from './view/RewardsStateDecreaseView';
+import RewardsStateDecreaseTodayView from './view/RewardStateDecreaseTodayView';
+import RewardsSummaryView from './view/RewardsSummaryView';
+import ReferralCompleteView from './view/ReferralCompleteView';
+import ReferralPendingView from './view/ReferralPendingView';
+import ReferralPingView from './view/ReferralPingView';
 
 import styles from './style';
-import RewardsStateIncreaseView from "./view/RewardsStateIncreaseView";
-import RewardsStateDecreaseView from "./view/RewardsStateDecreaseView";
-import RewardsStateDecreaseTodayView from "./view/RewardStateDecreaseTodayView";
-import RewardsSummaryView from "./view/RewardsSummaryView";
 
 /**
  * Main Notification row Component
@@ -194,6 +197,15 @@ export default class Notification extends Component {
       case "wire_happened":
         return <WireHappenedView entity={entity} navigation={this.props.navigation} styles={styles} />
 
+      case "referral_complete":
+        return <ReferralCompleteView entity={entity} navigation={this.props.navigation} styles={styles} />
+
+      case "referral_pending":
+        return <ReferralPendingView entity={entity} navigation={this.props.navigation} styles={styles} />
+
+      case "referral_ping":
+        return <ReferralPingView entity={entity} navigation={this.props.navigation} styles={styles} />
+
       case "report_actioned":
         return <ReportActionedView entity={entity} navigation={this.props.navigation} styles={styles} />
 

src/notifications/notification/view/ReferralCompleteView.js

+import React, {
+  PureComponent
+} from 'react';
+
+import {
+  Text,
+  View,
+} from 'react-native';
+
+import i18n from '../../../common/services/i18n.service';
+
+/**
+ * Referral Complete
+ */
+export default class ReferralCompleteView extends PureComponent {
+  /**
+   * Navigate to navToContributions
+   */
+  navToContributions = () => {
+    this.props.navigation.push('Contributions');
+  };
+
+  /**
+   * Render
+   */
+  render() {
+    const styles = this.props.styles;
+
+    return (
+      <View style={styles.bodyContents}>
+        <Text onPress={this.navToContributions}>
+          {i18n.to('notification.referralComplete', null, {
+            user: (
+              <Text style={styles.link}>{this.props.entity.fromObj.name}</Text>
+            ),
+          })}
+        </Text>
+      </View>
+    );
+  }
+}

src/notifications/notification/view/ReferralPendingView.js

+import React, {
+  PureComponent
+} from 'react';
+
+import {
+  Text,
+  View,
+} from 'react-native';
+
+import i18n from '../../../common/services/i18n.service';
+
+/**
+ * Referral Pending
+ */
+export default class ReferralPendingView extends PureComponent {
+  /**
+   * Navigate to navToContributions
+   */
+  navToContributions = () => {
+    this.props.navigation.push('Contributions');
+  };
+
+  /**
+   * Render
+   */
+  render() {
+    const styles = this.props.styles;
+
+    return (
+      <View style={styles.bodyContents}>
+        <Text onPress={this.navToContributions}>
+          {i18n.to('notification.referralPending', null, {
+            user: (
+              <Text style={styles.link}>{this.props.entity.fromObj.name}</Text>
+            ),
+          })}
+        </Text>
+      </View>
+    );
+  }
+}

src/notifications/notification/view/ReferralPingView.js

+import React, {
+  PureComponent
+} from 'react';
+
+import {
+  Text,
+  View,
+} from 'react-native';
+
+import i18n from '../../../common/services/i18n.service';
+
+/**
+ * Referral Ping
+ */
+export default class ReferralPingView extends PureComponent {
+  /**
+   * Navigate to navToContributions
+   */
+  navToContributions = () => {
+    this.props.navigation.push('Contributions');
+  };
+
+  /**
+   * Render
+   */
+  render() {
+    const styles = this.props.styles;
+
+    return (
+      <View style={styles.bodyContents}>
+        <Text onPress={this.navToContributions}>
+          {i18n.to('notification.referralPing', null, {
+            user: (
+              <Text style={styles.link}>{this.props.entity.fromObj.name}</Text>
+            ),
+          })}
+        </Text>
+      </View>
+    );
+  }
+}