Format intentions table hbs template

pull/15153/head
wenincode 2022-10-26 11:08:16 -06:00
parent 4dbb1e16f4
commit 46ba6174d5
1 changed files with 181 additions and 166 deletions

View File

@ -1,172 +1,187 @@
<TabularCollection <TabularCollection
class="consul-intention-list-table" class='consul-intention-list-table'
...attributes ...attributes
@items={{@items}} @items={{@items}}
@rowHeight={{59}} @rowHeight={{59}}
as |item index|> as |item index|
<BlockSlot @name="header"> >
<th class="source">Source</th> <BlockSlot @name='header'>
<th class="intent">&nbsp;</th> <th class='source'>Source</th>
<th class="destination">Destination</th> <th class='intent'>&nbsp;</th>
<th class="permissions"> <th class='destination'>Destination</th>
Permissions <th class='permissions'>
<span> Permissions
<Tooltip>Permissions intercept an Intention's traffic using Layer 7 criteria, such as path prefixes and http headers.</Tooltip> <span>
</span> <Tooltip>Permissions intercept an Intention's traffic using Layer 7 criteria, such as path
</th> prefixes and http headers.</Tooltip>
<th class="meta">&nbsp;</th> </span>
</BlockSlot> </th>
<BlockSlot @name="row"> <th class='meta'>&nbsp;</th>
<td class="source" data-test-intention={{item.ID}}> </BlockSlot>
<a href={{href-to (or @routeName 'dc.intentions.edit') item.ID}} data-test-intention-source={{item.SourceName}}> <BlockSlot @name='row'>
{{#if (eq item.SourceName '*') }} <td class='source' data-test-intention={{item.ID}}>
All Services (*) <a
{{else}} href={{href-to (or @routeName 'dc.intentions.edit') item.ID}}
{{item.SourceName}} data-test-intention-source={{item.SourceName}}
{{/if}}
{{! TODO: slugify }}
<em class="consul-intention-list-table__meta-info">
<Consul::Bucket::List
@item={{hash
Namespace=item.SourceNS
Partition=item.SourcePartition
PeerName=item.SourcePeer
}}
@nspace="-"
@partition="-"
/>
</em>
</a>
</td>
<td class="intent intent-{{slugify item.Action}}" data-test-intention-action={{item.Action}}>
<strong>{{capitalize (or item.Action "App aware")}}</strong>
</td>
<td class="destination" data-test-intention-destination={{item.DestinationName}}>
<span>
{{#if (eq item.DestinationName '*') }}
All Services (*)
{{else}}
{{item.DestinationName}}
{{/if}}
{{#if (or (can 'use nspaces') (can 'use partitions'))}}
{{! TODO: slugify }}
<em>
<span
class={{concat 'partition-' (or item.DestinationPartition 'default')}}
>{{or item.DestinationPartition 'default'}}</span> / <span
class={{concat 'nspace-' (or item.DestinationNS 'default')}}
>{{or item.DestinationNS 'default'}}</span>
</em>
{{/if}}
</span>
</td>
<td class="permissions">
{{#if (gt item.Permissions.length 0)}}
<span>{{pluralize item.Permissions.length 'Permission'}}</span>
{{/if}}
</td>
<td class="meta">
{{#if item.IsManagedByCRD}}
<Consul::ExternalSource @item={{item}} @label="Managed by CRD" />
{{/if}}
</td>
</BlockSlot>
<BlockSlot @name="actions" as |index change checked|>
<PopoverMenu
@expanded={{if (eq checked index) true false}}
@onchange={{action change index}} @keyboardAccess={{false}}
> >
<BlockSlot @name="trigger"> {{#if (eq item.SourceName '*')}}
More All Services (*)
</BlockSlot> {{else}}
<BlockSlot @name="menu" as |confirm send keypressClick change|> {{item.SourceName}}
{{#if (can "write intention" item=item)}} {{/if}}
<li role="none"> {{! TODO: slugify }}
<a role="menuitem" tabindex="-1" href={{href-to (or routeName 'dc.intentions.edit') item.ID}}>Edit</a> <em class='consul-intention-list-table__meta-info'>
</li> <Consul::Bucket::List
<li role="none" class="dangerous"> @item={{hash
<label for={{confirm}} role="menuitem" tabindex="-1" onkeypress={{keypressClick}} data-test-delete>Delete</label> Namespace=item.SourceNS
<div role="menu"> Partition=item.SourcePartition
<InformedAction PeerName=item.SourcePeer
class="warning" }}
> @nspace='-'
<:header> @partition='-'
Confirm Delete />
</:header> </em>
<:body> </a>
<p> </td>
Are you sure you want to delete this intention? <td class='intent intent-{{slugify item.Action}}' data-test-intention-action={{item.Action}}>
</p> <strong>{{capitalize (or item.Action 'App aware')}}</strong>
</:body> </td>
<:actions as |Actions|> <td class='destination' data-test-intention-destination={{item.DestinationName}}>
<Actions.Action class="dangerous"> <span>
<Action {{#if (eq item.DestinationName '*')}}
class="type-delete" All Services (*)
tabindex="-1" {{else}}
{{on 'click' (queue (action change) (action @delete item))}} {{item.DestinationName}}
> {{/if}}
Delete {{#if (or (can 'use nspaces') (can 'use partitions'))}}
</Action> {{! TODO: slugify }}
</Actions.Action> <em>
<Actions.Action> <span class={{concat 'partition-' (or item.DestinationPartition 'default')}}>{{or
<Action item.DestinationPartition
@for={{confirm}} 'default'
> }}</span>
Cancel /
</Action> <span class={{concat 'nspace-' (or item.DestinationNS 'default')}}>{{or
</Actions.Action> item.DestinationNS
</:actions> 'default'
</InformedAction> }}</span>
</div> </em>
</li> {{/if}}
{{else if (can "view CRD intention" item=item)}} </span>
<li role="none"> </td>
<div role="menu"> <td class='permissions'>
<InformedAction> {{#if (gt item.Permissions.length 0)}}
<:header> <span>{{pluralize item.Permissions.length 'Permission'}}</span>
<span class="flex flex-nowrap items-center"> {{/if}}
<FlightIcon @name="kubernetes-color" class="mr-1.5" /> </td>
Managed by CRD <td class='meta'>
</span> {{#if item.IsManagedByCRD}}
</:header> <Consul::ExternalSource @item={{item}} @label='Managed by CRD' />
<:body> {{/if}}
<p> </td>
This intention is being managed through an Intention Custom Resource in your Kubernetes cluster. It is view only in the UI. </BlockSlot>
</p> <BlockSlot @name='actions' as |index change checked|>
</:body> <PopoverMenu
<:actions as |Actions|> @expanded={{if (eq checked index) true false}}
<Actions.Action> @onchange={{action change index}}
<Action @keyboardAccess={{false}}
tabindex="-1" >
class="action" <BlockSlot @name='trigger'>
@href={{href-to (or @routeName 'dc.intentions.edit') item.ID}} More
> </BlockSlot>
View <BlockSlot @name='menu' as |confirm send keypressClick change|>
</Action> {{#if (can 'write intention' item=item)}}
</Actions.Action> <li role='none'>
<Actions.Action> <a
<Action role='menuitem'
@onclick={{action change}} tabindex='-1'
> href={{href-to (or routeName 'dc.intentions.edit') item.ID}}
Cancel >Edit</a>
</Action> </li>
</Actions.Action> <li role='none' class='dangerous'>
</:actions> <label
</InformedAction> for={{confirm}}
</div> role='menuitem'
</li> tabindex='-1'
{{else}} onkeypress={{keypressClick}}
<li role="none"> data-test-delete
<a >Delete</label>
role="menuitem" <div role='menu'>
tabindex="-1" <InformedAction class='warning'>
href={{href-to (or routeName 'dc.intentions.edit') item.ID}} <:header>
> Confirm Delete
View </:header>
</a> <:body>
</li> <p>
{{/if}} Are you sure you want to delete this intention?
</BlockSlot> </p>
</PopoverMenu> </:body>
</BlockSlot> <:actions as |Actions|>
<Actions.Action class='dangerous'>
<Action
class='type-delete'
tabindex='-1'
{{on 'click' (queue (action change) (action @delete item))}}
>
Delete
</Action>
</Actions.Action>
<Actions.Action>
<Action @for={{confirm}}>
Cancel
</Action>
</Actions.Action>
</:actions>
</InformedAction>
</div>
</li>
{{else if (can 'view CRD intention' item=item)}}
<li role='none'>
<div role='menu'>
<InformedAction>
<:header>
<span class='flex flex-nowrap items-center'>
<FlightIcon @name='kubernetes-color' class='mr-1.5' />
Managed by CRD
</span>
</:header>
<:body>
<p>
This intention is being managed through an Intention Custom Resource in your
Kubernetes cluster. It is view only in the UI.
</p>
</:body>
<:actions as |Actions|>
<Actions.Action>
<Action
tabindex='-1'
class='action'
@href={{href-to (or @routeName 'dc.intentions.edit') item.ID}}
>
View
</Action>
</Actions.Action>
<Actions.Action>
<Action @onclick={{action change}}>
Cancel
</Action>
</Actions.Action>
</:actions>
</InformedAction>
</div>
</li>
{{else}}
<li role='none'>
<a
role='menuitem'
tabindex='-1'
href={{href-to (or routeName 'dc.intentions.edit') item.ID}}
>
View
</a>
</li>
{{/if}}
</BlockSlot>
</PopoverMenu>
</BlockSlot>
</TabularCollection> </TabularCollection>