From 248284443862a5abb7a4eec353a223ff37529a84 Mon Sep 17 00:00:00 2001
From: Kasper Seweryn <github@wvffle.net>
Date: Mon, 14 Aug 2023 16:35:05 +0200
Subject: [PATCH] lint: fix linting

Part-of: <https://dev.funkwhale.audio/funkwhale/funkwhale/-/merge_requests/2552>
---
 front/src/components/audio/ChannelEntries.vue | 45 ++++++++++--
 front/src/components/audio/podcast/Row.vue    | 73 ++++++++++++++-----
 front/src/components/audio/podcast/Table.vue  | 53 +++++++++++---
 front/src/composables/useLogger.ts            |  1 +
 front/src/composables/useMarkdown.ts          |  4 +-
 .../specs/composables/useMarkdown.test.ts     | 36 ++++-----
 6 files changed, 157 insertions(+), 55 deletions(-)

diff --git a/front/src/components/audio/ChannelEntries.vue b/front/src/components/audio/ChannelEntries.vue
index 1feefde84..ece0c3440 100644
--- a/front/src/components/audio/ChannelEntries.vue
+++ b/front/src/components/audio/ChannelEntries.vue
@@ -62,17 +62,46 @@ watch(page, fetchData, { immediate: true })
   <div>
     <slot />
     <div class="ui hidden divider" />
-    <div v-if="isLoading" class="ui inverted active dimmer">
+    <div
+      v-if="isLoading"
+      class="ui inverted active dimmer"
+    >
       <div class="ui loader" />
     </div>
-    <podcast-table v-if="isPodcast" v-model:page="page" :paginate-by="limit" :default-cover="defaultCover"
-      :is-podcast="isPodcast" :show-art="true" :show-position="false" :tracks="channels" :show-artist="false"
-      :show-album="false" :paginate-results="true" :total="count" />
-    <track-table v-else v-model:page="page" :default-cover="defaultCover" :is-podcast="isPodcast" :show-art="true"
-      :show-position="false" :tracks="channels" :show-artist="false" :show-album="false" :paginate-results="true"
-      :total="count" :paginate-by="limit" :filters="filters" />
+    <podcast-table
+      v-if="isPodcast"
+      v-model:page="page"
+      :paginate-by="limit"
+      :default-cover="defaultCover"
+      :is-podcast="isPodcast"
+      :show-art="true"
+      :show-position="false"
+      :tracks="channels"
+      :show-artist="false"
+      :show-album="false"
+      :paginate-results="true"
+      :total="count"
+    />
+    <track-table
+      v-else
+      v-model:page="page"
+      :default-cover="defaultCover"
+      :is-podcast="isPodcast"
+      :show-art="true"
+      :show-position="false"
+      :tracks="channels"
+      :show-artist="false"
+      :show-album="false"
+      :paginate-results="true"
+      :total="count"
+      :paginate-by="limit"
+      :filters="filters"
+    />
     <template v-if="!isLoading && channels.length === 0">
-      <empty-state :refresh="true" @refresh="fetchData()">
+      <empty-state
+        :refresh="true"
+        @refresh="fetchData()"
+      >
         <p>
           {{ $t('components.audio.ChannelEntries.help.subscribe') }}
         </p>
diff --git a/front/src/components/audio/podcast/Row.vue b/front/src/components/audio/podcast/Row.vue
index 5dc4d39e5..4f0ca6cb9 100644
--- a/front/src/components/audio/podcast/Row.vue
+++ b/front/src/components/audio/podcast/Row.vue
@@ -68,32 +68,69 @@ await fetchData()
 </script>
 
 <template>
-  <div :class="[
-    { active: currentTrack && track.id === currentTrack.id },
-    'track-row podcast row',
-  ]" @dblclick="activateTrack(track, index)">
-    <div v-if="showArt" class="image left floated column" role="button"
-      @click.prevent.exact="activateTrack(track, index)">
-      <img v-if="track.cover?.urls.original"
-        v-lazy="$store.getters['instance/absoluteUrl'](track.cover.urls.medium_square_crop)" alt=""
-        class="ui artist-track mini image">
-      <img v-else-if="defaultCover" v-lazy="$store.getters['instance/absoluteUrl'](defaultCover.urls.medium_square_crop)"
-        alt="" class="ui artist-track mini image">
-      <img v-else alt="" class="ui artist-track mini image" src="../../../assets/audio/default-cover.png">
+  <div
+    :class="[
+      { active: currentTrack && track.id === currentTrack.id },
+      'track-row podcast row',
+    ]"
+    @dblclick="activateTrack(track, index)"
+  >
+    <div
+      v-if="showArt"
+      class="image left floated column"
+      role="button"
+      @click.prevent.exact="activateTrack(track, index)"
+    >
+      <img
+        v-if="track.cover?.urls.original"
+        v-lazy="$store.getters['instance/absoluteUrl'](track.cover.urls.medium_square_crop)"
+        alt=""
+        class="ui artist-track mini image"
+      >
+      <img
+        v-else-if="defaultCover"
+        v-lazy="$store.getters['instance/absoluteUrl'](defaultCover.urls.medium_square_crop)"
+        alt=""
+        class="ui artist-track mini image"
+      >
+      <img
+        v-else
+        alt=""
+        class="ui artist-track mini image"
+        src="../../../assets/audio/default-cover.png"
+      >
     </div>
-    <div tabindex="0" class="content left floated column">
-      <a class="podcast-episode-title ellipsis" @click.prevent.exact="activateTrack(track, index)">{{ track.title }}</a>
-      <p v-if="renderedDescription" class="podcast-episode-meta">
+    <div
+      tabindex="0"
+      class="content left floated column"
+    >
+      <a
+        class="podcast-episode-title ellipsis"
+        @click.prevent.exact="activateTrack(track, index)"
+      >{{ track.title }}</a>
+      <p
+        v-if="renderedDescription"
+        class="podcast-episode-meta"
+      >
         <SanitizedHtml :html="renderedDescription" />
       </p>
     </div>
-    <div v-if="displayActions" class="meta right floated column">
-      <play-button id="playmenu" class="play-button basic icon" :dropdown-only="true" :is-playable="track.is_playable"
+    <div
+      v-if="displayActions"
+      class="meta right floated column"
+    >
+      <play-button
+        id="playmenu"
+        class="play-button basic icon"
+        :dropdown-only="true"
+        :is-playable="track.is_playable"
         :dropdown-icon-classes="[
           'ellipsis',
           'vertical',
           'large really discrete',
-        ]" :track="track" />
+        ]"
+        :track="track"
+      />
     </div>
   </div>
 </template>
diff --git a/front/src/components/audio/podcast/Table.vue b/front/src/components/audio/podcast/Table.vue
index d8042a35d..de48aa1d4 100644
--- a/front/src/components/audio/podcast/Table.vue
+++ b/front/src/components/audio/podcast/Table.vue
@@ -46,22 +46,57 @@ const { page } = defineModels<{ page: number, }>()
     <div>
       <div :class="['track-table', 'ui', 'unstackable', 'grid', 'tablet-and-up']">
         <!-- For each item, build a row -->
-        <podcast-row v-for="(track, index) in tracks" :key="track.id" :track="track" :index="index" :tracks="tracks"
-          :display-actions="displayActions" :show-duration="showDuration" :is-podcast="isPodcast" />
+        <podcast-row
+          v-for="(track, index) in tracks"
+          :key="track.id"
+          :track="track"
+          :index="index"
+          :tracks="tracks"
+          :display-actions="displayActions"
+          :show-duration="showDuration"
+          :is-podcast="isPodcast"
+        />
       </div>
-      <div v-if="paginateResults" class="ui center aligned basic segment desktop-and-up">
-        <pagination v-bind="$attrs" :total="total" v-model:current="page" :paginate-by="paginateBy" />
+      <div
+        v-if="paginateResults"
+        class="ui center aligned basic segment desktop-and-up"
+      >
+        <pagination
+          v-bind="$attrs"
+          v-model:current="page"
+          :total="total"
+          :paginate-by="paginateBy"
+        />
       </div>
     </div>
 
     <div :class="['track-table', 'ui', 'unstackable', 'grid', 'tablet-and-below']">
       <!-- For each item, build a row -->
 
-      <track-mobile-row v-for="(track, index) in tracks" :key="track.id" :track="track" :index="index" :tracks="tracks"
-        :show-position="showPosition" :show-art="showArt" :show-duration="showDuration" :is-artist="isArtist"
-        :is-album="isAlbum" :is-podcast="isPodcast" />
-      <div v-if="paginateResults" class="ui center aligned basic segment tablet-and-below">
-        <pagination v-if="paginateResults" v-bind="$attrs" :total="total" v-model:current="page" :compact="true" />
+      <track-mobile-row
+        v-for="(track, index) in tracks"
+        :key="track.id"
+        :track="track"
+        :index="index"
+        :tracks="tracks"
+        :show-position="showPosition"
+        :show-art="showArt"
+        :show-duration="showDuration"
+        :is-artist="isArtist"
+        :is-album="isAlbum"
+        :is-podcast="isPodcast"
+      />
+      <div
+        v-if="paginateResults"
+        class="ui center aligned basic segment tablet-and-below"
+      >
+        <pagination
+          v-if="paginateResults"
+          v-bind="$attrs"
+          v-model:current="page"
+          :total="total"
+          :compact="true"
+        />
       </div>
     </div>
   </div>
diff --git a/front/src/composables/useLogger.ts b/front/src/composables/useLogger.ts
index e98c54718..d1c86c13a 100644
--- a/front/src/composables/useLogger.ts
+++ b/front/src/composables/useLogger.ts
@@ -53,6 +53,7 @@ const getFile = () => {
 // NOTE: We're pushing all logs to the end of the event loop
 const createLoggerFn = (level: LogLevel) => {
   // NOTE: We don't want to handle logs ourselves in tests
+  // eslint-disable-next-line no-console
   if (import.meta.env.VITEST) return console[level]
 
   return (...args: any[]) => {
diff --git a/front/src/composables/useMarkdown.ts b/front/src/composables/useMarkdown.ts
index 2fbf0c8a7..7c6d51e3d 100644
--- a/front/src/composables/useMarkdown.ts
+++ b/front/src/composables/useMarkdown.ts
@@ -7,7 +7,7 @@ import showdown from 'showdown'
 showdown.extension('openExternalInNewTab', {
   type: 'output',
   regex: /<a.+?href.+?">/g,
-  replace(text: string) {
+  replace (text: string) {
     const matches = text.match(/href="(.+)">/) ?? []
 
     const url = matches[1] ?? './'
@@ -26,7 +26,7 @@ showdown.extension('openExternalInNewTab', {
 showdown.extension('linkifyTags', {
   type: 'language',
   regex: /#[^\W]+/g,
-  replace(text: string) {
+  replace (text: string) {
     return `<a href="/library/tags/${text.slice(1)}">${text}</a>`
   }
 })
diff --git a/front/test/specs/composables/useMarkdown.test.ts b/front/test/specs/composables/useMarkdown.test.ts
index bb3b558ed..f3aa150f3 100644
--- a/front/test/specs/composables/useMarkdown.test.ts
+++ b/front/test/specs/composables/useMarkdown.test.ts
@@ -1,25 +1,25 @@
 import { useMarkdownRaw } from '~/composables/useMarkdown'
 
 describe('useMarkdownRaw', () => {
-	describe('anchors', () => {
-		it('should add target="_blank" to external links', () => {
-			const html = useMarkdownRaw('https://open.audio')
-			expect(html).toBe('<p><a href="https://open.audio" target="_blank" rel="noopener noreferrer">https://open.audio</a></p>')
-		})
+  describe('anchors', () => {
+    it('should add target="_blank" to external links', () => {
+      const html = useMarkdownRaw('https://open.audio')
+      expect(html).toBe('<p><a href="https://open.audio" target="_blank" rel="noopener noreferrer">https://open.audio</a></p>')
+    })
 
-		it('should not link raw path', () => {
-			const html = useMarkdownRaw('/library/tags')
-			expect(html).toBe('<p>/library/tags</p>')
-		})
+    it('should not link raw path', () => {
+      const html = useMarkdownRaw('/library/tags')
+      expect(html).toBe('<p>/library/tags</p>')
+    })
 
-		it('should not add target="_blank" to internal links', () => {
-			const html = useMarkdownRaw('[/library/tags](/library/tags)')
-			expect(html).toBe('<p><a href="/library/tags">/library/tags</a></p>')
-		})
+    it('should not add target="_blank" to internal links', () => {
+      const html = useMarkdownRaw('[/library/tags](/library/tags)')
+      expect(html).toBe('<p><a href="/library/tags">/library/tags</a></p>')
+    })
 
-		it('should handle multiple links', () => {
-			const html = useMarkdownRaw('https://open.audio https://funkwhale.audio')
-			expect(html).toBe('<p><a href="https://open.audio" target="_blank" rel="noopener noreferrer">https://open.audio</a> <a href="https://funkwhale.audio" target="_blank" rel="noopener noreferrer">https://funkwhale.audio</a></p>')
-		})
-	})
+    it('should handle multiple links', () => {
+      const html = useMarkdownRaw('https://open.audio https://funkwhale.audio')
+      expect(html).toBe('<p><a href="https://open.audio" target="_blank" rel="noopener noreferrer">https://open.audio</a> <a href="https://funkwhale.audio" target="_blank" rel="noopener noreferrer">https://funkwhale.audio</a></p>')
+    })
+  })
 })