From 2d421972844d6221e25c0a510206c14e3504a9eb Mon Sep 17 00:00:00 2001
From: Deepak Shah <shahkrdeepak@gmail.com>
Date: Fri, 18 Oct 2024 10:09:34 -0500
Subject: [PATCH] linting and prettier fixes

---
 eslint.config.mjs                             | 16 ++++++++++----
 .../src/components/layout/ComponentDoc.vue    | 22 +++++++++----------
 playground/src/components/layout/SideBar.vue  | 10 ++++-----
 playground/src/layouts/default.vue            |  5 ++---
 playground/src/pages/Components/s-footer.vue  |  2 +-
 .../src/pages/Components/s-header-logo.vue    |  7 +++---
 playground/src/pages/Components/s-header.vue  | 10 ++++-----
 playground/src/pages/index.vue                |  6 ++---
 src/runtime/components/SFooter.vue            |  2 +-
 src/runtime/components/SHeader.vue            | 10 +++------
 10 files changed, 45 insertions(+), 45 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index fcd0d34..2f00f60 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -1,7 +1,15 @@
-import withNuxt from './playground/.nuxt/eslint.config.mjs'
-import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended'
+import withNuxt from './playground/.nuxt/eslint.config.mjs';
+import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended';
 
 export default withNuxt({
     ...eslintPluginPrettierRecommended,
-    ignores: ['node_modules', '.nuxt', 'dist', 'playground/*', 'test'],
-})
+    ignores: ['node_modules', '.nuxt', 'dist', 'test', 'playground/*'],
+    rules: {
+        'vue/multi-word-component-names': 'off', 
+    },
+    languageOptions: {
+        globals: {
+            defineNuxtConfig: 'readonly',
+        },
+    },
+});
diff --git a/playground/src/components/layout/ComponentDoc.vue b/playground/src/components/layout/ComponentDoc.vue
index 87d5bc7..5b0284b 100644
--- a/playground/src/components/layout/ComponentDoc.vue
+++ b/playground/src/components/layout/ComponentDoc.vue
@@ -2,9 +2,9 @@
     <div class="pa-5">
         <v-card>
             <v-toolbar color="primary">
-                <v-app-bar-nav-icon icon="mdi-cube"></v-app-bar-nav-icon>
+                <v-app-bar-nav-icon icon="mdi-cube"/>
                 <v-toolbar-title>{{ propc.title }}</v-toolbar-title>
-                <v-spacer></v-spacer>
+                <v-spacer/>
                 <v-btn
                     prepend-icon="mdi-lightbulb-outline"
                     variant="outlined"
@@ -41,7 +41,7 @@
 
             <v-card-item class="bg-surface">
                 <v-card-text>
-                    <slot name="description"></slot>
+                    <slot name="description"/>
                 </v-card-text>
             </v-card-item>
             <v-divider />
@@ -49,44 +49,44 @@
                 <v-toolbar>
                     <v-app-bar-nav-icon
                         icon="mdi-lightbulb-outline"
-                    ></v-app-bar-nav-icon>
+                    />
                     <v-toolbar-title>Example</v-toolbar-title>
                 </v-toolbar>
                 <v-card-text ref="example">
-                    <slot name="example"></slot>
+                    <slot name="example"/>
                 </v-card-text>
             </v-card-item>
             <v-card-item>
                 <v-toolbar>
                     <v-app-bar-nav-icon
                         icon="mdi-tune-variant"
-                    ></v-app-bar-nav-icon>
+                    />
                     <v-toolbar-title>Props</v-toolbar-title>
                 </v-toolbar>
                 <v-card-text ref="props">
-                    <slot name="prop"></slot>
+                    <slot name="prop"/>
                 </v-card-text>
             </v-card-item>
             <v-card-item>
                 <v-toolbar>
                     <v-app-bar-nav-icon
                         icon="mdi-dock-left"
-                    ></v-app-bar-nav-icon>
+                    />
                     <v-toolbar-title>Slots</v-toolbar-title>
                 </v-toolbar>
                 <v-card-text ref="slots">
-                    <slot name="slot"></slot>
+                    <slot name="slot"/>
                 </v-card-text>
             </v-card-item>
             <v-card-item>
                 <v-toolbar>
                     <v-app-bar-nav-icon
                         icon="mdi-flash-outline"
-                    ></v-app-bar-nav-icon>
+                    />
                     <v-toolbar-title>Event</v-toolbar-title>
                 </v-toolbar>
                 <v-card-text ref="events">
-                    <slot name="event"></slot>
+                    <slot name="event"/>
                 </v-card-text>
             </v-card-item>
         </v-card>
diff --git a/playground/src/components/layout/SideBar.vue b/playground/src/components/layout/SideBar.vue
index e0104f8..33eb843 100644
--- a/playground/src/components/layout/SideBar.vue
+++ b/playground/src/components/layout/SideBar.vue
@@ -7,7 +7,7 @@
                         v-bind="props"
                         prepend-icon="mdi-clipboard-text"
                         title="Getting Started"
-                    ></v-list-item>
+                    />
                 </template>
                 <v-list-item
                     v-for="(item, i) in gettingStarted"
@@ -16,7 +16,7 @@
                     :title="item.title"
                     :value="item.title"
                     :to="item.link"
-                ></v-list-item>
+                />
             </v-list-group>
             <v-list-group v-model:opened="groups" value="components">
                 <template #activator="{ props }">
@@ -24,7 +24,7 @@
                         v-bind="props"
                         prepend-icon="mdi-cogs"
                         title="Components"
-                    ></v-list-item>
+                    />
                 </template>
                 <v-list-item
                     v-for="(item, i) in components"
@@ -33,15 +33,13 @@
                     :title="item.title"
                     :value="item.title"
                     :to="item.link"
-                ></v-list-item>
+                />
             </v-list-group>
         </v-list>
     </v-navigation-drawer>
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-
 const groups = ['started', 'components']
 
 const gettingStarted = [
diff --git a/playground/src/layouts/default.vue b/playground/src/layouts/default.vue
index 9ce6f40..90eb265 100644
--- a/playground/src/layouts/default.vue
+++ b/playground/src/layouts/default.vue
@@ -4,14 +4,13 @@
             <v-app-bar-nav-icon icon="mdi-view-dashboard-variant" to="/" />
             <v-app-bar-title to="/">Spatial UI Elements</v-app-bar-title>
 
-            <v-spacer></v-spacer>
+            <v-spacer/>
             <v-btn
                 icon="mdi-github"
                 variant="elevated"
                 href="https://github.com/SERVIR/spatial-ui-elements"
                 target="_blank"
-            >
-            </v-btn>
+            />
         </v-app-bar>
         <side-bar />
 
diff --git a/playground/src/pages/Components/s-footer.vue b/playground/src/pages/Components/s-footer.vue
index c8d6eae..fdcbfea 100644
--- a/playground/src/pages/Components/s-footer.vue
+++ b/playground/src/pages/Components/s-footer.vue
@@ -29,7 +29,7 @@
 ],
                             </pre>
                         </td>
-                        <td></td>
+                        <td/>
                     </tr>
                 </tbody>
             </v-table>
diff --git a/playground/src/pages/Components/s-header-logo.vue b/playground/src/pages/Components/s-header-logo.vue
index de25471..a4742d6 100644
--- a/playground/src/pages/Components/s-header-logo.vue
+++ b/playground/src/pages/Components/s-header-logo.vue
@@ -45,11 +45,11 @@
                     </tr>
                     <tr>
                         <td>right</td>
-                        <td>ImageProps[] </td>
+                        <td>ImageProps[]</td>
                         <td>
-                            <pre></pre>
+                            <pre/>
                         </td>
-                        <td></td>
+                        <td/>
                     </tr>
                     <tr>
                         <td>configuration</td>
@@ -80,7 +80,6 @@
 
 <script setup lang="ts">
 import ComponentDoc from '~/components/layout/ComponentDoc.vue'
-
 </script>
 
 <style lang="scss" scoped>
diff --git a/playground/src/pages/Components/s-header.vue b/playground/src/pages/Components/s-header.vue
index e28a919..fa45925 100644
--- a/playground/src/pages/Components/s-header.vue
+++ b/playground/src/pages/Components/s-header.vue
@@ -10,7 +10,7 @@
                 :configuration="configuration"
                 :menu="menu"
             />
-            <div class="pt-4"></div>
+            <div class="pt-4"/>
         </template>
         <template #prop>
             <v-table>
@@ -26,7 +26,7 @@
                     <tr>
                         <td>title</td>
                         <td>string</td>
-                        <td></td>
+                        <td/>
                         <td>Requred</td>
                     </tr>
                     <tr>
@@ -53,14 +53,14 @@
                     <tr>
                         <td>menu</td>
                         <td>IRoute</td>
-                        <td></td>
-                        <td></td>
+                        <td/>
+                        <td/>
                     </tr>
                     <tr>
                         <td>imageIcon</td>
                         <td>string</td>
                         <td>SERVIR Logo as default</td>
-                        <td></td>
+                        <td/>
                     </tr>
                 </tbody>
             </v-table>
diff --git a/playground/src/pages/index.vue b/playground/src/pages/index.vue
index 4808a19..f9f81da 100644
--- a/playground/src/pages/index.vue
+++ b/playground/src/pages/index.vue
@@ -10,15 +10,15 @@
                 geospatial applications with a focus on flexibility,
                 performance, and ease of integration for SERVIR Science
                 applications.
-                <br />
-                <br />
+                <br >
+                <br >
                 <div class="d-flex align-center justify-center">
                     <img
                         class=""
                         src="/logos/servir.svg"
                         alt="description"
                         width="200"
-                    />
+                    >
                 </div>
             </v-card-text>
         </v-card>
diff --git a/src/runtime/components/SFooter.vue b/src/runtime/components/SFooter.vue
index 71b4f2f..2982247 100644
--- a/src/runtime/components/SFooter.vue
+++ b/src/runtime/components/SFooter.vue
@@ -42,7 +42,7 @@
                     </v-row>
                 </v-col>
                 <slot />
-                <v-col cols="12" sm="6"> </v-col>
+                <v-col cols="12" sm="6"/>
             </v-row>
         </v-container>
     </v-footer>
diff --git a/src/runtime/components/SHeader.vue b/src/runtime/components/SHeader.vue
index 75407b4..86b7a88 100644
--- a/src/runtime/components/SHeader.vue
+++ b/src/runtime/components/SHeader.vue
@@ -1,10 +1,6 @@
 <template>
     <div>
-        <v-app-bar
-            v-bind="props.configuration"
-            class="s-header"
-            
-        >
+        <v-app-bar v-bind="props.configuration" class="s-header">
             <v-container class="d-flex align-center" style="height: 100%">
                 <v-row class="d-flex align-center">
                     <v-col class="d-flex align-center" cols="8" md="4">
@@ -81,7 +77,7 @@
                 <v-card-title class="text-wrap">
                     <b>{{ props.title }}</b></v-card-title
                 >
-                <v-divider></v-divider>
+                <v-divider/>
 
                 <v-list density="compact" nav>
                     <v-list-item
@@ -90,7 +86,7 @@
                         :prepend-icon="item.icon"
                         :title="item.title"
                         :to="item.route"
-                    ></v-list-item>
+                    />
                 </v-list>
             </v-card>
         </v-navigation-drawer>