Add a better error message

app/components/hooks-list-item.coffee

@@ -1,14 +1,18 @@
 `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("errorMessage", "There was an error")
+      @set("showError", true)
 
     close: ->
-      @set("errorMessage", null)
+      @set("showError", false)
 
 `export default HooksListItemComponent`

app/styles/app/layouts/profile.sass

@@ -201,7 +201,7 @@ p.profile-user-last
   padding: 0 $column-gutter/2;
   p
     position: relative
-    padding: $column-gutter/2;
+    padding: $column-gutter/2 $column-gutter*2 $column-gutter/2 $column-gutter/2;
     color: #de4248
     background-color: #f1b6ad
     &:after

app/templates/components/hooks-list-item.hbs

@@ -11,10 +11,18 @@
   {{hook.slug}}
   <span>{{hook.description}}</span></a>
 
-{{#if errorMessage}}
+{{#if showError}}
   <div class="error">
     <p>
-      {{errorMessage}}
+      An error happened when we tried to alter settings on GitHub.
-      <a class="close" {{action "close" target=view}}></a></p>
+      {{#if githubOrgsOauthAccessSettingsUrl}}
+        It may be caused by API restrictions, please
+        <a {{bind-attr href="githubOrgsOauthAccessSettingsUrl"}}
+          title="Orgs Oauth Access Settings on GitHub">
+          review and add
+        </a> your authorized Orgs.
+      {{/if}}
+      <a class="close" {{action "close" target=view}}></a>
+    </p>
   </div>
 {{/if}}