diff --git a/examples/sveltejs-todo-list/src/LoggedIn.svelte b/examples/sveltejs-todo-list/src/LoggedIn.svelte
index baf641a9323..9bb25893235 100644
--- a/examples/sveltejs-todo-list/src/LoggedIn.svelte
+++ b/examples/sveltejs-todo-list/src/LoggedIn.svelte
@@ -1,16 +1,12 @@
 <script>
-  import Lists from './Lists.svelte'
-  import { items, subscription } from './items'
+  import LoginLists from './LoginLists.svelte'
+  import { items } from './items'
   export let user
   let lists
-  $: {
-    lists = items()
-  }
-  // $: lists2 = subscription()
-  // lists2.socket.isConnected() && lists2.socket.connectionState()
+  $: lists = items()
 </script>
 
-<Lists user_id="{user.id}" lists="{lists}" />
+<LoginLists user_id="{user.id}" lists="{lists}" />
 <button
   class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base leading-6 font-medium rounded text-green-700 border-green-500 hover:text-green-500 hover:bg-green-50 focus:outline-none focus:shadow-outline focus:border-green-300 transition duration-150 ease-in-out md:py-4 md:text-lg md:px-10 float-left"
   on:click="{() => {
diff --git a/examples/sveltejs-todo-list/src/LoginLists.svelte b/examples/sveltejs-todo-list/src/LoginLists.svelte
new file mode 100644
index 00000000000..a3e9b214f54
--- /dev/null
+++ b/examples/sveltejs-todo-list/src/LoginLists.svelte
@@ -0,0 +1,9 @@
+<script lang="js">
+  import Lists from './Lists.svelte'
+  export let lists
+  export let user_id
+</script>
+<style>
+</style>
+
+<Lists bind:user_id bind:lists />
\ No newline at end of file