diff --git a/webapp/components/_new/features/MySomethingList/MySomethingList.spec.js b/webapp/components/_new/features/MySomethingList/MySomethingList.spec.js
index 7be290b3e..ea19bce8c 100644
--- a/webapp/components/_new/features/MySomethingList/MySomethingList.spec.js
+++ b/webapp/components/_new/features/MySomethingList/MySomethingList.spec.js
@@ -49,12 +49,12 @@ describe('MySomethingList.vue', () => {
         submitButton = wrapper.find('button')
       })
 
-      it('requires the link to be a valid url', async () => {
-        input.setValue('some value')
-        form.trigger('submit')
-        await Vue.nextTick()
-        expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
-      })
+      // Wolle it('requires the link to be a valid url', async () => {
+      //   input.setValue('some value')
+      //   form.trigger('submit')
+      //   await Vue.nextTick()
+      //   expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
+      // })
 
       it('displays an error message when not saved successfully', async () => {
         mocks.$apollo.mutate.mockRejectedValue({ message: 'Ouch!' })
@@ -143,15 +143,15 @@ describe('MySomethingList.vue', () => {
           expect(addInput.exists()).toBe(false)
         })
 
-        it('sends the new url to the backend', async () => {
-          const expected = expect.objectContaining({
-            variables: { id: 's1', url: newSocialMediaUrl },
-          })
-          input.setValue(newSocialMediaUrl)
-          form.trigger('submit')
-          await Vue.nextTick()
-          expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expected)
-        })
+        // Wolle remove? or test here abstract? it('sends the new url to the backend', async () => {
+        //   const expected = expect.objectContaining({
+        //     variables: { id: 's1', url: newSocialMediaUrl },
+        //   })
+        //   input.setValue(newSocialMediaUrl)
+        //   form.trigger('submit')
+        //   await Vue.nextTick()
+        //   expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expected)
+        // })
 
         it('allows the user to cancel editing', async () => {
           const cancelButton = wrapper.find('button#cancel')
diff --git a/webapp/components/_new/features/MySomethingList/MySomethingList.vue b/webapp/components/_new/features/MySomethingList/MySomethingList.vue
index ef374066a..55c9f0808 100644
--- a/webapp/components/_new/features/MySomethingList/MySomethingList.vue
+++ b/webapp/components/_new/features/MySomethingList/MySomethingList.vue
@@ -16,12 +16,13 @@
           </ds-heading>
         </ds-space>
         <ds-space v-if="socialMediaLinks" margin-top="base" margin="base">
-          <ds-input
+          <!-- Wolle <ds-input
             id="editSocialMedia"
             model="socialMediaUrl"
             type="text"
             :placeholder="$t('settings.social-media.placeholder')"
-          />
+          /> -->
+          <slot name="edit-item" />
         </ds-space>
       </div>
       <div v-else>
@@ -87,17 +88,29 @@ import { mapGetters, mapMutations } from 'vuex'
 
 export default {
   name: 'MySomethingList',
+  props: {
+    useFormData: {
+      type: Object,
+      default: () => ({}),
+    },
+    useFormSchema: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
   data() {
     return {
-      formData: {
-        socialMediaUrl: '',
-      },
-      formSchema: {
-        socialMediaUrl: {
-          type: 'url',
-          message: this.$t('common.validations.url'),
-        },
-      },
+      // Wolle formData: {
+      //   socialMediaUrl: '',
+      // },
+      // formSchema: {
+      //   socialMediaUrl: {
+      //     type: 'url',
+      //     message: this.$t('common.validations.url'),
+      //   },
+      // },
+      formData: this.useFormData,
+      formSchema: this.useFormSchema,
       disabled: true,
       editingLink: {},
     }
diff --git a/webapp/pages/settings/my-social-media.spec.js b/webapp/pages/settings/my-social-media.spec.js
index 13b507049..a9d7a15d0 100644
--- a/webapp/pages/settings/my-social-media.spec.js
+++ b/webapp/pages/settings/my-social-media.spec.js
@@ -11,19 +11,19 @@ describe('my-social-media.vue', () => {
   let mocks
   let getters
   const socialMediaUrl = 'https://freeradical.zone/@mattwr18'
-  // const newSocialMediaUrl = 'https://twitter.com/mattwr18'
+  const newSocialMediaUrl = 'https://twitter.com/mattwr18'
   const faviconUrl = 'https://freeradical.zone/favicon.ico'
 
   beforeEach(() => {
     mocks = {
       $t: jest.fn(),
-      //   $apollo: {
-      //     mutate: jest.fn(),
-      //   },
-      //   $toast: {
-      //     error: jest.fn(),
-      //     success: jest.fn(),
-      //   },
+      $apollo: {
+        mutate: jest.fn(),
+      },
+      $toast: {
+        error: jest.fn(),
+        success: jest.fn(),
+      },
     }
     getters = {
       'auth/user': () => {
@@ -34,6 +34,7 @@ describe('my-social-media.vue', () => {
 
   describe('mount', () => {
     // let form, input, submitButton
+    let form, input
     const Wrapper = () => {
       const store = new Vuex.Store({
         getters,
@@ -41,60 +42,60 @@ describe('my-social-media.vue', () => {
       return mount(MySocialMedia, { store, mocks, localVue })
     }
 
-    // describe('adding social media link', () => {
-    //   beforeEach(() => {
-    //     wrapper = Wrapper()
-    //     form = wrapper.find('form')
-    //     input = wrapper.find('input#addSocialMedia')
-    //     submitButton = wrapper.find('button')
-    //   })
+    describe('adding social media link', () => {
+      beforeEach(() => {
+        wrapper = Wrapper()
+        form = wrapper.find('form')
+        input = wrapper.find('input#addSocialMedia')
+        // submitButton = wrapper.find('button')
+      })
 
-    //   it('requires the link to be a valid url', async () => {
-    //     input.setValue('some value')
-    //     form.trigger('submit')
-    //     await Vue.nextTick()
-    //     expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
-    //   })
+      it('requires the link to be a valid url', async () => {
+        input.setValue('some value')
+        form.trigger('submit')
+        await Vue.nextTick()
+        expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
+      })
 
-    //   it('displays an error message when not saved successfully', async () => {
-    //     mocks.$apollo.mutate.mockRejectedValue({ message: 'Ouch!' })
-    //     input.setValue(newSocialMediaUrl)
-    //     form.trigger('submit')
-    //     await Vue.nextTick()
-    //     await flushPromises()
-    //     expect(mocks.$toast.error).toHaveBeenCalledTimes(1)
-    //   })
+      //   it('displays an error message when not saved successfully', async () => {
+      //     mocks.$apollo.mutate.mockRejectedValue({ message: 'Ouch!' })
+      //     input.setValue(newSocialMediaUrl)
+      //     form.trigger('submit')
+      //     await Vue.nextTick()
+      //     await flushPromises()
+      //     expect(mocks.$toast.error).toHaveBeenCalledTimes(1)
+      //   })
 
-    //   describe('success', () => {
-    //     beforeEach(async () => {
-    //       mocks.$apollo.mutate.mockResolvedValue({
-    //         data: { CreateSocialMedia: { id: 's2', url: newSocialMediaUrl } },
-    //       })
-    //       input.setValue(newSocialMediaUrl)
-    //       form.trigger('submit')
-    //       await Vue.nextTick()
-    //     })
+      // describe('success', () => {
+      //   beforeEach(async () => {
+      //     mocks.$apollo.mutate.mockResolvedValue({
+      //       data: { CreateSocialMedia: { id: 's2', url: newSocialMediaUrl } },
+      //     })
+      //     input.setValue(newSocialMediaUrl)
+      //     form.trigger('submit')
+      //     await Vue.nextTick()
+      //   })
 
-    //     it('sends the new url to the backend', () => {
-    //       const expected = expect.objectContaining({
-    //         variables: { url: newSocialMediaUrl },
-    //       })
+      //   it('sends the new url to the backend', () => {
+      //     const expected = expect.objectContaining({
+      //       variables: { url: newSocialMediaUrl },
+      //     })
 
-    //       expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expected)
-    //     })
+      //     expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expected)
+      //   })
 
-    //     it('displays a success message', async () => {
-    //       await flushPromises()
-    //       expect(mocks.$toast.success).toHaveBeenCalledTimes(1)
-    //     })
+      //     it('displays a success message', async () => {
+      //       await flushPromises()
+      //       expect(mocks.$toast.success).toHaveBeenCalledTimes(1)
+      //     })
 
-    //     it('clears the form', async () => {
-    //       await flushPromises()
-    //       expect(input.value).toBe(undefined)
-    //       expect(submitButton.vm.$attrs.disabled).toBe(true)
-    //     })
-    //   })
-    // })
+      //     it('clears the form', async () => {
+      //       await flushPromises()
+      //       expect(input.value).toBe(undefined)
+      //       expect(submitButton.vm.$attrs.disabled).toBe(true)
+      //     })
+      // })
+    })
 
     describe('given existing social media links', () => {
       beforeEach(() => {
@@ -105,7 +106,7 @@ describe('my-social-media.vue', () => {
         }
 
         wrapper = Wrapper()
-        // form = wrapper.find('form')
+        form = wrapper.find('form')
       })
 
       describe('for each link it', () => {
@@ -133,37 +134,37 @@ describe('my-social-media.vue', () => {
       //   expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
       // })
 
-      // describe('editing social media link', () => {
-      //   beforeEach(async () => {
-      //     const editButton = wrapper.find('.base-button[data-test="edit-button"]')
-      //     editButton.trigger('click')
-      //     await Vue.nextTick()
-      //     input = wrapper.find('input#editSocialMedia')
-      //   })
+      describe('editing social media link', () => {
+        beforeEach(async () => {
+          const editButton = wrapper.find('.base-button[data-test="edit-button"]')
+          editButton.trigger('click')
+          await Vue.nextTick()
+          input = wrapper.find('input#editSocialMedia')
+        })
 
-      //   it('disables adding new links while editing', () => {
-      //     const addInput = wrapper.find('input#addSocialMedia')
+        //   it('disables adding new links while editing', () => {
+        //     const addInput = wrapper.find('input#addSocialMedia')
 
-      //     expect(addInput.exists()).toBe(false)
-      //   })
+        //     expect(addInput.exists()).toBe(false)
+        //   })
 
-      //   it('sends the new url to the backend', async () => {
-      //     const expected = expect.objectContaining({
-      //       variables: { id: 's1', url: newSocialMediaUrl },
-      //     })
-      //     input.setValue(newSocialMediaUrl)
-      //     form.trigger('submit')
-      //     await Vue.nextTick()
-      //     expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expected)
-      //   })
+        it.only('sends the new url to the backend', async () => {
+          const expected = expect.objectContaining({
+            variables: { id: 's1', url: newSocialMediaUrl },
+          })
+          input.setValue(newSocialMediaUrl)
+          form.trigger('submit')
+          await Vue.nextTick()
+          expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expected)
+        })
 
-      //   it('allows the user to cancel editing', async () => {
-      //     const cancelButton = wrapper.find('button#cancel')
-      //     cancelButton.trigger('click')
-      //     await Vue.nextTick()
-      //     expect(wrapper.find('input#editSocialMedia').exists()).toBe(false)
-      //   })
-      // })
+        //   it('allows the user to cancel editing', async () => {
+        //     const cancelButton = wrapper.find('button#cancel')
+        //     cancelButton.trigger('click')
+        //     await Vue.nextTick()
+        //     expect(wrapper.find('input#editSocialMedia').exists()).toBe(false)
+        //   })
+      })
 
       // describe('deleting social media link', () => {
       //   beforeEach(async () => {
diff --git a/webapp/pages/settings/my-social-media.vue b/webapp/pages/settings/my-social-media.vue
index 57220ce17..9c2bacfd8 100644
--- a/webapp/pages/settings/my-social-media.vue
+++ b/webapp/pages/settings/my-social-media.vue
@@ -1,8 +1,16 @@
 <template>
-  <my-something-list>
+  <my-something-list :useFormData="useFormData" :useFormSchema="useFormSchema">
     <template #list-item="{ link }">
       <social-media-list-item :link="link" />
     </template>
+    <template #edit-item>
+      <ds-input
+        id="editSocialMedia"
+        model="socialMediaUrl"
+        type="text"
+        :placeholder="$t('settings.social-media.placeholder')"
+      />
+    </template>
   </my-something-list>
 </template>
 
@@ -15,5 +23,18 @@ export default {
     MySomethingList,
     SocialMediaListItem,
   },
+  data() {
+    return {
+      useFormData: {
+        socialMediaUrl: '',
+      },
+      useFormSchema: {
+        socialMediaUrl: {
+          type: 'url',
+          message: this.$t('common.validations.url'),
+        },
+      },
+    }
+  },
 }
 </script>