provide for resetting referral set error state

improve reward buttons
show setReferrer errors in modal

ui/component/rewardTile/view.jsx

@@ -27,6 +27,7 @@ const RewardTile = (props: Props) => {
   const { reward, openRewardCodeModal, openSetReferrerModal, user } = props;
   const referrerSet = user && user.invited_by_id;
   const claimed = !!reward.transaction_id;
+  const customActionsRewards = [rewards.TYPE_REFERRAL, rewards.TYPE_REFEREE];
 
   return (
     <Card
@@ -41,13 +42,16 @@ const RewardTile = (props: Props) => {
             <Button button="primary" navigate="/$/invite" label={__('Go to Invites')} />
           )}
           {reward.reward_type === rewards.TYPE_REFEREE && (
-            <Button
-              button="primary"
-              onClick={openSetReferrerModal}
-              label={referrerSet ? __('Change Invitee') : __('Set Invitee')}
-            />
+            <>
+              {referrerSet && <RewardLink button reward_type={reward.reward_type} />}
+              <Button
+                button={referrerSet ? 'link' : 'primary'}
+                onClick={openSetReferrerModal}
+                label={referrerSet ? __('Change Inviter') : __('Set Inviter')}
+              />
+            </>
           )}
-          {reward.reward_type !== rewards.TYPE_REFERRAL &&
+          {!customActionsRewards.some(i => i === reward.reward_type) &&
             (claimed ? (
               <span>
                 <Icon icon={ICONS.COMPLETED} /> {__('Reward claimed.')}

ui/modal/modalSetReferrer/index.js

@@ -1,6 +1,6 @@
 import { connect } from 'react-redux';
 import { doHideModal } from 'redux/actions/app';
-import { doUserSetReferrer, selectSetReferrerError, selectSetReferrerPending } from 'lbryinc';
+import { doUserSetReferrer, selectSetReferrerError, selectSetReferrerPending, doUserSetReferrerReset } from 'lbryinc';
 import ModalSetReferrer from './view';
 
 const select = state => ({
@@ -11,6 +11,7 @@ const select = state => ({
 const perform = dispatch => ({
   closeModal: () => dispatch(doHideModal()),
   setReferrer: (referrer, doClaim) => dispatch(doUserSetReferrer(referrer, doClaim)),
+  resetReferrerError: () => dispatch(doUserSetReferrerReset()),
 });
 
 export default connect(

ui/modal/modalSetReferrer/view.jsx

@@ -13,6 +13,7 @@ type Props = {
   setReferrer: (string, boolean) => void,
   referrerSetPending: boolean,
   referrerSetError?: string,
+  resetReferrerError: () => void,
 };
 
 type State = {
@@ -28,6 +29,7 @@ class ModalSetReferrer extends React.PureComponent<Props, State> {
     };
 
     (this: any).handleSubmit = this.handleSubmit.bind(this);
+    (this: any).handleTextChange = this.handleTextChange.bind(this);
   }
 
   handleSubmit() {
@@ -36,14 +38,23 @@ class ModalSetReferrer extends React.PureComponent<Props, State> {
     setReferrer(referrer, true);
   }
 
+  handleTextChange(e: SyntheticInputEvent<*>) {
+    const { referrerSetError, resetReferrerError } = this.props;
+
+    this.setState({ referrer: e.target.value });
+    if (referrerSetError) {
+      resetReferrerError();
+    }
+  }
+
   render() {
-    const { closeModal, rewardIsPending } = this.props;
+    const { closeModal, rewardIsPending, referrerSetError, referrerSetPending } = this.props;
     const { referrer } = this.state;
 
     return (
-      <Modal isOpen contentLabel={__('Enter Invitee')} type="card" onAborted={closeModal}>
+      <Modal isOpen contentLabel={__('Enter Inviter')} type="card" onAborted={closeModal}>
         <Card
-          title={__('Enter Invitee')}
+          title={__('Enter Inviter')}
           subtitle={
             <React.Fragment>
               {__('Did someone invite you to use lbry.tv? Tell us who and you both get a reward!')}
@@ -63,7 +74,8 @@ class ModalSetReferrer extends React.PureComponent<Props, State> {
                   label={__('Code or channel')}
                   placeholder="0123abc"
                   value={referrer}
-                  onChange={e => this.setState({ referrer: e.target.value })}
+                  onChange={this.handleTextChange}
+                  error={!referrerSetPending && referrerSetError}
                 />
               </Form>
               <div className="card__actions">