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,47 +1,52 @@
<TabularCollection
class="consul-intention-list-table"
class='consul-intention-list-table'
...attributes
@items={{@items}}
@rowHeight={{59}}
as |item index|>
<BlockSlot @name="header">
<th class="source">Source</th>
<th class="intent">&nbsp;</th>
<th class="destination">Destination</th>
<th class="permissions">
as |item index|
>
<BlockSlot @name='header'>
<th class='source'>Source</th>
<th class='intent'>&nbsp;</th>
<th class='destination'>Destination</th>
<th class='permissions'>
Permissions
<span>
<Tooltip>Permissions intercept an Intention's traffic using Layer 7 criteria, such as path prefixes and http headers.</Tooltip>
<Tooltip>Permissions intercept an Intention's traffic using Layer 7 criteria, such as path
prefixes and http headers.</Tooltip>
</span>
</th>
<th class="meta">&nbsp;</th>
<th class='meta'>&nbsp;</th>
</BlockSlot>
<BlockSlot @name="row">
<td class="source" data-test-intention={{item.ID}}>
<a href={{href-to (or @routeName 'dc.intentions.edit') item.ID}} data-test-intention-source={{item.SourceName}}>
<BlockSlot @name='row'>
<td class='source' data-test-intention={{item.ID}}>
<a
href={{href-to (or @routeName 'dc.intentions.edit') item.ID}}
data-test-intention-source={{item.SourceName}}
>
{{#if (eq item.SourceName '*')}}
All Services (*)
{{else}}
{{item.SourceName}}
{{/if}}
{{! TODO: slugify }}
<em class="consul-intention-list-table__meta-info">
<em class='consul-intention-list-table__meta-info'>
<Consul::Bucket::List
@item={{hash
Namespace=item.SourceNS
Partition=item.SourcePartition
PeerName=item.SourcePeer
}}
@nspace="-"
@partition="-"
@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 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}}>
<td class='destination' data-test-intention-destination={{item.DestinationName}}>
<span>
{{#if (eq item.DestinationName '*')}}
All Services (*)
@ -51,45 +56,58 @@ as |item index|>
{{#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>
<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">
<td class='permissions'>
{{#if (gt item.Permissions.length 0)}}
<span>{{pluralize item.Permissions.length 'Permission'}}</span>
{{/if}}
</td>
<td class="meta">
<td class='meta'>
{{#if item.IsManagedByCRD}}
<Consul::ExternalSource @item={{item}} @label="Managed by CRD" />
<Consul::ExternalSource @item={{item}} @label='Managed by CRD' />
{{/if}}
</td>
</BlockSlot>
<BlockSlot @name="actions" as |index change checked|>
<BlockSlot @name='actions' as |index change checked|>
<PopoverMenu
@expanded={{if (eq checked index) true false}}
@onchange={{action change index}} @keyboardAccess={{false}}
@onchange={{action change index}}
@keyboardAccess={{false}}
>
<BlockSlot @name="trigger">
<BlockSlot @name='trigger'>
More
</BlockSlot>
<BlockSlot @name="menu" as |confirm send keypressClick change|>
{{#if (can "write intention" item=item)}}
<li role="none">
<a role="menuitem" tabindex="-1" href={{href-to (or routeName 'dc.intentions.edit') item.ID}}>Edit</a>
<BlockSlot @name='menu' as |confirm send keypressClick change|>
{{#if (can 'write intention' item=item)}}
<li role='none'>
<a
role='menuitem'
tabindex='-1'
href={{href-to (or routeName 'dc.intentions.edit') item.ID}}
>Edit</a>
</li>
<li role="none" class="dangerous">
<label for={{confirm}} role="menuitem" tabindex="-1" onkeypress={{keypressClick}} data-test-delete>Delete</label>
<div role="menu">
<InformedAction
class="warning"
>
<li role='none' class='dangerous'>
<label
for={{confirm}}
role='menuitem'
tabindex='-1'
onkeypress={{keypressClick}}
data-test-delete
>Delete</label>
<div role='menu'>
<InformedAction class='warning'>
<:header>
Confirm Delete
</:header>
@ -99,19 +117,17 @@ as |item index|>
</p>
</:body>
<:actions as |Actions|>
<Actions.Action class="dangerous">
<Actions.Action class='dangerous'>
<Action
class="type-delete"
tabindex="-1"
class='type-delete'
tabindex='-1'
{{on 'click' (queue (action change) (action @delete item))}}
>
Delete
</Action>
</Actions.Action>
<Actions.Action>
<Action
@for={{confirm}}
>
<Action @for={{confirm}}>
Cancel
</Action>
</Actions.Action>
@ -119,35 +135,34 @@ as |item index|>
</InformedAction>
</div>
</li>
{{else if (can "view CRD intention" item=item)}}
<li role="none">
<div role="menu">
{{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" />
<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.
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"
tabindex='-1'
class='action'
@href={{href-to (or @routeName 'dc.intentions.edit') item.ID}}
>
View
</Action>
</Actions.Action>
<Actions.Action>
<Action
@onclick={{action change}}
>
<Action @onclick={{action change}}>
Cancel
</Action>
</Actions.Action>
@ -156,10 +171,10 @@ as |item index|>
</div>
</li>
{{else}}
<li role="none">
<li role='none'>
<a
role="menuitem"
tabindex="-1"
role='menuitem'
tabindex='-1'
href={{href-to (or routeName 'dc.intentions.edit') item.ID}}
>
View