diff --git a/src/components/structures/GroupView.js b/src/components/structures/GroupView.js
index d69784e0ca..647ffee37a 100644
--- a/src/components/structures/GroupView.js
+++ b/src/components/structures/GroupView.js
@@ -22,7 +22,7 @@ import MatrixClientPeg from '../../MatrixClientPeg';
import sdk from '../../index';
import dis from '../../dispatcher';
import { sanitizedHtmlNode } from '../../HtmlUtils';
-import { _t } from '../../languageHandler';
+import { _t, _td, _tJsx } from '../../languageHandler';
import AccessibleButton from '../views/elements/AccessibleButton';
import Modal from '../../Modal';
import classnames from 'classnames';
@@ -32,6 +32,17 @@ import GroupStore from '../../stores/GroupStore';
import { showGroupAddRoomDialog } from '../../GroupAddressPicker';
import GeminiScrollbar from 'react-gemini-scrollbar';
+const LONG_DESC_PLACEHOLDER = _td(
+`<h1>HTML for your community's page</h1>
+<p>
+ Use the long description to introduce new members to the community, or distribute
+ some important <a href="foo">links</a>
+</p>
+<p>
+ You can even use 'img' tags
+</p>
+`);
+
const RoomSummaryType = PropTypes.shape({
room_id: PropTypes.string.isRequired,
profile: PropTypes.shape({
@@ -392,6 +403,8 @@ export default React.createClass({
propTypes: {
groupId: PropTypes.string.isRequired,
+ // Whether this is the first time the group admin is viewing the group
+ groupIsNew: PropTypes.bool,
},
childContextTypes: {
@@ -422,7 +435,7 @@ export default React.createClass({
componentWillMount: function() {
this._changeAvatarComponent = null;
- this._initGroupStore(this.props.groupId);
+ this._initGroupStore(this.props.groupId, true);
MatrixClientPeg.get().on("Group.myMembership", this._onGroupMyMembership);
},
@@ -449,7 +462,7 @@ export default React.createClass({
this.setState({membershipBusy: false});
},
- _initGroupStore: function(groupId) {
+ _initGroupStore: function(groupId, firstInit) {
this._groupStore = GroupStoreCache.getGroupStore(MatrixClientPeg.get(), groupId);
this._groupStore.registerListener(() => {
const summary = this._groupStore.getSummary();
@@ -472,6 +485,9 @@ export default React.createClass({
),
error: null,
});
+ if (this.props.groupIsNew && firstInit) {
+ this._onEditClick();
+ }
});
this._groupStore.on('error', (err) => {
this.setState({
@@ -868,6 +884,18 @@ export default React.createClass({
let description = null;
if (summary.profile && summary.profile.long_description) {
description = sanitizedHtmlNode(summary.profile.long_description);
+ } else if (this.state.isUserPrivileged) {
+ description = <div
+ className="mx_GroupView_groupDesc_placeholder"
+ onClick={this._onEditClick}
+ >
+ { _tJsx(
+ 'Your community hasn\'t got a Long Description, a HTML page to show to community members.<br />' +
+ 'Click here to open settings and give it one!',
+ [/<br \/>/],
+ [(sub) => <br />])
+ }
+ </div>;
}
const groupDescEditingClasses = classnames({
"mx_GroupView_groupDesc": true,
@@ -879,6 +907,7 @@ export default React.createClass({
<h3> { _t("Long Description (HTML)") } </h3>
<textarea
value={this.state.profileForm.long_description}
+ placeholder={_t(LONG_DESC_PLACEHOLDER)}
onChange={this._onLongDescChange}
tabIndex="4"
key="editLongDesc"
diff --git a/src/components/structures/LoggedInView.js b/src/components/structures/LoggedInView.js
index 5d1d47c5b2..08120d9508 100644
--- a/src/components/structures/LoggedInView.js
+++ b/src/components/structures/LoggedInView.js
@@ -301,6 +301,7 @@ export default React.createClass({
case PageTypes.GroupView:
page_element = <GroupView
groupId={this.props.currentGroupId}
+ isNew={this.props.currentGroupIsNew}
collapsedRhs={this.props.collapseRhs}
/>;
if (!this.props.collapseRhs) right_panel = <RightPanel groupId={this.props.currentGroupId} disabled={this.props.rightDisabled} />;
diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js
index e679276a08..e8ca8e82fc 100644
--- a/src/components/structures/MatrixChat.js
+++ b/src/components/structures/MatrixChat.js
@@ -490,7 +490,10 @@ module.exports = React.createClass({
case 'view_group':
{
const groupId = payload.group_id;
- this.setState({currentGroupId: groupId});
+ this.setState({
+ currentGroupId: groupId,
+ currentGroupIsNew: payload.group_is_new,
+ });
this._setPage(PageTypes.GroupView);
this.notifyNewScreen('group/' + groupId);
}
diff --git a/src/components/views/dialogs/CreateGroupDialog.js b/src/components/views/dialogs/CreateGroupDialog.js
index e1dfe388d6..168fe75947 100644
--- a/src/components/views/dialogs/CreateGroupDialog.js
+++ b/src/components/views/dialogs/CreateGroupDialog.js
@@ -81,6 +81,7 @@ export default React.createClass({
dis.dispatch({
action: 'view_group',
group_id: result.group_id,
+ group_is_new: true,
});
this.props.onFinished(true);
}).catch((e) => {
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index 0eecc63ed7..4746a11921 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -672,6 +672,7 @@
"You must <a>register</a> to use this functionality": "You must <a>register</a> to use this functionality",
"You must join the room to see its files": "You must join the room to see its files",
"There are no visible files in this room": "There are no visible files in this room",
+ "<h1>HTML for your community's page</h1>\n<p>\n Use the long description to introduce new members to the community, or distribute\n some important <a href=\"foo\">links</a>\n</p>\n<p>\n You can even use 'img' tags\n</p>\n": "<h1>HTML for your community's page</h1>\n<p>\n Use the long description to introduce new members to the community, or distribute\n some important <a href=\"foo\">links</a>\n</p>\n<p>\n You can even use 'img' tags\n</p>\n",
"Add rooms to the community summary": "Add rooms to the community summary",
"Which rooms would you like to add to this summary?": "Which rooms would you like to add to this summary?",
"Add to summary": "Add to summary",
@@ -703,6 +704,7 @@
"You are a member of this community": "You are a member of this community",
"Community Member Settings": "Community Member Settings",
"Publish this community on your profile": "Publish this community on your profile",
+ "Your community hasn't got a Long Description, a HTML page to show to community members.<br />Click here to open settings and give it one!": "Your community hasn't got a Long Description, a HTML page to show to community members.<br />Click here to open settings and give it one!",
"Long Description (HTML)": "Long Description (HTML)",
"Description": "Description",
"Community %(groupId)s not found": "Community %(groupId)s not found",