mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-29 04:48:50 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #1514 from matrix-org/luke/groups-my-groups-placeholder

Browse source 
Add placeholder to MyGroups page, adjust CSS classes
This commit is contained in:
Luke Barnard 2017-10-20 18:16:28 +01:00 committed by GitHub
commit b5c9fa4caa
2 changed files with 41 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
src/components/structures/MyGroups.js
View file

@ -118,9 +118,18 @@ export default withMatrixClient(React.createClass({
this.state.groups.forEach((g) => { this.state.groups.forEach((g) => {
groupNodes.push(<GroupTile groupId={g} />); groupNodes.push(<GroupTile groupId={g} />);
}); });
content = <div className="mx_MyGroups_joinedGroups"> content = groupNodes.length > 0 ?
{ groupNodes } <div>
</div>; <h3>{ _t('Your Communities') }</h3>
<div className="mx_MyGroups_joinedGroups">
{ groupNodes }
</div>
</div> :
<div className="mx_MyGroups_placeholder">
{ _t(
"You're not currently a member of any communities.",
) }
</div>;
} else if (this.state.error) { } else if (this.state.error) {
content = <div className="mx_MyGroups_error"> content = <div className="mx_MyGroups_error">
{ _t('Error whilst fetching joined communities') } { _t('Error whilst fetching joined communities') }
@ -131,38 +140,40 @@ export default withMatrixClient(React.createClass({
return <div className="mx_MyGroups"> return <div className="mx_MyGroups">
<SimpleRoomHeader title={_t("Communities")} icon="img/icons-groups.svg" /> <SimpleRoomHeader title={_t("Communities")} icon="img/icons-groups.svg" />
<div className='mx_MyGroups_joinCreateBox'> <div className='mx_MyGroups_header'>
<div className="mx_MyGroups_createBox"> <div className="mx_MyGroups_headerCard">
<div className="mx_MyGroups_joinCreateHeader"> <AccessibleButton className='mx_MyGroups_headerCard_button' onClick={this._onCreateGroupClick}>
{ _t('Create a new community') }
</div>
<AccessibleButton className='mx_MyGroups_joinCreateButton' onClick={this._onCreateGroupClick}>
<TintableSvg src="img/icons-create-room.svg" width="50" height="50" /> <TintableSvg src="img/icons-create-room.svg" width="50" height="50" />
</AccessibleButton> </AccessibleButton>
{ _t( <div className="mx_MyGroups_headerCard_content">
'Create a community to represent your community! '+ <div className="mx_MyGroups_headerCard_header">
'Define a set of rooms and your own custom homepage '+ { _t('Create a new community') }
'to mark out your space in the Matrix universe.', </div>
) } { _t(
'Create a community to group together users and rooms! ' +
'Build a custom homepage to mark out your space in the Matrix universe.',
) }
</div>
</div> </div>
<div className="mx_MyGroups_joinBox"> <div className="mx_MyGroups_joinBox mx_MyGroups_headerCard">
<div className="mx_MyGroups_joinCreateHeader"> <AccessibleButton className='mx_MyGroups_headerCard_button' onClick={this._onJoinGroupClick}>
{ _t('Join an existing community') }
</div>
<AccessibleButton className='mx_MyGroups_joinCreateButton' onClick={this._onJoinGroupClick}>
<TintableSvg src="img/icons-create-room.svg" width="50" height="50" /> <TintableSvg src="img/icons-create-room.svg" width="50" height="50" />
</AccessibleButton> </AccessibleButton>
{ _tJsx( <div className="mx_MyGroups_headerCard_content">
'To join an existing community you\'ll have to '+ <div className="mx_MyGroups_headerCard_header">
'know its community identifier; this will look '+ { _t('Join an existing community') }
'something like <i>+example:matrix.org</i>.', </div>
/<i>(.*)<\/i>/, { _tJsx(
(sub) => <i>{ sub }</i>, 'To join an existing community you\'ll have to '+
) } 'know its community identifier; this will look '+
'something like <i>+example:matrix.org</i>.',
/<i>(.*)<\/i>/,
(sub) => <i>{ sub }</i>,
) }
</div>
</div> </div>
</div> </div>
<div className="mx_MyGroups_content"> <div className="mx_MyGroups_content">
<h3>{ _t('Your Communities') }</h3>
{ content } { content }
</div> </div>
</div>; </div>;

5
src/i18n/strings/en_EN.json
View file

@ -698,12 +698,13 @@
"Signed Out": "Signed Out", "Signed Out": "Signed Out",
"For security, this session has been signed out. Please sign in again.": "For security, this session has been signed out. Please sign in again.", "For security, this session has been signed out. Please sign in again.": "For security, this session has been signed out. Please sign in again.",
"Logout": "Logout", "Logout": "Logout",
"Your Communities": "Your Communities",
"You're not currently a member of any communities.": "You're not currently a member of any communities.",
"Error whilst fetching joined communities": "Error whilst fetching joined communities", "Error whilst fetching joined communities": "Error whilst fetching joined communities",
"Create a new community": "Create a new community", "Create a new community": "Create a new community",
"Create a community to represent your community! Define a set of rooms and your own custom homepage to mark out your space in the Matrix universe.": "Create a community to represent your community! Define a set of rooms and your own custom homepage to mark out your space in the Matrix universe.", "Create a community to group together users and rooms! Build a custom homepage to mark out your space in the Matrix universe.": "Create a community to group together users and rooms! Build a custom homepage to mark out your space in the Matrix universe.",
"Join an existing community": "Join an existing community", "Join an existing community": "Join an existing community",
"To join an existing community you'll have to know its community identifier; this will look something like <i>+example:matrix.org</i>.": "To join an existing community you'll have to know its community identifier; this will look something like <i>+example:matrix.org</i>.", "To join an existing community you'll have to know its community identifier; this will look something like <i>+example:matrix.org</i>.": "To join an existing community you'll have to know its community identifier; this will look something like <i>+example:matrix.org</i>.",
"Your Communities": "Your Communities",
"You have no visible notifications": "You have no visible notifications", "You have no visible notifications": "You have no visible notifications",
"Scroll to bottom of page": "Scroll to bottom of page", "Scroll to bottom of page": "Scroll to bottom of page",
"Connectivity to the server has been lost.": "Connectivity to the server has been lost.", "Connectivity to the server has been lost.": "Connectivity to the server has been lost.",