diff --git a/app/components/hook-switch.coffee b/app/components/hook-switch.coffee new file mode 100644 index 00000000..18468089 --- /dev/null +++ b/app/components/hook-switch.coffee @@ -0,0 +1,18 @@ +`import Ember from 'ember'` + +HookSwitchComponent = Ember.Component.extend + tagName: 'a' + classNames: ['travis-switch', 'switch'] + classNameBindings: ['active'] + activeBinding: "hook.active" + + click: -> + @sendAction('onToggle') + hook = @get('hook') + hook.toggle().then( (->), => + @toggleProperty('hook.active') + @sendAction('onToggleError', hook) + ) + + +`export default HookSwitchComponent` diff --git a/app/components/hooks-list-item.coffee b/app/components/hooks-list-item.coffee new file mode 100644 index 00000000..f0f69e3e --- /dev/null +++ b/app/components/hooks-list-item.coffee @@ -0,0 +1,21 @@ +`import Ember from 'ember'` +`import config from 'travis/config/environment'` + +HooksListItemComponent = Ember.Component.extend + tagName: 'li' + classNames: ['row'] + classNameBindings: ['hook.active:active'] + + githubOrgsOauthAccessSettingsUrl: config.githubOrgsOauthAccessSettingsUrl + + actions: + handleToggleError: -> + @set("showError", true) + + close: -> + @send('resetErrors') + + resetErrors: -> + @set("showError", false) + +`export default HooksListItemComponent` diff --git a/app/styles/app/layouts/profile.sass b/app/styles/app/layouts/profile.sass index 6a715a7b..5c23ad46 100644 --- a/app/styles/app/layouts/profile.sass +++ b/app/styles/app/layouts/profile.sass @@ -124,12 +124,12 @@ p.profile-user-last clear: both margin-bottom: .8em overflow: auto - > div - width: grid-calc(10, 24) - @media #{$medium-up} - width: grid-calc(7, 24) - @media #{$large-up} - width: grid-calc(5, 24) + .profile-hooks + width: grid-calc(10, 24) + @media #{$medium-up} + width: grid-calc(7, 24) + @media #{$large-up} + width: grid-calc(5, 24) .switch display: inline-block .profile-settings @@ -190,4 +190,28 @@ p.profile-user-last line-height: $line-height-m a color: #adaaab - text-decoration: underline \ No newline at end of file + text-decoration: underline + +.error + width: 100%; + padding: 0 $column-gutter/2; + p + position: relative + padding: $column-gutter/2 $column-gutter*2 $column-gutter/2 $column-gutter/2; + color: #de4248 + background-color: #f1b6ad + &:after + content: "" + position: absolute + top: -0.5em + left: 1.5em + width: 1.2em + height: 1.2em + background: #f1b6ad + transform: rotate(45deg) + .close + @extend .icon + position: absolute + top: 1em + right: 1em + @extend .icon--dismiss-red diff --git a/app/templates/account.hbs b/app/templates/account.hbs index ab1a9041..a7d0f77c 100644 --- a/app/templates/account.hbs +++ b/app/templates/account.hbs @@ -21,28 +21,47 @@ {{/if}} -
-

{{view.name}}

-
+
+

{{view.name}}

+
- {{#if user.isSyncing}} -
- -
- - {{else}} -
- -

last synced {{format-time user.syncedAt}}

-
- {{#if config.pro}} -

We're only showing your private repositories. You can find your public projects on travis-ci.org.

- {{else}} -

We're only showing your public repositories. You can find your private projects on travis-ci.com.

+ {{#if user.isSyncing}} +
+ +
+ {{else}} +
+ +

last synced {{format-time user.syncedAt}}

+
+ {{#if config.billingEndpoint}} +
+ {{#if view.subscribed}} + + Subscription active! + + {{else}} + {{#if view.education}} + + Educational account! + + {{else}} + + Sign up this account! + + {{/if}} + {{/if}} +
+ {{/if}} + {{#if config.pro}} +

We're only showing your private repositories. You can find your public projects on travis-ci.org.

+ {{else}} +

We're only showing your public repositories. You can find your private projects on travis-ci.com.

+ {{/if}} {{/if}} @@ -74,20 +93,7 @@
- {{#if hooksWithoutAdmin.length}} -
-

You require admin rights to enable these repositories

+ {{#if hooksWithoutAdmin.length}} +
+

You require admin rights to enable these repositories

- -
- {{/if}} + +
{{/if}} + {{else}} {{/if}} diff --git a/app/templates/components/hook-switch.hbs b/app/templates/components/hook-switch.hbs new file mode 100644 index 00000000..dbed063c --- /dev/null +++ b/app/templates/components/hook-switch.hbs @@ -0,0 +1,6 @@ + + ON + + + OFF + diff --git a/app/templates/components/hooks-list-item.hbs b/app/templates/components/hooks-list-item.hbs new file mode 100644 index 00000000..91fa3d36 --- /dev/null +++ b/app/templates/components/hooks-list-item.hbs @@ -0,0 +1,28 @@ +
+ {{hook-switch hook=hook onToggleError="handleToggleError" onToggle="resetErrors"}} + {{!-- --}} + {{#if hook.isSaving}} + + {{else}} + {{#link-to "settings" hook.ownerName hook.name class="profile-settings" title="Repository settings"}}{{/link-to}} + {{/if}} +
+ + {{hook.slug}} + {{hook.description}} + +{{#if showError}} +
+

+ An error happened when we tried to alter settings on GitHub. + {{#if githubOrgsOauthAccessSettingsUrl}} + It may be caused by API restrictions, please + + review and add + your authorized Orgs. + {{/if}} + +

+
+{{/if}} diff --git a/tests/unit/components/hook-switch-test.coffee b/tests/unit/components/hook-switch-test.coffee new file mode 100644 index 00000000..c59d5281 --- /dev/null +++ b/tests/unit/components/hook-switch-test.coffee @@ -0,0 +1,17 @@ +`import { test, moduleForComponent } from 'ember-qunit'` + +moduleForComponent 'hook-switch', 'HookSwitchComponent', { + # specify the other units that are required for this test + # needs: ['component:foo', 'helper:bar'] +} + +test 'it renders', -> + expect 2 + + # creates the component instance + component = @subject() + equal component._state, 'preRender' + + # appends the component to the page + @append() + equal component._state, 'inDOM' diff --git a/tests/unit/components/hooks-list-item-test.coffee b/tests/unit/components/hooks-list-item-test.coffee new file mode 100644 index 00000000..f0ddafdc --- /dev/null +++ b/tests/unit/components/hooks-list-item-test.coffee @@ -0,0 +1,24 @@ +`import { test, moduleForComponent } from 'ember-qunit'` + +moduleForComponent 'hooks-list-item', 'HooksListItemComponent', { + # specify the other units that are required for this test + needs: ['component:hook-switch'] +} + +test 'it renders', -> + + attributes = { + id: 10000, + name: "foo-bar", + owner_name: "foo", + description: "A foo repo", + active: true, + urlGithub: "https://github.com/foo/foobar", + slug: "foo/foo-bar" + } + component = @subject(hook: attributes) + @append() + + ok component.$().hasClass('active'), 'component should have active class' + ok component.$('.travis-switch').hasClass('active'), 'switch should have active class' + equal component.$('.profile-repo span').text().trim(), 'A foo repo', 'repo description should be displayed'