## Description Improve page loads by removing the blocking calls of user and tenant information. These calls were called before any other routes would load and that would increase the time taken for other subsequent calls. Reasons it was needed for 1. Branding info comes from tenant api call. This being executed later would cause flashing of colours if branding is updated 2. Licence info comes from tenant api call. A check is needed for licence validity and show appropriate screens instead of the app for users 3. User info was needed to show the correct admin settings to the user We are going to mitigate dependency 1 and 2 by hiding the ui by making the opacity to 0 till the responses are not received. This will ensure users don't see the screen, yet the JS is being loaded efficiently and api calls are done earlier. We will move the admin settings dependency to the route itself so that other routes do not delay because of this change #### PR fixes following issue(s) Fixes #25586 #### Media > A video or a GIF is preferred. when using Loom, don’t embed because it looks like it’s a GIF. instead, just link to the video > > #### Type of change - Chore (housekeeping or task changes that don't impact user perception) ## Testing #### How Has This Been Tested? Needs regression testing on EE with admin settings, branding and licence checks Page loads on CE and EE - [x] Manual - [ ] Cypress #### Test Plan EE: - [ ] admin settings - [ ] branding - [ ] licence checks - [ ] Page loads CE - [x] admin settings - [x] Page loads > #### Issues raised during DP testing No issues found during DP (CE) Testing ## Checklist: #### Dev activity - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag #### QA activity: - [ ] [Speedbreak features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-) have been covered - [ ] Test plan covers all impacted features and [areas of interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-) - [ ] Test plan has been peer reviewed by project stakeholders and other QA members - [ ] Manually tested functionality on DP - [ ] We had an implementation alignment call with stakeholders post QA Round 2 - [ ] Cypress test cases have been added and approved by SDET/manual QA - [ ] Added `Test Plan Approved` label after Cypress tests were reviewed - [ ] Added `Test Plan Approved` label after JUnit tests were reviewed
220 lines
8.9 KiB
HTML
Executable File
220 lines
8.9 KiB
HTML
Executable File
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
||
<title>Appsmith</title>
|
||
<style>
|
||
#loader {
|
||
position: fixed;
|
||
left: 0;
|
||
top: 0;
|
||
height: 4px;
|
||
background: #D7D7D7;
|
||
transition: all ease-in 0.3s;
|
||
}
|
||
#app-load-block {
|
||
visibility: hidden;
|
||
}
|
||
</style>
|
||
<script>
|
||
// '' (empty strings), 'false' are falsy
|
||
// could return either boolean or string based on value
|
||
const parseConfig = (config) => {
|
||
if (config.indexOf("__") === 0 || config.indexOf("$") === 0 || config.indexOf("%") === 0)
|
||
return "";
|
||
|
||
const result = config.trim();
|
||
if (result.toLowerCase() === "false" || result === "") {
|
||
return false;
|
||
} else if (result.toLowerCase() === "true") {
|
||
return true;
|
||
}
|
||
|
||
return result;
|
||
};
|
||
const CLOUD_HOSTING = parseConfig("__APPSMITH_CLOUD_HOSTING__");
|
||
const ZIPY_KEY = parseConfig("__APPSMITH_ZIPY_SDK_KEY__");
|
||
</script>
|
||
<script>
|
||
window.__APPSMITH_CHUNKS_TO_PRELOAD =
|
||
<%=
|
||
(function () {
|
||
// This code emits URLs to be preloaded as soon as the main bundle loads.
|
||
// If you code-split away some files and need to preload them as well, here’s how to do that:
|
||
// 1) Give your import a name (use the `webpackChunkName` comment: `import(/* webpackChunkName: "my-name" */ "./my-file")`)
|
||
// 2) Add the name into the `chunksToPreload` array below
|
||
let chunksToPreload = {
|
||
'edit-mode': [...getChunkUrls("editor"), ...getChunkUrls("global-search")],
|
||
'view-mode': getChunkUrls("AppViewer")
|
||
};
|
||
|
||
return JSON.stringify(chunksToPreload);
|
||
|
||
function getChunkUrls(chunkName) {
|
||
return compilation.namedChunkGroups.get(chunkName).chunks.flatMap(chunk => [...chunk.files]);
|
||
}
|
||
})()
|
||
%>
|
||
</script>
|
||
<script>
|
||
if (CLOUD_HOSTING && ZIPY_KEY) {
|
||
const script = document.createElement('script');
|
||
script.crossOrigin = "anonymous";
|
||
script.defer = true;
|
||
script.src = "https://cdn.zipy.ai/sdk/v1.0/zipy.min.umd.js";
|
||
script.onload = () => {
|
||
window.zipy && window.zipy.init(ZIPY_KEY);
|
||
}
|
||
const head = document.getElementsByTagName('head')[0];
|
||
head && head.appendChild(script);
|
||
}
|
||
// This function is triggered on load of google apis javascript library
|
||
// Even though the script is loaded asynchronously, in case of firefox run on windows
|
||
// The gapi script is getting loaded even before the last script of index.html
|
||
// Hence defining this function before loading gapi
|
||
// For more info: https://github.com/appsmithorg/appsmith/issues/21033
|
||
gapiLoaded = () => {
|
||
window.googleAPIsLoaded = true;
|
||
}
|
||
onError = () => {
|
||
window.googleAPIsLoaded = false;
|
||
};
|
||
</script>
|
||
<!-- Adding this Library to access google file picker API in case of limiting google sheet access -->
|
||
<script async defer id="googleapis" src="https://apis.google.com/js/api.js" onload="gapiLoaded()"
|
||
onerror="onError()"></script>
|
||
</head>
|
||
|
||
<body class="appsmith-light-theme">
|
||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||
<div id="loader" style="width: 30vw;"></div>
|
||
<!--
|
||
To keep zIndex for tooltips higher than app comments, todo remove when migrating to Tooltip2
|
||
Currently the className does not apply to the portal root, so we're unable to work with z-indexes based on that
|
||
-->
|
||
<div id="app-load-block">
|
||
<div id="header-root"></div>
|
||
<div id="root"></div>
|
||
</div>
|
||
<div id="date-picker-control" style="position: relative; z-index: 1000;"></div>
|
||
<script type="text/javascript">
|
||
// Ref: https://github.com/Modernizr/Modernizr/blob/94592f279a410436530c7c06acc42a6e90c20150/feature-detects/storage/localstorage.js
|
||
const getIsLocalStorageSupported = () => {
|
||
try {
|
||
window.localStorage.setItem("test", "testA");
|
||
window.localStorage.removeItem("test");
|
||
return true;
|
||
} catch (e) {
|
||
return false;
|
||
}
|
||
};
|
||
const isLocalStorageSupported = getIsLocalStorageSupported();
|
||
|
||
const handleLocalStorageNotSupportedError = () => {
|
||
console.error("Localstorage storage is not supported on your device.");
|
||
}
|
||
|
||
const localStorageUtil = {
|
||
getItem: (key) => {
|
||
if (!isLocalStorageSupported) {
|
||
handleLocalStorageNotSupportedError();
|
||
return;
|
||
}
|
||
return window.localStorage.getItem(key);
|
||
},
|
||
removeItem: (key) => {
|
||
if (!isLocalStorageSupported) {
|
||
handleLocalStorageNotSupportedError();
|
||
return
|
||
}
|
||
return window.localStorage.removeItem(key);
|
||
},
|
||
setItem: (key, value) => {
|
||
if (!isLocalStorageSupported) {
|
||
handleLocalStorageNotSupportedError();
|
||
return;
|
||
}
|
||
return window.localStorage.setItem(key, value);
|
||
}
|
||
};
|
||
window.addEventListener("DOMContentLoaded", (event) => {
|
||
document.getElementById("loader").style.width = "50vw";
|
||
});
|
||
|
||
const registerPageServiceWorker = () => {
|
||
if (
|
||
"serviceWorker" in navigator
|
||
// Disable the service worker in Cypress tests. We primarily do this to make
|
||
// the Performance/LinkRelPreload_Spec.js test work (as it collects URLs all network requests,
|
||
// and service worker requests fail it.) But, anecdotally, disabling the service worker
|
||
// also seems to make the tests a bit faster, as the network load is lower.
|
||
&& !window.Cypress
|
||
) {
|
||
window.addEventListener("load", function () {
|
||
navigator.serviceWorker.register("/pageService.js").catch(error => {
|
||
console.error("Service Worker Registration failed: " + error);
|
||
});
|
||
});
|
||
}
|
||
};
|
||
registerPageServiceWorker();
|
||
</script>
|
||
<script type="text/javascript">
|
||
const LOG_LEVELS = ["debug", "error"];
|
||
const CONFIG_LOG_LEVEL_INDEX = LOG_LEVELS.indexOf(parseConfig("__APPSMITH_CLIENT_LOG_LEVEL__"));
|
||
|
||
const INTERCOM_APP_ID = parseConfig("%REACT_APP_INTERCOM_APP_ID%") || parseConfig("__APPSMITH_INTERCOM_APP_ID__");
|
||
const DISABLE_INTERCOM = parseConfig("__APPSMITH_DISABLE_INTERCOM__");
|
||
|
||
// Initialize the Intercom library
|
||
if (INTERCOM_APP_ID.length && !DISABLE_INTERCOM) {
|
||
(function () { var w = window; var ic = w.Intercom; if (typeof ic === "function") { ic('reattach_activator'); ic('update', w.intercomSettings); } else { var d = document; var i = function () { i.c(arguments); }; i.q = []; i.c = function (args) { i.q.push(args); }; w.Intercom = i; var l = function () { var s = d.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = 'https://widget.intercom.io/widget/' + INTERCOM_APP_ID; var x = d.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x); }; if (document.readyState === 'complete') { l(); } else if (w.attachEvent) { w.attachEvent('onload', l); } else { w.addEventListener('load', l, false); } } })();
|
||
}
|
||
|
||
window.SENTRY_CONFIG = parseConfig("__APPSMITH_SENTRY_DSN__");
|
||
window.APPSMITH_FEATURE_CONFIGS = {
|
||
sentry: {
|
||
dsn: parseConfig("__APPSMITH_SENTRY_DSN__"),
|
||
release: parseConfig("__APPSMITH_SENTRY_RELEASE__"),
|
||
environment: parseConfig("__APPSMITH_SENTRY_ENVIRONMENT__"),
|
||
},
|
||
smartLook: {
|
||
id: parseConfig("__APPSMITH_SMART_LOOK_ID__"),
|
||
},
|
||
enableRapidAPI: parseConfig("__APPSMITH_MARKETPLACE_ENABLED__"),
|
||
segment: {
|
||
apiKey: parseConfig("__APPSMITH_SEGMENT_KEY__"),
|
||
ceKey: parseConfig("__APPSMITH_SEGMENT_CE_KEY__"),
|
||
},
|
||
fusioncharts: {
|
||
licenseKey: parseConfig("__APPSMITH_FUSIONCHARTS_LICENSE_KEY__")
|
||
},
|
||
enableMixpanel: parseConfig("__APPSMITH_SEGMENT_KEY__"),
|
||
algolia: {
|
||
apiId: parseConfig("__APPSMITH_ALGOLIA_API_ID__"),
|
||
apiKey: parseConfig("__APPSMITH_ALGOLIA_API_KEY__"),
|
||
indexName: parseConfig("__APPSMITH_ALGOLIA_SEARCH_INDEX_NAME__"),
|
||
},
|
||
logLevel: CONFIG_LOG_LEVEL_INDEX > -1 ? LOG_LEVELS[CONFIG_LOG_LEVEL_INDEX] : LOG_LEVELS[1],
|
||
cloudHosting: CLOUD_HOSTING,
|
||
enableTNCPP: parseConfig("__APPSMITH_TNC_PP__"),
|
||
appVersion: {
|
||
id: parseConfig("__APPSMITH_VERSION_ID__"),
|
||
releaseDate: parseConfig("__APPSMITH_VERSION_RELEASE_DATE__")
|
||
},
|
||
intercomAppID: INTERCOM_APP_ID,
|
||
mailEnabled: parseConfig("__APPSMITH_MAIL_ENABLED__"),
|
||
cloudServicesBaseUrl: parseConfig("__APPSMITH_CLOUD_SERVICES_BASE_URL__") || "https://cs.appsmith.com",
|
||
googleRecaptchaSiteKey: parseConfig("__APPSMITH_RECAPTCHA_SITE_KEY__"),
|
||
hideWatermark: parseConfig("__APPSMITH_HIDE_WATERMARK__"),
|
||
disableIframeWidgetSandbox: parseConfig("__APPSMITH_DISABLE_IFRAME_WIDGET_SANDBOX__"),
|
||
customerPortalUrl: parseConfig("__APPSMITH_CUSTOMER_PORTAL_URL__") || "https://customer.appsmith.com",
|
||
pricingUrl: parseConfig("__APPSMITH_PRICING_URL__") || "https://www.appsmith.com/pricing",
|
||
};
|
||
</script>
|
||
</body>
|
||
|
||
</html>
|