From d7f3b98aed217bf4cb35cbb626f75e6c0d63852e Mon Sep 17 00:00:00 2001 From: joshhunt Date: Tue, 14 Jul 2026 09:43:16 +0100 Subject: [PATCH 1/3] Remove suspense boundary from App plugins --- .../templates/app/src/module.tsx | 22 ++++--------------- 1 file changed, 4 insertions(+), 18 deletions(-) diff --git a/packages/create-plugin/templates/app/src/module.tsx b/packages/create-plugin/templates/app/src/module.tsx index 33fb72bd20..3ac708eca1 100644 --- a/packages/create-plugin/templates/app/src/module.tsx +++ b/packages/create-plugin/templates/app/src/module.tsx @@ -1,26 +1,12 @@ -import React, { Suspense, lazy } from 'react'; -import { AppPlugin, type AppRootProps } from '@grafana/data'; -import { LoadingPlaceholder } from '@grafana/ui'; -import type { AppConfigProps } from './components/AppConfig/AppConfig'; +import { lazy } from 'react'; +import { AppPlugin } from '@grafana/data'; const LazyApp = lazy(() => import('./components/App/App')); const LazyAppConfig = lazy(() => import('./components/AppConfig/AppConfig')); -const App = (props: AppRootProps) => ( - }> - - -); - -const AppConfig = (props: AppConfigProps) => ( - }> - - -); - -export const plugin = new AppPlugin<{}>().setRootPage(App).addConfigPage({ +export const plugin = new AppPlugin<{}>().setRootPage(LazyApp).addConfigPage({ title: 'Configuration', icon: 'cog', - body: AppConfig, + body: LazyAppConfig, id: 'configuration', }); From 7a8d1864b5110770beab8eff4dee05cf67e97208 Mon Sep 17 00:00:00 2001 From: joshhunt Date: Tue, 14 Jul 2026 10:14:30 +0100 Subject: [PATCH 2/3] rename app components --- packages/create-plugin/templates/app/src/module.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/create-plugin/templates/app/src/module.tsx b/packages/create-plugin/templates/app/src/module.tsx index 3ac708eca1..8b690a22e9 100644 --- a/packages/create-plugin/templates/app/src/module.tsx +++ b/packages/create-plugin/templates/app/src/module.tsx @@ -1,12 +1,12 @@ import { lazy } from 'react'; import { AppPlugin } from '@grafana/data'; -const LazyApp = lazy(() => import('./components/App/App')); -const LazyAppConfig = lazy(() => import('./components/AppConfig/AppConfig')); +const App = lazy(() => import('./components/App/App')); +const AppConfig = lazy(() => import('./components/AppConfig/AppConfig')); -export const plugin = new AppPlugin<{}>().setRootPage(LazyApp).addConfigPage({ +export const plugin = new AppPlugin<{}>().setRootPage(App).addConfigPage({ title: 'Configuration', icon: 'cog', - body: LazyAppConfig, + body: AppConfig, id: 'configuration', }); From 1e7117acb91731ae84891ccec451896aa3021cbc Mon Sep 17 00:00:00 2001 From: joshhunt Date: Tue, 14 Jul 2026 13:11:16 +0100 Subject: [PATCH 3/3] actually just remove suspense boundary from App --- .../create-plugin/templates/app/src/module.tsx | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/packages/create-plugin/templates/app/src/module.tsx b/packages/create-plugin/templates/app/src/module.tsx index 8b690a22e9..f44d97945d 100644 --- a/packages/create-plugin/templates/app/src/module.tsx +++ b/packages/create-plugin/templates/app/src/module.tsx @@ -1,8 +1,16 @@ -import { lazy } from 'react'; -import { AppPlugin } from '@grafana/data'; +import React, { Suspense, lazy } from 'react'; +import { AppPlugin, type AppRootProps } from '@grafana/data'; +import { LoadingPlaceholder } from '@grafana/ui'; +import type { AppConfigProps } from './components/AppConfig/AppConfig'; const App = lazy(() => import('./components/App/App')); -const AppConfig = lazy(() => import('./components/AppConfig/AppConfig')); +const LazyAppConfig = lazy(() => import('./components/AppConfig/AppConfig')); + +const AppConfig = (props: AppConfigProps) => ( + }> + + +); export const plugin = new AppPlugin<{}>().setRootPage(App).addConfigPage({ title: 'Configuration',