Merge pull request #26 from weni-ai/fix/lint

Fix the code using linter

package.json

@@ -8,7 +8,7 @@
     "build": "vite build",
     "preview": "vite preview",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore",
-    "format": "lint --fix"
+    "format": "yarn lint --fix"
   },
   "dependencies": {
     "@weni/unnnic-system": "^2.0.0-beta.0",

src/components/AgentChats.vue

@@ -1,7 +1,11 @@
 <template>
   <section class="table-agents">
     <p class="table-agents__title">
-      <unnnic-avatar-icon icon="forum" size="xs" scheme="feedback-green" />
+      <UnnnicAvatarIcon
+        icon="forum"
+        size="xs"
+        scheme="feedback-green"
+      />
       <span> Chats por agente </span>
     </p>
 

src/components/ColumnCharts.vue

@@ -1,5 +1,10 @@
 <template>
-  <apexchart width="500" type="bar" :options="options" :series="series" />
+  <Apexchart
+    width="500"
+    type="bar"
+    :options="options"
+    :series="series"
+  />
 </template>
 
 <script>

src/components/DashboardsCard.vue

@@ -4,7 +4,7 @@
     <p class="dashboards-card__title">
       <slot name="title"></slot>
     </p>
-    <unnnic-button
+    <UnnnicButton
       text="Ver"
       type="secondary"
       size="large"

src/components/InsightsInput.vue

@@ -6,7 +6,7 @@
       placeholder="Peça insights ao InsightsGPT..."
     />
     <div class="insights-input__button">
-      <unnnic-button
+      <UnnnicButton
         type="secondary"
         size="large"
         iconCenter="send"
@@ -25,7 +25,8 @@ export default {
 .insights-input {
   margin-top: auto;
   width: 100%;
-  padding: 0 calc($unnnic-spacing-awesome + $unnnic-spacing-giant) $unnnic-spacing-lg;
+  padding: 0 calc($unnnic-spacing-awesome + $unnnic-spacing-giant)
+    $unnnic-spacing-lg;
   display: flex;
   flex-direction: row;
   position: relative;
@@ -62,4 +63,4 @@ export default {
     }
   }
 }
-</style>
+</style>

src/components/SugestionCard.vue

@@ -1,55 +1,55 @@
 <template>
-    <article class="insights-card">
-      <p class="insights-card__title">
-        <slot name="title"></slot>
-      </p>
-      <p class="insights-card__description">
-        <slot name="description"></slot>
-      </p>
-    </article>
-  </template>
+  <article class="insights-card">
+    <p class="insights-card__title">
+      <slot name="title"></slot>
+    </p>
+    <p class="insights-card__description">
+      <slot name="description"></slot>
+    </p>
+  </article>
+</template>
 
-  <script>
-  export default {
-    name: 'SugestionCard',
-  };
-  </script>
+<script>
+export default {
+  name: 'SugestionCard',
+};
+</script>
 
-  <style scoped lang="scss">
-  .insights-card {
-    background-color: $unnnic-color-neutral-lightest;
-    padding: $unnnic-spacing-sm;
-    border-radius: $unnnic-spacing-nano;
-    display: flex;
-    flex-direction: column;
-    gap: $unnnic-spacing-xs;
-    justify-content: center;
-    cursor: pointer;
-    border: none;
-    text-align: left;
+<style scoped lang="scss">
+.insights-card {
+  background-color: $unnnic-color-neutral-lightest;
+  padding: $unnnic-spacing-sm;
+  border-radius: $unnnic-spacing-nano;
+  display: flex;
+  flex-direction: column;
+  gap: $unnnic-spacing-xs;
+  justify-content: center;
+  cursor: pointer;
+  border: none;
+  text-align: left;
 
-    &__title {
-      color: $unnnic-color-neutral-darkest;
-      font-size: $unnnic-font-size-body-lg;
-      font-weight: $unnnic-font-weight-bold;
-    }
+  &__title {
+    color: $unnnic-color-neutral-darkest;
+    font-size: $unnnic-font-size-body-lg;
+    font-weight: $unnnic-font-weight-bold;
+  }
 
-    &__description {
-      color: $unnnic-color-neutral-dark;
-      font-size: $unnnic-font-size-body-gt;
-      font-family: $unnnic-font-family-secondary;
-      position: relative;
-      white-space: nowrap;
-      width: 22em;
-      overflow: hidden;
-      text-overflow: ellipsis;
+  &__description {
+    color: $unnnic-color-neutral-dark;
+    font-size: $unnnic-font-size-body-gt;
+    font-family: $unnnic-font-family-secondary;
+    position: relative;
+    white-space: nowrap;
+    width: 22em;
+    overflow: hidden;
+    text-overflow: ellipsis;
 
-      &::before {
-        content: '';
-        position: absolute;
-        right: 0;
-        bottom: 0;
-      }
+    &::before {
+      content: '';
+      position: absolute;
+      right: 0;
+      bottom: 0;
     }
   }
-</style>
+}
+</style>

src/components/TableChats.vue

@@ -14,7 +14,12 @@
     <table class="table-chats__table">
       <thead class="table-chats__table-head">
         <tr>
-          <th v-for="header in headers" :key="header">{{ header }}</th>
+          <th
+            v-for="header in headers"
+            :key="header"
+          >
+            {{ header }}
+          </th>
         </tr>
       </thead>
       <tbody class="table-chats__table-body">
@@ -23,7 +28,12 @@
           :key="rowIndex"
           class="table-chats__table-row"
         >
-          <td v-for="(value, colIndex) in row" :key="colIndex">{{ value }}</td>
+          <td
+            v-for="(value, colIndex) in row"
+            :key="colIndex"
+          >
+            {{ value }}
+          </td>
         </tr>
       </tbody>
     </table>

src/components/TablePagination.vue

@@ -5,7 +5,7 @@
         {{ tablePagination.from }} - {{ tablePagination.to }} de
         {{ tablePagination.total }}
       </p>
-      <unnnic-pagination
+      <UnnnicPagination
         :value="value"
         @input="goToPage"
         :max="countPages"

src/main.js

@@ -17,4 +17,4 @@ app.use(store);
 app.use(Unnnic);
 app.use(VueApexCharts);
 
-app.mount('#app');
+app.mount('#app');

src/router/index.js

@@ -43,4 +43,4 @@ router.beforeEach((to, from, next) => {
     store.dispatch('sidebar/updateChartVisibility', false);
   }
   next();
-});
+});

src/store/index.js

@@ -7,4 +7,4 @@ const store = createStore({
   },
 });
 
-export default store;
+export default store;

src/store/modules/sidebar.js

@@ -1,16 +1,16 @@
 export default {
-    namespaced: true,
-    state: {
-      chartVisible: false,
+  namespaced: true,
+  state: {
+    chartVisible: false,
+  },
+  mutations: {
+    setChartVisibility(state, isVisible) {
+      state.chartVisible = isVisible;
     },
-    mutations: {
-      setChartVisibility(state, isVisible) {
-        state.chartVisible = isVisible;
-      },
+  },
+  actions: {
+    updateChartVisibility({ commit }, isVisible) {
+      commit('setChartVisibility', isVisible);
     },
-    actions: {
-      updateChartVisibility({ commit }, isVisible) {
-        commit('setChartVisibility', isVisible);
-      },
-    },
-  };
+  },
+};

src/views/dashboards/Home/index.vue

@@ -1,9 +1,12 @@
 <template>
-  <insights-layout ref="insights-layout">
+  <InsightsLayout ref="insights-layout">
     <header class="dashboards__header">
-      <unnnic-breadcrumb :crumbs="breadcrumb" @crumbClick="handleCrumbClick" />
+      <UnnnicBreadcrumb
+        :crumbs="breadcrumb"
+        @crumbClick="handleCrumbClick"
+      />
       <section class="dashboards__subheader">
-        <unnnic-icon
+        <UnnnicIcon
           icon="arrow_back"
           size="lg"
           scheme="neutral-black"
@@ -14,7 +17,7 @@
           <h1 class="dashboards__title">Nome do projeto</h1>
           <p class="dashboards__description">Dashboards do projeto</p>
         </section>
-        <unnnic-icon
+        <UnnnicIcon
           icon="close"
           size="md"
           scheme="neutral-black"
@@ -38,7 +41,7 @@
         </template>
       </DashboardCard>
     </section>
-  </insights-layout>
+  </InsightsLayout>
 </template>
 
 <script>

src/views/insights/Home/index.vue

@@ -1,15 +1,18 @@
 <template>
-  <insights-layout ref="insights-layout">
+  <InsightsLayout ref="insights-layout">
     <h1 class="insights__title">Insights</h1>
     <div class="buttons">
-      <unnnic-button
+      <UnnnicButton
         text="Dashboards"
-        icon-left="bar_chart_4_bars"
+        iconLeft="bar_chart_4_bars"
         type="tertiary"
         size="small"
         @click="goToDashboards"
       />
-      <unnnic-input-date-picker v-model="filterDate" size="sm" />
+      <UnnnicInputDatePicker
+        v-model="filterDate"
+        size="sm"
+      />
     </div>
     <section>
       <ColumnCharts
@@ -24,7 +27,10 @@
         <p class="card__title">2150</p>
         <p class="card__description">Mensagens trocadas via bot</p>
       </div>
-      <div class="card card--cursor" @click="goToHumanService">
+      <div
+        class="card card--cursor"
+        @click="goToHumanService"
+      >
         <p class="card__title">503</p>
         <p class="card__description">Atendimentos no Weni Chats</p>
       </div>
@@ -45,7 +51,7 @@
         <p class="card__description">Erros</p>
       </div>
     </div>
-  </insights-layout>
+  </InsightsLayout>
 </template>
 
 <script>