diff --git a/app/javascript/gabsocial/features/group_create.js b/app/javascript/gabsocial/features/group_create.js
index 025b1e9b..88e1a2f7 100644
--- a/app/javascript/gabsocial/features/group_create.js
+++ b/app/javascript/gabsocial/features/group_create.js
@@ -18,9 +18,14 @@ import {
setGroup,
resetEditor,
} from '../actions/group_editor'
-import { closeModal } from '../actions/modal'
+import {
+ openModal,
+ closeModal,
+} from '../actions/modal'
import { fetchGroup } from '../actions/groups'
import { fetchGroupCategories } from '../actions/group_categories'
+import { me } from '../initial_state'
+import { MODAL_PRO_UPGRADE } from '../constants'
import ColumnIndicator from '../components/column_indicator'
import Button from '../components/button'
import Divider from '../components/divider'
@@ -70,11 +75,17 @@ class GroupCreate extends ImmutablePureComponent {
handleSubmit = (e) => {
e.preventDefault()
+
+ // if not pro and not admin of group show pro upgrade modal
+ if (!this.props.isPro && !this.props.isAdmin) {
+ this.props.onOpenProUpgradeModal()
+ return
+ }
+
if (this.props.onClose) this.props.onClose()
this.props.onSubmit(this.context.router.history)
}
-
render() {
const {
group,
@@ -100,12 +111,25 @@ class GroupCreate extends ImmutablePureComponent {
groupId,
categories,
isAdmin,
+ isPro,
} = this.props
if (!group && groupId) {
return
} else if ((!group && error) || (groupId && !isAdmin)) {
return
+ } else if (!isPro && !groupId) {
+ return
+ You must be a GabPRO member to create a group.
+
+
+ )} />
}
const memberCount = group ? group.get('member_count') : 0
@@ -298,6 +322,7 @@ const mapStateToProps = (state, { params }) => {
isPrivate: state.getIn(['group_editor', 'isPrivate']),
isVisible: state.getIn(['group_editor', 'isVisible']),
categories: state.getIn(['group_categories', 'items']),
+ isPro: state.getIn(['accounts', me, 'is_pro']),
}
}
@@ -341,7 +366,10 @@ const mapDispatchToProps = (dispatch) => ({
},
onFetchGroupCategories() {
dispatch(fetchGroupCategories())
- }
+ },
+ onOpenProUpgradeModal() {
+ dispatch(openModal(MODAL_PRO_UPGRADE))
+ },
})
GroupCreate.propTypes = {
@@ -362,6 +390,7 @@ GroupCreate.propTypes = {
onResetEditor: PropTypes.func.isRequired,
onSetGroup: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
+ onOpenProUpgradeModal: PropTypes.func.isRequired,
isSubmitting: PropTypes.bool,
isAdmin: PropTypes.bool,
onClose: PropTypes.func,
diff --git a/app/javascript/gabsocial/pages/groups_page.js b/app/javascript/gabsocial/pages/groups_page.js
index a48465d7..3f3379ac 100644
--- a/app/javascript/gabsocial/pages/groups_page.js
+++ b/app/javascript/gabsocial/pages/groups_page.js
@@ -8,6 +8,8 @@ import Text from '../components/text'
import DefaultLayout from '../layouts/default_layout'
import GroupsCollection from '../features/groups_collection'
import WrappedBundle from '../features/ui/util/wrapped_bundle'
+import { openModal } from '../actions/modal'
+import { MODAL_PRO_UPGRADE } from '../constants'
import {
GroupsPanel,
LinkFooter,
@@ -15,6 +17,10 @@ import {
class GroupsPage extends React.PureComponent {
+ handleOpenProUpgradeModal = () => {
+ this.props.dispatch(openModal(MODAL_PRO_UPGRADE))
+ }
+
render() {
const {
activeTab,
@@ -66,7 +72,8 @@ class GroupsPage extends React.PureComponent {
{
title: 'Create',
icon: 'add',
- to: '/groups/create',
+ to: isPro ? '/groups/create' : undefined,
+ onClick: isPro ? undefined : this.handleOpenProUpgradeModal,
},
]}
tabs={tabs}