div.content-box__info

  include ../../templates/hubl-user-avatar.pug

  solid-widget(name='hubl-user-groups')
    template ${await value.name}

  solid-widget(name='hubl-team-template-edit')
    template
      solid-display.user-thumb.is-spaced(
        class='w280 cell border cell-with-id-card user-thumb'
        data-src='${await value.user}'
        fields='account.picture, sup(name, groups), sub(profile.city)'

        class-account.picture='user-thumb__picture avatar'
        class-name='user-thumb__name'
        class-groups='user-thumb__groups'
        class-profile.city='user-thumb__city'

        widget-account.picture='hubl-user-avatar'

        multiple-groups=''
        widget-groups='hubl-user-groups'
      )

      solid-ac-checker(
        class='w162 cell border'
        permission="acl:Delete"
        data-src="${value['@id']}"
      )
        solid-delete(
          class='button text-bold text-uppercase reversed button-secondary bordered with-icon icon-close'
          data-src="${value['@id']}"
          data-label='Retirer'
        )

      //- Only to show the table grid
      solid-ac-checker(
        class='w162 cell border'
        no-permission="acl:Delete"
        data-src="${value['@id']}"
      )

  solid-link(class="backlink right", bind-resources, next='circle-profile') Retour

  solid-ac-checker(permission='acl:Write', bind-resources)
    h1 Modifie ton canal

    solid-form.form.button-register(
      bind-resources

      fields='status, line-1(name, owner), description'
      range-owner=`${endpoints.users || endpoints.get.users}`

      label-status='Statut du canal'
      widget-status='hubl-status'

      label-name='Nom du canal'
      label-owner='Administrateur ou administratrice'
      label-description='Sous-titre du canal *'

      class-name='form-label is-light is-half-width input-text-like'
      class-owner='form-label is-light is-half-width member-select color'
      class-description='form-label is-light is-full-width input-text-like'
      class-status='form-label is-light is-full-width member-select color'

      widget-owner='solid-form-auto-completion'

      partial=''

      submit-button='Enregistrer'
      next='circle-information'
    )

  h2 Liste des membres :

  solid-ac-checker(permission='acl:Append', bind-resources, nested-field='members')
    solid-form.block.select-add(
      bind-resources 
      nested-field='members'
      fields='user'
      range-user=`${endpoints.users || endpoints.get.users}`

      class-user='team form-label is-light'
      label-user=''
      widget-user='solid-form-auto-completion'

      submit-button='Ajouter un membre'
    )

  .table-wrapper
    .table
      div.table-header.grey-color
        div.w280 Nom
        div.w162 Accès

      //-class='table-body'
      solid-display(
        class='table-body'
        bind-resources
        fields='members'

        multiple-members=''
        widget-members='hubl-team-template-edit'
      )