diff --git a/README.md b/README.md
index f5db2a2..2637bf3 100644
--- a/README.md
+++ b/README.md
@@ -6,19 +6,6 @@ Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introdu
 
 Make sure to install the dependencies:
 
-```bash
-# npm
-npm install
-
-# pnpm
-pnpm install
-
-# yarn
-yarn install
-
-# bun
-bun install
-```
 
 ## Development Server
 
diff --git a/components/Footer.vue b/components/Footer.vue
index ff981b8..4bf7900 100644
--- a/components/Footer.vue
+++ b/components/Footer.vue
@@ -6,13 +6,3 @@
 
   </footer>
 </template>
-
-<script>
-export default {
-
-}
-</script>
-
-<style>
-
-</style>
\ No newline at end of file
diff --git a/components/Header.vue b/components/Header.vue
index 6acd858..127a2c7 100644
--- a/components/Header.vue
+++ b/components/Header.vue
@@ -15,17 +15,17 @@
   </header>
 </template>
 
-<script>
-export default {
-  methods:{
-    async logout() {
-      await this.$auth.logout().catch(e => {
+<script setup lang="ts">
+
+const logout =  async() =>{
+
+  const  nuxtApp = useNuxtApp()
+
+  await nuxtApp.$auth.logout().catch(e => {
           console.log('logged out with error', e)
       })
       console.log('logged out')
     }
-  }
-}
 </script>
 
 <style>
diff --git a/components/Home.vue b/components/Home.vue
index d1b4873..3d82068 100644
--- a/components/Home.vue
+++ b/components/Home.vue
@@ -79,61 +79,58 @@
 </template>
 
 <script>
-export default {
-	data(){
-		return {
-			user: null,
-			configs: {
-				enabled: false,
-				loading: true,
-				checkins: {
-					enabled: false,
-					loading: true,
-					venues: {},
-				}
-			},
-			venue_search: '',
-			bot_enabled_spinner: '',
-			auto_check_in_enabled_spinner: '',
-		}
-	},
-	mounted() {
-
-	},
-	watch: {
-		venue_search: async function(val){
-			if(val.length != 0){
-				//console.log(val);
-				let venue_name = await this.$MFO_UTILS.searchVenues(val);
-				console.log(venue_name[0]?.name);
-			}
-			
-		},
-        'configs.enabled': async function(val, oldVal) {
-			this.bot_enabled_spinner = '';
-			console.log(val);
-			try {
-				let toggle = await this.$MFO_UTILS.setBotStatus(val);
-			} catch (error) {
-				console.log(error)
-			}
-
-			this.bot_enabled_spinner = 'd-none';
-        },
-		'configs.checkins.enabled': async function(val, oldVal) {
-			this.auto_check_in_enabled_spinner = '';
-			console.log(val);
-			try {
-				let toggle = await this.$MFO_UTILS.setAutoCheckinStatus(val);
-			} catch (error) {
-				console.log(error)
-			}
-
-			this.auto_check_in_enabled_spinner = 'd-none';
-        }
-    },
-	methods: {
+
+const user = ref(null);
+const configs = ref({
+	enabled: false,
+	loading: true,
+	checkins: {
+		enabled: false,
+		loading: true,
+		venues: {},
+	}
+});
+const venue_search = ref('');
+const bot_enabled_spinner = ref('');
+const auto_check_in_enabled_spinner = ref('');
+
+onMounted(async () => {
+	
+});
+
+watch(() => configs.value.enabled, async (val, oldVal) => {
+	bot_enabled_spinner.value = '';
+	console.log(val);
+	try {
+		let toggle = await $MFO_UTILS.setBotStatus(val);
+	} catch (error) {
+		console.log(error)
+	}
+
+	bot_enabled_spinner.value = 'd-none';
+});
+
+watch(() => configs.value.checkins.enabled, async (val, oldVal) => {
+	auto_check_in_enabled_spinner.value = '';
+	console.log(val);
+	try {
+		let toggle = await $MFO_UTILS.setAutoCheckinStatus(val);
+	} catch (error) {
+		console.log(error)
+	}
+
+	auto_check_in_enabled_spinner.value = 'd-none';
+});
+
+const logout =  async() =>{
+
+	const  nuxtApp = useNuxtApp()
+
+	await nuxtApp.$auth.logout().catch(e => {
+			console.log('logged out with error', e)
+		})
+		console.log('logged out')
+	}
+
 	
-	},
-};
 </script>