diff --git a/frontend/javascripts/admin/admin_rest_api.ts b/frontend/javascripts/admin/admin_rest_api.ts index 06702383cdf..1b39dc8de8f 100644 --- a/frontend/javascripts/admin/admin_rest_api.ts +++ b/frontend/javascripts/admin/admin_rest_api.ts @@ -2053,6 +2053,8 @@ export async function getPricingPlanStatus(): Promise { return Request.receiveJSON("/api/pricing/status"); } +export const cachedGetPricingPlanStatus = _.memoize(getPricingPlanStatus); + // ### BuildInfo webknossos export function getBuildInfo(): Promise { return Request.receiveJSON("/api/buildinfo", { diff --git a/frontend/javascripts/dashboard/dashboard_view.tsx b/frontend/javascripts/dashboard/dashboard_view.tsx index 5e8fa76c791..64632af32ee 100644 --- a/frontend/javascripts/dashboard/dashboard_view.tsx +++ b/frontend/javascripts/dashboard/dashboard_view.tsx @@ -11,7 +11,7 @@ import type { APIOrganization, APIPricingPlanStatus, APIUser } from "types/api_f import type { OxalisState } from "oxalis/store"; import { enforceActiveUser } from "oxalis/model/accessors/user_accessor"; import { - getPricingPlanStatus, + cachedGetPricingPlanStatus, getUser, updateNovelUserExperienceInfos, } from "admin/admin_rest_api"; @@ -120,7 +120,10 @@ class DashboardView extends PureComponent { const user = this.props.userId != null ? await getUser(this.props.userId) : this.props.activeUser; - const pricingPlanStatus = await getPricingPlanStatus(); + // Use a cached version of this route to avoid that a tab switch in the dashboard + // causes a whole-page spinner. Since the different tabs are controlled by the + // router, the DashboardView re-mounts. + const pricingPlanStatus = await cachedGetPricingPlanStatus(); this.setState({ user, diff --git a/frontend/stylesheets/_utils.less b/frontend/stylesheets/_utils.less index 7692453877d..eb71950bb3d 100644 --- a/frontend/stylesheets/_utils.less +++ b/frontend/stylesheets/_utils.less @@ -122,3 +122,7 @@ td.nowrap * { .min-height-0 { min-height: 0; } + +.text-center { + text-align: center; +}