Collection: new widget to add book to collection

front/src/CollectionForm.vue

@@ -2,6 +2,7 @@
 import { computed, ref } from 'vue'
 import { getCollection } from './api.js'
 import CollectionFormBookItem from './CollectionFormBookItem.vue'
+import AddBookToCollection from './AddBookToCollection.vue'
 import Pagination from './Pagination.vue'
 
 const props = defineProps({
@@ -27,14 +28,20 @@ getCollection(data, error, props.id, limit, offset.value)
 function pageChange(newPageNumber) {
   pageNumber.value = newPageNumber
   data.value = null
+  error.value = null
   getCollection(data, error, props.id, limit, offset.value)
 }
+
+function fetchCollection() {
+  pageChange(1)
+}
 </script>
 
 <template>
   <div v-if="error">{{ $t('bookform.error', { error: error.message }) }}</div>
   <div v-if="data">
     <h2 class="title">{{ data.name }}</h2>
+    <AddBookToCollection :collection-id="props.id" @created="fetchCollection" />
     <div>
       <CollectionFormBookItem v-for="book in data.books" :key="book.id" v-bind="book" />
     </div>