zotero-web-library/lib/libraryUi/widgets/ProfileGroupsList.js

Web library from zotero.org

'use strict';

var log = require('libzotero/lib/Log').Logger('zotero-web-library:profileGroupsList');

var React = require('react');

var LoadingSpinner = require('./LoadingSpinner.js');

var ProfileGroupsList = React.createClass({
	displayName: 'ProfileGroupsList',

	componentWillMount: function componentWillMount() {
		var reactInstance = this;
		var groups = new Zotero.Groups();
		reactInstance.setState({ loading: true });
		groups.fetchUserGroups(reactInstance.props.userID).then(function (response) {
			var groups = response.fetchedGroups;
			reactInstance.setState({ groups: groups, loading: false });
		}).catch(Zotero.catchPromiseError);
	},
	getInitialState: function getInitialState() {
		return {
			groups: [],
			loading: false
		};
	},
	render: function render() {
		var reactInstance = this;
		log.debug(reactInstance.state.groups);

		var memberGroups = reactInstance.state.groups.map(function (group) {
			return React.createElement(
				'li',
				{ key: group.get('id') },
				React.createElement(
					'a',
					{ href: Zotero.url.groupViewUrl(group) },
					group.get('name')
				)
			);
		});

		return React.createElement(
			'div',
			{ className: 'profile-groups-list' },
			React.createElement(
				'h2',
				null,
				'Groups'
			),
			React.createElement(LoadingSpinner, { loading: reactInstance.state.loading }),
			React.createElement(
				'ul',
				null,
				memberGroups
			)
		);
	}
});

module.exports = ProfileGroupsList;