diff --git a/components/CVReplySystem.vue b/components/CVReplySystem.vue
index c7a77940..985df01d 100644
--- a/components/CVReplySystem.vue
+++ b/components/CVReplySystem.vue
@@ -12,21 +12,21 @@ const props = defineProps<{
     replies: Reply[]
 }>()
 
+console.log(props.familyCuid)
 const replyData = ref<Partial<Reply>>({
     name: "",
     reply:"",
-    pageCuid: "",
-    familyCuid:"",
+    pageCuid: props.pageCuid,
+    familyCuid: props.familyCuid,
 })
 
 const clearSuccessMessage = () => {
     successMessage.value = '';
-    //replyData.value.name = ""; // Clear name field
-    //replyData.value.reply = ""; // Clear reply field
+    replyData.value.name = ""; // Clear name field
+    replyData.value.reply = ""; // Clear reply field
 }
 
 const successMessage = ref("");
-// todo: change to $fetch
 const submitComment = async () => {
     const response = await $fetch('/api/replies', {  // look at nuxt documentation for $fetch
       method: 'POST',
@@ -38,16 +38,16 @@ const submitComment = async () => {
     });
 
     if (response) {
-        replyData.value.pageCuid = props.pageCuid;
-        replyData.value.familyCuid = props.familyCuid;
-        emit('displayReply', replyData.value);
+        //replyData.value.pageCuid = props.pageCuid;
+        //replyData.value.familyCuid = props.familyCuid;
+        emit('displayReply', {...replyData.value});
         // replyData.value.name = ""; // Clear name field
         // replyData.value.reply = ""; // Clear reply field
         // need to find a way to clear fields after submitting a response without messing up the emitted data
         
-        successMessage.value = "Comment submitted successfully!"; // Set success message
+        //successMessage.value = "Comment submitted successfully!"; // Set success message
 
-        setTimeout(clearSuccessMessage, 3000);
+        setTimeout(clearSuccessMessage, 1500);
     }
     
 };
diff --git a/components/DonationEntry.vue b/components/DonationEntry.vue
index 3254eae8..9e49cdb3 100644
--- a/components/DonationEntry.vue
+++ b/components/DonationEntry.vue
@@ -40,7 +40,6 @@ const create_checkout_session = async () => {
         isAnonymous: donationData.value.isAnonymous,
         comments: donationData.value.comments
     };
-
     const sessionInfo = await $fetch('/api/create_session', {
 
         method: 'POST',
diff --git a/components/ImageUpload.vue b/components/ImageUpload.vue
index 9335ad93..9d36e11b 100644
--- a/components/ImageUpload.vue
+++ b/components/ImageUpload.vue
@@ -22,11 +22,17 @@ const onFile = async (event: Event) => {
     const file = Files[i];
     // Creates the presigned url and enters the image into the database
     // todo: change to $fetch
-    const { data: imageData } = await useFetch('/api/image_upload', {
+    const imageDataObj = {
+      contentLength: file.size, 
+      contentType: file.type, 
+      file,
+      pageCuid: props.pageCuid
+    }
+    const imageData = await $fetch('/api/image_upload', {
       method: 'POST',
-      body: { contentLength: file.size, contentType: file.type, file, pageCuid: ref(props.pageCuid) }
+      body: imageDataObj
     });
-  const { uploadUrl, image} = imageData.value as unknown as imageLinkTypes;
+  const { uploadUrl, image } = imageData as unknown as imageLinkTypes;
 
   // Executing the image upload by using the presigned url and file as well as its size and type in the request
   const response = await fetch(uploadUrl, {
diff --git a/components/PayoutRecord.vue b/components/PayoutRecord.vue
index 3a87cfc8..0071f1e7 100644
--- a/components/PayoutRecord.vue
+++ b/components/PayoutRecord.vue
@@ -17,7 +17,6 @@ const cvuser = useCookie<User>('cvuser')
 
 // Method that records donation payouts and increases the amount distributed for each page.
 const save = async () => {
-
   const result = await $fetch('/api/family_transaction_payout', {
 
     method: 'POST',
diff --git a/components/imagePreview.vue b/components/imagePreview.vue
index 326506e9..0d7dd3cb 100644
--- a/components/imagePreview.vue
+++ b/components/imagePreview.vue
@@ -38,7 +38,7 @@ const removeImage = async (cuid: string, isPreview: boolean) => {
   if(confirm('Are you sure you want to delete this image?')){
     const theImage = props.images.find((i:Image)=> i.cuid == cuid)
     // todo: change to $fetch
-    await useFetch('/api/image', {
+    await $fetch('/api/image', {
     method: 'delete',
     body: (theImage as Image)
     });
diff --git a/pages/EditPage/[EditPageId].vue b/pages/EditPage/[EditPageId].vue
index 5636d761..a43f4112 100644
--- a/pages/EditPage/[EditPageId].vue
+++ b/pages/EditPage/[EditPageId].vue
@@ -33,7 +33,8 @@ const cvuser2 = useCookie<User2>('cvuser')
 const data = ref<Page>({
     cuid: "",
     userCuid: "",
-    page_name: "",
+    page_first_name: "",
+    page_last_name: "",
     day_of_birth: "",
     day_of_passing:"",
     visitation_date: "",
@@ -145,9 +146,7 @@ const save = async () => {
         data.value.start_date = new Date().toString()
     }
 
-
-    const saveSuccess= await $fetch('/api/page', {
-
+    const saveSuccess = await $fetch('/api/page', {
         // Checks if there is a pre-existing page to edit or if to create a new page    
         method: router.params.EditPageId !== "0" ? 'PUT' : 'POST',
         body: ({ ...data.value })
@@ -155,6 +154,7 @@ const save = async () => {
     )
     try {
 
+
         if (saveSuccess == true && isAdvocate.value) {
             errorInPage.value = false;
             await navigateTo('/PageList/' + data.value.userCuid + '?fromUsers=1')
@@ -265,15 +265,16 @@ CVContainer
     div
         .information.rounded-md.my-2.text-center(class="sm:text-start text-white bg-blue-999")
             CVLegend Personal Information
-        .py-4.flex.gap-60
-            .flex
-                CVLabel Page Name
-                CVHelpButton(class="inline-block" 
-    description="The first and last name of the recently deceased person this page should be dedicated to should be entered here") 
-                // TODO: Fix this frontend bit to facilitate page name => first and last name
-            CVInput.mx-11(v-model='data.page_name' placeholder="required" required)
-        //    .col-md-8.mx-9(class="sm:col-span-2 sm:mr-11")
-                CVInput(v-model='data.page_name' placeholder="required" required)
+
+        .py-4.grid(class="sm:grid-cols-3") 
+            CVLabel First Name
+            .col-md-8.mx-9(class="sm:col-span-2 sm:mr-11")
+                CVInput(v-model='data.page_first_name' placeholder="required" required)
+        .py-4.grid(class="sm:grid-cols-3") 
+            CVLabel Last Name
+            .col-md-8.mx-9(class="sm:col-span-2 sm:mr-11")
+                CVInput(v-model='data.page_last_name' placeholder="required" required)
+
         .py-4.grid(class="sm:grid-cols-3" v-if="isAdvocate")
             CVLabel Family
             .col-md-8.mx-9(class="sm:col-span-2 sm:mr-11")
diff --git a/pages/EditUser/[id].vue b/pages/EditUser/[id].vue
index 50a670d1..d8a4d3e3 100644
--- a/pages/EditUser/[id].vue
+++ b/pages/EditUser/[id].vue
@@ -66,8 +66,7 @@ const save = async () => {
     } else {
         errorInPage.value = true;
     }
-
-}
+  }
 
 }
 
@@ -95,7 +94,7 @@ if ((cuid.value as string) !== "0") {
   await getData(cuid.value as string);
 }
 
-    await getUsers()
+await getUsers()
 
 </script>
 
diff --git a/pages/FamilyReports.vue b/pages/FamilyReports.vue
index 6dd78def..0cc45e81 100644
--- a/pages/FamilyReports.vue
+++ b/pages/FamilyReports.vue
@@ -4,6 +4,7 @@
 //todo: add selection for families instead of all at once and toggle between all at once and all families by having the first option as displaying every page
 //todo: 3 column by however many needed rows (flex-wrap) of checkboxes to enable and disable columns. Future idea: put a nicer version as a sidebar
 div
+
     TitleComp.border-1.border-black  Family Reports 
     br
     .flex.flex-col.gap-5.px-4.mx-auto.mt-8(class="w-3/4 sm:px-16")
@@ -67,6 +68,7 @@ div
       p {{  currentPage + 1 }}
   .col-md-10.px-2.mt-2
       button(@click="nextPage") >
+
 </template>
     
 <script setup lang='ts'>
@@ -118,39 +120,8 @@ div
   
   // converts array of family pages and their advocate responsible for the family into a csv
   function convertToCSV(arr : Partial<Page[]>) {
-    // todo: clean up and remove usages of any, idea for this is to use the pick type from typescript
-    // problem for Samuel: page_name will be set as first_name and last_name which will be on the same level as the user first_name and last_name
-    const listOfTags = ["page_name", "donation_goal", "amount_raised", "deadline", "amount_distributed", "donation_status", "duration", "start_date", "goal_met_date", "first_name", "middle_name", "last_name", "Amount Owed / Goal Percentage" ]
-    // removes every column not in list of tags
-    Object.keys(arr[0] || "").forEach((element: string) => {
-      const currentArr = ref<Partial<Page[]>>([])
-      if(!listOfTags.includes(element)) {
-        arr.forEach((d: any) => {
-        const { [element]: removedSeries , ...newObject  } = d
-        currentArr.value.push(newObject)
-    });
-      arr = currentArr.value 
-      }
-    })
-
-    //adds owed Percent
-    //todo: add something useful here or depreciate
-    type pageReport = Partial<Page> & { owedPercent: number | undefined }
-    const currentArr = ref<pageReport[]>([])
-    arr.forEach((d) => {
-        const owed = (d?.amount_raised as number) - (d?.amount_distributed as number)
-        const goal = (d?.donation_goal as number)
-        const owedPercent: number | undefined = goal != 0 ? ((100 * owed) / goal) : 0
-        
-        currentArr.value.push({...d, ['owedPercent']: owedPercent | 0} )
-    });
-
-    const array = [listOfTags].concat(currentArr.value as unknown as string[])
-  
-    // creates CSV
-    return array.map(it => {
-      return Object.values(it).toString()
-    }).join('\n')
+    const headers = ["page_first_name", "page_last_name", "donation_goal", "amount_raised", "deadline", "amount_distributed", "donation_status", "duration", "start_date", "goal_met_date", "first_name", "middle_name", "last_name", "Amount Owed / Goal Percentage" ]
+    return arr.reduce((acc: any[], page: any) => [...acc, headers.reduce((acc: string[], header: string) => [...acc, page[header]], []).join(",")], []).join("\n")
   }
 
 
@@ -169,24 +140,21 @@ div
   // loads family report data from the families database table and joins and creates a download link for the file
   const loadReports = async () => {
     if( isAdminAdvocate ) { 
-        const { data: familiesData } = await useFetch('/api/familiesReports', {
-        method: 'GET', 
-        query: { page_number: currentPage, start_date: start_date.value, end_date: end_date.value },
-        watch: [currentPage, start_date, end_date]
-        });
-        
-        families.value = familiesData.value?.paginated_pages as unknown as Family[]
-        totalLength.value = familiesData.value?.Pagination.total as unknown as number
-        console.log(families.value)
-        // gathering the family data into an array of family pages and their advocate responsible
-        familiesRaw.value = familiesData.value?.all_families as unknown as Family[]
-        familiesRaw.value.forEach((element: Family)  => { element.Pages.forEach((element2) => {familyPages.value.push( { ...element2 as unknown as Page[], ...element.AdvocateResponsible as any }) })})
-        const familyPagesArr = [...familyPages.value]
-        const csv = convertToCSV( familyPagesArr )
-        createCsvDownloadLink(csv)
+      const familiesData = await useFetch('/api/families', {
+        method: 'GET' 
+      });
+      
+      families.value = familiesData as unknown as Family[]
+      // gathering the family data into an array of family pages and their advocate responsible
+      families.value.forEach((element: Family)  => { element.Pages.forEach((element2) => {familyPages.value.push( { ...element2 as unknown as Page[], ...element.AdvocateResponsible as any }) })})
+      const familyPagesArr = [...familyPages.value]
+      
+      const csv = convertToCSV( familyPagesArr )
+      createCsvDownloadLink(csv)
     }
   }
 
+
     // Formats report date to the format 'yyyy-mm-dd'
     function formatReportDate(date: string) {
       const dates = date.split("-")
@@ -201,7 +169,7 @@ div
     
     // method activated by Advocate or Admin to manual remove the ability to donate to a family page after about a week of the donation deadline.
     // an advocate or admin can also re-enable a page to set its status from 'inactive' to 'active'
-    const togglePageStatus = (page: Page) => {
+    const togglePageStatus = async(page: Page) => {
       if(isAdminAdvocate.value) {
         let booleanChanged = false 
         if(page.status == "active") {
@@ -218,7 +186,7 @@ div
             page.status = "active"
 
             booleanChanged = true
-          } else if(!confirmDeactivate){
+          } else if(!confirmReactivate){
           return ""
           }
       } else if(page.status == "inactive" && !booleanChanged) {
@@ -229,14 +197,17 @@ div
         } else if(!confirmReactivate) {
         return ""
         }
+      }
 
-          booleanChanged = false          
-          const toggledStatus = $fetch('api/page', {
+        //booleanChanged = false         
+        if(booleanChanged) {
+          const toggledStatus = await $fetch('api/page', {
             method: "PUT",
             body: { ...page }
           })
         }
     }
+  }
     
 // Pagination control, move the page counter forwards and backwards and searches
 const nextPage = () => { 
@@ -246,7 +217,7 @@ const nextPage = () => {
         loadReports()
     } 
 }
-const prevPage= () => {
+const prevPage = () => {
     if(currentPage.value != 0){
         currentPage.value--
         loadReports()
@@ -254,5 +225,4 @@ const prevPage= () => {
   }
 // Invoke the initial data loading
 loadReports();
-    }
-    </script>
+</script>
diff --git a/pages/FamilyTransactionList.vue b/pages/FamilyTransactionList.vue
index ec775948..aaa3c011 100644
--- a/pages/FamilyTransactionList.vue
+++ b/pages/FamilyTransactionList.vue
@@ -106,8 +106,8 @@ const { data: Families } = await useFetch<Family[]>('/api/families', {
             leave-to-class='opacity-0'
           )
             ListboxOptions(as='div' class='w-full absolute z-10 mt-10 bg-white shadow-lg max-h-60 rounded-md px-2 py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm' )
-              ListboxOption(as='div' v-for="page in familyData.raw_data" :key="page.cuid" :value="page.cuid" class="px-2 border border-grey-500 py-1 my-1") {{ page.page_name }} | {{ donationFormat(page?.amount_raised - page?.amount_distributed) }}
-        ListboxButton(class='text-left bg-white relative rounded-md pl-2 pr-10 py-2 sm:text-sm w-96') {{ currentPageCuid ? currentPage.page_name : 'Select Page' }}
+              ListboxOption(as='div' v-for="page in familyData.raw_data" :key="page.cuid" :value="page.cuid" class="px-2 border border-grey-500 py-1 my-1") {{ page.page_first_name + " "  + page.page_last_name }} | {{ donationFormat(page?.amount_raised - page?.amount_distributed) }}
+        ListboxButton(class='text-left bg-white relative rounded-md pl-2 pr-10 py-2 sm:text-sm w-96') {{ currentPageCuid ? (currentPage.page_first_name || currentPage.page_last_name) : 'Select Page' }}
   
   .flex.gap-5.justify-around
     //these next two divs could theoretically be their own component with props
@@ -149,7 +149,7 @@ const { data: Families } = await useFetch<Family[]>('/api/families', {
               :key="i" 
               :class="{'bg-gray-200': (i+1) % 2}"
           )
-              td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ item?.page_name }}
+              td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ item?.page_first_name + " " + item?.page_last_name }}
               td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ donationFormat(item.amount_raised) }}
               td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ donationFormat(item.amount_raised-item.amount_distributed) }}
   .mb-9.py-7.flex.flex-wrap.gap-2.place-content-center
@@ -171,7 +171,8 @@ const { data: Families } = await useFetch<Family[]>('/api/families', {
               :class="{'bg-gray-200': (i+1) % 2}"
           )
               td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ item.transaction_id }}
-              td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ item.Page.page_name }}
+              td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ item.cuid }}
+              td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ item.Page.page_first_name + " " + item.Page.page_last_name }}
               td.font-poppins.text-gray-dark.font-bold(style="text-align: center")  {{ donationFormat(item.amount) }}
 </template>
 
diff --git a/pages/Page/[id].vue b/pages/Page/[id].vue
index df701468..d099b03f 100644
--- a/pages/Page/[id].vue
+++ b/pages/Page/[id].vue
@@ -81,7 +81,7 @@ const donationData = ref<PageDonation>({
 });
 
 const userCuid = ref("0")
-const familyCuid = computed(() => pageDataDB.value?.familyCuid)
+
 const profileImageLink = ref("")
 const family_cuid = ref("0")
 const router = useRoute();
@@ -94,7 +94,6 @@ const stripeLink_ref = ref("")
 *  This creates a stripe session and redirects the user to stripe.
 *  Then it redirects to /PageDonation/pageCuid/transactionId
 */
-// todo: change to $fetch
 const create_checkout_session = async () => {
     const sessionInfo = await $fetch('/api/create_session', {
         method: 'POST',
@@ -103,7 +102,7 @@ const create_checkout_session = async () => {
         cuid: id.value,
         pageCuid: id.value,
         familyCuid: pageDataDB.value?.familyCuid,
-        amount_raised: Math.trunc(parseFloat(donationData.amount as unknown as string) * 100) as number
+        amount_raised: Math.trunc(parseFloat(donationData.value.amount as unknown as string) * 100) as number
       }
     });
     stripeLink_ref.value = sessionInfo as string
@@ -127,12 +126,12 @@ const isActive = computed(() => pageDataDB.value?.status == "active")
 
 // todo: Set as pop up?
 const shareFacebook = () => {
-  const facebookShareLink = `https://www.facebook.com/sharer/sharer.php?caption=${pageDataDB.value?.page_name}&u=${window.location.href}`
+  const facebookShareLink = `https://www.facebook.com/sharer/sharer.php?caption=${pageDataDB.value?.page_first_name}${pageDataDB.value?.page_last_name}&u=${window.location.href}`
   window.open(facebookShareLink)
 }
 
-const shareXFormalyKnownAsTwitter = () => {
-  const xShareLink = `https://twitter.com/intent/tweet?text=${pageDataDB.value?.page_name}&url=${window.location.href}`
+const shareXFormerlyKnownAsTwitter = () => {
+  const xShareLink = `https://twitter.com/intent/tweet?text=${pageDataDB.value?.page_first_name}${pageDataDB.value?.page_last_name}&url=${window.location.href}`
   window.open(xShareLink)
 }
 
@@ -141,6 +140,7 @@ const shareMail = () => {
   window.open(MailShareLink)
 }
 
+const familyCuid = computed(() => pageDataDB.value?.familyCuid)
 const donated_percentage = computed(() => (((pageDataDB.value?.amount_raised as number) / (pageDataDB.value?.donation_goal as number )) * 100).toFixed(1) + "");
 const donation_goal_provided = computed(() => pageDataDB.value?.donation_goal as number > 0)
 const comments = computed(() => pageDataDB.value?.PageDonations)
@@ -191,7 +191,7 @@ console.log(pageDataDB.value?.funeral_date)
 // the header overlay with image and name
 .mt-2.min-h-24.text-white.uppercase.w-full(style="background-image: url('https://carsonsvillage.org/wp-content/uploads/2018/11/iStock-862083112-BW.jpg');") 
   .h-full.py-8.self-center.w-full.text-center.flex.flex-col(style="background-color: rgba(50, 119, 136, .8)") 
-    p.my-auto.font-bold.text-4xl {{ pageDataDB.page_name }}
+    p.my-auto.font-bold.text-4xl {{ pageDataDB.page_first_name + " " + pageDataDB.page_last_name }}
 
 .flex.flex-col.gap-5.px-4.mx-auto.mt-8(class="w-3/4 sm:px-16")
   img.mx-auto(v-if="profileImage?.url" class="w-[122px] h-[122px] rounded-[8px]" :src="`${profileImage?.url}`")
@@ -254,7 +254,7 @@ console.log(pageDataDB.value?.funeral_date)
                         .div.comment-header(style="font-size: 0.75rem; font-weight: bold; margin-bottom: 1.5rem;") {{ comment.donorFirstName }} {{ comment.donorLastName }}
                         p.comment-body(style="font-size: 0.75rem; width: fit-content; color: #666;") {{ comment.comments }}
                         .div.comment-donation-amount(style="font-size: 0.75rem; color: #666;") Amount Donated: {{ donationFormat(comment.amount) }}
-        CVReplySystem(:pageCuid="pageCuid" :familyCuid="familyCuid" :replies="replies" @displayReply="displayReply")
+        CVReplySystem(:pageCuid="id" :familyCuid="familyCuid" :replies="replies" @displayReply="displayReply")
         .py-4.grid.flex-box.flex-row.item-centered.gap-1(v-if="replies?.length" style="line-height: 0px;text-align: center")
             div(class="flex")
             .div(v-for="(reply,i) in replies" :key="i" class="reply-box")
@@ -267,7 +267,7 @@ console.log(pageDataDB.value?.funeral_date)
             button(@click="shareFacebook")
               img(src="/facebook-fa.png" style="width:30px; height:33px;") 
           .col
-            button(@click="shareXFormalyKnownAsTwitter")
+            button(@click="shareXFormerlyKnownAsTwitter")
                 img(src="/twitter_fa.png" style="width:30px; height:29px;") 
           .col
             button(@click="shareMail")
diff --git a/pages/PageList/[id].vue b/pages/PageList/[id].vue
index 8cc0b42b..77c993cd 100644
--- a/pages/PageList/[id].vue
+++ b/pages/PageList/[id].vue
@@ -190,7 +190,8 @@ await getDataPageList()
       :key="i" 
       :class="{'bg-gray-200': (i+1) % 2}"
       )
-        td.font-poppins.text-gray-dark.font-bold(style="text-align: center;") {{ item.page_name }}
+        td.font-poppins.text-gray-dark.font-bold(style="text-align: center;") {{ item.page_first_name + " " + item.page_last_name }}
+        td.font-poppins.text-gray-dark.font-bold(style="text-align: center;" v-if="isAdmin") {{ item.userCuid }}
         td.font-poppins.text-gray-dark.font-bold(style="text-align: center;") {{ dateFormat(item.deadline) }}
         td
           LinkButton(class="sm:my-2 transition duration-300 bg-orange-999 hover:bg-green-600" style="--tw-bg-opacity: 1; white-space: nowrap; display: flex; flex-direction: row; padding: 14px 24px; gap: 10px;" :to="`/EditPage/${item.cuid}`") Edit
@@ -210,7 +211,8 @@ await getDataPageList()
       :key="i" 
       :class="{'bg-gray-200': (i+1) % 2}"
       )
-        td.font-poppins.text-gray-dark.font-bold(style="text-align: center;") {{ item.page_name }}
+        td.font-poppins.text-gray-dark.font-bold(style="text-align: center;") {{ item.page_first_name + " " + item.page_last_name }}
+        td.font-poppins.text-gray-dark.font-bold(style="text-align: center;" v-if="isAdmin") {{ item.userCuid }}
         td.font-poppins.text-gray-dark.font-bold(style="text-align: center;") {{ dateFormat(item.deadline) }}
         td
           LinkButton(class="sm:my-2 transition duration-300 bg-orange-999 hover:bg-green-600" style="--tw-bg-opacity: 1; white-space: nowrap; display: flex; flex-direction: row; padding: 14px 24px; gap: 10px;" :to="`/EditPage/${item.cuid}`") Edit
diff --git a/pages/Search.vue b/pages/Search.vue
index b9f82c79..5a5922af 100644
--- a/pages/Search.vue
+++ b/pages/Search.vue
@@ -102,7 +102,7 @@ const searchOnEnter = () => {
       tbody
         tr(v-for="(page, i) in pages" :class="{'bg-gray-200': (i+1) % 2}")
           td(style="text-align: center")   
-            NuxtLink(:to="`/Page/${page.cuid}`") {{ page.page_name}}
+            NuxtLink(:to="`/Page/${page.cuid}`") {{ page.page_first_name + " " + page.page_last_name }}
           td(style="text-align: center") {{ donationFormat(page.donation_goal) }}
           td(style="text-align: center") {{ dateFormat(page.deadline) }}
   .ml-9.mb-9.py-7.flex.flex-wrap.gap-2.place-content-center
diff --git a/prisma/migrations/20240220175128_page_name_first_name_last_name/migration.sql b/prisma/migrations/20240220175128_page_name_first_name_last_name/migration.sql
new file mode 100644
index 00000000..78cc5874
--- /dev/null
+++ b/prisma/migrations/20240220175128_page_name_first_name_last_name/migration.sql
@@ -0,0 +1,12 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `page_name` on the `pages` table. All the data in the column will be lost.
+  - Added the required column `first_name` to the `pages` table without a default value. This is not possible if the table is not empty.
+  - Added the required column `last_name` to the `pages` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- AlterTable
+ALTER TABLE "pages" DROP COLUMN "page_name",
+ADD COLUMN     "first_name" TEXT NOT NULL,
+ADD COLUMN     "last_name" TEXT NOT NULL;
diff --git a/prisma/migrations/20240223151306_page_qualifer_name/migration.sql b/prisma/migrations/20240223151306_page_qualifer_name/migration.sql
new file mode 100644
index 00000000..d69e5445
--- /dev/null
+++ b/prisma/migrations/20240223151306_page_qualifer_name/migration.sql
@@ -0,0 +1,10 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `first_name` on the `pages` table. All the data in the column will be lost.
+  - Added the required column `page_first_name` to the `pages` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- AlterTable
+ALTER TABLE "pages" DROP COLUMN "first_name",
+ADD COLUMN     "page_first_name" TEXT NOT NULL;
diff --git a/prisma/migrations/20240223151402_page_name/migration.sql b/prisma/migrations/20240223151402_page_name/migration.sql
new file mode 100644
index 00000000..a3a2b24e
--- /dev/null
+++ b/prisma/migrations/20240223151402_page_name/migration.sql
@@ -0,0 +1,10 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `last_name` on the `pages` table. All the data in the column will be lost.
+
+*/
+-- AlterTable
+ALTER TABLE "pages" DROP COLUMN "last_name",
+ADD COLUMN     "page_last_name" TEXT NOT NULL DEFAULT '',
+ALTER COLUMN "page_first_name" SET DEFAULT '';
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index b340f00e..4cebfaab 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -9,18 +9,17 @@ datasource db {
 }
 
 model User {
-  cuid        String @id @default(cuid())
-  email       String @unique
-  user_role   String @default("family") // advocate, admin
-  first_name  String @default("")
-  middle_name String @default("")
-  last_name   String @default("")
-  phone       String @default("")
-
-  AdvocateFamily Family[] @relation("advocate_family")
-  Family         Family?  @relation(name: "family_member", fields: [familyCuid], references: [cuid])
+  cuid           String   @id @default(cuid())
+  email          String   @unique
+  user_role      String   @default("family")
+  first_name     String   @default("")
+  middle_name    String   @default("")
+  last_name      String   @default("")
+  phone          String   @default("")
   familyCuid     String?
+  AdvocateFamily Family[] @relation("advocate_family")
   Pages          Page[]
+  Family         Family?  @relation("family_member", fields: [familyCuid], references: [cuid])
 
   @@map("user_accounts")
 }
@@ -29,14 +28,14 @@ model Family {
   cuid                  String           @id @default(cuid())
   family_name           String
   stripe_account_id     String?
-  FamilyMembers         User[]           @relation("family_member")
   created_at            String           @default("")
   updated_at            String           @default("")
-  Pages                 Page[]
-  FamilyDonations       PageDonation[]
-  FamilyDonationPayouts DonationPayout[]
   advocateCuid          String           @map("advocate_cuid")
-  AdvocateResponsible   User?            @relation("advocate_family", fields: [advocateCuid], references: [cuid])
+  FamilyDonationPayouts DonationPayout[]
+  AdvocateResponsible   User             @relation("advocate_family", fields: [advocateCuid], references: [cuid])
+  FamilyDonations       PageDonation[]
+  Pages                 Page[]
+  FamilyMembers         User[]           @relation("family_member")
 }
 
 model DonationPayout {
@@ -46,42 +45,41 @@ model DonationPayout {
   transaction_id   String @unique
   amount           Int    @default(0)
   distributionDate String
-  Family           Family @relation(fields: [familyCuid], references: cuid)
-  Page             Page   @relation(fields: [pageCuid], references: cuid)
+  Family           Family @relation(fields: [familyCuid], references: [cuid])
+  Page             Page   @relation(fields: [pageCuid], references: [cuid])
 }
 
 model Page {
-  cuid                   String  @id @default(cuid())
-  page_name              String
+  cuid                   String           @id @default(cuid())
   day_of_birth           String?
   day_of_passing         String?
   visitation_date        String?
   visitation_location    String
   visitation_description String
-
-  funeral_date        String?
-  funeral_location    String
-  funeral_description String
-
-  obituary           String
-  donation_goal      Int              @default(0)
-  amount_raised      Int              @default(0)
-  deadline           String
-  userCuid           String           @map("user_cuid")
-  PageDonations      PageDonation[]
-  DonationPayouts    DonationPayout[]
-  User               User             @relation(fields: [userCuid], references: cuid)
-  Images             Image[]
-  amount_distributed Int              @default(0)
-  profileImageCuid   String           @map("profile_image_cuid")
-  Family             Family?          @relation(fields: [familyCuid], references: cuid)
-  familyCuid         String?          @map("family_cuid")
-  status             String           @default("active")
-  donation_status    String           @default("in progress")
-  duration           String           @default("0 days")
-  start_date         String           @default("")
-  goal_met_date      String           @default("")
-  Reply              Reply[]
+  funeral_date           String?
+  funeral_location       String
+  funeral_description    String
+  obituary               String
+  donation_goal          Int              @default(0)
+  amount_raised          Int              @default(0)
+  deadline               String
+  userCuid               String           @map("user_cuid")
+  amount_distributed     Int              @default(0)
+  profileImageCuid       String           @map("profile_image_cuid")
+  familyCuid             String?          @map("family_cuid")
+  status                 String           @default("active")
+  donation_status        String           @default("in progress")
+  duration               String           @default("0 days")
+  start_date             String           @default("")
+  goal_met_date          String           @default("")
+  page_first_name        String           @default("")
+  page_last_name         String           @default("")
+  DonationPayouts        DonationPayout[]
+  Reply                  Reply[]
+  Images                 Image[]
+  PageDonations          PageDonation[]
+  Family                 Family?          @relation(fields: [familyCuid], references: [cuid])
+  User                   User             @relation(fields: [userCuid], references: [cuid])
 
   @@map("pages")
 }
@@ -96,9 +94,9 @@ model PageDonation {
   isAnonymous    Boolean @default(false)
   success        Boolean @default(false)
   transaction_id String  @unique
-  amount         Int //In cents
-  Family         Family  @relation(fields: [familyCuid], references: cuid)
-  Page           Page    @relation(fields: [pageCuid], references: cuid)
+  amount         Int
+  Family         Family  @relation(fields: [familyCuid], references: [cuid])
+  Page           Page    @relation(fields: [pageCuid], references: [cuid])
 
   @@map("page_donations")
 }
@@ -109,7 +107,7 @@ model Reply {
   familyCuid String  @map("family_cuid")
   reply      String  @default("")
   name       String? @default("")
-  Page       Page    @relation(fields: [pageCuid], references: cuid)
+  Page       Page    @relation(fields: [pageCuid], references: [cuid])
 }
 
 model Image {
diff --git a/server/api/complete_session.get.ts b/server/api/complete_session.get.ts
index 37fb9bfc..9e2e75cc 100644
--- a/server/api/complete_session.get.ts
+++ b/server/api/complete_session.get.ts
@@ -23,7 +23,8 @@ export default defineEventHandler(async event => {
         include: {
           Page: {
             select: {
-              page_name: true,
+              page_first_name: true,
+              page_last_name: true,
               amount_raised: true,
               donation_goal: true,
               deadline: true,
diff --git a/server/api/create_session.post.ts b/server/api/create_session.post.ts
index 215510e9..7ee42873 100644
--- a/server/api/create_session.post.ts
+++ b/server/api/create_session.post.ts
@@ -19,11 +19,11 @@ export default defineEventHandler(async event => {
     const transaction_id = nanoid();
     const stripe = new Stripe(runtime.STRIPE_SECRET, { apiVersion:"2022-11-15"})
     const body = await readBody(event)
-    const page_cuid = body.pageCuid
-    const donorComments = body.comments;
+    const page_cuid = body._value.pageCuid
+    const donorComments = body._value.comments;
     const state = {}; 
-    const userCuid = body.userCuid
-    const familyCuid = body.family_cuid 
+    const userCuid = body._value.userCuid
+    const familyCuid = body._value.familyCuid 
   try{
     const page = await prisma.page.findFirst({
       where: {
@@ -37,9 +37,9 @@ export default defineEventHandler(async event => {
 			{
 				price_data: {
 					currency: 'usd',
-					unit_amount: body.amount_raised,
+					unit_amount: Math.trunc(parseFloat(body._value.amount as unknown as string) * 100) as number,
 					product_data: {
-						name: `Donation to ${page?.page_name}`,
+						name: `Donation to ${page?.page_first_name} ${page?.page_last_name}`,
 					},
 				},
 				quantity: 1
@@ -47,10 +47,11 @@ export default defineEventHandler(async event => {
 		],
 		metadata: {
 			transaction_id: transaction_id,
-			amount: body.amount_raised,
+			amount: Math.trunc(parseFloat(body._value.amount as unknown as string) * 100) as number,
 			target_user_id: userCuid,
       target_family_id: familyCuid,
-			target_page_name: page?.page_name as string,
+			target_first_name: page?.page_first_name as string,
+      target_last_name: page?.page_last_name as string,
 			target_page_cuid: page?.cuid as string,
       comments: donorComments,
 		},
@@ -58,14 +59,14 @@ export default defineEventHandler(async event => {
 		cancel_url: `${runtime.BASEURL}page/${page_cuid}`,
 	});
 
-	console.log(body)
+	console.log(body._value)
 
     const queryRes = await prisma.pageDonation.create({
       data: {
         transaction_id: transaction_id,
-        amount: body.amount_raised,
-        donorFirstName: body.donorFirstName,
-        donorLastName: body.donorLastName,
+        amount: Math.trunc(parseFloat(body._value.amount as unknown as string) * 100) as number,
+        donorFirstName: body._value.donorFirstName,
+        donorLastName: body._value.donorLastName,
         comments: donorComments, 
         Family: {
           connect: {
diff --git a/server/api/image_upload.post.ts b/server/api/image_upload.post.ts
index c8086978..ddfc71c5 100644
--- a/server/api/image_upload.post.ts
+++ b/server/api/image_upload.post.ts
@@ -8,14 +8,14 @@ const runtime = useRuntimeConfig()
 export default defineEventHandler(async (event) => {
     // Read the request body
     const data = await readBody(event)
-
+    console.log(data)
     // key used to retrieve image later on
     const key = nanoid()
     // gets presigned URL from aws.ts and returns it to the call from vue
     const uploadUrl =  await getSignedFileUrl(data.contentLength, data.contentType, key);
     const contentUrl =  "https://" + runtime.AWS_S3_BUCKET_NAME + "/" + key;
     const body = await readBody(event)
-    const url = body.url
+    //const url = body._value.url
 
   if(event.context.user.cuid != ""){
   //try{
diff --git a/server/api/pages.get.ts b/server/api/pages.get.ts
index aaa8514e..5a9a48c5 100644
--- a/server/api/pages.get.ts
+++ b/server/api/pages.get.ts
@@ -2,9 +2,9 @@ import { PrismaClient } from "@prisma/client"
 const prisma = new PrismaClient()
 
 /*
-*	/PageList/cuid
-*	function:	POST
-*	retrive family pages details from database for a partial or complete page name
+*    /PageList/cuid
+*    function:    POST
+*    retrive family pages details from database for a partial or complete page name
 */
 
 export default defineEventHandler(async event => {
@@ -27,26 +27,45 @@ if(event.context.user.cuid != undefined) { //if the user is not logged in, do no
     };
   }
 
-  const searchQuerySpacesRemoved = (searchQuery as string).replaceAll(" ", "")
-  // Makes sure that an empty searchQuery returns no results and that searchQueries with all spaces return no results (prevents returning all pages with a first and last name using a space).
-  if((searchQuery as string) != "" && searchQuerySpacesRemoved.length != 0) {
-    // Pagination via taking the absolute page number with 12 records per page 
-    const [count, pagesResult] = await prisma.$transaction([
-      prisma.page.count({ where: { page_name: {
-        contains: searchQuery as string,
-        mode: 'insensitive',
-      } }}),
-      prisma.page.findMany({
-    where: {
-    page_name: {
+  console.log(page_number)
+  
+  // Pagination via taking the absolute page number with 12 records per page 
+  // Transaction is a Database thing
+  // You can get away with doing multiple operations at once. 
+  // count gets the amount of pages with the same name
+  // 
+  const [count, pagesResult] = await prisma.$transaction([
+    prisma.page.count({ where: { 
+      OR: [ {
+      page_first_name: {
       contains: searchQuery as string,
       mode: 'insensitive',
-    }
+    } },
+      { page_last_name: {
+        contains: searchQuery as string,
+      mode: 'insensitive',
+      }}] }}),
+    prisma.page.findMany({
+  where: {
+    OR: [ {
+      page_first_name: {
+        contains: searchQuery as string,
+        mode: 'insensitive',
+      }
     },
-    skip: page_number as number * 12,
-    take: 12, 
-  })
-    ])
+    {
+      page_last_name: {
+        contains: searchQuery as string,
+        mode: 'insensitive',
+      }
+    }
+    ]
+  },
+  skip: page_number as number * 12,
+  take: 12, 
+})
+  ])
+
 
     return {
       Pagination: {
@@ -60,11 +79,4 @@ if(event.context.user.cuid != undefined) { //if the user is not logged in, do no
     }, 
     data:  []
   };
-} 
-  return {
-    Pagination: {
-    total: 0
-    }, 
-    data:  []
-  };
-  })
+})
diff --git a/server/api/replies.post.ts b/server/api/replies.post.ts
index b13ba258..73b00c54 100644
--- a/server/api/replies.post.ts
+++ b/server/api/replies.post.ts
@@ -4,13 +4,13 @@ const prisma = new PrismaClient();
 
 export default defineEventHandler(async (event) => {
   //try {
-    const {pageCuid, familyCuid, replyData} = await readBody(event)
-    console.log(replyData)
+    const {pageCuid, familyCuid,replyData} = await readBody(event)
+    console.log(replyData._value)
     const newReply = await prisma.reply.create({
-      data: { ...replyData}
+      data: { ...replyData._value}
     });
 
-    return { reply: newReply };
+    return newReply;
   /*} catch (error) {
     console.error(error);
   } finally {
diff --git a/types.d.ts b/types.d.ts
index d07d0e45..604f3a95 100644
--- a/types.d.ts
+++ b/types.d.ts
@@ -48,7 +48,8 @@ import { DonationPayout } from "@prisma/client"
 
 // TODO: import types from prisma, export them with relations added
 export type Page = {
-    page_name: string,
+    page_first_name: string,
+    page_last_name: string,
     cuid: string,
     userCuid: string,
     familyCuid: string,