Improvements of project structure

src/main/index.js

@@ -15,6 +15,7 @@ function createMainWindow () {
    const window = new BrowserWindow({
       width: 1024,
       height: 800,
+      icon: path.join(__static, 'logo-32.png'),
       webPreferences: {
          nodeIntegration: true,
          'web-security': false

src/renderer/App.vue

@@ -1,7 +1,7 @@
 <template>
    <div id="app">
       <img alt="Vue logo" src="logo.png">
-      <HelloWorld msg="Welcome to Your Vue.js App" />
+      <HelloWorld :msg="$store.state.application.appName" />
    </div>
 </template>
 

src/renderer/components/HelloWorld.vue

@@ -1,32 +1,11 @@
 <template>
   <div class="hello">
     <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
+    <div>
+      <i class="devicons devicons-mysql"></i>
+      <i class="devicons devicons-msql_server"></i>
+      <i class="devicons devicons-postgresql"></i>
+    </div>
   </div>
 </template>
 
@@ -55,4 +34,8 @@ li {
 a {
   color: #42b983;
 }
+
+.devicons{
+  font-size: 4rem;
+}
 </style>

src/renderer/index.js

@@ -1,8 +0,0 @@
-import Vue from 'vue';
-import App from './App.vue';
-
-Vue.config.productionTip = false;
-
-new Vue({
-   render: h => h(App)
-}).$mount('#app');

src/renderer/main.js

@@ -1,8 +1,14 @@
+'use strict';
+
 import Vue from 'vue';
-import App from './App.vue';
+import 'devicons/css/devicons.min.css';
+
+import App from '@/App.vue';
+import store from '@/store';
 
 Vue.config.productionTip = false;
 
 new Vue({
-   render: h => h(App)
+   render: h => h(App),
+   store
 }).$mount('#app');

src/renderer/store/index.js

@@ -0,0 +1,15 @@
+'use strict';
+
+import Vue from 'vue';
+import Vuex from 'vuex';
+
+import application from './modules/application.store';
+
+Vue.use(Vuex);
+
+export default new Vuex.Store({
+   strict: true,
+   modules: {
+      application
+   }
+});

src/renderer/store/modules/application.store.js

@@ -0,0 +1,20 @@
+'use strict';
+
+export default {
+   namespaced: false,
+   strict: true,
+   state: {
+      appName: 'Antares - SQL Client',
+      isLoading: false
+   },
+   mutations: {
+      setLoadingStatus (state, payload) {
+         state.isLoading = payload;
+      }
+   },
+   actions: {
+      setLoadingStatus ({ commit }, payload) {
+         commit('setLoadingStatus', payload);
+      }
+   }
+};