diff --git a/Packages/User/vue-component.sublime-snippet b/Packages/User/vue-component.sublime-snippet
index dc6db06..6515cb9 100644
--- a/Packages/User/vue-component.sublime-snippet
+++ b/Packages/User/vue-component.sublime-snippet
@@ -1,34 +1,56 @@
 <snippet>
     <content><![CDATA[
 <script setup>
-import { useAttrs, reactive, ref, computed, watch, onBeforeMount, onMounted, provide, inject } from 'vue'
-import { useForm, usePage } from '@inertiajs/inertia-vue3'
+import { useAttrs, useSlots, reactive, ref, computed, watch, onBeforeMount, onMounted, onBeforeUpdate, onBeforeUnmount, onUnmounted, provide, inject } from 'vue'
+import { Head, Link, useForm, usePage } from '@inertiajs/inertia-vue3'
 import AppLayout from '@/Layouts/AppLayout.vue'
 
 const emit = defineEmits([])
 
 const attrs = useAttrs()
 
+const slots = useSlots()
+
 const props = defineProps({})
 
+// variables
+
 // computed properties
 
 // watchers
 
 // lifecycle hooks
+onBeforeMount(() => {
+    //
+})
 
+onMounted(() => {
+    //
+})
+
+onBeforeUpdate(() => {
+    //
+})
+
+onBeforeUnmount(() => {
+    //
+})
+
+onUnmounted(() => {
+    //
+})
 // methods
 
 </script>
 
 <template>
-    <app-layout title="${1:TITLE}">
+    <AppLayout title="${1:TITLE}">
         <template #header>${1:TITLE}</template>
 
         <div class="col-span-6">
             <!-- content goes here -->
         </div>
-    </app-layout>
+    </AppLayout>
 </template>
 
 ]]></content>