category chooser might actually be done

src/App.vue

@@ -14,8 +14,8 @@
 	const instruments = ref([])
 	const categories = ref([])
 
-	const updateCurrentWorkingCategoryID = (category) =>{
-		currentWorkingCategory.value = category
+	const updateCurrentWorkingCategory = (summarizedCategory) =>{
+		currentWorkingCategory.value = categories.value.find(category => category.id === summarizedCategory.category_id)
 	}
 
 	const refreshPage = (session) => {
@@ -47,7 +47,7 @@
 			-->
 		</section>
 		<section id="summary">
-			<Summary ref="summaryRef" @update="updateCurrentWorkingCategoryID"/>
+			<Summary ref="summaryRef" @update="updateCurrentWorkingCategory"/>
 		</section>
 		<section id="category">
 			<ShowCategory

src/components/show_category.vue

@@ -26,7 +26,9 @@
 		loadCategory(props.currentWorkingCategory.id)
 	})
 
-	/*watch(currentWorkingCategory, loadCategory)*/
+	watch(() => props.currentWorkingCategory, (chosenCategory)=>{
+		loadCategory(chosenCategory.id)
+	})
 	defineExpose({loadCategory})
 </script>
 

src/components/summary.vue

@@ -12,7 +12,7 @@
 	onMounted(loadData)
 
 	const setWorkingCategory = (category) => {
-		emit('update', category.category_id)
+		emit('update', category)
 	}
 
 	defineExpose({loadData})