diff --git a/cookbook/helper/permission_helper.py b/cookbook/helper/permission_helper.py
index 5c2a381c..54e5dd61 100644
--- a/cookbook/helper/permission_helper.py
+++ b/cookbook/helper/permission_helper.py
@@ -164,7 +164,7 @@ class CustomIsOwner(permissions.BasePermission):
         return is_object_owner(request.user, obj)
 
 
-class CustomIsShared(permissions.BasePermission): # TODO function duplicate name
+class CustomIsShared(permissions.BasePermission):  # TODO function duplicate/too similar name
     """
     Custom permission class for django rest framework views
     verifies user is shared for the object he is trying to access
@@ -175,7 +175,6 @@ class CustomIsShared(permissions.BasePermission): # TODO function duplicate name
         return request.user.is_authenticated
 
     def has_object_permission(self, request, view, obj):
-        print("called is shared")
         return is_object_shared(request.user, obj)
 
 
diff --git a/cookbook/serializer.py b/cookbook/serializer.py
index d37c145d..8f5a115d 100644
--- a/cookbook/serializer.py
+++ b/cookbook/serializer.py
@@ -33,7 +33,7 @@ class CustomDecimalField(serializers.Field):
                 raise ValidationError('A valid number is required')
 
 
-class UserNameSerializer(serializers.ModelSerializer):
+class UserNameSerializer(WritableNestedModelSerializer):
     username = serializers.SerializerMethodField('get_user_label')
 
     def get_user_label(self, obj):
@@ -231,6 +231,7 @@ class ShoppingListEntryCheckedSerializer(serializers.ModelSerializer):
 class ShoppingListSerializer(WritableNestedModelSerializer):
     recipes = ShoppingListRecipeSerializer(many=True, allow_null=True)
     entries = ShoppingListEntrySerializer(many=True, allow_null=True)
+    shared = UserNameSerializer(many=True)
 
     class Meta:
         model = ShoppingList
diff --git a/cookbook/templates/shopping_list.html b/cookbook/templates/shopping_list.html
index 3b15256c..8656690f 100644
--- a/cookbook/templates/shopping_list.html
+++ b/cookbook/templates/shopping_list.html
@@ -199,6 +199,29 @@
                 </div>
             </div>
 
+            <div class="row">
+                <div class="col" style="margin-top: 1vh">
+                    <multiselect
+                            v-tabindex
+
+                            v-model="shopping_list.shared"
+                            :options="users"
+                            :close-on-select="true"
+                            :clear-on-select="true"
+                            :allow-empty="true"
+                            :preserve-search="true"
+                            placeholder="{% trans 'Select User' %}"
+                            select-label="{% trans 'Select' %}"
+                            label="username"
+                            track-by="id"
+                            :multiple="true"
+                            :loading="users_loading"
+                            @search-change="searchUsers">
+                    </multiselect>
+
+                </div>
+            </div>
+
         </div>
         <div v-else>
 
@@ -287,7 +310,7 @@
             data: {
                 shopping_list_id: {% if shopping_list_id  %}{{ shopping_list_id }}{% else %}null{% endif %},
                 loading: true,
-                edit_mode: true,
+                edit_mode: false,
                 export_text_prefix: '', //TODO add userpreference
                 recipe_query: '',
                 recipes: [],
@@ -301,12 +324,8 @@
                 foods_loading: false,
                 units: [],
                 units_loading: false,
-                list: [
-                    {id: 1, name: "Abby", sport: "basket"},
-                    {id: 2, name: "Brooke", sport: "foot"},
-                    {id: 3, name: "Courtenay", sport: "volley"},
-                    {id: 4, name: "David", sport: "rugby"}
-                ],
+                users: [],
+                users_loading: false,
             },
             directives: {
                 tabindex: {
@@ -385,6 +404,8 @@
                         }
                     }, {% widthratio request.user.userpreference.shopping_auto_sync 1 1000 %})
                 {% endif %}
+
+                this.searchUsers('')
             },
             methods: {
                 /*
@@ -441,7 +462,9 @@
                             "recipes": [],
                             "entries": [],
                             "entries_display": [],
-                            "shared": [],
+                            "shared": [{% for u in request.user.userpreference.plan_share.all %}
+                                {{ u.pk }},
+                            {% endfor %}],
                             "created_by": 1
                         }
                         this.loading = false
@@ -504,7 +527,7 @@
                     })
                 },
                 sortEntries: function () {
-                    this.display_entries.forEach( (item, index) => {
+                    this.display_entries.forEach((item, index) => {
 
                     })
                     console.log("IMPLEMENT ME", this.display_entries)
@@ -634,6 +657,15 @@
                     this.units.push(new_unit)
                     this.new_entry.unit = new_unit
                 },
+                searchUsers: function (query) { //TODO move to central component
+                    this.users_loading = true
+                    this.$http.get("{% url 'api:username-list' %}" + '?query=' + query + '&limit=10').then((response) => {
+                        this.users = response.data
+                        this.users_loading = false
+                    }).catch((err) => {
+                        this.makeToast('{% trans 'Error' %}', '{% trans 'There was an error loading a resource!' %}' + err.bodyText, 'danger')
+                    })
+                },
 
             }
         });