Reactive user status with Svelte

help
1

Hi guys just starting out a new project with Meteor/Svelte. Just wondering if anyone can point me in the right direction as per keeping the current user (logged in / not etc) reactive?

Should this be using Tracker around Meteor.user? Should I be assigning this to a svelte store or a session value? Thanks in advance!

2 
<script>
  let user;
  Tracker.autorun(() => {
    user = Meteor.user();
  });
</script>
3

For reusability, I’d say take @cereal’s answer and make it a store.

4

Thanks @cereal and @arggh, I sort of am going down that route but I’m having trouble putting it all together. For example if not logged in showing a different route (I’m using svelte-routing) and I’m also trying to handle redirects for example if a user is logged out.

Don’t suppose either of you have any more fleshed-out examples?

Thanks again

5

I’m sort of doing all this in my App component but unsure where is a good idea to authenticate routes. In my current app it’s pretty simple, if a user isn’t logged in they should see the login page (or be redirected to it)

6

You should read the Meteor guide about accounts. Hook the relevant reactive data sources from Meteor’s accounting package to your Svelte components.

If you want to:

a) only execute certain Svelte components if the user is logged in
b) redirect to a login view if the user is not logged in

→ Maybe create a <LoggedIn> component that only renders child components if the user is logged in, and wrap your protected routes with that. It could also have an autorun tracking if the user is not logged in and not logging in, and if so, set window.location to /login.

…Or something similar that works better for your app structure & flow.

2 Likes
7

Thanks! That sounds like a good plan, maybe going the child component route is the way to go!