style(eslint): apply stylistic rules

See: https://eslint.style/rules See: BIDS-128
gobitfly · Aug 8, 2024 · fea1e8f · fea1e8f
1 parent 905ed98
commit fea1e8f
Show file tree

Hide file tree

Showing 311 changed files with 6,451 additions and 3,189 deletions.
diff --git a/frontend/app.vue b/frontend/app.vue
@@ -8,9 +8,9 @@ useHead({
     {
       key: 'revive',
       src: '../js/revive.min.js',
-      async: false
-    }
-  ]
+      async: false,
+    },
+  ],
 }, { mode: 'client' })
 useWindowSizeProvider()
 useBcToastProvider()

diff --git a/frontend/app/router.options.ts b/frontend/app/router.options.ts
@@ -1,5 +1,5 @@
 export default {
-  scrollBehavior (_to: any, _from: any, savedPosition: { left: number, top: number } | null) {
+  scrollBehavior(_to: any, _from: any, savedPosition: { left: number, top: number } | null) {
     return { _to, ...savedPosition }
-  }
+  },
 }
diff --git a/frontend/components/bc/BcBlurOverlay.vue b/frontend/components/bc/BcBlurOverlay.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="gradient-blur" />
 </template>
+
 <style lang="scss" scoped>
 .gradient-blur {
   background: linear-gradient(rgba(233, 233, 233, 0), rgba(233, 233, 233, 1));

diff --git a/frontend/components/bc/BcButton.vue b/frontend/components/bc/BcButton.vue
@@ -1,23 +1,22 @@
 <script lang="ts" setup>
-
-const props =defineProps<{
+const props = defineProps<{
   /**
    * ℹ️ should only be used rarely, e.g. in cases where the action should not be triggerd twice
    */
-  isDisabled?: boolean,
+  isDisabled?: boolean
   /**
    * ♿️ buttons that are aria-disabled are still perceivable by screen readers
-   * as they can still be focused on 
+   * as they can still be focused on
    */
-  isAriaDisabled?: boolean,
+  isAriaDisabled?: boolean
   variant?: 'secondary' // | 'red'
 }>()
 
 const shouldAppearDisabled = computed(() => props.isDisabled || props.isAriaDisabled)
 </script>
 
-<template> 
-  <Button 
+<template>
+  <Button
     type="button"
     :disabled="isDisabled"
     :aria-disabled="isAriaDisabled"
@@ -27,16 +26,15 @@ const shouldAppearDisabled = computed(() => props.isDisabled || props.isAriaDisa
       // 'bc-button--red': variant === 'red'
     }"
   >
-    <slot/>
+    <slot />
     <span
       v-if="$slots.icon"
       class="bc-button__icon"
     >
-      <slot name="icon"/>
+      <slot name="icon" />
     </span>
   </Button>
-
- </template>
+</template>
 
 <style lang="scss" scoped>
   .bc-button--secondary {
@@ -65,4 +63,4 @@ const shouldAppearDisabled = computed(() => props.isDisabled || props.isAriaDisa
   .bc-button__icon {
     margin-left: var(--padding-small);
   }
-</style>
+</style>
diff --git a/frontend/components/bc/BcContentFilter.vue b/frontend/components/bc/BcContentFilter.vue
@@ -1,23 +1,25 @@
 <script lang="ts" setup>
-import { faMagnifyingGlass } from '@fortawesome/pro-solid-svg-icons'
+import {
+  faMagnifyingGlass,
+} from '@fortawesome/pro-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 import type InputText from 'primevue/inputtext'
 
 interface Props {
-  searchPlaceholder?: string;
-  disabledFilter?: boolean;
+  searchPlaceholder?: string
+  disabledFilter?: boolean
 }
 const props = defineProps<Props>()
 
-defineEmits<{(e: 'filter-changed', value: string): void }>()
+defineEmits<{ (e: 'filter-changed', value: string): void }>()
 
 const isFilterVisible = ref(false)
 const filter = ref('')
 
-const button = ref<{$el: HTMLButtonElement} | null>(null)
+const button = ref<{ $el: HTMLButtonElement } | null>(null)
 
-const input = ref<{$el: HTMLInputElement} | null>(null)
-const focusAndSelect = (inputElement: {$el: HTMLInputElement}) => {
+const input = ref<{ $el: HTMLInputElement } | null>(null)
+const focusAndSelect = (inputElement: { $el: HTMLInputElement }) => {
   if (inputElement?.$el) {
     // make sure the input is not disabled anymore
     nextTick(() => {

diff --git a/frontend/components/bc/BcCurrencySelection.vue b/frontend/components/bc/BcCurrencySelection.vue
@@ -6,7 +6,6 @@ defineProps<{
 }>()
 
 const { currency, withLabel, setCurrency } = useCurrency()
-
 </script>
 
 <template>
@@ -20,8 +19,14 @@ const { currency, withLabel, setCurrency } = useCurrency()
   >
     <template #value>
       <span class="item in-header ">
-        <span v-if="showCurrencyIcon" class="icon">
-          <IconCurrency v-if="currency" :currency="currency" />
+        <span
+          v-if="showCurrencyIcon"
+          class="icon"
+        >
+          <IconCurrency
+            v-if="currency"
+            :currency="currency"
+          />
         </span>{{ currency }}
       </span>
     </template>

diff --git a/frontend/components/bc/BcDialog.vue b/frontend/components/bc/BcDialog.vue
@@ -5,11 +5,11 @@ const { width } = useWindowSize()
 const { setTouchableElement } = useSwipe()
 
 interface Props {
-  header?: string,
+  header?: string
 }
 const props = defineProps<Props>()
 
-const dialog = ref<{container: HTMLElement} | undefined>()
+const dialog = ref<{ container: HTMLElement } | undefined>()
 
 const visible = defineModel<boolean>() // requires two way binding as both the parent (only the parent can open the modal) and the component itself (clicking outside the modal closes it) need to update the visibility
 
@@ -35,7 +35,7 @@ const onShow = () => {
     :draggable="false"
     :position="position"
     class="modal_container"
-    :class="{'p-dialog-header-hidden':!props.header && !$slots.header}"
+    :class="{ 'p-dialog-header-hidden': !props.header && !$slots.header }"
     @show="onShow"
   >
     <template #header>

diff --git a/frontend/components/bc/BcDropdown.vue b/frontend/components/bc/BcDropdown.vue
@@ -1,20 +1,28 @@
 <script setup lang="ts">
-
 interface Props {
-  variant?: 'default' | 'table' | 'header',
+  variant?: 'default' | 'table' | 'header'
   panelClass?: string
 }
 
 defineProps<Props>()
 </script>
 
 <template>
-  <Dropdown :class="variant" :panel-class="[variant, panelClass]">
+  <Dropdown
+    :class="variant"
+    :panel-class="[variant, panelClass]"
+  >
     <template #value="slotProps">
-      <slot name="value" v-bind="slotProps" />
+      <slot
+        name="value"
+        v-bind="slotProps"
+      />
     </template>
     <template #option="slotProps">
-      <slot name="option" v-bind="slotProps.option" />
+      <slot
+        name="option"
+        v-bind="slotProps.option"
+      />
     </template>
   </Dropdown>
 </template>
diff --git a/frontend/components/bc/BcFaq.vue b/frontend/components/bc/BcFaq.vue
@@ -1,8 +1,9 @@
 <script setup lang="ts">
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 import {
-  faCaretRight
+  faCaretRight,
 } from '@fortawesome/pro-solid-svg-icons'
+
 interface Props {
   translationPath?: string
 }
@@ -17,35 +18,52 @@ const questions = computed(() => {
     const question = tD($t, `${path}.question`)
     if (!question) {
       break
-    } else {
+    }
+    else {
       list.push({
         path,
         question,
         answers: tAll($t, `${path}.answer`),
         linkPath: tD($t, `${path}.link.path`),
-        linkLabel: tD($t, `${path}.link.label`)
+        linkLabel: tD($t, `${path}.link.label`),
       })
     }
   }
   return list
 })
-
 </script>
 
 <template>
-  <div v-if="questions.length" class="faq-container">
+  <div
+    v-if="questions.length"
+    class="faq-container"
+  >
     <h1>FAQ</h1>
     <Accordion class="accordion">
-      <AccordionTab v-for="quest in questions" :key="quest.path" :header="quest.question">
+      <AccordionTab
+        v-for="quest in questions"
+        :key="quest.path"
+        :header="quest.question"
+      >
         <template #headericon>
           <FontAwesomeIcon :icon="faCaretRight" />
         </template>
         <div class="answer">
-          <p v-for="(answer, index) in quest.answers" :key="index">
+          <p
+            v-for="(answer, index) in quest.answers"
+            :key="index"
+          >
             {{ answer }}
           </p>
-          <div v-if="quest.linkPath" class="footer">
-            <BcLink :to="quest.linkPath" target="_blank" class="link">
+          <div
+            v-if="quest.linkPath"
+            class="footer"
+          >
+            <BcLink
+              :to="quest.linkPath"
+              target="_blank"
+              class="link"
+            >
               {{ quest.linkLabel }}
             </BcLink>
           </div>

diff --git a/frontend/components/bc/BcIconToggle.vue b/frontend/components/bc/BcIconToggle.vue
@@ -3,8 +3,8 @@ import type { IconDefinition } from '@fortawesome/fontawesome-svg-core'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 interface Props {
-  trueIcon?: IconDefinition,
-  falseIcon?: IconDefinition,
+  trueIcon?: IconDefinition
+  falseIcon?: IconDefinition
   disabled?: boolean
 }
 
@@ -21,19 +21,29 @@ const toggle = () => {
   }
   selected.value = !selected.value
 }
-
 </script>
 
 <template>
-  <div class="bc-toggle" :class="{ selected }" :disabled="disabled || null" @click="toggle">
+  <div
+    class="bc-toggle"
+    :class="{ selected }"
+    :disabled="disabled || null"
+    @click="toggle"
+  >
     <div class="icon true-icon">
       <slot name="trueIcon">
-        <FontAwesomeIcon v-if="trueIcon" :icon="trueIcon" />
+        <FontAwesomeIcon
+          v-if="trueIcon"
+          :icon="trueIcon"
+        />
       </slot>
     </div>
     <div class="icon false-icon">
       <slot name="falseIcon">
-        <FontAwesomeIcon v-if="falseIcon" :icon="falseIcon" />
+        <FontAwesomeIcon
+          v-if="falseIcon"
+          :icon="falseIcon"
+        />
       </slot>
     </div>
     <span class="slider" />

diff --git a/frontend/components/bc/BcLink.vue b/frontend/components/bc/BcLink.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 </script>
+
 <template>
   <NuxtLink :no-prefetch="true">
     <template #default>

diff --git a/frontend/components/bc/BcMaintenanceBanner.vue b/frontend/components/bc/BcMaintenanceBanner.vue
@@ -13,20 +13,25 @@ const maintenanceLabel = computed(() => {
   if (isNaN(parsed)) {
     warn('NUXT_PUBLIC_MAINTENANCE_TS is not convertible to an integer, a unix ts is expected')
     return undefined
-  } else if (parsed === 0) {
+  }
+  else if (parsed === 0) {
     return
   }
   const ts = new Date(parsed * 1000).getTime()
   if (ts > tick.value) {
     return $t('maintenance.planned', { date: formatTsToAbsolute(ts / 1000, $t('locales.date'), true) })
-  } else {
+  }
+  else {
     return $t('maintenance.ongoing')
   }
 })
-
 </script>
+
 <template>
-  <div v-if="maintenanceLabel" class="maintenance-banner">
+  <div
+    v-if="maintenanceLabel"
+    class="maintenance-banner"
+  >
     {{ maintenanceLabel }}
   </div>
 </template>

diff --git a/frontend/components/bc/BcToggle.vue b/frontend/components/bc/BcToggle.vue
@@ -1,25 +1,35 @@
 <script setup lang="ts">
 interface Props {
-  trueOption?: string,
-  falseOption?: string,
+  trueOption?: string
+  falseOption?: string
   disabled?: boolean
 }
 defineProps<Props>()
 
 const selected = defineModel<boolean>({ required: true })
-
 </script>
 
 <template>
   <div class="toggle-container">
     <slot name="falseOption">
-      <div v-if="falseOption" class="option-label" :class="{ selected: !selected }">
+      <div
+        v-if="falseOption"
+        class="option-label"
+        :class="{ selected: !selected }"
+      >
         {{ falseOption }}
       </div>
     </slot>
-    <InputSwitch v-model="selected" :disabled="disabled" />
+    <InputSwitch
+      v-model="selected"
+      :disabled="disabled"
+    />
     <slot name="trueOption">
-      <div v-if="trueOption" class="option-label" :class="{ selected }">
+      <div
+        v-if="trueOption"
+        class="option-label"
+        :class="{ selected }"
+      >
         {{ trueOption }}
       </div>
     </slot>