diff --git a/webapp/channels/src/components/no_script/no_script_template.html b/webapp/channels/src/components/no_script/no_script_template.html
new file mode 100644
index 0000000000..588d07d866
--- /dev/null
+++ b/webapp/channels/src/components/no_script/no_script_template.html
@@ -0,0 +1,17 @@
+
diff --git a/webapp/channels/src/components/root/root.test.tsx b/webapp/channels/src/components/root/root.test.tsx
index a470edeace..9024726413 100644
--- a/webapp/channels/src/components/root/root.test.tsx
+++ b/webapp/channels/src/components/root/root.test.tsx
@@ -18,7 +18,7 @@ import {StoragePrefixes} from 'utils/constants';
import {handleLoginLogoutSignal, redirectToOnboardingOrDefaultTeam} from './actions';
import type {Props} from './root';
-import Root from './root';
+import Root, {doesRouteBelongToTeamControllerRoutes} from './root';
jest.mock('mattermost-redux/client/rudder', () => ({
rudderAnalytics: {
@@ -358,3 +358,49 @@ describe('components/Root', () => {
});
});
});
+
+describe('doesRouteBelongToTeamControllerRoutes', () => {
+ test('should return true for some of team_controller routes', () => {
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/messages/abc')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/messages')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/channels/cde')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/channels')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/threads/efg')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/threads')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/drafts')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/integrations/klm')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/emoji/nop')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/integrations')).toBe(true);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_1/emoji')).toBe(true);
+ });
+
+ test('should return false for other of team_controller routes', () => {
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_2')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_2/pl/permalink123')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/team_name_example_2/needs_team_component_plugin')).toBe(false);
+ });
+
+ test('should return false for other routes of root', () => {
+ expect(doesRouteBelongToTeamControllerRoutes('/plug/custom_route_component')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/main_component_product_1')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/product_1/public')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/_redirect/pl/message_1')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/preparing-workspace')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/mfa')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/create_team')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/oauth/authorize')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/select_team')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/admin_console')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/landing')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/terms_of_service')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/claim')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/do_verify_email')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/should_verify_email')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/signup_user_complete')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/reset_password_complete')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/reset_password')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/access_problem')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/login')).toBe(false);
+ expect(doesRouteBelongToTeamControllerRoutes('/error')).toBe(false);
+ });
+});
diff --git a/webapp/channels/src/components/root/root.tsx b/webapp/channels/src/components/root/root.tsx
index 6d265278b9..22d4f709b5 100644
--- a/webapp/channels/src/components/root/root.tsx
+++ b/webapp/channels/src/components/root/root.tsx
@@ -28,6 +28,7 @@ import OpenPluginInstallPost from 'components/custom_open_plugin_install_post_re
import GlobalHeader from 'components/global_header/global_header';
import {HFRoute} from 'components/header_footer_route/header_footer_route';
import {HFTRoute, LoggedInHFTRoute} from 'components/header_footer_template_route';
+import InitialLoadingScreen from 'components/initial_loading_screen';
import MobileViewWatcher from 'components/mobile_view_watcher';
import ModalController from 'components/modal_controller';
import LaunchingWorkspace, {LAUNCHING_WORKSPACE_FULLSCREEN_Z_INDEX} from 'components/preparing_workspace/launching_workspace';
@@ -309,7 +310,7 @@ export default class Root extends React.PureComponent {
BrowserStore.setLandingPageSeen(true);
};
- componentDidUpdate(prevProps: Props) {
+ componentDidUpdate(prevProps: Props, prevState: State) {
if (!deepEqual(prevProps.theme, this.props.theme)) {
Utils.applyTheme(this.props.theme);
}
@@ -333,6 +334,12 @@ export default class Root extends React.PureComponent {
if (!prevProps.isConfigLoaded && this.props.isConfigLoaded) {
this.setRudderConfig();
}
+
+ if (prevState.shouldMountAppRoutes === false && this.state.shouldMountAppRoutes === true) {
+ if (!doesRouteBelongToTeamControllerRoutes(this.props.location.pathname)) {
+ InitialLoadingScreen.stop();
+ }
+ }
}
captureUTMParams() {
@@ -600,3 +607,8 @@ export default class Root extends React.PureComponent {
);
}
}
+
+export function doesRouteBelongToTeamControllerRoutes(pathname: RouteComponentProps['location']['pathname']): boolean {
+ const TEAM_CONTROLLER_PATH_PATTERN = /^\/([a-z0-9\-_]+)\/(channels|messages|threads|drafts|integrations|emoji)(\/.*)?$/;
+ return TEAM_CONTROLLER_PATH_PATTERN.test(pathname);
+}
diff --git a/webapp/channels/src/components/team_controller/team_controller.tsx b/webapp/channels/src/components/team_controller/team_controller.tsx
index c81e616471..89fa10b0ea 100644
--- a/webapp/channels/src/components/team_controller/team_controller.tsx
+++ b/webapp/channels/src/components/team_controller/team_controller.tsx
@@ -16,6 +16,7 @@ import LocalStorageStore from 'stores/local_storage_store';
import {makeAsyncComponent} from 'components/async_load';
import ChannelController from 'components/channel_layout/channel_controller';
import useTelemetryIdentitySync from 'components/common/hooks/useTelemetryIdentifySync';
+import InitialLoadingScreen from 'components/initial_loading_screen';
import Constants from 'utils/constants';
import {cmdOrCtrlPressed, isKeyPressed} from 'utils/keyboard';
@@ -53,6 +54,7 @@ function TeamController(props: Props) {
useTelemetryIdentitySync();
useEffect(() => {
+ InitialLoadingScreen.stop();
async function fetchInitialChannels() {
await props.fetchAllMyTeamsChannelsAndChannelMembersREST();
diff --git a/webapp/channels/src/root.html b/webapp/channels/src/root.html
index 58c5ba8047..14d73dd718 100644
--- a/webapp/channels/src/root.html
+++ b/webapp/channels/src/root.html
@@ -19,68 +19,13 @@
-
-
-
+
+
-
-
-
Cannot connect to Mattermost
-
-
We're having trouble connecting to Mattermost. If refreshing this page (Ctrl+R or Command+R) does not work, please verify that your computer is connected to the internet.