From b17c88261251bea67b4cbb761110afd894944fb7 Mon Sep 17 00:00:00 2001
From: Cheng Pan <chengpan@apache.org>
Date: Fri, 3 Nov 2023 21:45:08 +0800
Subject: [PATCH] [KYUUBI #5620] [UI] Remove dummy information card from
 Overview page

### _Why are the changes needed?_

<img width="1345" alt="image" src="https://github.com/apache/kyuubi/assets/26535726/3c566b65-0403-493c-9e83-dd4d14587557">

### _How was this patch tested?_
- [ ] Add some test cases that check the changes thoroughly including negative and positive cases if possible

- [ ] Add screenshots for manual tests if appropriate

<img width="1350" alt="image" src="https://github.com/apache/kyuubi/assets/26535726/dba98f70-1a07-4458-99ad-e5037d9bac46">

- [ ] [Run test](https://kyuubi.readthedocs.io/en/master/contributing/code/testing.html#running-tests) locally before make a pull request

### _Was this patch authored or co-authored using generative AI tooling?_

No

Closes #5620 from pan3793/ui-overview.

Closes #5620

50cface35 [Cheng Pan] fix
44815e294 [Cheng Pan] [UI] Remove dummy information card from Overview page

Authored-by: Cheng Pan <chengpan@apache.org>
Signed-off-by: Cheng Pan <chengpan@apache.org>
---
 kyuubi-server/web-ui/.env                       | 16 ++++++++++++++++
 .../src/layout/components/aside/index.vue       |  8 ++------
 .../src/test/unit/views/layout/aside.spec.ts    |  6 +-----
 .../web-ui/src/views/overview/index.vue         | 17 ++---------------
 kyuubi-server/web-ui/vite.config.ts             |  3 ---
 kyuubi-server/web-ui/vitest.config.ts           |  3 ---
 6 files changed, 21 insertions(+), 32 deletions(-)
 create mode 100644 kyuubi-server/web-ui/.env

diff --git a/kyuubi-server/web-ui/.env b/kyuubi-server/web-ui/.env
new file mode 100644
index 000000000..fb092780f
--- /dev/null
+++ b/kyuubi-server/web-ui/.env
@@ -0,0 +1,16 @@
+ # Licensed to the Apache Software Foundation (ASF) under one or more
+ # contributor license agreements.  See the NOTICE file distributed with
+ # this work for additional information regarding copyright ownership.
+ # The ASF licenses this file to You under the Apache License, Version 2.0
+ # (the "License"); you may not use this file except in compliance with
+ # the License.  You may obtain a copy of the License at
+ #
+ #     http://www.apache.org/licenses/LICENSE-2.0
+ #
+ # Unless required by applicable law or agreed to in writing, software
+ # distributed under the License is distributed on an "AS IS" BASIS,
+ # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ # See the License for the specific language governing permissions and
+ # limitations under the License.
+
+VITE_APP_VERSION=$npm_package_version
diff --git a/kyuubi-server/web-ui/src/layout/components/aside/index.vue b/kyuubi-server/web-ui/src/layout/components/aside/index.vue
index 4d82c6144..78cbbc774 100644
--- a/kyuubi-server/web-ui/src/layout/components/aside/index.vue
+++ b/kyuubi-server/web-ui/src/layout/components/aside/index.vue
@@ -20,7 +20,7 @@
   <header>
     <img v-if="!isCollapse" src="@/assets/kyuubi-logo.svg" />
     <img v-else class="collapsed-logo" src="@/assets/kyuubi.png" />
-    <pre v-if="!isCollapse">{{ title }}</pre>
+    <pre v-if="!isCollapse">{{ version }}</pre>
   </header>
   <c-menu :is-collapse="isCollapse" :active-path="activePath" :menus="menus" />
 </template>
@@ -38,11 +38,7 @@
   const { isCollapse } = storeToRefs(store)
   const router = useRoute()
   const activePath = ref(router.path)
-  /* eslint-disable */
-  // define __APP_VERSION__ in vite.config.ts
-  // @ts-ignore
-  const title = `${__APP_VERSION__}`
-  /* eslint-enable */
+  const version = import.meta.env.VITE_APP_VERSION
 </script>
 
 <style lang="scss" scoped>
diff --git a/kyuubi-server/web-ui/src/test/unit/views/layout/aside.spec.ts b/kyuubi-server/web-ui/src/test/unit/views/layout/aside.spec.ts
index ec6206e16..95a4fe0eb 100644
--- a/kyuubi-server/web-ui/src/test/unit/views/layout/aside.spec.ts
+++ b/kyuubi-server/web-ui/src/test/unit/views/layout/aside.spec.ts
@@ -35,9 +35,5 @@ test('mount component', () => {
     }
   })
   expect(wrapper.text())
-    /* eslint-disable */
-    // define __APP_VERSION__ in vitest.config.ts
-    // @ts-ignore
-    .toContain(`${__APP_VERSION__}`)
-  /* eslint-enable */
+    .toContain(import.meta.env.VITE_APP_VERSION)
 })
diff --git a/kyuubi-server/web-ui/src/views/overview/index.vue b/kyuubi-server/web-ui/src/views/overview/index.vue
index 3a2334c8e..a363d0e95 100644
--- a/kyuubi-server/web-ui/src/views/overview/index.vue
+++ b/kyuubi-server/web-ui/src/views/overview/index.vue
@@ -20,7 +20,7 @@
   <main>
     <el-row :gutter="12">
       <el-col v-for="(card, index) in cards" :key="index" :md="8">
-        <c-card :title="card.title" :value="card.value" />
+        <c-card />
       </el-col>
     </el-row>
   </main>
@@ -30,20 +30,7 @@
   import { reactive } from 'vue'
   import cCard from '@/components/card/index.vue'
 
-  const cards = reactive([
-    {
-      title: 'Opened Session',
-      value: 1
-    },
-    {
-      title: 'ExecPool Size',
-      value: 2
-    },
-    {
-      title: 'ExecPool ActiveCount',
-      value: 3
-    }
-  ])
+  const cards = reactive([])
 </script>
 
 <style scoped></style>
diff --git a/kyuubi-server/web-ui/vite.config.ts b/kyuubi-server/web-ui/vite.config.ts
index 9470319f3..b6786a0c1 100644
--- a/kyuubi-server/web-ui/vite.config.ts
+++ b/kyuubi-server/web-ui/vite.config.ts
@@ -44,9 +44,6 @@ export default defineConfig(({ mode }) => {
           changeOrigin: true
         }
       }
-    },
-    define: {
-      __APP_VERSION__: JSON.stringify(require('./package.json').version)
     }
   }
 })
diff --git a/kyuubi-server/web-ui/vitest.config.ts b/kyuubi-server/web-ui/vitest.config.ts
index e79ecf164..11955299c 100644
--- a/kyuubi-server/web-ui/vitest.config.ts
+++ b/kyuubi-server/web-ui/vitest.config.ts
@@ -39,8 +39,5 @@ export default defineConfig({
   test: {
     globals: true,
     environment: 'jsdom'
-  },
-  define: {
-    __APP_VERSION__: JSON.stringify(require('./package.json').version)
   }
 })