diff --git a/Composer/packages/client/src/App.tsx b/Composer/packages/client/src/App.tsx
index e9955277a1..9b69bd3586 100644
--- a/Composer/packages/client/src/App.tsx
+++ b/Composer/packages/client/src/App.tsx
@@ -20,11 +20,10 @@ export const App: React.FC = () => {
     loadLocale(appLocale);
   }, [appLocale]);
 
-  const { fetchExtensions, loadFormDialogSchemaTemplates } = useRecoilValue(dispatcherState);
+  const { fetchExtensions } = useRecoilValue(dispatcherState);
 
   useEffect(() => {
     fetchExtensions();
-    loadFormDialogSchemaTemplates();
   }, []);
 
   return (
diff --git a/Composer/packages/client/src/pages/form-dialog/FormDialogPage.tsx b/Composer/packages/client/src/pages/form-dialog/FormDialogPage.tsx
index e0096cd1f9..943f073b14 100644
--- a/Composer/packages/client/src/pages/form-dialog/FormDialogPage.tsx
+++ b/Composer/packages/client/src/pages/form-dialog/FormDialogPage.tsx
@@ -40,10 +40,15 @@ const FormDialogPage: React.FC<Props> = React.memo((props: Props) => {
     createFormDialogSchema,
     updateFormDialogSchema,
     navigateToGeneratedDialog,
+    loadFormDialogSchemaTemplates,
   } = useRecoilValue(dispatcherState);
 
   const { 0: createSchemaDialogOpen, 1: setCreateSchemaDialogOpen } = React.useState(false);
 
+  React.useEffect(() => {
+    loadFormDialogSchemaTemplates();
+  }, []);
+
   const availableTemplates = React.useMemo(
     () => formDialogLibraryTemplates.filter((t) => !t.isGlobal).map((t) => t.name),
     [formDialogLibraryTemplates]