This is an automated email from the ASF dual-hosted git repository.

chengpan pushed a commit to branch branch-1.8
in repository https://gitbox.apache.org/repos/asf/kyuubi.git


The following commit(s) were added to refs/heads/branch-1.8 by this push:
     new ba1944388 [KYUUBI #5586][UI] Kyuubi Web UI show current version
ba1944388 is described below

commit ba1944388916ba837a06b7a750e55280a8ab47f3
Author: zwangsheng <[email protected]>
AuthorDate: Wed Nov 1 22:38:14 2023 +0800

    [KYUUBI #5586][UI] Kyuubi Web UI show current version
    
    ### _Why are the changes needed?_
    
    As title, let kyuubi web ui header show current version.
    
    ### _How was this patch tested?_
    - [x] Add some test cases that check the changes thoroughly including 
negative and positive cases if possible
    
    - [ ] Add screenshots for manual tests if appropriate
    
    - [ ] [Run 
test](https://kyuubi.readthedocs.io/en/master/contributing/code/testing.html#running-tests)
 locally before make a pull request
    
    npm run dev:
    ![截屏2023-11-01 10 08 
56](https://github.com/apache/kyuubi/assets/52876270/98f8b2c8-1e52-4f5e-abe6-3c548d39f685)
    ![截屏2023-11-01 10 09 
00](https://github.com/apache/kyuubi/assets/52876270/c0c8b4b6-1009-476a-bf20-316804928bd3)
    
    ### _Was this patch authored or co-authored using generative AI tooling?_
    
    No
    
    Closes #5587 from zwangsheng/KYUUBI#5586.
    
    Closes #5586
    
    0664a65db [zwangsheng] fix comments
    5d1705c4f [zwangsheng] fix unit test
    ad6e3424e [zwangsheng] fix unit test
    0c9ee1c99 [zwangsheng] fix license
    5a4dbb1ca [zwangsheng] fix comments
    56ee0dfa3 [zwangsheng] fix comments
    d4ee121c5 [zwangsheng] remove test changes
    b6523f02d [zwangsheng] fix unit test
    b932c4e51 [zwangsheng] remove test changes
    36f721e5e [zwangsheng] remove test changes
    9c466d38b [zwangsheng] [KYUUBI apache#5586][Improvement][UI] Kyuubi Web UI 
show current version
    
    Authored-by: zwangsheng <[email protected]>
    Signed-off-by: Cheng Pan <[email protected]>
    (cherry picked from commit 444ff4649e842e4e5f9da1271d64819b98307d20)
    Signed-off-by: Cheng Pan <[email protected]>
---
 kyuubi-server/web-ui/src/assets/kyuubi-logo.svg    | 126 +++++++++++++++++++++
 .../web-ui/src/layout/components/aside/index.vue   |  32 ++++--
 .../src/test/unit/views/layout/aside.spec.ts       |   7 +-
 kyuubi-server/web-ui/vite.config.ts                |   3 +
 kyuubi-server/web-ui/vitest.config.ts              |   3 +
 5 files changed, 159 insertions(+), 12 deletions(-)

diff --git a/kyuubi-server/web-ui/src/assets/kyuubi-logo.svg 
b/kyuubi-server/web-ui/src/assets/kyuubi-logo.svg
new file mode 100644
index 000000000..682bc80e7
--- /dev/null
+++ b/kyuubi-server/web-ui/src/assets/kyuubi-logo.svg
@@ -0,0 +1,126 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!--
+* 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.
+-->
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/";
+   xmlns:cc="http://creativecommons.org/ns#";
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#";
+   xmlns:svg="http://www.w3.org/2000/svg";
+   xmlns="http://www.w3.org/2000/svg";
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd";
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape";
+   version="1.1"
+   id="图层_1"
+   x="0px"
+   y="0px"
+   viewBox="0 0 1890.599 571.65601"
+   xml:space="preserve"
+   sodipodi:docname="apache kyuubi - 副本.svg"
+   width="1890.599"
+   height="571.65601"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)"><metadata
+   id="metadata45"><rdf:RDF><cc:Work
+       rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+         rdf:resource="http://purl.org/dc/dcmitype/StillImage"; 
/><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+   id="defs43" /><sodipodi:namedview
+   pagecolor="#ffffff"
+   bordercolor="#666666"
+   borderopacity="1"
+   objecttolerance="10"
+   gridtolerance="10"
+   guidetolerance="10"
+   inkscape:pageopacity="0"
+   inkscape:pageshadow="2"
+   inkscape:window-width="1920"
+   inkscape:window-height="986"
+   id="namedview41"
+   showgrid="false"
+   fit-margin-top="0"
+   fit-margin-left="0"
+   fit-margin-right="0"
+   fit-margin-bottom="0"
+   inkscape:zoom="0.504"
+   inkscape:cx="953.099"
+   inkscape:cy="442.484"
+   inkscape:window-x="-11"
+   inkscape:window-y="1609"
+   inkscape:window-maximized="1"
+   inkscape:current-layer="图层_1" />
+<polygon
+   style="fill:#999999"
+   points="320.183,1034.416 219.362,1034.416 195.906,940.811 153.818,973.73 
138.366,1034.416 46.901,1034.416 128.97,712.098 220.429,712.098 178.073,878.475 
264.658,800.926 374.8,800.926 270.212,882.717 "
+   id="polygon10"
+   transform="translate(-46.901,-557.516)" />
+<path
+   style="fill:#999999"
+   d="m 332.746,243.407 h 94.416 l 8.58,155.433 84.312,-155.433 h 88.171 L 
452.068,492.886 c -17.794,28.452 -33.457,47.671 -46.98,57.65 -19.117,14.081 
-44.577,21.12 -76.366,21.12 -12.896,0 -32.366,-1.764 -58.431,-5.28 l 
8.865,-62.432 c 11.851,4.093 25.67,6.154 41.494,6.154 10.543,0 19.688,-2.427 
27.44,-7.268 7.746,-4.84 15.475,-13.506 23.193,-25.972 z"
+   id="path12" />
+<path
+   style="fill:#999999"
+   d="m 811.078,476.899 h -83.549 l 9.631,-37.818 c -16.412,15.539 
-31.801,26.602 -46.158,33.195 -14.362,6.599 -30.774,9.897 -49.24,9.897 
-24.626,0 -42.059,-7.364 -52.306,-22.09 -10.246,-14.734 -11.474,-37.414 
-3.67,-68.05 l 37.841,-148.622 h 89.924 l -32.692,128.391 c -3.733,14.66 
-3.676,25.066 0.183,31.225 3.859,6.154 10.692,9.236 20.516,9.236 10.697,0 
20.499,-4.104 29.409,-12.313 8.904,-8.209 16.063,-22.941 21.475,-44.199 L 
781.046,243.41 h 89.485 z"
+   id="path14" />
+<path
+   style="fill:#999999"
+   d="m 1102.399,476.899 h -83.548 l 9.63,-37.818 c -16.412,15.539 
-31.801,26.602 -46.157,33.195 -14.362,6.599 -30.774,9.897 -49.24,9.897 
-24.626,0 -42.059,-7.364 -52.306,-22.09 -10.246,-14.734 -11.474,-37.414 
-3.67,-68.05 l 37.841,-148.622 h 89.924 l -32.692,128.392 c -3.733,14.66 
-3.676,25.066 0.183,31.225 3.859,6.154 10.691,9.236 20.516,9.236 10.698,0 
20.498,-4.104 29.41,-12.313 8.904,-8.209 16.063,-22.941 21.474,-44.199 l 
28.605,-112.341 h 89.485 z"
+   id="path16" />
+<path
+   style="fill:#999999"
+   d="m 1230.208,154.585 h 90.364 l -28.44,111.685 c 11.325,-9.379 
23.268,-16.412 35.82,-21.104 12.552,-4.693 25.721,-7.04 39.502,-7.04 28.433,0 
49.354,10.229 62.763,30.671 13.403,20.448 15.241,49.806 5.503,88.058 
-6.497,25.505 -16.469,47.962 -29.918,67.387 -13.443,19.42 -28.895,33.931 
-46.368,43.533 -17.463,9.595 -35.364,14.396 -53.682,14.396 -15.686,0 
-29.193,-3.374 -40.512,-10.109 -8.483,-5.28 -16.663,-15.174 -24.547,-29.685 l 
-8.791,34.519 h -83.764 z m 37.527,204.907 c -5.115,20.088 [...]
+   id="path18" />
+<polygon
+   style="fill:#999999"
+   points="1578.705,1034.413 1489.221,1034.413 1548.673,800.923 
1638.157,800.923 "
+   id="polygon20"
+   transform="translate(-46.901,-557.516)" />
+<path
+   style="fill:#e7211a"
+   d="m 1890.599,170.392 c -8.637,2.205 -17.685,3.38 -27.001,3.38 -46.443,0 
-86.105,-29.021 -101.849,-69.915 l -0.109,-0.212 c -0.514,-1.222 -0.667,-2.58 
-0.799,-3.984 -0.542,-5.578 2.146,-9.658 8.015,-10.259 1.245,-0.112 
2.506,-0.169 3.779,-0.169 14.585,0 27.44,7.392 35.032,18.631 v -0.537 c 
-27.977,-47.78 -79.854,-79.871 -139.222,-79.871 -5.245,0 -10.435,0.251 
-15.555,0.742 l 0.491,-0.514 c 7.586,-6.769 17.599,-10.885 28.565,-10.885 
6.553,0 12.763,1.473 18.318,4.099 l -5.343,-2.888 C 1 [...]
+   id="path22" />
+<path
+   style="fill:#e7211a"
+   d="m 1682.823,201.459 c -30.928,-14.242 -53.151,-6.839 -53.151,-6.839 
12.73,-42.206 53.151,6.839 53.151,6.839"
+   id="path24" />
+<g
+   id="g38"
+   transform="translate(-46.901,-557.516)">
+       <path
+   style="fill:#999999"
+   d="m 321.269,711.254 -49.792,70.424 h 19.171 l 9.572,-14.271 h 23.731 l 
0.312,14.271 h 17.906 l -3.289,-70.424 z m 2.007,39.909 h -11.79 l 
11.322,-16.451 z"
+   id="path26" />
+       <path
+   style="fill:#999999"
+   d="m 432.454,711.254 h -41.118 l -22.672,70.513 h 17.415 l 7.336,-22.822 h 
25.08 c 2.921,0 5.814,-1.104 8.596,-3.272 2.654,-2.074 4.504,-4.688 
5.508,-7.776 l 6.478,-20.169 c 1.115,-3.445 1.7,-5.959 1.784,-7.682 
0.106,-1.968 -0.279,-3.646 -1.137,-4.973 -1.578,-2.497 -4.093,-3.819 
-7.27,-3.819 z m -10.057,16.245 -4.889,15.202 h -18.87 l 4.889,-15.202 z"
+   id="path28" />
+       <path
+   style="fill:#999999"
+   d="m 494.51,711.254 -49.792,70.424 h 19.171 l 9.572,-14.271 h 23.731 l 
0.312,14.271 h 17.906 l -3.289,-70.424 z m 2.007,39.909 h -11.79 l 
11.322,-16.451 z"
+   id="path30" />
+       <path
+   style="fill:#999999"
+   d="m 561.923,714.616 c -2.654,2.074 -4.504,4.688 -5.502,7.776 l 
-15.135,47.083 c -1.065,3.3 -0.842,6.177 0.669,8.557 v 0.006 c 1.583,2.492 
4.097,3.813 7.275,3.813 h 44.139 l 5.084,-15.821 h -38.487 l 12.498,-38.872 h 
38.492 l 5.084,-15.821 h -45.516 c -2.931,10e-4 -5.83,1.105 -8.601,3.279 z"
+   id="path32" />
+       <polygon
+   style="fill:#999999"
+   points="643.212,754.162 666.742,754.162 657.867,781.767 675.36,781.767 
698.032,711.254 680.539,711.254 671.965,737.912 648.435,737.912 657.009,711.254 
639.599,711.254 616.928,781.767 634.337,781.767 "
+   id="polygon34" />
+       <polygon
+   style="fill:#999999"
+   points="725.091,765.606 728.77,754.162 761.537,754.162 766.761,737.912 
733.994,737.912 737.344,727.499 773.874,727.499 779.097,711.254 725.158,711.254 
702.486,781.767 756.587,781.767 761.783,765.606 "
+   id="polygon36" />
+</g>
+</svg>
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 52304abff..33d794478 100644
--- a/kyuubi-server/web-ui/src/layout/components/aside/index.vue
+++ b/kyuubi-server/web-ui/src/layout/components/aside/index.vue
@@ -18,8 +18,9 @@
 
 <template>
   <header>
-    <img src="@/assets/kyuubi.png" />
-    <article v-if="!isCollapse">Apache Kyuubi Dashboard</article>
+    <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>
   </header>
   <c-menu :is-collapse="isCollapse" :active-path="activePath" :menus="menus" />
 </template>
@@ -37,6 +38,11 @@
   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 */
 </script>
 
 <style lang="scss" scoped>
@@ -49,19 +55,23 @@
     line-height: 64px;
     img {
       display: inline-block;
-      width: 32px;
-      height: 32px;
+      width: 140px;
+      height: 50px;
+      top: -10px;
       position: relative;
-      top: -4px;
       vertical-align: middle;
     }
-    article {
+    pre {
+      font-size: 10px;
       display: inline-block;
-      margin-left: 12px;
-      color: #fff;
-      font-weight: 600;
-      font-size: 14px;
-      font-family: 'Myriad Pro', 'Helvetica Neue', Arial, Helvetica, 
sans-serif;
+      width: 100px;
+      margin-top: 20px;
+      text-align: center;
+    }
+    .collapsed-logo {
+      width: 40px;
+      height: 40px;
+      margin-top: 30px;
     }
   }
   .el-menu {
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 3e31535ae..ec6206e16 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
@@ -34,5 +34,10 @@ test('mount component', () => {
       plugins: [mockRouter, getStore()]
     }
   })
-  expect(wrapper.text()).toContain('Apache Kyuubi Dashboard')
+  expect(wrapper.text())
+    /* eslint-disable */
+    // define __APP_VERSION__ in vitest.config.ts
+    // @ts-ignore
+    .toContain(`${__APP_VERSION__}`)
+  /* eslint-enable */
 })
diff --git a/kyuubi-server/web-ui/vite.config.ts 
b/kyuubi-server/web-ui/vite.config.ts
index b6786a0c1..9470319f3 100644
--- a/kyuubi-server/web-ui/vite.config.ts
+++ b/kyuubi-server/web-ui/vite.config.ts
@@ -44,6 +44,9 @@ 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 11955299c..e79ecf164 100644
--- a/kyuubi-server/web-ui/vitest.config.ts
+++ b/kyuubi-server/web-ui/vitest.config.ts
@@ -39,5 +39,8 @@ export default defineConfig({
   test: {
     globals: true,
     environment: 'jsdom'
+  },
+  define: {
+    __APP_VERSION__: JSON.stringify(require('./package.json').version)
   }
 })

Reply via email to