Added question button to promoted posts to show ProUpgradeModal

• Added:
- question button to promoted posts to show ProUpgradeModal

app/javascript/gabsocial/components/status.js

@@ -308,6 +308,7 @@ class Status extends ImmutablePureComponent {
       contextType,
       isComposeModalOpen,
       commentSortingType,
+      onOpenProModal,
     } = this.props
     // const { height } = this.state
 
@@ -430,6 +431,7 @@ class Status extends ImmutablePureComponent {
                     isFeatured={isFeatured}
                     isPinnedInGroup={isPinnedInGroup}
                     isComment={isComment && !isChild}
+                    onOpenProModal={onOpenProModal}
                   />
 
                   <StatusHeader
@@ -563,6 +565,7 @@ Status.propTypes = {
   onFavorite: PropTypes.func,
   onMention: PropTypes.func,
   onOpenMedia: PropTypes.func,
+  onOpenProModal: PropTypes.func,
   onOpenVideo: PropTypes.func,
   onHeightChange: PropTypes.func,
   onToggleHidden: PropTypes.func,

app/javascript/gabsocial/components/status_prepend.js

@@ -17,6 +17,7 @@ class StatusPrepend extends ImmutablePureComponent {
       isPromoted,
       isComment,
       isPinnedInGroup,
+      onOpenProModal,
     } = this.props
 
     if (!status) return null
@@ -32,8 +33,8 @@ class StatusPrepend extends ImmutablePureComponent {
     else if (isComment) iconId = 'comment'
 
     return (
-      <div className={[_s.d, _s.w100PC, _s.aiStart, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
+      <div className={[_s.d, _s.w100PC, _s.flexRow, _s.aiStart, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
-        <div className={[_s.d, _s.w100PC, _s.flexRow, _s.aiCenter, _s.py5, _s.px15].join(' ')}>
+        <div className={[_s.d, _s.flexNormal, _s.flexRow, _s.aiCenter, _s.py5, _s.px15, _s.overflowHidden].join(' ')}>
           <Icon id={iconId} size='12px' className={[_s.cSecondary, _s.mr5].join(' ')} />
           {
             isRepost && !isComment &&
@@ -90,6 +91,19 @@ class StatusPrepend extends ImmutablePureComponent {
             </Text>
           }
         </div>
+        {
+          isPromoted &&
+          <div className={[_s.d, _s.h100PC, _s.pr10, _s.py2, _s.aiCenter, _s.jcCenter].join(' ')}>
+            <button
+              className={[_s.d, _s.cursorPointer, _s.outlineNone, _s.bgTertiary, _s.circle, _s.py2, _s.px5].join(' ')}
+              onClick={onOpenProModal}
+            >
+              <Text color='tertiary' size='extraSmall' isBadge>
+                ?
+              </Text>
+            </button>
+          </div>
+        }
       </div>
     )
   }
@@ -111,6 +125,7 @@ StatusPrepend.propTypes = {
   isFeatured: PropTypes.bool,
   isPinnedInGroup: PropTypes.bool,
   isPromoted: PropTypes.bool,
+  onOpenProModal: PropTypes.func.isRequired,
 }
 
 export default injectIntl(StatusPrepend)

app/javascript/gabsocial/containers/status_container.js

@@ -32,6 +32,7 @@ import {
 import {
   MODAL_BOOST,
   MODAL_CONFIRM,
+  MODAL_PRO_UPGRADE,
   POPOVER_COMMENT_SORTING_OPTIONS,
   POPOVER_STATUS_SHARE,
   COMMENT_SORTING_TYPE_OLDEST,
@@ -333,7 +334,11 @@ const mapDispatchToProps = (dispatch) => ({
       callback,
       position: 'top',
     }))
-  }
+  },
+
+  onOpenProModal() {
+    dispatch(openModal(MODAL_PRO_UPGRADE))
+  },
 
 });