[FIX] Sidenav does not open on some admin pages (#14010)

* Fix open sidenav in the admin pages

* Fix sidenav close

app/apps/client/admin/appInstall.js

@@ -10,7 +10,9 @@
 import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { APIClient } from '../../../utils';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.appInstall.helpers({
 	appFile() {
@@ -135,3 +137,10 @@ Template.appInstall.events({
 		t.isInstalling.set(false);
 	},
 });
+
+Template.appInstall.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/apps/client/admin/appLogs.js

@@ -2,9 +2,11 @@ import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { TAPi18n } from 'meteor/tap:i18n';
+import { Tracker } from 'meteor/tracker';
 import { APIClient } from '../../../utils';
 import moment from 'moment';
 import hljs from 'highlight.js';
+import { SideNav } from '../../../ui-utils/client';
 
 const loadData = (instance) => {
 	Promise.all([
@@ -104,3 +106,10 @@ Template.appLogs.events({
 		loadData(t);
 	},
 });
+
+Template.appLogs.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/apps/client/admin/appManage.js

@@ -3,6 +3,7 @@ import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { TAPi18n, TAPi18next } from 'meteor/tap:i18n';
+import { Tracker } from 'meteor/tracker';
 
 import { isEmail, APIClient } from '../../../utils';
 import { settings } from '../../../settings';
@@ -16,6 +17,7 @@ import { AppEvents } from '../communication';
 import { Utilities } from '../../lib/misc/Utilities';
 import { Apps } from '../orchestrator';
 import semver from 'semver';
+import { SideNav } from '../../../ui-utils/client';
 
 function getApps(instance) {
 	const id = instance.id.get();
@@ -502,3 +504,10 @@ Template.appManage.events({
 		}
 	}, 500),
 });
+
+Template.appManage.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/apps/client/admin/appWhatIsIt.js

@@ -2,7 +2,9 @@ import { Meteor } from 'meteor/meteor';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { Apps } from '../orchestrator';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.appWhatIsIt.onCreated(function() {
 	this.isLoading = new ReactiveVar(false);
@@ -43,3 +45,10 @@ Template.appWhatIsIt.events({
 		});
 	},
 });
+
+Template.appWhatIsIt.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/apps/client/admin/apps.js

@@ -2,11 +2,13 @@ import toastr from 'toastr';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { settings } from '../../../settings';
 import { t, APIClient } from '../../../utils';
 import { modal } from '../../../ui-utils';
 import { AppEvents } from '../communication';
 import { Apps } from '../orchestrator';
+import { SideNav } from '../../../ui-utils/client';
 
 const ENABLED_STATUS = ['auto_enabled', 'manually_enabled'];
 const enabled = ({ status }) => ENABLED_STATUS.includes(status);
@@ -337,3 +339,10 @@ Template.apps.events({
 		e.stopPropagation();
 	},
 });
+
+Template.apps.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/authorization/client/views/permissions.js

@@ -5,6 +5,7 @@ import { Template } from 'meteor/templating';
 import { Roles } from '../../../models';
 import { ChatPermissions } from '../lib/ChatPermissions';
 import { hasAllPermission } from '../hasPermission';
+import { SideNav } from '../../../ui-utils/client/lib/SideNav';
 
 Template.permissions.helpers({
 	role() {
@@ -79,3 +80,10 @@ Template.permissions.onCreated(function() {
 		});
 	});
 });
+
+Template.permissions.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/authorization/client/views/permissionsRole.js

@@ -4,10 +4,12 @@ import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { handleError } from '../../../utils/client/lib/handleError';
 import { t } from '../../../utils/lib/tapi18n';
+import { Tracker } from 'meteor/tracker';
 import { Roles } from '../../../models';
 import { hasAllPermission } from '../hasPermission';
 import { modal } from '../../../ui-utils/client/lib/modal';
 import toastr from 'toastr';
+import { SideNav } from '../../../ui-utils/client/lib/SideNav';
 
 Template.permissionsRole.helpers({
 	role() {
@@ -247,3 +249,10 @@ Template.permissionsRole.onCreated(function() {
 		}));
 	});
 });
+
+Template.permissionsRole.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/cloud/client/admin/callback.js

@@ -3,8 +3,10 @@ import './callback.html';
 import { Meteor } from 'meteor/meteor';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 
 import { FlowRouter } from 'meteor/kadira:flow-router';
+import { SideNav } from '../../../ui-utils/client';
 
 import queryString from 'query-string';
 
@@ -35,3 +37,11 @@ Template.cloudCallback.helpers({
 		return Template.instance().callbackError.get();
 	},
 });
+
+Template.cloudCallback.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});
+

app/cloud/client/admin/cloud.js

@@ -3,7 +3,9 @@ import './cloud.html';
 import { Meteor } from 'meteor/meteor';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { t } from '../../../utils';
+import { SideNav } from '../../../ui-utils/client';
 
 import queryString from 'query-string';
 import toastr from 'toastr';
@@ -152,3 +154,11 @@ Template.cloud.events({
 		i.syncWorkspace();
 	},
 });
+
+Template.cloud.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});
+

app/importer/client/admin/adminImport.js

@@ -1,10 +1,12 @@
 import { Meteor } from 'meteor/meteor';
+import { Tracker } from 'meteor/tracker';
 import { Importers } from '..';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { TAPi18n } from 'meteor/tap:i18n';
 import { hasRole } from '../../../authorization';
 import { t, handleError } from '../../../utils';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.adminImport.helpers({
 	isAdmin() {
@@ -37,3 +39,10 @@ Template.adminImport.events({
 		});
 	},
 });
+
+Template.adminImport.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/importer/client/admin/adminImportHistory.js

@@ -1,4 +1,5 @@
 import { Meteor } from 'meteor/meteor';
+import { Tracker } from 'meteor/tracker';
 import { Importers } from '..';
 import { Template } from 'meteor/templating';
 import { hasRole } from '../../../authorization';
@@ -7,6 +8,7 @@ import toastr from 'toastr';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { ProgressStep } from '../../lib/ImporterProgressStep';
 import { FlowRouter } from 'meteor/kadira:flow-router';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.adminImportHistory.helpers({
 	isAdmin() {
@@ -177,7 +179,6 @@ Template.adminImportHistory.events({
 	},
 });
 
-
 Template.adminImportHistory.onCreated(function() {
 	const instance = this;
 	this.preparing = new ReactiveVar(true);
@@ -193,3 +194,10 @@ Template.adminImportHistory.onCreated(function() {
 		}
 	});
 });
+
+Template.adminImportHistory.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/importer/client/admin/adminImportPrepare.js

@@ -1,5 +1,6 @@
 import { Meteor } from 'meteor/meteor';
 import { ReactiveVar } from 'meteor/reactive-var';
+import { Tracker } from 'meteor/tracker';
 import { Importers } from '..';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
@@ -8,6 +9,7 @@ import { hasRole } from '../../../authorization';
 import { settings } from '../../../settings';
 import { t, handleError, APIClient } from '../../../utils';
 import toastr from 'toastr';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.adminImportPrepare.helpers({
 	isAdmin() {
@@ -312,3 +314,10 @@ Template.adminImportPrepare.onCreated(function() {
 		return FlowRouter.go('/admin/import');
 	}
 });
+
+Template.adminImportPrepare.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/integrations/client/views/integrations.js

@@ -1,9 +1,11 @@
 import { Template } from 'meteor/templating';
 import { TAPi18n } from 'meteor/tap:i18n';
+import { Tracker } from 'meteor/tracker';
 import { hasAtLeastOnePermission } from '../../../authorization';
 import { integrations } from '../../lib/rocketchat';
 import { ChatIntegrations } from '../collections';
 import moment from 'moment';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.integrations.helpers({
 	hasPermission() {
@@ -19,3 +21,10 @@ Template.integrations.helpers({
 		return TAPi18n.__(integrations.outgoingEvents[event].label);
 	},
 });
+
+Template.integrations.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/integrations/client/views/integrationsIncoming.js

@@ -3,8 +3,9 @@ import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { TAPi18n } from 'meteor/tap:i18n';
+import { Tracker } from 'meteor/tracker';
 import { hasAtLeastOnePermission, hasAllPermission } from '../../../authorization';
-import { modal } from '../../../ui-utils';
+import { modal, SideNav } from '../../../ui-utils/client';
 import { t, handleError } from '../../../utils';
 import { ChatIntegrations } from '../collections';
 import { exampleMsg, exampleSettings, exampleUser } from './messageExample';
@@ -235,3 +236,10 @@ Template.integrationsIncoming.events({
 		}
 	},
 });
+
+Template.integrationsIncoming.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/integrations/client/views/integrationsNew.js

@@ -1,8 +1,17 @@
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { hasAtLeastOnePermission } from '../../../authorization';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.integrationsNew.helpers({
 	hasPermission() {
 		return hasAtLeastOnePermission(['manage-integrations', 'manage-own-integrations']);
 	},
 });
+
+Template.integrationsNew.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/integrations/client/views/integrationsOutgoing.js

@@ -4,9 +4,10 @@ import { Random } from 'meteor/random';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { TAPi18n } from 'meteor/tap:i18n';
+import { Tracker } from 'meteor/tracker';
 import { hasAllPermission, hasAtLeastOnePermission } from '../../../authorization';
-import { modal } from '../../../ui-utils';
-import { t, handleError } from '../../../utils';
+import { modal, SideNav } from '../../../ui-utils';
+import { t, handleError } from '../../../utils/client';
 import { ChatIntegrations } from '../collections';
 import { integrations } from '../../lib/rocketchat';
 import hljs from 'highlight.js';
@@ -352,3 +353,11 @@ Template.integrationsOutgoing.events({
 		}
 	},
 });
+
+Template.integrationsOutgoing.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});
+

app/integrations/client/views/integrationsOutgoingHistory.js

@@ -3,6 +3,7 @@ import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { TAPi18n } from 'meteor/tap:i18n';
+import { Tracker } from 'meteor/tracker';
 import { handleError } from '../../../utils';
 import { hasAllPermission, hasAtLeastOnePermission } from '../../../authorization';
 import { ChatIntegrations, ChatIntegrationHistory } from '../collections';
@@ -11,6 +12,7 @@ import _ from 'underscore';
 import hljs from 'highlight.js';
 import moment from 'moment';
 import toastr from 'toastr';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.integrationsOutgoingHistory.onCreated(function _integrationsOutgoingHistoryOnCreated() {
 	this.hasMore = new ReactiveVar(false);
@@ -164,3 +166,10 @@ Template.integrationsOutgoingHistory.events({
 		}
 	}, 200),
 });
+
+Template.integrationsOutgoingHistory.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/logger/client/views/viewLogs.js

@@ -1,11 +1,13 @@
 import { Meteor } from 'meteor/meteor';
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { ansispan } from '../ansispan';
 import { stdout } from '../viewLogs';
 import { readMessage } from '../../../ui-utils';
 import { hasAllPermission } from '../../../authorization';
 import _ from 'underscore';
 import moment from 'moment';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.viewLogs.onCreated(function() {
 	this.subscribe('stdout');
@@ -41,7 +43,10 @@ Template.viewLogs.events({
 });
 
 Template.viewLogs.onRendered(function() {
-
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
 	const wrapper = this.find('.terminal');
 	const wrapperUl = this.find('.terminal');
 	const newLogs = this.find('.new-logs');

app/mail-messages/client/router.js

@@ -2,8 +2,8 @@ import { Meteor } from 'meteor/meteor';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { BlazeLayout } from 'meteor/kadira:blaze-layout';
 
-FlowRouter.route('/mailer', {
-	name: 'mailer',
+FlowRouter.route('/admin/mailer', {
+	name: 'admin-mailer',
 	action() {
 		return BlazeLayout.render('main', {
 			center: 'mailer',

app/mail-messages/client/startup.js

@@ -2,7 +2,7 @@ import { AdminBox } from '../../ui-utils';
 import { hasAllPermission } from '../../authorization';
 
 AdminBox.addOption({
-	href: 'mailer',
+	href: 'admin-mailer',
 	i18nLabel: 'Mailer',
 	icon: 'mail',
 	permissionGranted() {

app/mail-messages/client/views/mailer.js

@@ -1,9 +1,11 @@
 import { Meteor } from 'meteor/meteor';
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { TAPi18n } from 'meteor/tap:i18n';
 import { settings } from '../../../settings';
 import { handleError } from '../../../utils';
 import toastr from 'toastr';
+import { SideNav } from '../../../ui-utils/client';
 
 Template.mailer.helpers({
 	fromEmail() {
@@ -35,3 +37,10 @@ Template.mailer.events({
 		});
 	},
 });
+
+Template.mailer.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});

app/oauth2-server-config/client/admin/views/oauthApp.js

@@ -3,8 +3,9 @@ import { ReactiveVar } from 'meteor/reactive-var';
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Template } from 'meteor/templating';
 import { TAPi18n } from 'meteor/tap:i18n';
+import { Tracker } from 'meteor/tracker';
 import { hasAllPermission } from '../../../../authorization';
-import { modal } from '../../../../ui-utils';
+import { modal, SideNav } from '../../../../ui-utils/client';
 import { t, handleError } from '../../../../utils';
 import { ChatOAuthApps } from '../collection';
 import toastr from 'toastr';
@@ -100,3 +101,11 @@ Template.oauthApp.events({
 		});
 	},
 });
+
+Template.oauthApp.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});
+

app/oauth2-server-config/client/admin/views/oauthApps.js

@@ -1,7 +1,9 @@
 import { Template } from 'meteor/templating';
+import { Tracker } from 'meteor/tracker';
 import { hasAllPermission } from '../../../../authorization';
 import { ChatOAuthApps } from '../collection';
 import moment from 'moment';
+import { SideNav } from '../../../../ui-utils/client';
 
 Template.oauthApps.onCreated(function() {
 	this.subscribe('oauthApps');
@@ -18,3 +20,11 @@ Template.oauthApps.helpers({
 		return moment(date).format('L LT');
 	},
 });
+
+Template.oauthApps.onRendered(() => {
+	Tracker.afterFlush(() => {
+		SideNav.setFlex('adminFlex');
+		SideNav.openFlex();
+	});
+});
+

app/ui-utils/client/lib/SideNav.js

@@ -1,6 +1,6 @@
 import { FlowRouter } from 'meteor/kadira:flow-router';
 import { Session } from 'meteor/session';
-import { roomTypes } from '../../../utils';
+import { roomTypes } from '../../../utils/client/lib/roomTypes';
 import { Subscriptions } from '../../../models';
 import { AccountBox } from './AccountBox';
 
@@ -97,7 +97,7 @@ export const SideNav = new class {
 			}
 		});
 		setTimeout(() => {
-			const ref = highestZidxElem.querySelector('input');
+			const ref = highestZidxElem && highestZidxElem.querySelector('input');
 			return ref && ref.focus();
 		}, 200);
 	}