Meteor Reactivity seems to fail when Logging in - meteor

Question

I have a couple of utility function in my Meteor app that look like this:
Template.registerHelper('canManagePatients', () =>{
const id = Meteor.userId();
const aa = new AccountAccess(id);
const val = aa.canManagePatients();
return val;
});
My understanding is that Meteor.userId() is a recative data source and hence after login the state of these helpers should change.
Unfortunately however, it does not work like this and unless I reload, these options remain hidden after logging in. What am I missing?
This is how the AccountAccess class uses the userId:
constructor(userId){
if (typeof userId !== "undefined"){
this._userId = userId;
} else {
this._userId = Meteor.userId();
}
}
canManagePatients(){
const practice = this.getCurrentPractice();
if (!practice){
return false;
}
const patientTagId = this._getPatientAdminTag()._id;
const ownerTagId = this._getOwnerTag()._id;
return practice.tags.some((obj)=>{
return (obj === patientTagId || obj === ownerTagId);
});
}
Update
This is an excerpt of what the template looks like. All works fine except for the four {{#if }} statements that only function correctly after a reload after logging in.
<div id="navbar" class="navbar-collapse collapse">
{{#if Template.subscriptionsReady}}
<ul class="nav navbar-nav navbar-right">
{{#if currentUser}}
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
{{practice.name}}<br><b>Hello {{userName}}</b> (Not you? <b><u>Logout</u></b>)<span class="caret"></span>
</a>
<ul class="dropdown-menu">
{{#if canManageUsers}}<li>Manage Users</li>{{/if}}
{{#if canManageForms}}<li>Manage Registration Settings</li>{{/if}}
{{#if canManageForms}}<li>Manage Forms</li>{{/if}}
{{#if canManagePatients}}<li>Reporting</li>{{/if}}
<li role="separator" class="divider"></li>
<li>Use compact UI</li>
<li>Use old UI</li>
<li role="separator" class="divider"></li>
<li><a id="linkLogout">Logout</a></li>
</ul>
</li>
{{/if}}
</ul>
{{/if}}
</div><!--/.nav-collapse -->

Answer 1

This kind of state initialization is inappropriate for a helper - it's better if your helpers are stateless since they can be called more often than you expect.
A better approach would be to use a Tracker.autorun() to setup a Session variable (or reactive var) and then have your helper refer to that:
Tracker.autorun(()=>{
const aa = new AccountAccess(Meteor.userId());
Session.set('canManagePatients',aa.canManagePatients());
});
Then your helper can just return the value of the Session variable:
Template.registerHelper('canManagePatients', () =>{
return Session.get('canManagePatients');
});