codogo-react-widgets/lib/components/shell/sidebar.js

Provides a unified way to access the styling of commonly used widgets across different apps

import _toConsumableArray from "babel-runtime/helpers/toConsumableArray";
import _taggedTemplateLiteral from "babel-runtime/helpers/taggedTemplateLiteral";

var _templateObject = _taggedTemplateLiteral(["\n\tquery SidebarUserQuery {\n\t\tuser {\n\t\t\tid\n\t\t\tusername\n\t\t\tpersonal {\n\t\t\t\tid\n\t\t\t\tname\n\t\t\t}\n\t\t\tmemberships {\n\t\t\t\tid\n\t\t\t\ttype\n\t\t\t\torg {\n\t\t\t\t\tid\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n"], ["\n\tquery SidebarUserQuery {\n\t\tuser {\n\t\t\tid\n\t\t\tusername\n\t\t\tpersonal {\n\t\t\t\tid\n\t\t\t\tname\n\t\t\t}\n\t\t\tmemberships {\n\t\t\t\tid\n\t\t\t\ttype\n\t\t\t\torg {\n\t\t\t\t\tid\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n"]);

import React from "react";
import * as R from "ramda";
import { compose, withProps } from "recompose";
import gql from "graphql-tag";
import { graphql } from "react-apollo";
import { withRouter } from "react-router";

import Button from "./button";
import IconsSection from "./iconsSection";
import { Sidebar, Arrow, SidebarOrgsSection } from "./styles";

// --------------------------------------------------

var userQuery = gql(_templateObject);

var enhance = compose(graphql(userQuery), withRouter, withProps(function (_ref) {
	var data = _ref.data;
	return {
		orgIDs: R.pipe(R.pathOr([], ["user", "memberships"]), R.map(R.path(["org", "id"])))(data),

		personalOrgID: R.path(["user", "personal", "id"], data)
	};
}), withProps(function (props) {
	return {
		allIDs: [props.personalOrgID].concat(_toConsumableArray(props.orgIDs.filter(function (orgID) {
			return orgID !== props.personalOrgID;
		})))
	};
}), withProps(function (props) {
	return {
		activeOrgIndex: props.allIDs.findIndex(function (id) {
			return id && id === R.path(["match", "params", "orgID"])(props);
		})
	};
}));

export default enhance(function (props) {
	return props.data.user ? React.createElement(
		Sidebar,
		null,
		React.createElement(
			SidebarOrgsSection,
			null,
			React.createElement(Button, { isUser: true, id: props.personalOrgID }),
			props.orgIDs.filter(function (orgID) {
				return orgID !== props.personalOrgID;
			}).map(function (orgID) {
				return React.createElement(Button, { isOrg: true, key: orgID, id: orgID });
			}),
			React.createElement(Button, { isAddNew: true }),
			props.activeOrgIndex > -1 ? React.createElement(Arrow, { index: props.activeOrgIndex }) : null
		),
		React.createElement(IconsSection, props)
	) : React.createElement(Sidebar, null);
});