refactor(controlhub): add controlhub demo mode

.github/workflows/common-config.yml

@@ -69,7 +69,7 @@ jobs:
       - run: yarn install --no-frozen-lockfile
 
       - name: Build
-        run: yarn ${{ inputs.PACKAGE_BUILD_SCRIPT }}
+        run: ${{ inputs.PACKAGE_BUILD_SCRIPT }}
 
       - name: Check if version has been updated
         id: check

.github/workflows/release-controlhub-demo.yml

@@ -0,0 +1,36 @@
+name: Update AdminConsole Frontend
+
+on:
+  workflow_dispatch:
+
+  pull_request:
+    types:
+      - opened
+    branches:
+      - 'main'
+      - 'bug/fix-0729_beta'
+    paths:
+      - 'apps/adminConsole/package.json'
+  push:
+    branches:
+      - 'main'
+      - 'chore/apps'
+    paths:
+      - 'apps/adminConsole/**'
+      - 'apps/common/**'
+      - .github/workflows/update-admin-console.yml
+      - .github/workflows/common-config.yml
+      - nginx.conf
+
+jobs:
+  call-nodes-ci:
+    uses: ./.github/workflows/common-config.yml
+    with:
+      NODE_VERSION: '16.14'
+      PACKAGE_NAME: controlhub-demo
+      PACKAGE_PATH: apps/adminConsole/package.json
+      DIR_PATH: apps/adminConsole
+      DOCKERFILE_PATH: Dockerfile-admin-console-client
+      PACKAGE_BUILD_SCRIPT: DEMO=true yarn build:console
+      DEFAULT_VERSION: latest
+    secrets: inherit

.github/workflows/update-admin-console.yml

@@ -3,14 +3,6 @@ name: Update AdminConsole Frontend
 on:
   workflow_dispatch:
 
-  pull_request:
-    types:
-      - opened
-    branches:
-      - 'main'
-      - 'bug/fix-0729_beta'
-    paths:
-      - 'apps/adminConsole/package.json'
   push:
     branches:
       - 'main'
@@ -31,6 +23,6 @@ jobs:
       PACKAGE_PATH: apps/adminConsole/package.json
       DIR_PATH: apps/adminConsole
       DOCKERFILE_PATH: Dockerfile-admin-console-client
-      PACKAGE_BUILD_SCRIPT: build:console
+      PACKAGE_BUILD_SCRIPT: yarn build:console
       DEFAULT_VERSION: latest
     secrets: inherit

.github/workflows/update-monitoring.yml

@@ -25,6 +25,6 @@ jobs:
       PACKAGE_PATH: apps/monitoring/package.json
       DIR_PATH: apps/monitoring
       DOCKERFILE_PATH: Dockerfile-monitoring-client
-      PACKAGE_BUILD_SCRIPT: build:monitoring
+      PACKAGE_BUILD_SCRIPT: yarn build:monitoring
       DEFAULT_VERSION: latest
     secrets: inherit

.github/workflows/update-server.yml

@@ -3,13 +3,6 @@ name: Update Server
 on:
   workflow_dispatch:
 
-  pull_request:
-    types:
-      - opened
-    branches:
-      - 'main'
-    paths:
-      - 'apps/server/package.json'
   push:
     branches:
       - 'main'

apps/adminConsole/quasar.config.js

@@ -58,7 +58,8 @@ module.exports = configure(function (ctx) {
 				LOGIN_USERNAME: process.env.LOGIN_USERNAME,
 				LOGIN_PASSWORD: process.env.LOGIN_PASSWORD,
 				AUTH_TOKEN: process.env.AUTH_TOKEN,
-				ACCOUNT: process.env.ACCOUNT
+				ACCOUNT: process.env.ACCOUNT,
+				DEMO: process.env.DEMO
 			},
 
 			// Add dependencies for transpiling with Babel (Array of string/regex)

apps/adminConsole/src/layouts/MainLayout.vue

@@ -25,6 +25,7 @@ import { onMounted, computed } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
 import { useSplitMenu } from '@packages/ui/src/stores/menu';
 import { useI18n } from 'vue-i18n';
+import { useAppDetailStore } from 'src/stores/AppDetail';
 import {
 	updateBreadcrumbs,
 	options,
@@ -34,26 +35,32 @@ import {
 	options3
 } from './breadcrumbs';
 const { t } = useI18n();
-
+const appDetailStore = useAppDetailStore();
 const splitMenu = useSplitMenu();
 
-const items = computed(() => [
-	{
-		key: 'terminus',
-		label: t('TERMINUS'),
-		children: options.value
-	},
-	{
-		key: 'resource',
-		label: t('RESOURCE'),
-		children: options2.value
-	},
-	{
-		key: 'middleware',
-		label: t('MIDDLEWARE'),
-		children: options3.value
-	}
-]);
+const items = computed(() => {
+	const item1 = [
+		{
+			key: 'terminus',
+			label: t('TERMINUS'),
+			children: options.value
+		},
+		{
+			key: 'resource',
+			label: t('RESOURCE'),
+			children: options2.value
+		}
+	];
+	const item2 = [
+		{
+			key: 'middleware',
+			label: t('MIDDLEWARE'),
+			children: options3.value
+		}
+	];
+
+	return appDetailStore.isDemo ? item1 : item1.concat(item2);
+});
 
 const optionsAll = [...options.value, ...options2.value, ...options3.value];
 

apps/adminConsole/src/layouts/breadcrumbs.ts

@@ -1,5 +1,6 @@
 import { ref, computed } from 'vue';
 import { t } from 'src/boot/i18n';
+import { useAppDetailStore } from 'src/stores/AppDetail';
 export interface Breadcrumb {
 	title: string;
 	icon?: string;
@@ -83,11 +84,13 @@ export const options3 = computed(() => [
 	}
 ]);
 
-const optionAll = computed(() => [
-	...options.value,
-	...options2.value,
-	...options3.value
-]);
+const optionAll = computed(() => {
+	const appDetailsStore = useAppDetailStore();
+
+	return appDetailsStore.isDemo
+		? [...options.value, ...options2.value]
+		: [...options.value, ...options2.value, ...options3.value];
+});
 export const active = ref(optionAll.value[0].key);
 export const currentItem = computed(() =>
 	optionAll.value.find((item) => item.key === active.value)

apps/adminConsole/src/pages/ApplicationSpaces/Configurations/Configmaps.vue

@@ -2,7 +2,7 @@
 	<MyContentPage>
 		<template #extra>
 			<div class="col-auto">
-				<QButtonStyle>
+				<QButtonStyle v-permission>
 					<q-btn dense flat icon="sym_r_edit_square" @click="clickHandler">
 						<q-tooltip>
 							<div style="white-space: nowrap">

apps/adminConsole/src/pages/ApplicationSpaces/Configurations/Secrets.vue

@@ -2,7 +2,7 @@
 	<MyContentPage>
 		<template #extra>
 			<div class="col-auto">
-				<QButtonStyle>
+				<QButtonStyle v-permission>
 					<q-btn dense flat icon="sym_r_edit_square" @click="clickHandler">
 						<q-tooltip>
 							<div style="white-space: nowrap">

apps/adminConsole/src/pages/ApplicationSpaces/Configurations/ServiceAccounts.vue

@@ -2,7 +2,7 @@
 	<MyContentPage>
 		<template #extra>
 			<div class="col-auto">
-				<QButtonStyle>
+				<QButtonStyle v-permission>
 					<q-btn dense flat icon="sym_r_edit_square" @click="clickHandler">
 						<q-tooltip>
 							<div style="white-space: nowrap">

apps/adminConsole/src/pages/ApplicationSpaces/Services/Detail.vue

@@ -3,7 +3,7 @@
 		<MyContentPage>
 			<template #extra>
 				<div class="col-auto">
-					<QButtonStyle>
+					<QButtonStyle v-permission>
 						<q-btn dense flat icon="sym_r_edit_square" @click="clickHandler">
 							<q-tooltip>
 								<div style="white-space: nowrap">
@@ -12,7 +12,7 @@
 							</q-tooltip>
 						</q-btn>
 					</QButtonStyle>
-					<QButtonStyle>
+					<QButtonStyle v-permission>
 						<q-btn dense flat icon="sym_r_edit_square" @click="clickHandler2">
 							<q-tooltip>
 								<div style="white-space: nowrap">

apps/adminConsole/src/pages/ApplicationSpaces/Workloads/Detail.vue

@@ -11,7 +11,11 @@
 						</q-tooltip>
 					</q-btn>
 				</QButtonStyle>
-				<MoreSelection :options="options" size="md"></MoreSelection>
+				<MoreSelection
+					:options="options"
+					size="md"
+					v-permission
+				></MoreSelection>
 			</div>
 		</template>
 		<EnvironmentVariables ref="envRef"> </EnvironmentVariables>

apps/adminConsole/src/pages/Customresources/Detail.vue

@@ -170,7 +170,10 @@ const columns: any = computed(() => {
 			label: t('CREATED_TIME'),
 			align: 'left',
 			field: 'createTime'
-		},
+		}
+	];
+
+	const data2 = [
 		{
 			name: 'Operations',
 			label: t('OPERATIONS'),
@@ -181,7 +184,7 @@ const columns: any = computed(() => {
 	if (module === 'applications') {
 		data.splice(1, 1);
 	}
-	return data;
+	return appDetailStore.isDemo ? data : data.concat(data2);
 });
 
 const currentYamlData = ref<any>({});

apps/adminConsole/src/pages/Jobs/CronJobsDetails.vue

@@ -1,7 +1,7 @@
 <template>
 	<MyContentPage>
 		<template #extra>
-			<div class="col-auto">
+			<div class="col-auto" v-permission>
 				<QButtonStyle v-for="item in options" :key="item.value">
 					<q-btn dense flat :icon="item.icon" @click="item.onClick">
 						<q-tooltip>

apps/adminConsole/src/pages/Jobs/JobsDetails.vue

@@ -2,7 +2,7 @@
 	<div class="absolute-position">
 		<MyContentPage>
 			<template #extra>
-				<div class="col-auto">
+				<div class="col-auto" v-permission>
 					<QButtonStyle v-for="item in options" :key="item.value">
 						<q-btn dense flat :icon="item.icon" @click="item.onClick">
 							<q-tooltip>

apps/adminConsole/src/pages/NetworkPolicies/PoliciesDetail.vue

@@ -2,7 +2,7 @@
 	<MyContentPage>
 		<template #extra>
 			<div class="col-auto">
-				<QButtonStyle>
+				<QButtonStyle v-permission>
 					<q-btn dense flat icon="sym_r_edit_square" @click="clickHandler">
 						<q-tooltip>
 							<div style="white-space: nowrap">