Ghost/ghost/admin/app/templates/settings/integrations/zapier.hbs
Kevin Ansfield 2231dd84c2 Migrated to <AngleBracketSyntax /> (#1460)
no issue

Ember is migrating to `<AngleBracketSyntax />` for component invocation, see https://github.com/emberjs/rfcs/blob/master/text/0311-angle-bracket-invocation.md

We were in a half-way situation where some templates used angle bracket syntax in some places, this PR updates templates to use the syntax everywhere.

This simplifies the rules for what template code is referring to...

`<Component>` = a component
`{{helper}}` = a helper (or locally assigned handlebars variable)
`{{this.foo}}` = data on the template backing context (a component/controller)
`{{@foo}}` = a named argument passed into the component that the component backing class has not modified (note: this commit does not introduce any named arguments)

- ran codemod https://github.com/ember-codemods/ember-angle-brackets-codemod on the following directories:
  - `app/templates`
  - `lib/koenig-editor/addon/templates`
- removed positional params from components as angle bracket syntax does not support them
  - `gh-feature-flag`
  - `gh-tour-item`
  - `gh-cm-editor`
  - `gh-fullscreen-modal`
  - `gh-task-button`
- updates some code that was missed in 3c851293c1 to use explicit this
2020-01-16 15:14:03 +00:00

88 lines
4.5 KiB
Handlebars

<section class="gh-canvas">
<GhCanvasHeader class="gh-canvas-header">
<h2 class="gh-canvas-title" data-test-screen-title>
<LinkTo @route="settings.integrations" data-test-link="integrations-back">Integrations</LinkTo>
<span>{{svg-jar "arrow-right"}}</span>
Zapier
</h2>
</GhCanvasHeader>
<section class="view-container bt b--lightgrey-d1 pt5">
<section class="app-grid">
<div class="app-cell">
<div class="bg-white mr3 display flex items-center justify-center br-pill shadow-1 pa3">
<img class="app-icon" src="assets/img/zapiericon.png" />
</div>
</div>
<div class="app-cell">
<h3>Zapier</h3>
<p>Automation for your favourite apps</p>
</div>
</section>
<div class="m15 mt4">
<table class="ma0 shadow-1 bg-grouped-table br3" style="table-layout: fixed">
<tbody>
<tr class="bb b--lightgrey">
<td class="pa3 w50 fw7">Admin API Key</td>
<td class="pa0">
<div class="pa3 relative truncate {{unless this.copyAdminKey.isRunning "hide-child-instant"}}">
<span class="midgrey" data-test-text="admin-key">
{{this.integration.adminKey.secret}}
</span>
<div class="absolute top-1 right-2">
<div class="pt1 pr3 pb1 pl3 bg-black-70 child br3 f8 nudge-top--4 nudge-right--1">
<button type="button" {{action (perform this.copyAdminKey)}} class="white fw4 flex items-center">
{{#if this.copyAdminKey.isRunning}}
{{svg-jar "check-circle" class="w3 v-mid mr2"}} Copied
{{else}}
Copy
{{/if}}
</button>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td class="pa3 w50 fw7">API URL</td>
<td class="pa0 truncate">
<div class="pa3 relative truncate {{unless this.copyApiUrl.isRunning "hide-child-instant"}}">
<span class="midgrey" data-test-text="api-url">
{{this.apiUrl}}
</span>
<div class="absolute top-1 right-2">
<div class="pt1 pr3 pb1 pl3 bg-black-70 child br3 f8 nudge-top--4 nudge-right--1">
<button type="button" {{action (perform this.copyApiUrl)}} class="white fw4 flex items-center">
{{#if this.copyApiUrl.isRunning}}
{{svg-jar "check-circle" class="w3 v-mid mr2"}} Copied
{{else}}
Copy
{{/if}}
</button>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="mt12" id="zapier-toggle">
<div class="gh-setting-content gh-setting-content--no-action">
<div class="gh-setting-title">Zapier Templates</div>
<div class="gh-setting-desc mt1">Explore pre-built templates for common automation tasks</div>
<div class="gh-setting-content-extended">
<div id="zapier-templates">
{{!-- we don't want the script loading during tests because it errors --}}
{{#unless this.isTesting}}
<script src="https://zapier.com/apps/embed/widget.js?services=ghost&container=true&limit=10&html_id=zapier-templates"></script>
{{/unless}}
</div>
</div>
</div>
</div>
</section>
</section>