%script#environment-item-template{ "type"=> "text/x-template" }
  %tr
    %td{"v-bind:class" => "{ 'children-row': isChildren}" }
      %a.environment-name{ "v-if" => "!isFolder",
        ":href" => "'#{namespace_project_environments_path(@project.namespace, @project)}/' + model.id" }
        {{model.name}}

      %span.folder-name{ "v-if" => "isFolder",
        "@click" => "toggle" }

        %i.folder-icon{ "v-show" => "open" }
          =icon ("caret-down")
        %i.folder-icon{ "v-show" => "!open" }
          =icon("caret-right")

        {{model.name}}

        %span.badge 
          {{childrenCounter}}

    %td.deployment-column
      %span{ "v-if" => "!isFolder && model.last_deployment && model.last_deployment.iid" }
        = precede "#" do
          {{model.last_deployment.iid}}
        
        %span{ "v-if" => "model.last_deployment.user" }
          by
          %a{":href" => "'/' + model.last_deployment.user.username" }
            %img.avatar.has_tooltip.s20{ ":src" => "model.last_deployment.user.avatar_url",
            ":alt" => "model.last_deployment.user.username + 'avatar'",
            ":title" => "model.last_deployment.user.username",
            data: {container: "body" },
            width: 20, height: 20}

    %td
      %a.build-link{ "v-if" => "!isFolder && model.last_deployment && model.last_deployment.deployable",
        ":href" => "'#{namespace_project_builds_path(@project.namespace, @project)}/' + model.last_deployment.deployable.id" }
        {{model.last_deployment.deployable.name}}
        = precede "#" do
          {{model.last_deployment.deployable.id}}

    %td
      =render "projects/environments/components/commit"
      
      %p.commit-title{ "v-if" => "!isFolder && !model.last_deployment" }
        No deployments yet

    %td
      %span{ "v-if" => "!isFolder && model.last_deployment" }
        {{model.last_deployment.created_at}}

    %td.hidden-xs
      .pull-right{ "v-if" => "!isFolder" }
        =render "projects/environments/components/external_url"
        =render "projects/environments/components/actions"
        =render "projects/environments/components/stop"
        =render "projects/environments/components/rollback"

  %tr{"v-if" => "open && isFolder", 
    "is" => "environment-item", 
    "v-for" => "model in model.children",
    ":model" => "model" }