@appscode/design-system 2.17.73 → 2.17.75

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appscode/design-system",
-  "version": "2.17.73",
+  "version": "2.17.75",
   "description": "A design system for Appscode websites and dashboards made using Bulma",
   "main": "main.scss",
   "scripts": {

package/vue-components/v3/form-fields/Switch.vue

@@ -20,18 +20,26 @@ const model = defineModel({ type: Boolean });
 
 <template>
   <div class="ac-switch is-flex is-align-items-center gap-8" :class="modifierClasses">
-    <label :for="id">{{ label }}</label>
-    <label class="switch">
-      <input
-        v-model="model"
-        :id="id"
-        type="checkbox"
-        :name="name"
-        class="switch is-rounded is-primary"
-        :data-testid="dataTestId"
-      />
-      <span class="slider round"></span>
-    </label>
+    <div class="is-flex is-align-items-center gap-8">
+      <slot name="left" />
+      <label :for="id">{{ label }}</label>
+      <slot name="middle" />
+    </div>
+
+    <div class="is-flex is-align-items-center gap-8">
+      <label class="switch">
+        <input
+          v-model="model"
+          :id="id"
+          type="checkbox"
+          :name="name"
+          class="switch is-rounded is-primary"
+          :data-testid="dataTestId"
+        />
+        <span class="slider round"></span>
+      </label>
+      <slot name="right" />
+    </div>
 
     <p v-show="errorMsg" class="is-danger is-italic">
       {{ errorMsg }}

package/vue-components/v3/navbar/Appdrawer.vue

@@ -9,6 +9,7 @@ export interface Props {
   activeOrganization?: string;
   rootDomain?: string;
   activeOrgType?: number;
+  isOfflineInstaller?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -17,6 +18,7 @@ const props = withDefaults(defineProps<Props>(), {
   activeOrganization: "",
   rootDomain: "",
   activeOrgType: 0,
+  isOfflineInstaller: false,
 });
 
 const appList = [
@@ -116,8 +118,12 @@ const filteredAppList = appListWithUrl.filter((element) => {
   if (element.name === props.currentApp) return false;
 
   // remove billing selfhost & learn from selfhost mode
+  // but always keep billing when this is an offline installer
   const selfHostList = ["billing", "selfhost", "learn"];
-  if (isSelfHosted.value && selfHostList.includes(element.name)) return false;
+  if (isSelfHosted.value && selfHostList.includes(element.name)) {
+    if (element.name === "billing" && props.isOfflineInstaller) return true;
+    return false;
+  }
 
   return true;
 });