Client - update prettier config

fittrackee_client/.prettierrc

@@ -0,0 +1,13 @@
+{
+  "tabWidth": 2,
+  "semi": false,
+  "singleQuote": true,
+  "quoteProps": "as-needed",
+  "trailingComma": "es5",
+  "bracketSpacing": true,
+  "jsxBracketSameLine": false,
+  "arrowParens": "always",
+  "printWidth": 80,
+  "endOfLine": "auto",
+  "vueIndentScriptAndStyle": true
+}

fittrackee_client/babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  presets: ["@vue/cli-plugin-babel/preset"],
-};
+  presets: ['@vue/cli-plugin-babel/preset'],
+}

fittrackee_client/src/App.vue

@@ -4,36 +4,36 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
-import NavBar from "@/components/NavBar.vue";
+  import { defineComponent } from 'vue'
+  import NavBar from '@/components/NavBar.vue'
 
-export default defineComponent({
-  name: "App",
-  components: {
-    NavBar,
-  },
-});
+  export default defineComponent({
+    name: 'App',
+    components: {
+      NavBar,
+    },
+  })
 </script>
 
 <style lang="scss">
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-}
-
-#nav {
-  padding: 30px;
-
-  a {
-    font-weight: bold;
+  #app {
+    font-family: Avenir, Helvetica, Arial, sans-serif;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    text-align: center;
     color: #2c3e50;
+  }
 
-    &.router-link-exact-active {
-      color: #42b983;
+  #nav {
+    padding: 30px;
+
+    a {
+      font-weight: bold;
+      color: #2c3e50;
+
+      &.router-link-exact-active {
+        color: #42b983;
+      }
     }
   }
-}
 </style>

fittrackee_client/src/components/HelloWorld.vue

@@ -127,30 +127,30 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
+  import { defineComponent } from 'vue'
 
-export default defineComponent({
-  name: "HelloWorld",
-  props: {
-    msg: String,
-  },
-});
+  export default defineComponent({
+    name: 'HelloWorld',
+    props: {
+      msg: String,
+    },
+  })
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss">
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
+  h3 {
+    margin: 40px 0 0;
+  }
+  ul {
+    list-style-type: none;
+    padding: 0;
+  }
+  li {
+    display: inline-block;
+    margin: 0 10px;
+  }
+  a {
+    color: #42b983;
+  }
 </style>

fittrackee_client/src/components/NavBar.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
+  import { defineComponent } from 'vue'
 
-export default defineComponent({
-  name: "NavBar",
-});
+  export default defineComponent({
+    name: 'NavBar',
+  })
 </script>
 
 <style scoped></style>

fittrackee_client/src/main.ts

@@ -1,7 +1,7 @@
-import { createApp } from "vue";
-import App from "./App.vue";
-import "./registerServiceWorker";
-import router from "./router";
-import store from "./store";
+import { createApp } from 'vue'
+import App from './App.vue'
+import './registerServiceWorker'
+import router from './router'
+import store from './store'
 
-createApp(App).use(store).use(router).mount("#app");
+createApp(App).use(store).use(router).mount('#app')

fittrackee_client/src/registerServiceWorker.ts

@@ -1,34 +1,34 @@
 /* eslint-disable no-console */
 
-import { register } from "register-service-worker";
+import { register } from 'register-service-worker'
 
-if (process.env.NODE_ENV === "production") {
+if (process.env.NODE_ENV === 'production') {
   register(`${process.env.BASE_URL}service-worker.js`, {
     ready() {
       console.log(
-        "App is being served from cache by a service worker.\n" +
-          "For more details, visit https://goo.gl/AFskqB"
-      );
+        'App is being served from cache by a service worker.\n' +
+          'For more details, visit https://goo.gl/AFskqB'
+      )
     },
     registered() {
-      console.log("Service worker has been registered.");
+      console.log('Service worker has been registered.')
     },
     cached() {
-      console.log("Content has been cached for offline use.");
+      console.log('Content has been cached for offline use.')
     },
     updatefound() {
-      console.log("New content is downloading.");
+      console.log('New content is downloading.')
     },
     updated() {
-      console.log("New content is available; please refresh.");
+      console.log('New content is available; please refresh.')
     },
     offline() {
       console.log(
-        "No internet connection found. App is running in offline mode."
-      );
+        'No internet connection found. App is running in offline mode.'
+      )
     },
     error(error) {
-      console.error("Error during service worker registration:", error);
+      console.error('Error during service worker registration:', error)
     },
-  });
+  })
 }

fittrackee_client/src/router/index.ts

@@ -1,26 +1,26 @@
-import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
-import Home from "../views/Home.vue";
+import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
+import Home from '../views/Home.vue'
 
 const routes: Array<RouteRecordRaw> = [
   {
-    path: "/",
-    name: "Home",
+    path: '/',
+    name: 'Home',
     component: Home,
   },
   {
-    path: "/about",
-    name: "About",
+    path: '/about',
+    name: 'About',
     // route level code-splitting
     // this generates a separate chunk (about.[hash].js) for this route
     // which is lazy-loaded when the route is visited.
     component: () =>
-      import(/* webpackChunkName: "about" */ "../views/About.vue"),
+      import(/* webpackChunkName: "about" */ '../views/About.vue'),
   },
-];
+]
 
 const router = createRouter({
   history: createWebHistory(process.env.BASE_URL),
   routes,
-});
+})
 
-export default router;
+export default router

fittrackee_client/src/store/index.ts

@@ -1,8 +1,8 @@
-import { createStore } from "vuex";
+import { createStore } from 'vuex'
 
 export default createStore({
   state: {},
   mutations: {},
   actions: {},
   modules: {},
-});
+})

fittrackee_client/src/views/Home.vue

@@ -6,13 +6,13 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
-import HelloWorld from "@/components/HelloWorld.vue"; // @ is an alias to /src
+  import { defineComponent } from 'vue'
+  import HelloWorld from '@/components/HelloWorld.vue' // @ is an alias to /src
 
-export default defineComponent({
-  name: "Home",
-  components: {
-    HelloWorld,
-  },
-});
+  export default defineComponent({
+    name: 'Home',
+    components: {
+      HelloWorld,
+    },
+  })
 </script>

fittrackee_client/tests/unit/example.spec.ts

@@ -1,13 +1,13 @@
-import { expect } from "chai";
-import { shallowMount } from "@vue/test-utils";
-import HelloWorld from "@/components/HelloWorld.vue";
+import { expect } from 'chai'
+import { shallowMount } from '@vue/test-utils'
+import HelloWorld from '@/components/HelloWorld.vue'
 
-describe("HelloWorld.vue", () => {
-  it("renders props.msg when passed", () => {
-    const msg = "new message";
+describe('HelloWorld.vue', () => {
+  it('renders props.msg when passed', () => {
+    const msg = 'new message'
     const wrapper = shallowMount(HelloWorld, {
       props: { msg },
-    });
-    expect(wrapper.text()).to.include(msg);
-  });
-});
+    })
+    expect(wrapper.text()).to.include(msg)
+  })
+})