added Pinia for state management & made a store folder for global states

devartstar · devartstar · commit fb8a0025e096 · 2022-06-09T14:30:33.000+05:30
diff --git a/index.html b/index.html
@@ -5,7 +5,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vuetify 3 Vite Preview</title>
+    <title>CircuitVerse - Vue</title>
 </head>
 
 <body>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@mdi/font": "5.9.55",
+    "pinia": "^2.0.14",
     "roboto-fontface": "*",
     "vue": "^3.2.25",
     "vue-router": "^4.0.15",
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/src/components/Home.vue b/src/components/Home.vue
@@ -2,7 +2,7 @@
   <v-layout>
     <v-navigation-drawer color="grey-darken-2" permanent></v-navigation-drawer>
     <v-app-bar color="grey-lighten-2">
-		<h2>Welcome to CicuitVerse Home Page</h2>
+		<h2>{{ title }}</h2>
 	</v-app-bar>
     <v-main>
       <v-card height="200px"></v-card>
@@ -12,4 +12,8 @@
 
 <script lang="ts" setup>
 
+import { HomeStore } from '../store/Home'
+
+const main = HomeStore();
+const { title } = main
 </script>
diff --git a/src/main.ts b/src/main.ts
@@ -2,11 +2,13 @@ import { createApp } from 'vue'
 import App from './App.vue'
 import vuetify from './plugins/vuetify'
 import router from './router/index.js'
+import { createPinia } from 'pinia'
 import { loadFonts } from './plugins/webfontloader'
 
 loadFonts()
 
 createApp(App)
   .use(vuetify)
   .use(router)
+  .use(createPinia())
   .mount('#app')
diff --git a/src/store/Home.ts b/src/store/Home.ts
@@ -0,0 +1,7 @@
+import { defineStore } from "pinia";
+
+export const HomeStore = defineStore('main', {
+	state: () => ({
+		title: "Welcome to CircuitVerse Home Page",
+	})
+})
