<form>
    <fieldset>
        <label data-test-source-element class="type-text{{if item.error.SourceName ' has-error'}}">
            <span>Source Service</span>
            {{#power-select-with-create
              options=items
              searchField='Name'
              selected=SourceName
              searchPlaceholder='Type service name'
              buildSuggestion=(action 'createNewLabel' "Use a future Consul Service called '{{term}}'")
              showCreateWhen=(action "isUnique")
              oncreate=(action 'change' 'SourceName')
              onchange=(action 'change' 'SourceName') as |service search|
            }}
              {{#if (eq service.Name '*') }}
                * (All Services)
              {{else}}
                {{service.Name}}
              {{/if}}
            {{/power-select-with-create}}
            <em>Choose a Consul Service, write in a future Consul Service, or write any Service URL</em>
        </label>
        <label data-test-destination-element class="type-text{{if item.error.DestinationName ' has-error'}}">
            <span>Destination Service</span>
            {{#power-select-with-create
              options=items
              searchField='Name'
              selected=DestinationName
              searchPlaceholder='Type service name'
              buildSuggestion=(action 'createNewLabel' "Use a future Consul Service called '{{term}}'")
              showCreateWhen=(action "isUnique")
              oncreate=(action 'change' 'DestinationName')
              onchange=(action 'change' 'DestinationName') as |service|
            }}
              {{#if (eq service.Name '*') }}
                * (All Services)
              {{else}}
                {{service.Name}}
              {{/if}}
            {{/power-select-with-create}}
            <em>Choose a Consul Service, write in a future Consul Service, or write any Service URL</em>
        </label>
        <div role="radiogroup" class={{if item.error.Action ' has-error'}}>
            {{#each intents as |intent|}}
                <label>
                    <span>{{ capitalize intent }}</span>
                    <input type="radio" name="Action" value="{{intent}}" checked={{if (eq item.Action intent) 'checked'}} onchange={{ action 'change' }}/>
                </label>
            {{/each}}
        </div>
        <label class="type-text{{if item.error.Description ' has-error'}}">
            <span>Description</span>
            <input type="text" name="Description" value="{{item.Description}}" placeholder="Description" onchange={{action 'change'}} />
            <em>Choose a Consul Service, write in a future Consul Service, or write any Service URL</em>
        </label>
    </fieldset>
    <div>
{{#if create }}
        <button type="submit" {{ action "create" item}} disabled={{if (or item.isPristine item.isInvalid) 'disabled'}}>Save</button>
{{ else }}
        <button type="submit" {{ action "update" item}} disabled={{if item.isInvalid 'disabled'}}>Save</button>
{{/if}}
        <button type="reset" {{ action "cancel" item}}>Cancel</button>
{{# if (and item.ID (not-eq item.ID 'anonymous')) }}
        {{#confirmation-dialog message='Are you sure you want to delete this Intention?'}}
            {{#block-slot 'action' as |confirm|}}
                <button data-test-delete type="button" class="type-delete" {{action confirm 'delete' item parent}}>Delete</button>
            {{/block-slot}}
            {{#block-slot 'dialog' as |execute cancel message|}}
              {{delete-confirmation message=message execute=execute cancel=cancel}}
            {{/block-slot}}
        {{/confirmation-dialog}}
{{/if}}
    </div>
</form>

