Avoid an API call by passing values with props

resources/js/views/Groups.vue

@@ -15,10 +15,12 @@
             <div v-if="groups.length > 0">
                 <div v-for="group in groups" :key="group.id" class="group-item has-text-light is-size-5 is-size-6-mobile">
                     {{ group.name }}
+                    <!-- delete icon -->
                     <a class="has-text-grey is-pulled-right" @click="deleteGroup(group.id)">
                         <font-awesome-icon :icon="['fas', 'trash']" />
                     </a>
-                    <router-link :to="{ name: 'editGroup', params: { groupId: group.id }}" class="tag is-dark">
+                    <!-- edit link -->
+                    <router-link :to="{ name: 'editGroup', params: { id: group.id, name: group.name }}" class="tag is-dark">
                         {{ $t('commons.rename') }}
                     </router-link>
                     <span class="is-family-primary is-size-6 is-size-7-mobile has-text-grey">{{ group.count }} {{ $t('twofaccounts.accounts') }}</span>

resources/js/views/groups/Edit.vue

@@ -21,40 +21,29 @@
     export default {
         data() {
             return {
-                groupExists: false,
                 form: new Form({
-                    name: '',
+                    name: this.name,
                 })
             }
         },
 
-        created: function() {
-            this.getGroup();
-        },
+        props: ['id', 'name'],
 
         methods: {
-            async getGroup () {
-
-                const { data } = await this.axios.get('/api/groups/' + this.$route.params.groupId)
-
-                this.form.fill(data)
-                this.groupExists = true
-                
-            },
 
             async updateGroup() {
 
-                await this.form.put('/api/groups/' + this.$route.params.groupId)
+                await this.form.put('/api/groups/' + this.id)
 
                 if( this.form.errors.any() === false ) {
-                    this.$router.push({name: 'groups', params: { InitialEditMode: true }})
+                    this.$router.push({ name: 'groups' })
                 }
 
             },
 
             cancelCreation: function() {
 
-                this.$router.push({name: 'groups', params: { InitialEditMode: true }});
+                this.$router.push({ name: 'groups' });
             },
 
         },