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:


### _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)
}
})