From df064938cc3f0b02ed4c2940da112f9ae14d619e Mon Sep 17 00:00:00 2001 From: Ryan Lerch Date: Dec 12 2017 13:03:24 +0000 Subject: get basic allgroups page working --- diff --git a/hubs/static/client/app/components/AllGroupsPage.js b/hubs/static/client/app/components/AllGroupsPage.js new file mode 100644 index 0000000..280dc6b --- /dev/null +++ b/hubs/static/client/app/components/AllGroupsPage.js @@ -0,0 +1,80 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; +import { + defineMessages, + FormattedMessage, + } from 'react-intl'; +import PageStructure from './PageStructure'; +import { monogramColour } from '../core/utils'; + + +class AllGroupsPage extends React.Component { + + render() { + return ( + +
+ {console.log(this.props.hubslist)} +
+ + } + content={ +
+
+
+ {this.props.hubslist.hubs.map(function(hub, i) { + return ( + +
+ { !hub.config.avatar ? +
+ {hub.name.charAt(0).toUpperCase()} +
+ : + + } +
+

{hub.name}

+

{hub.config.summary}

+
+
+
+
+
Members
+
{hub.member_count}
+
+
+
Subscribers
+
{hub.subscriber_count}
+
+
+ + ); + })} +
+
+
+ } + /> + ); + } +} + +const mapStateToProps = (state) => { + return { + hubslist: state.hubslist, + } + }; + + export default connect(mapStateToProps)(AllGroupsPage); diff --git a/hubs/static/client/app/core/Pages.js b/hubs/static/client/app/core/Pages.js index 67aee23..632a13c 100644 --- a/hubs/static/client/app/core/Pages.js +++ b/hubs/static/client/app/core/Pages.js @@ -14,6 +14,11 @@ const Streams = makeLoadable( "Loading...", "Sorry, there was a problem loading the page." ); +//const Groups = makeLoadable( +// () => import(/* webpackChunkName: "page-allgroups" */ '../components/AllGroupsPage'), +// "Loading...", +// "Sorry, there was a problem loading the page." +//); +const Groups = require('../components/AllGroupsPage').default; - -export {Hub, Streams}; +export {Hub, Streams, Groups}; diff --git a/hubs/static/client/app/core/reducers/index.js b/hubs/static/client/app/core/reducers/index.js index 61bb90e..acb6644 100644 --- a/hubs/static/client/app/core/reducers/index.js +++ b/hubs/static/client/app/core/reducers/index.js @@ -40,6 +40,7 @@ const rootReducer = combineReducers({ globalConfig: noop, urls: noop, currentUser: userReducer, + hubslist: noop, ui, entities, }); diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css index dae5273..defa6b5 100644 --- a/hubs/static/css/style.css +++ b/hubs/static/css/style.css @@ -401,16 +401,16 @@ header h5.m-b-1 { } /*Move these color defs into fedora-bootstrap*/ -.bg-fedora-blue{background-color:#3c6eb4;} -.bg-fedora-magenta{background-color: #db3279;} -.bg-fedora-orange{background-color: #e59728;} -.bg-fedora-green{background-color: #79db32;} -.bg-fedora-purple{background-color: #a07cbc;} -.text-fedora-blue-dark{color: #294a7a;} -.text-fedora-magenta-dark{color: #9a1b51;} -.text-fedora-orange-dark{color: #9a6213;} -.text-fedora-green-dark{color: #488b18;} -.text-fedora-purple-dark{color: #70488f;} +.bg-fedora-blue{background-color:#3c6eb4!important;} +.bg-fedora-magenta{background-color: #db3279!important;} +.bg-fedora-orange{background-color: #e59728!important;} +.bg-fedora-green{background-color: #79db32!important;} +.bg-fedora-purple{background-color: #a07cbc!important;} +.text-fedora-blue-dark{color: #294a7a!important;} +.text-fedora-magenta-dark{color: #9a1b51!important;} +.text-fedora-orange-dark{color: #9a6213!important;} +.text-fedora-green-dark{color: #488b18!important;} +.text-fedora-purple-dark{color: #70488f!important;} .typeahead, .twitter-typeahead { width: 100%!important; diff --git a/hubs/views/root.py b/hubs/views/root.py index cae9996..1a19b55 100644 --- a/hubs/views/root.py +++ b/hubs/views/root.py @@ -4,7 +4,9 @@ import flask import hubs.models from hubs.app import app, OIDC -from hubs.utils.views import authenticated, is_safe_url, login_required +from hubs.utils import hubname2monogramcolour +from hubs.utils.views import (authenticated, is_safe_url, + login_required, get_user_details) @app.route('/') @@ -21,21 +23,48 @@ def index(): @app.route('/groups/') @login_required def groups(): - # Get the list of promoted and non-promoted group hubs from the DB - promoted_names = app.config.get('PROMOTED_GROUPS') + current_user = get_user_details() + urls = { + "allGroups": flask.url_for("groups"), + } + flash_messages = [ + {"msg": msg[1], "type": msg[0]} for msg in + flask.get_flashed_messages(with_categories=True) + ] + groups = hubs.models.Hub.all_group_hubs() - promoted = [g for g in groups if g.name in promoted_names] - secondary = [g for g in groups if g.name not in promoted_names] + hubslist = [] + for group in groups: + hub = group.get_props() + hub["monogram_colour"] = hubname2monogramcolour(hub["name"]) + hub["hub_url"] = flask.url_for('hub', name=hub["name"]) + + member_count = len(hub["users"]["member"]) + owner_count = len(hub["users"]["owner"]) + hub["member_count"] = member_count + owner_count + + subscriber_count = len(hub["users"]["subscriber"]) + hub["subscriber_count"] = subscriber_count + + hubslist.append(hub) name_of_the_month = app.config.get('HUB_OF_THE_MONTH') - hub_of_the_month = hubs.models.Hub.by_name(name_of_the_month) + hub_of_the_month = hubs.models.Hub.by_name(name_of_the_month).get_props() return flask.render_template( - 'groups.html', - promoted=promoted, - secondary=secondary, - hub_of_the_month=hub_of_the_month, - ) + 'react.html', + page_title="All Groups", + initial_state=dict( + ui=dict( + page="Groups", + flashMessages=flash_messages, + ), + urls=urls, + currentUser=current_user, + hubslist={"hubs": hubslist, + "hub_of_the_month": hub_of_the_month} + ), + ) @app.route('/login/', methods=('GET', 'POST'))