ui: beta flag

apps/ui/src/lib/components/Beta.svelte

@@ -0,0 +1 @@
+<span class="badge bg-coollabs-gradient rounded text-white font-normal"> BETA </span>

apps/ui/src/lib/components/Setting.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import Beta from './Beta.svelte';
 	import Explaner from './Explainer.svelte';
 	import Tooltip from './Tooltip.svelte';
 
@@ -6,6 +7,7 @@
 	export let customClass: any = null;
 	export let setting: any;
 	export let title: any;
+	export let isBeta: any = false;
 	export let description: any;
 	export let isCenter = true;
 	export let disabled = false;
@@ -19,6 +21,9 @@
 		<!-- svelte-ignore a11y-label-has-associated-control -->
 		<label>
 			{title}
+			{#if isBeta}
+				<Beta />
+			{/if}
 			{#if description && description !== ''}
 				<Explaner explanation={description} />
 			{/if}

apps/ui/src/lib/components/Usage.svelte

@@ -27,6 +27,7 @@
 	import { onDestroy, onMount } from 'svelte';
 	import { get, post } from '$lib/api';
 	import { errorNotification } from '$lib/common';
+	import Beta from './Beta.svelte';
 	async function getStatus() {
 		if (loading.usage) return;
 		loading.usage = true;
@@ -78,7 +79,7 @@
 			<h1 class="font-bold text-lg lg:text-xl truncate">
 				{server.name}
 				{#if server.remoteEngine}
-					<span class="badge bg-coollabs-gradient rounded text-white"> BETA </span>
+					<Beta />
 				{/if}
 			</h1>
 			<div class="text-xs">

apps/ui/src/routes/settings/certificates.svelte

@@ -20,6 +20,7 @@
 	export let certificates: any;
 	import { del, post } from '$lib/api';
 	import { errorNotification } from '$lib/common';
+	import Beta from '$lib/components/Beta.svelte';
 
 	let loading = {
 		save: false
@@ -57,7 +58,7 @@
 
 <div class="mx-auto w-full">
 	<div class="flex border-b border-coolgray-500 mb-6">
-			<div class="title font-bold pb-3 pr-4">SSL Certificates <span class="badge rounded bg-coollabs-gradient text-white">BETA</span></div>
+		<div class="title font-bold pb-3 pr-4">SSL Certificates <Beta /></div>
 		<label for="my-modal" class="btn btn-sm btn-primary" on:click={() => (isModalActive = true)}
 			>Add SSL Certificate</label
 		>

apps/ui/src/routes/sources/[id]/_Github.svelte

@@ -152,6 +152,7 @@
 				/>
 				<Setting
 					customClass="pt-4"
+					isBeta={true}
 					id="autodeploy"
 					isCenter={false}
 					bind:setting={source.isSystemWide}
@@ -238,6 +239,7 @@
 				/>
 				<Setting
 					customClass="pt-4"
+					isBeta={true}
 					id="autodeploy"
 					isCenter={false}
 					disabled={$appSession.teamId !== '0'}