From 74a936668865d5cd49e01e6c16ee2eab3ef674af Mon Sep 17 00:00:00 2001
From: Andrey Platov <andrey@hardcoreeng.com>
Date: Wed, 22 Sep 2021 12:43:25 +0200
Subject: [PATCH] preloading of popup component

Signed-off-by: Andrey Platov <andrey@hardcoreeng.com>
---
 .../ui/src/components/PopupInstance.svelte    |  6 +-----
 packages/ui/src/index.ts                      | 21 +++++++++++++------
 2 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/packages/ui/src/components/PopupInstance.svelte b/packages/ui/src/components/PopupInstance.svelte
index d1ab6fd976..a5cac8fdf1 100644
--- a/packages/ui/src/components/PopupInstance.svelte
+++ b/packages/ui/src/components/PopupInstance.svelte
@@ -89,11 +89,7 @@ $: {
 </script>
 
 <div class="popup" bind:this={modalHTML} style={`z-index: ${zIndex + 1};`}>
-  {#if typeof(is) === 'string'}
-    <Component is={is} props={props} on:close={ (ev) => close(ev.detail) }/>
-  {:else}
-    <svelte:component this={is} {...props} on:close={ (ev) => close(ev.detail) } />
-  {/if}
+  <svelte:component this={is} {...props} on:close={ (ev) => close(ev.detail) } />
 </div>
 <div bind:this={modalOHTML} class="modal-overlay" style={`z-index: ${zIndex};`} on:click={() => close(undefined)} />
 
diff --git a/packages/ui/src/index.ts b/packages/ui/src/index.ts
index 891c9b6097..5f972a38d3 100644
--- a/packages/ui/src/index.ts
+++ b/packages/ui/src/index.ts
@@ -15,7 +15,7 @@
 
 import { SvelteComponent } from 'svelte'
 import type { AnySvelteComponent, AnyComponent, PopupAlignment, LabelAndProps, TooltipAligment } from './types'
-import type { IntlString } from '@anticrm/platform'
+import { getResource, IntlString } from '@anticrm/platform'
 import { addStringsLoader } from '@anticrm/platform'
 import { uiId } from './plugin' 
 
@@ -81,7 +81,7 @@ export function createApp (target: HTMLElement): SvelteComponent {
 }
 
 interface CompAndProps {
-  is: AnySvelteComponent | AnyComponent
+  is: AnySvelteComponent
   props: any
   element?: PopupAlignment
   onClose?: (result: any) => void
@@ -95,10 +95,19 @@ interface CompAndProps {
 export const popupstore = writable<CompAndProps[]>([])
 
 export function showPopup (component: AnySvelteComponent | AnyComponent, props: any, element?: PopupAlignment, onClose?: (result: any) => void): void {
-  popupstore.update(popups => {
-    popups.push({ is: component, props, element, onClose })
-    return popups
-  })
+  if (typeof component === 'string') {
+    getResource(component).then(resolved => {
+      popupstore.update(popups => {
+        popups.push({ is: resolved, props, element, onClose })
+        return popups
+      })    
+    })
+  } else {
+    popupstore.update(popups => {
+      popups.push({ is: component, props, element, onClose })
+      return popups
+    })
+  }
 }
 
 export function closePopup (): void {