dennii/dbgate
1
0
Fork 0
mirror of https://github.com/DeNNiiInc/dbgate.git synced 2026-04-25 01:45:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

dynamic promo widget

Browse Source
This commit is contained in:
SPRINX0\prochazka
2025-10-17 14:04:08 +02:00
parent a98c953876
commit 1fa4216b18
7 changed files with 146 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
packages/web/src/jsonui/JsonUiContentRenderer.svelte Normal file
View File

@@ -0,0 +1,22 @@
<script lang="ts">
import JsonUiHeading from './JsonUiHeading.svelte';
import JsonUiLinkButton from './JsonUiLinkButton.svelte';
import JsonUiTextBlock from './JsonUiTextBlock.svelte';
import JsonUiTickList from './JsonUiTickList.svelte';
import { JsonUiBlock } from './jsonuitypes';
export let blocks: JsonUiBlock[] = [];
const componentMap = {
text: JsonUiTextBlock,
heading: JsonUiHeading,
ticklist: JsonUiTickList,
button: JsonUiLinkButton,
} as const;
</script>
{#each blocks as block, i}
{#if block.type in componentMap}
<svelte:component this={componentMap[block.type]} {...block} />
{/if}
{/each}

13
packages/web/src/jsonui/JsonUiHeading.svelte Normal file
View File

@@ -0,0 +1,13 @@
<script lang="ts">
export let text: string;
export let level: 1|2|3|4|5|6 = 2;
const tag = `h${level}` as keyof HTMLElementTagNameMap;
</script>
<svelte:element this={tag}>{text}</svelte:element>
<style>
h2 {
text-align: center;
}
</style>

21
packages/web/src/jsonui/JsonUiLinkButton.svelte Normal file
View File

@@ -0,0 +1,21 @@
<script lang="ts">
import FormStyledButton from '../buttons/FormStyledButton.svelte';
import { openWebLink } from '../utility/simpleTools';
export let text: string;
export let link: string;
export let newTab: boolean = true;
// very light url guard
const safe = /^(https?:)?\/\//i.test(link) || link.startsWith('/');
</script>
<div class="center">
<FormStyledButton on:click={() => openWebLink(link)} value={text} skipWidth />
</div>
<style>
.center {
text-align: center;
}
</style>

11
packages/web/src/jsonui/JsonUiTextBlock.svelte Normal file
View File

@@ -0,0 +1,11 @@
<script lang="ts">
export let text: string;
</script>
<p>{text}</p>
<style>
p {
margin: 10px;
}
</style>

22
packages/web/src/jsonui/JsonUiTickList.svelte Normal file
View File

@@ -0,0 +1,22 @@
<script lang="ts">
export let items: string[] = [];
</script>
<ul class="ticklist">
{#each items as item}
<li>{item}</li>
{/each}
</ul>
<style>
.ticklist {
margin: 10px;
padding: 0;
list-style: none;
padding-left: 0;
}
.ticklist li::before {
content: '✔︎ ';
color: var(--theme-icon-green);
}
</style>

5
packages/web/src/jsonui/jsonuitypes.ts Normal file
View File

@@ -0,0 +1,5 @@
export type JsonUiBlock =
| { type: 'text'; text: string }
| { type: 'heading'; text: string; level?: 1|2|3|4|5|6 }
| { type: 'ticklist'; items: string[] }
| { type: 'button'; text: string; link: string; newTab?: boolean };

100
packages/web/src/widgets/AdminPremiumPromoWidget.svelte
View File

@@ -1,55 +1,59 @@
<script>
import FormStyledButton from '../buttons/FormStyledButton.svelte';
import { openWebLink } from '../utility/simpleTools';
<script lang='ts'>
import JsonUiContentRenderer from '../jsonui/JsonUiContentRenderer.svelte';
import { JsonUiBlock } from '../jsonui/jsonuitypes';
import WidgetsInnerContainer from './WidgetsInnerContainer.svelte';
const data: JsonUiBlock[] = [
{ 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>
<h2>Try DbGate Premium</h2>
<p>Upgrade to get exclusive features:</p>
<ul>
<li>Query designer</li>
<li>AI powered database chat</li>
<li>Unlimited DbGate Cloud storage</li>
<li>Shared cloud folders</li>
<li>Charts from query result</li>
<li>Compare database models</li>
<li>Synchronize database structure</li>
<li>Backup &amp; restore database</li>
<li>Advanced ER diagram settings</li>
<li>Export database model</li>
<li>Firestore, libSQL, Turso, CosmosDB, Redshift support</li>
<li>Amazon and Azure identity providers</li>
<li>E-mail support</li>
</ul>
<h2>Download DbGate Premium</h2>
<ul>
<li>Free 30 day trial</li>
<li>DbGate Premium will reuse your connections and files from DbGate Community</li>
</ul>
<div class="center">
<FormStyledButton on:click={() => openWebLink('https://www.dbgate.io/download')} value="Download" />
</div>
<h2>Purchase DbGate Premium</h2>
<ul>
<li>Use monthly or yearly subscription</li>
</ul>
<div class="center">
<FormStyledButton on:click={() => openWebLink('https://www.dbgate.io/purchase/premium')} value="Purchase" />
</div>
<h2>Get PREMIUM license for free</h2>
<p>Your feedback is very valuable for us. We have time-limited offers available for users who provide feedback.</p>
<div class="center">
<FormStyledButton on:click={() => openWebLink('https://www.dbgate.io/review?utm_campaign=communityWidget')} value="View current offer" skipWidth />
</div>
<JsonUiContentRenderer blocks={data} />
</WidgetsInnerContainer>
<style>