From 93ab59090356e58d9333cb5d8a32d9244249b676 Mon Sep 17 00:00:00 2001
From: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de>
Date: Tue, 9 Apr 2019 11:10:50 +0200
Subject: [PATCH] lint fixes

---
 webapp/pages/admin.vue                |  16 ++-
 webapp/pages/post/_id.vue             |   9 +-
 webapp/pages/post/_id/_slug/index.vue |  56 ++++++---
 webapp/pages/profile/_id/_slug.vue    | 165 ++++++++++++++++++++------
 webapp/pages/settings.vue             |  16 ++-
 5 files changed, 200 insertions(+), 62 deletions(-)

diff --git a/webapp/pages/admin.vue b/webapp/pages/admin.vue
index 979684612..6cacedef5 100644
--- a/webapp/pages/admin.vue
+++ b/webapp/pages/admin.vue
@@ -1,13 +1,21 @@
 <template>
   <div>
-    <ds-heading tag="h1">{{ $t('admin.name') }}</ds-heading>
+    <ds-heading tag="h1">
+      {{ $t('admin.name') }}
+    </ds-heading>
     <ds-flex gutter="small">
       <ds-flex-item :width="{ base: '100%', md: '200px' }">
-        <ds-menu :routes="routes" :is-exact="() => true"/>
+        <ds-menu
+          :routes="routes"
+          :is-exact="() => true"
+        />
       </ds-flex-item>
       <ds-flex-item :width="{ base: '100%', md: 1 }">
-        <transition name="slide-up" appear>
-          <nuxt-child/>
+        <transition
+          name="slide-up"
+          appear
+        >
+          <nuxt-child />
         </transition>
       </ds-flex-item>
     </ds-flex>
diff --git a/webapp/pages/post/_id.vue b/webapp/pages/post/_id.vue
index 3447d3ac1..2e021dc13 100644
--- a/webapp/pages/post/_id.vue
+++ b/webapp/pages/post/_id.vue
@@ -2,12 +2,15 @@
   <div>
     <ds-flex gutter="small">
       <ds-flex-item :width="{ base: '100%', sm: 2, md: 2, lg: 1 }">
-        <transition name="slide-up" appear>
-          <nuxt-child/>
+        <transition
+          name="slide-up"
+          appear
+        >
+          <nuxt-child />
         </transition>
       </ds-flex-item>
       <ds-flex-item :width="{ base: '200px' }">
-        <ds-menu :routes="routes"/>
+        <ds-menu :routes="routes" />
       </ds-flex-item>
     </ds-flex>
   </div>
diff --git a/webapp/pages/post/_id/_slug/index.vue b/webapp/pages/post/_id/_slug/index.vue
index e5160f33a..a2937b4e5 100644
--- a/webapp/pages/post/_id/_slug/index.vue
+++ b/webapp/pages/post/_id/_slug/index.vue
@@ -1,12 +1,15 @@
 <template>
-  <transition name="fade" appear>
+  <transition
+    name="fade"
+    appear
+  >
     <ds-card
       v-if="post && ready"
       :image="post.image"
       :header="post.title"
       :class="{'post-card': true, 'disabled-content': post.disabled}"
     >
-      <hc-user :user="post.author"/>
+      <hc-user :user="post.author" />
       <no-ssr>
         <content-menu
           placement="bottom-end"
@@ -15,22 +18,27 @@
           :is-owner="isAuthor(post.author.id)"
         />
       </no-ssr>
-      <ds-space margin-bottom="small"/>
+      <ds-space margin-bottom="small" />
       <!-- Content -->
       <!-- eslint-disable vue/no-v-html -->
       <!-- TODO: replace editor content with tiptap render view -->
-      <div class="content hc-editor-content" v-html="post.content"/>
+      <div
+        class="content hc-editor-content"
+        v-html="post.content"
+      />
       <ds-space>
         <ds-text
           v-if="post.createdAt"
           align="right"
           size="small"
           color="soft"
-        >{{ post.createdAt | dateTime('dd. MMMM yyyy HH:mm') }}</ds-text>
+        >
+          {{ post.createdAt | dateTime('dd. MMMM yyyy HH:mm') }}
+        </ds-text>
       </ds-space>
       <!-- eslint-enable vue/no-v-html -->
       <!-- Shout Button -->
-      <ds-space margin="xx-large"/>
+      <ds-space margin="xx-large" />
       <hc-shout-button
         v-if="post.author"
         :disabled="isAuthor(post.author.id)"
@@ -46,7 +54,7 @@
         :name="category.icon"
         size="large"
       />&nbsp;
-      <ds-space margin-bottom="small"/>
+      <ds-space margin-bottom="small" />
       <!--<div class="tags">
       <ds-icon name="compass" /> <ds-tag
         v-for="category in post.categories"
@@ -57,21 +65,24 @@
       </div>-->
       <!-- Tags -->
       <template v-if="post.tags && post.tags.length">
-        <ds-space margin="xx-small"/>
+        <ds-space margin="xx-small" />
         <div class="tags">
-          <ds-icon name="tags"/>
-          <ds-tag v-for="tag in post.tags" :key="tag.id">
-            <ds-icon name="tag"/>
+          <ds-icon name="tags" />
+          <ds-tag
+            v-for="tag in post.tags"
+            :key="tag.id"
+          >
+            <ds-icon name="tag" />
             {{ tag.name }}
           </ds-tag>
         </div>
       </template>
-      <ds-space margin="small"/>
+      <ds-space margin="small" />
       <!-- Comments -->
       <ds-section slot="footer">
         <h3 style="margin-top: 0;">
           <span>
-            <ds-icon name="comments"/>
+            <ds-icon name="comments" />
             <ds-tag
               v-if="post.comments"
               style="margin-top: -4px; margin-left: -12px; position: absolute;"
@@ -81,11 +92,22 @@
             >{{ post.commentsCount }}</ds-tag>&nbsp; Comments
           </span>
         </h3>
-        <ds-space margin-bottom="large"/>
-        <div v-if="post.comments" id="comments" class="comments">
-          <comment v-for="comment in post.comments" :key="comment.id" :comment="comment"/>
+        <ds-space margin-bottom="large" />
+        <div
+          v-if="post.comments"
+          id="comments"
+          class="comments"
+        >
+          <comment
+            v-for="comment in post.comments"
+            :key="comment.id"
+            :comment="comment"
+          />
         </div>
-        <hc-empty v-else icon="messages"/>
+        <hc-empty
+          v-else
+          icon="messages"
+        />
       </ds-section>
     </ds-card>
   </transition>
diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index bd35abe5b..38bf847a2 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -3,8 +3,12 @@
     <ds-card v-if="user && user.image">
       <p>PROFILE IMAGE</p>
     </ds-card>
-    <ds-space/>
-    <ds-flex v-if="user" :width="{ base: '100%' }" gutter="base">
+    <ds-space />
+    <ds-flex
+      v-if="user"
+      :width="{ base: '100%' }"
+      gutter="base"
+    >
       <ds-flex-item :width="{ base: '100%', sm: 2, md: 2, lg: 1 }">
         <ds-card
           :class="{'disabled-content': user.disabled}"
@@ -25,32 +29,54 @@
             />
           </no-ssr>
           <ds-space margin="small">
-            <ds-heading tag="h3" align="center" no-margin>{{ user.name }}</ds-heading>
-            <ds-text v-if="user.location" align="center" color="soft" size="small">
-              <ds-icon name="map-marker"/>
+            <ds-heading
+              tag="h3"
+              align="center"
+              no-margin
+            >
+              {{ user.name }}
+            </ds-heading>
+            <ds-text
+              v-if="user.location"
+              align="center"
+              color="soft"
+              size="small"
+            >
+              <ds-icon name="map-marker" />
               {{ user.location.name }}
             </ds-text>
             <ds-text
               align="center"
               color="soft"
               size="small"
-            >{{ $t('profile.memberSince') }} {{ user.createdAt | date('MMMM yyyy') }}</ds-text>
+            >
+              {{ $t('profile.memberSince') }} {{ user.createdAt | date('MMMM yyyy') }}
+            </ds-text>
           </ds-space>
-          <ds-space v-if="user.badges && user.badges.length" margin="x-small">
-            <hc-badges :badges="user.badges"/>
+          <ds-space
+            v-if="user.badges && user.badges.length"
+            margin="x-small"
+          >
+            <hc-badges :badges="user.badges" />
           </ds-space>
           <ds-flex>
             <ds-flex-item>
               <no-ssr>
                 <ds-number :label="$t('profile.followers')">
-                  <hc-count-to slot="count" :end-val="followedByCount"/>
+                  <hc-count-to
+                    slot="count"
+                    :end-val="followedByCount"
+                  />
                 </ds-number>
               </no-ssr>
             </ds-flex-item>
             <ds-flex-item>
               <no-ssr>
                 <ds-number :label="$t('profile.following')">
-                  <hc-count-to slot="count" :end-val="Number(user.followingCount) || 0"/>
+                  <hc-count-to
+                    slot="count"
+                    :end-val="Number(user.followingCount) || 0"
+                  />
                 </ds-number>
               </no-ssr>
             </ds-flex-item>
@@ -66,61 +92,122 @@
           </ds-space>
           <template v-if="user.about">
             <hr>
-            <ds-space margin-top="small" margin-bottom="small">
-              <ds-text color="soft" size="small">{{ user.about }}</ds-text>
+            <ds-space
+              margin-top="small"
+              margin-bottom="small"
+            >
+              <ds-text
+                color="soft"
+                size="small"
+              >
+                {{ user.about }}
+              </ds-text>
             </ds-space>
           </template>
         </ds-card>
-        <ds-space/>
-        <ds-heading tag="h3" soft style="text-align: center; margin-bottom: 10px;">Netzwerk</ds-heading>
+        <ds-space />
+        <ds-heading
+          tag="h3"
+          soft
+          style="text-align: center; margin-bottom: 10px;"
+        >
+          Netzwerk
+        </ds-heading>
         <ds-card style="position: relative; height: auto;">
-          <ds-space v-if="user.following && user.following.length" margin="x-small">
-            <ds-text tag="h5" color="soft">Wem folgt {{ user.name | truncate(15) }}?</ds-text>
+          <ds-space
+            v-if="user.following && user.following.length"
+            margin="x-small"
+          >
+            <ds-text
+              tag="h5"
+              color="soft"
+            >
+              Wem folgt {{ user.name | truncate(15) }}?
+            </ds-text>
           </ds-space>
           <template v-if="user.following && user.following.length">
-            <ds-space v-for="follow in uniq(user.following)" :key="follow.id" margin="x-small">
+            <ds-space
+              v-for="follow in uniq(user.following)"
+              :key="follow.id"
+              margin="x-small"
+            >
               <!-- TODO: find better solution for rendering errors -->
               <no-ssr>
-                <user :user="follow" :trunc="15"/>
+                <user
+                  :user="follow"
+                  :trunc="15"
+                />
               </no-ssr>
             </ds-space>
-            <ds-space v-if="user.followingCount - user.following.length" margin="small">
+            <ds-space
+              v-if="user.followingCount - user.following.length"
+              margin="small"
+            >
               <ds-text
                 size="small"
                 color="softer"
-              >und {{ user.followingCount - user.following.length }} weitere</ds-text>
+              >
+                und {{ user.followingCount - user.following.length }} weitere
+              </ds-text>
             </ds-space>
           </template>
           <template v-else>
-            <p style="text-align: center; opacity: .5;">{{ user.name }} folgt niemandem</p>
+            <p style="text-align: center; opacity: .5;">
+              {{ user.name }} folgt niemandem
+            </p>
           </template>
         </ds-card>
-        <ds-space/>
+        <ds-space />
         <ds-card style="position: relative; height: auto;">
-          <ds-space v-if="user.followedBy && user.followedBy.length" margin="x-small">
-            <ds-text tag="h5" color="soft">Wer folgt {{ user.name | truncate(15) }}?</ds-text>
+          <ds-space
+            v-if="user.followedBy && user.followedBy.length"
+            margin="x-small"
+          >
+            <ds-text
+              tag="h5"
+              color="soft"
+            >
+              Wer folgt {{ user.name | truncate(15) }}?
+            </ds-text>
           </ds-space>
           <template v-if="user.followedBy && user.followedBy.length">
-            <ds-space v-for="follow in uniq(user.followedBy)" :key="follow.id" margin="x-small">
+            <ds-space
+              v-for="follow in uniq(user.followedBy)"
+              :key="follow.id"
+              margin="x-small"
+            >
               <!-- TODO: find better solution for rendering errors -->
               <no-ssr>
-                <user :user="follow" :trunc="15"/>
+                <user
+                  :user="follow"
+                  :trunc="15"
+                />
               </no-ssr>
             </ds-space>
-            <ds-space v-if="user.followedByCount - user.followedBy.length" margin="small">
+            <ds-space
+              v-if="user.followedByCount - user.followedBy.length"
+              margin="small"
+            >
               <ds-text
                 size="small"
                 color="softer"
-              >und {{ user.followedByCount - user.followedBy.length }} weitere</ds-text>
+              >
+                und {{ user.followedByCount - user.followedBy.length }} weitere
+              </ds-text>
             </ds-space>
           </template>
           <template v-else>
-            <p style="text-align: center; opacity: .5;">niemand folgt {{ user.name }}</p>
+            <p style="text-align: center; opacity: .5;">
+              niemand folgt {{ user.name }}
+            </p>
           </template>
         </ds-card>
       </ds-flex-item>
       <ds-flex-item :width="{ base: '100%', sm: 3, md: 5, lg: 3 }">
-        <ds-flex :width="{ base: '100%' }" gutter="small">
+        <ds-flex
+          :width="{ base: '100%' }"
+          gutter="small"
+        >
           <ds-flex-item class="profile-top-navigation">
             <ds-card class="ds-tab-nav">
               <ds-flex>
@@ -129,7 +216,10 @@
                     <!-- TODO: find better solution for rendering errors -->
                     <no-ssr>
                       <ds-number :label="$t('common.post', null, user.contributionsCount)">
-                        <hc-count-to slot="count" :end-val="user.contributionsCount"/>
+                        <hc-count-to
+                          slot="count"
+                          :end-val="user.contributionsCount"
+                        />
                       </ds-number>
                     </no-ssr>
                   </ds-space>
@@ -176,16 +266,23 @@
               :key="post.id"
               :width="{ base: '100%', md: '100%', xl: '50%' }"
             >
-              <hc-post-card :post="post"/>
+              <hc-post-card :post="post" />
             </ds-flex-item>
           </template>
           <template v-else>
             <ds-flex-item :width="{ base: '100%' }">
-              <hc-empty margin="xx-large" icon="file"/>
+              <hc-empty
+                margin="xx-large"
+                icon="file"
+              />
             </ds-flex-item>
           </template>
         </ds-flex>
-        <hc-load-more v-if="hasMore" :loading="$apollo.loading" @click="showMoreContributions"/>
+        <hc-load-more
+          v-if="hasMore"
+          :loading="$apollo.loading"
+          @click="showMoreContributions"
+        />
       </ds-flex-item>
     </ds-flex>
   </div>
diff --git a/webapp/pages/settings.vue b/webapp/pages/settings.vue
index 58b95f855..33e29bde0 100644
--- a/webapp/pages/settings.vue
+++ b/webapp/pages/settings.vue
@@ -1,13 +1,21 @@
 <template>
   <div>
-    <ds-heading tag="h1">{{ $t('settings.name') }}</ds-heading>
+    <ds-heading tag="h1">
+      {{ $t('settings.name') }}
+    </ds-heading>
     <ds-flex gutter="small">
       <ds-flex-item :width="{ base: '100%', md: '200px' }">
-        <ds-menu :routes="routes" :is-exact="() => true"/>
+        <ds-menu
+          :routes="routes"
+          :is-exact="() => true"
+        />
       </ds-flex-item>
       <ds-flex-item :width="{ base: '100%', md: 1 }">
-        <transition name="slide-up" appear>
-          <nuxt-child/>
+        <transition
+          name="slide-up"
+          appear
+        >
+          <nuxt-child />
         </transition>
       </ds-flex-item>
     </ds-flex>