/** @jsx React.DOM */

var Policy = React.createClass({
  mixins: [conjur.views.mixins.Tab],
  render: function() {
    var policy = this.props.data.policy;
    var id = policy.id.split(':')[2];

    //TODO: policy loader
    //TODO in CLI: why not save text of policy as an annotation?
    var overview_tab =
            <TabPane key="overview" tab="Overview">
            <dl className="dl-horizontal">
              <dt>Owner</dt>
              <dd><RoleLink id={policy.id}/></dd>
            </dl>
            </TabPane>;

    var permissions_tab = this.permissions_tab(policy.id);
    var memberships_tab = this.memberships_tab(policy.id);
    var annotations_tab = this.annotations_tab();
    var owned_tab       = this.owned_tab();

    var audit_tab =
            <TabPane key="audit" tab="Recent Activity">
                <div className="audit auditGroup">
                  <AuditBox roles={[policy.id]} tabview={true} />
                </div>
            </TabPane>;
    var tabs = _.compact( [ overview_tab, owned_tab, memberships_tab, permissions_tab,
                            annotations_tab, audit_tab
                          ] );

    return (
      <div className="policy">
        <h2>Policy {id}</h2>
        <TabbedArea defaultActiveKey="overview">
            {tabs}
        </TabbedArea>
      </div>
    );
  }
});