Chore: Fix eslint issues

jorisnoo · Jan 8, 2020 · f61c5ac · f61c5ac
1 parent 8e0175b
commit f61c5ac
Show file tree

Hide file tree

Showing 9 changed files with 124 additions and 85 deletions.
diff --git a/.github/workflows/lint-js.yml b/.github/workflows/lint-js.yml
@@ -1,12 +1,12 @@
 name: Run Eslint
 
-#on:
-#    push:
-#        branches:
-#            - master
-#        paths:
-#            - '**.js'
-#            - '**.vue'
+on:
+    push:
+        branches:
+            - master
+        paths:
+            - '**.js'
+            - '**.vue'
 
 jobs:
     eslint:

diff --git a/src/js/App.vue b/src/js/App.vue
@@ -1,29 +1,27 @@
 <template>
     <section class="container">
         <div>
+            <external-logos :links="socialmedia" />
 
-            <external-logos :links="socialmedia"></external-logos>
+            <logo />
 
-            <logo></logo>
-
-            <shows :events="events"></shows>
+            <shows :events="events" />
 
             <album
                 v-for="album in albums"
+                :key="album.name"
                 :name="album.name"
                 :link="album.link"
                 :cover="album.cover"
-                :key="album.name"
-            ></album>
-
-<!--            <spotify-links :links="music"></spotify-links>-->
+            />
 
-<!--            <social-links :links="socialmedia"></social-links>-->
+            <!--            <spotify-links :links="music"></spotify-links>-->
 
-            <footer-links></footer-links>
+            <!--            <social-links :links="socialmedia"></social-links>-->
 
-            <mountain></mountain>
+            <footer-links />
 
+            <mountain />
         </div>
     </section>
 </template>
@@ -34,20 +32,20 @@
     import Logo from "./components/Logo";
     import Mountain from "./components/Mountain";
     import Shows from "./components/Shows";
-    import SocialLinks from "./components/SocialLinks";
+    // import SocialLinks from "./components/SocialLinks";
     import ExternalLogos from "./components/ExternalLogos";
-    import SpotifyLinks from "./components/SpotifyLinks";
+    // import SpotifyLinks from "./components/SpotifyLinks";
 
     import { data as albums } from '../content/albums.md';
     import { data as socialmedia } from '../content/socialmedia.md';
-    import events from '../content/events'
+    import events from '../content/events';
     // import { data as music } from '../content/music.md';
     // import { data as footer } from '../content/footer.md';
 
     export default {
         name: "App",
         components: {
-            Album, FooterLinks, Logo, Mountain, Shows, SocialLinks, ExternalLogos, SpotifyLinks,
+            Album, FooterLinks, Logo, Mountain, Shows, ExternalLogos,
         },
 
         data() {
@@ -57,7 +55,7 @@
                 socialmedia: JSON.parse(JSON.stringify(socialmedia.socialmedia)),
                 // music: JSON.parse(JSON.stringify(data.music)),
                 // footer: JSON.parse(JSON.stringify(footer.footer)),
-            }
+            };
         },
 
         created() {
@@ -69,5 +67,5 @@
             // console.log(events);
         },
 
-    }
+    };
 </script>
diff --git a/src/js/components/Album.vue b/src/js/components/Album.vue
@@ -16,30 +16,33 @@
             },
         },
 
-    }
+    };
 </script>
 <template>
     <div class="album">
-        <a :href="link" target="_blank" class="album-cover" >
+        <a
+            :href="link"
+            target="_blank"
+            class="album-cover"
+        >
             <img
                 data-sizes="auto"
                 :data-src="'/images/album/' + cover + '?nf_resize=fit&w=640'"
                 :data-srcset="
-                '/images/album/' + cover + '?nf_resize=fit&w=960 960w, ' +
-                '/images/album/' + cover + '?nf_resize=fit&w=640 640w, ' +
-                '/images/album/' + cover + '?nf_resize=fit&w=480 480w, ' +
-                '/images/album/' + cover + '?nf_resize=fit&w=320 320w'
+                    '/images/album/' + cover + '?nf_resize=fit&w=960 960w, ' +
+                        '/images/album/' + cover + '?nf_resize=fit&w=640 640w, ' +
+                        '/images/album/' + cover + '?nf_resize=fit&w=480 480w, ' +
+                        '/images/album/' + cover + '?nf_resize=fit&w=320 320w'
                 "
                 class="lazyload"
                 :alt="name"
-            />
+            >
         </a>
 
-<!--        <ul class="album-links">-->
-<!--            <li class="album-link" v-for="link in links">-->
-<!--                <a :href="link.fields.link" target="_blank">{{ link.fields.title }}</a>-->
-<!--            </li>-->
-<!--        </ul>-->
-
+        <!--        <ul class="album-links">-->
+        <!--            <li class="album-link" v-for="link in links">-->
+        <!--                <a :href="link.fields.link" target="_blank">{{ link.fields.title }}</a>-->
+        <!--            </li>-->
+        <!--        </ul>-->
     </div>
 </template>
diff --git a/src/js/components/ExternalLogos.vue b/src/js/components/ExternalLogos.vue
@@ -7,15 +7,16 @@
                 type: Array,
                 default: () => [],
             },
-        }
+        },
 
-    }
+    };
 </script>
 <template>
     <div>
         <ul class="externalLogos">
             <li
                 v-for="link in links"
+                :key="link.title.toLowerCase().replace(' ', '')"
                 class="externalLogos-entry"
                 :class="'externalLogos-entry--' + link.title.toLowerCase().replace(' ', '')"
             >
@@ -24,7 +25,7 @@
                     :href="link.url"
                     target="_blank"
                     rel="noopener"
-                ></a>
+                />
             </li>
         </ul>
     </div>

diff --git a/src/js/components/FooterLinks.vue b/src/js/components/FooterLinks.vue
@@ -7,28 +7,45 @@
                 type: Array,
                 default: () => [],
             },
-        }
+        },
 
-    }
+    };
 </script>
 
 <template>
     <div>
         <ul class="footerLinks">
-<!--            <li class="footerLinks-entry" v-for="link in links">-->
-<!--                {{ link.title }} <a :href="(link.email) ? 'mailto:' + link.email : link.url" target="_blank" class="footerLinks-link">{{ (link.text) ? link.text : ((link.email) ? link.email : link.url) }}</a>-->
-<!--            </li>-->
-            <li class="footerLinks-entry" >
+            <!--            <li class="footerLinks-entry" v-for="link in links">-->
+            <!--                {{ link.title }} <a :href="(link.email) ? 'mailto:' + link.email : link.url" target="_blank" class="footerLinks-link">{{ (link.text) ? link.text : ((link.email) ? link.email : link.url) }}</a>-->
+            <!--            </li>-->
+            <li class="footerLinks-entry">
                 Booking
-                <a href="mailto:[email protected]" target="_blank" class="footerLinks-link">[email protected]</a>
+                <a
+                    href="mailto:[email protected]"
+                    target="_blank"
+                    class="footerLinks-link"
+                >[email protected]</a>
             </li>
-            <li class="footerLinks-entry" >
+            <li class="footerLinks-entry">
                 Website By
-                <a href="mailto:[email protected]" target="_blank" class="footerLinks-link">Joris Noordermeer (Code)</a>
-                <a href="https://rubenfeurer.com" target="_blank" class="footerLinks-link" rel="noopener">Ruben Feurer (Design)</a>
+                <a
+                    href="mailto:[email protected]"
+                    target="_blank"
+                    class="footerLinks-link"
+                >Joris Noordermeer (Code)</a>
+                <a
+                    href="https://rubenfeurer.com"
+                    target="_blank"
+                    class="footerLinks-link"
+                    rel="noopener"
+                >Ruben Feurer (Design)</a>
             </li>
-            <li class="footerLinks-entry" >
-                Management <a href="mailto:[email protected]" target="_blank" class="footerLinks-link">[email protected]</a>
+            <li class="footerLinks-entry">
+                Management <a
+                    href="mailto:[email protected]"
+                    target="_blank"
+                    class="footerLinks-link"
+                >[email protected]</a>
             </li>
         </ul>
     </div>

diff --git a/src/js/components/Mountain.vue b/src/js/components/Mountain.vue
@@ -5,11 +5,11 @@
             :data-src="'/images/mountain.png'"
             :data-srcset="
                 '/images/mountain.png 1142w, ' +
-                '/images/mountain.png?nf_resize=fit&w=960 960w, ' +
-                '/images/mountain.png?nf_resize=fit&w=640 640w, ' +
-                '/images/mountain.png?nf_resize=fit&w=480 480w, ' +
-                '/images/mountain.png?nf_resize=fit&w=320 320w'
-                "
+                    '/images/mountain.png?nf_resize=fit&w=960 960w, ' +
+                    '/images/mountain.png?nf_resize=fit&w=640 640w, ' +
+                    '/images/mountain.png?nf_resize=fit&w=480 480w, ' +
+                    '/images/mountain.png?nf_resize=fit&w=320 320w'
+            "
             class="lazyload"
         >
     </div>

diff --git a/src/js/components/Shows.vue b/src/js/components/Shows.vue
@@ -4,13 +4,6 @@
 
     export default {
 
-        props: {
-            events: {
-                type: Array,
-                default: () => [],
-            },
-        },
-
         // mounted() {
         //     this.$nextTick(() => {
         //         this.fEvents = _.filter(this.events, (event) => { return this.eventIsUpcoming(event); });
@@ -21,7 +14,14 @@
             date: function (value) {
                 if (!value) return '';
                 return moment(value).format('ddd D MMM');
-            }
+            },
+        },
+
+        props: {
+            events: {
+                type: Array,
+                default: () => [],
+            },
         },
 
         // methods: {
@@ -35,16 +35,21 @@
         //         return _.filter(this.events, (event) => { return this.eventIsUpcoming(event); });
         //     }
         // }
-    }
+    };
 </script>
 <template>
     <div>
         <ul class="shows">
             <li
                 v-for="event in events"
+                :key="event.venue.name + event.datetime"
                 class="shows-entry"
             >
-                <a :href="event.url" class="shows-link" target="_blank">
+                <a
+                    :href="event.url"
+                    class="shows-link"
+                    target="_blank"
+                >
                     {{ event.datetime | date }} <span class="shows-venue">{{ event.venue.name }}</span> {{ event.venue.city }}
                 </a>
             </li>

diff --git a/src/js/components/SocialLinks.vue b/src/js/components/SocialLinks.vue
@@ -1,3 +1,15 @@
+<template>
+    <div>
+        <ul class="socialLinks">
+            <li
+                v-for="link in links"
+                :key="link.title"
+            >
+                <a class="socialLinks-link" :href="link.url">{{ link.title }}</a>
+            </li>
+        </ul>
+    </div>
+</template>
 
 <script>
     export default {
@@ -7,16 +19,7 @@
                 type: Array,
                 default: () => [],
             },
-        }
+        },
 
-    }
+    };
 </script>
-<template>
-    <div>
-        <ul class="socialLinks">
-            <li v-for="link in links">
-                <a class="socialLinks-link" :href="link.url">{{ link.title }}</a>
-            </li>
-        </ul>
-    </div>
-</template>
diff --git a/src/js/components/SpotifyLinks.vue b/src/js/components/SpotifyLinks.vue
@@ -8,9 +8,9 @@
                 type: Array,
                 default: () => [],
             },
-        }
+        },
 
-    }
+    };
 </script>
 
 <template>
@@ -20,13 +20,25 @@
             :key="link.title"
             class="spotifyLinks-item"
         >
-            <h2 class="spotifyLinks-title">{{ link.title }}</h2>
-            <h3 class="spotifyLinks-subtitle">{{ link.subtitle }}</h3>
-            <a :href="link.spotify_link" class="spotifyLinks-button" target="_blank">
+            <h2 class="spotifyLinks-title">
+                {{ link.title }}
+            </h2>
+            <h3 class="spotifyLinks-subtitle">
+                {{ link.subtitle }}
+            </h3>
+            <a
+                :href="link.spotify_link"
+                class="spotifyLinks-button"
+                target="_blank"
+            >
                 <div class="spotifyLinks-play">Play</div>
             </a>
-            <div v-if="link.itunes_link" class="spotifyLinks-link"><a :href="link.itunes_link"  target="_blank">Buy on iTunes</a></div>
-            <div v-if="link.all_music_link" class="spotifyLinks-link"> <a :href="link.all_music_link" target="_blank">All music by Pablo Nouvelle</a></div>
+            <div v-if="link.itunes_link" class="spotifyLinks-link">
+                <a :href="link.itunes_link" target="_blank">Buy on iTunes</a>
+            </div>
+            <div v-if="link.all_music_link" class="spotifyLinks-link">
+                <a :href="link.all_music_link" target="_blank">All music by Pablo Nouvelle</a>
+            </div>
         </div>
     </div>
 </template>