Merge #1211 #1215

1211: Remplace 32x32 PNG with SVG for GitHub mark r=carols10cents

The PNG looks blurry on a high-resolution display.

This SVG is extracted with Inkscape from `GitHub-Mark.ai` from https://github.com/logos.

1215: Revert "Merge #1194" r=carols10cents

While I still like the feature it self, the implementation currently has some issues (see #1209) that I wasn't aware of initially and are not quite as easy to fix. Since I'll be on vacation for the next weeks I won't have time to work on a proper solution for now, so IMHO the best solution is to revert the problematic behavior until this can be fixed correctly.

Resolves #1209

/cc @durka @Boscop

Author: bors-voyager[bot]

app/controllers/application.js

@@ -21,11 +21,7 @@ export default Controller.extend(EKMixin, {
     }),
 
     actions: {
-        search(q) {
-            if (q !== undefined) {
-                this.set('searchQuery', q);
-            }
-
+        search() {
             this.transitionToRoute('search', {
                 queryParams: {
                     q: this.get('searchQuery'),

app/controllers/search.js

@@ -3,12 +3,10 @@ import { computed } from '@ember/object';
 import { alias, bool, readOnly } from '@ember/object/computed';
 import { inject as service } from '@ember/service';
 
-import { task, timeout } from 'ember-concurrency';
+import { task } from 'ember-concurrency';
 
 import PaginationMixin from '../mixins/pagination';
 
-const DEBOUNCE_MS = 250;
-
 export default Controller.extend(PaginationMixin, {
     search: service(),
     queryParams: ['q', 'page', 'per_page', 'sort'],
@@ -42,13 +40,10 @@ export default Controller.extend(PaginationMixin, {
     hasItems: bool('totalItems'),
 
     dataTask: task(function* (params) {
-        // debounce the search query
-        yield timeout(DEBOUNCE_MS);
-
         if (params.q !== null) {
             params.q = params.q.trim();
         }
 
         return yield this.store.query('crate', params);
-    }).restartable(),
+    }).drop(),
 });

app/templates/application.hbs

@@ -21,7 +21,7 @@
         <input type="text" class="search" name="q" id="cargo-desktop-search"
                 placeholder="Click or press 'S' to search..."
                 value={{searchQuery}}
-                oninput={{action "search" value="target.value"}}
+                oninput={{action (mut searchQuery) value="target.value"}}
                 autofocus="autofocus"
                 tabindex="1"
                 required
@@ -106,7 +106,7 @@
     <input type="text" class="search" name="q"
             placeholder="Search"
             value={{searchQuery}}
-            oninput={{action "search" value="target.value"}}
+            oninput={{action (mut searchQuery) value="target.value"}}
             autocorrect="off"
             tabindex="1"
             required>

app/templates/team.hbs

@@ -11,7 +11,7 @@
                 </h2>
             </div>
             {{#user-link user=model.team data-test-github-link=true}}
-                <img alt="GitHub profile" title="GitHub profile" src="/assets/GitHub-Mark-32px.png"/>
+                <img alt="GitHub profile" title="GitHub profile" src="/assets/GitHub-Mark.svg"/>
             {{/user-link}}
         </div>
     </div>

app/templates/user.hbs

@@ -4,7 +4,7 @@
         {{ model.user.login }}
     </h1>
     {{#user-link user=model.user data-test-user-link=true}}
-      <img alt="GitHub profile" title="GitHub profile" src="/assets/GitHub-Mark-32px.png"/>
+      <img alt="GitHub profile" title="GitHub profile" src="/assets/GitHub-Mark.svg"/>
     {{/user-link}}
 </div>
 

public/assets/GitHub-Mark-32px.png

@@ -28,7 +28,7 @@ test('github link has image in team header', async function(assert) {
     await visit('/teams/github:org:thehydroimpulse');
 
     assert.dom('[data-test-heading] [data-test-github-link] img')
-        .hasAttribute('src', '/assets/GitHub-Mark-32px.png');
+        .hasAttribute('src', '/assets/GitHub-Mark.svg');
 });
 
 test('team organization details has github profile icon', async function(assert) {

public/assets/GitHub-Mark.svg

@@ -27,7 +27,7 @@ test('github link has image in user header', async function(assert) {
     await visit('/users/thehydroimpulse');
 
     assert.dom('[data-test-heading] [data-test-user-link] img')
-        .hasAttribute('src', '/assets/GitHub-Mark-32px.png');
+        .hasAttribute('src', '/assets/GitHub-Mark.svg');
 });
 
 test('user details has github profile icon', async function(assert) {