Merge branch 'feature/dynamic-promo-widget'

packages/api/src/controllers/cloud.js

@@ -8,6 +8,7 @@ const {
   getCloudContent,
   putCloudContent,
   removeCloudCachedConnection,
+  getPromoWidgetData,
 } = require('../utility/cloudIntf');
 const connections = require('./connections');
 const socket = require('../utility/socket');
@@ -283,6 +284,18 @@ module.exports = {
     return getAiGatewayServer();
   },
 
+  premiumPromoWidget_meta: true,
+  async premiumPromoWidget() {
+    const data = getPromoWidgetData();
+    if (data?.state != 'data') {
+      return null;
+    }
+    if (data.validTo && new Date().getTime() > new Date(data.validTo).getTime()) {
+      return null;
+    }
+    return data;
+  },
+
   // chatStream_meta: {
   //   raw: true,
   //   method: 'post',

packages/api/src/utility/cloudIntf.js

@@ -17,6 +17,7 @@ const currentVersion = require('../currentVersion');
 const logger = getLogger('cloudIntf');
 
 let cloudFiles = null;
+let promoWidgetData = null;
 
 const DBGATE_IDENTITY_URL = process.env.LOCAL_DBGATE_IDENTITY
   ? 'http://localhost:3103'
@@ -259,6 +260,36 @@ async function getPublicFileData(path) {
   return resp.data;
 }
 
+async function updatePremiumPromoWidget() {
+  try {
+    const fileContent = await fs.readFile(path.join(datadir(), 'promo-widget.json'), 'utf-8');
+    promoWidgetData = JSON.parse(fileContent);
+  } catch (err) {
+    promoWidgetData = null;
+  }
+
+  const tags = (await collectCloudFilesSearchTags()).join(',');
+
+  const resp = await axios.default.get(
+    `${DBGATE_CLOUD_URL}/premium-promo-widget?identifier=${promoWidgetData?.identifier ?? 'empty'}&tags=${tags}`,
+    {
+      headers: {
+        ...(await getCloudInstanceHeaders()),
+        'x-app-version': currentVersion.version,
+      },
+    }
+  );
+
+  if (!resp.data || resp.data?.state == 'unchanged') {
+    return;
+  }
+
+  promoWidgetData = resp.data;
+  await fs.writeFile(path.join(datadir(), 'promo-widget.json'), JSON.stringify(promoWidgetData, null, 2));
+
+  socket.emitChanged(`promo-widget-changed`);
+}
+
 async function refreshPublicFiles(isRefresh) {
   if (!cloudFiles) {
     await loadCloudFiles();
@@ -268,6 +299,9 @@ async function refreshPublicFiles(isRefresh) {
   } catch (err) {
     logger.error(extractErrorLogData(err), 'DBGM-00166 Error updating cloud files');
   }
+  if (!isProApp()) {
+    await updatePremiumPromoWidget();
+  }
 }
 
 async function callCloudApiGet(endpoint, signinHolder = null, additionalHeaders = {}) {
@@ -432,6 +466,10 @@ async function getPublicIpInfo() {
   }
 }
 
+function getPromoWidgetData() {
+  return promoWidgetData;
+}
+
 module.exports = {
   createDbGateIdentitySession,
   startCloudTokenChecking,
@@ -449,4 +487,5 @@ module.exports = {
   readCloudTokenHolder,
   readCloudTestTokenHolder,
   getPublicIpInfo,
+  getPromoWidgetData,
 };

packages/web/src/stores.ts

@@ -183,6 +183,7 @@ export const focusedConnectionOrDatabase = writable<{ conid: string; database?:
 export const focusedTreeDbKey = writable<{ key: string; root: string; type: string; text: string }>(null);
 
 export const cloudSigninTokenHolder = writableSettingsValue(null, 'cloudSigninTokenHolder');
+export const seenPremiumPromoWidget = writableWithStorage(null, 'seenPremiumPromoWidget');
 
 export const cloudConnectionsStore = writable({});
 

packages/web/src/utility/metadataLoaders.ts

@@ -183,12 +183,16 @@ const cloudContentListLoader = () => ({
   params: {},
   reloadTrigger: { key: `cloud-content-changed` },
 });
-
 const teamFilesLoader = () => ({
   url: 'team-files/list',
   params: {},
   reloadTrigger: { key: `team-files-changed` },
 });
+const promoWidgetLoader = () => ({
+  url: 'cloud/premium-promo-widget',
+  params: {},
+  reloadTrigger: { key: `promo-widget-changed` },
+});
 
 async function getCore(loader, args) {
   const { url, params, reloadTrigger, transform, onLoaded, errorValue } = loader(args);
@@ -536,3 +540,10 @@ export function getTeamFiles(args) {
 export function useTeamFiles(args) {
   return useCore(teamFilesLoader, args);
 }
+
+export function getPromoWidget(args) {
+  return getCore(promoWidgetLoader, args);
+}
+export function usePromoWidget(args) {
+  return useCore(promoWidgetLoader, args);
+}

packages/web/src/widgets/AdminPremiumPromoWidget.svelte

@@ -1,59 +1,15 @@
-<script lang='ts'>
+<script lang="ts">
   import JsonUiContentRenderer from '../jsonui/JsonUiContentRenderer.svelte';
-  import { JsonUiBlock } from '../jsonui/jsonuitypes';
+  import { usePromoWidget } from '../utility/metadataLoaders';
   import WidgetsInnerContainer from './WidgetsInnerContainer.svelte';
 
-  const data: JsonUiBlock[] = [
+  const promoWidget = usePromoWidget({});
-    { type: 'heading', text: 'Try DbGate Premium' },
-    { type: 'text', text: 'Upgrade to get exclusive features:' },
-    {
-      type: 'ticklist',
-      items: [
-        'Query designer',
-        'AI powered database chat',
-        'Unlimited DbGate Cloud storage',
-        'Shared cloud folders',
-        'Charts from query result',
-        'Compare database models',
-        'Synchronize database structure',
-        'Backup & restore database',
-        'Advanced ER diagram settings',
-        'Export database model',
-        'Firestore, libSQL, Turso, CosmosDB, Redshift support',
-        'Amazon and Azure identity providers',
-        'E-mail support',
-      ],
-    },
-
-    { type: 'heading', text: 'Download DbGate Premium' },
-    {
-      type: 'ticklist',
-      items: ['Free 30 day trial', 'DbGate Premium will reuse your connections and files from DbGate Community'],
-    },
-    { type: 'button', text: 'Download', link: 'https://www.dbgate.io/download' },
-
-    { type: 'heading', text: 'Purchase DbGate Premium' },
-    {
-      type: 'ticklist',
-      items: ['Use monthly or yearly subscription'],
-    },
-    { type: 'button', text: 'Purchase', link: 'https://www.dbgate.io/purchase/premium' },
-
-    { type: 'heading', text: 'Get PREMIUM license for free' },
-    {
-      type: 'text',
-      text: 'Your feedback is very valuable for us. We have time-limited offers available for users who provide feedback.',
-    },
-    {
-      type: 'button',
-      text: 'View current offer',
-      link: 'https://www.dbgate.io/review?utm_campaign=communityWidget',
-    },
-  ];
 </script>
 
 <WidgetsInnerContainer>
-  <JsonUiContentRenderer blocks={data} />
+  {#if $promoWidget?.state == 'data'}
+    <JsonUiContentRenderer blocks={$promoWidget?.blocks} />
+  {/if}
 </WidgetsInnerContainer>
 
 <style>

packages/web/src/widgets/WidgetIconPanel.svelte

@@ -10,6 +10,7 @@
     lockedDatabaseMode,
     getCurrentConfig,
     cloudSigninTokenHolder,
+    seenPremiumPromoWidget,
   } from '../stores';
   import mainMenuDefinition from '../../../../app/src/mainMenuDefinition';
   import hasPermission from '../utility/hasPermission';
@@ -20,11 +21,14 @@
   import { showModal } from '../modals/modalTools';
   import NewObjectModal from '../modals/NewObjectModal.svelte';
   import openNewTab from '../utility/openNewTab';
+  import { usePromoWidget } from '../utility/metadataLoaders';
 
   let domSettings;
   let domCloudAccount;
   let domMainMenu;
 
+  const promoWidget = usePromoWidget({});
+
   const widgets = [
     getCurrentConfig().storageDatabase && {
       icon: 'icon admin',
@@ -98,6 +102,10 @@
     } else {
       $selectedWidget = name;
       $visibleWidgetSideBar = true;
+
+      if (name == 'premium') {
+        $seenPremiumPromoWidget = $promoWidget?.identifier || '';
+      }
     }
   }
   //const handleChangeWidget= e => (selectedWidget.set(item.name))
@@ -169,7 +177,7 @@
   {/if}
   {#each widgets
     .filter(x => x && hasPermission(`widgets/${x.name}`))
-    .filter(x => !x.isPremiumPromo || !isProApp())
+    .filter(x => !x.isPremiumPromo || (!isProApp() && $promoWidget?.state == 'data'))
     // .filter(x => !x.isPremiumOnly || isProApp())
     .filter(x => x.name != 'cloud-private' || $cloudSigninTokenHolder) as item}
     <div
@@ -181,6 +189,9 @@
       <FontIcon icon={item.icon} title={item.title} />
       {#if item.isPremiumPromo}
         <div class="premium-promo">Premium</div>
+        {#if $promoWidget?.identifier != $seenPremiumPromoWidget}
+          <div class="premium-promo-not-seen">•</div>
+        {/if}
       {/if}
     </div>
   {/each}
@@ -262,4 +273,12 @@
     border-radius: 3px;
     bottom: 0;
   }
+
+  .premium-promo-not-seen {
+    position: absolute;
+    font-size: 16pt;
+    color: var(--theme-icon-yellow);
+    top: -5px;
+    right: 5px;
+  }
 </style>