This is an automated email from the ASF dual-hosted git repository.
nicholasjiang pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-paimon-webui.git
The following commit(s) were added to refs/heads/main by this push:
new ef6f0b7 [Feature] Fetch metadata with getAllCatalogs API (#81)
ef6f0b7 is described below
commit ef6f0b765cda6b5c26347a4d754242f327b7bcf6
Author: xiaomo <wegi...@gmail.com>
AuthorDate: Fri Oct 27 19:06:07 2023 +0800
[Feature] Fetch metadata with getAllCatalogs API (#81)
---
.../metadata.ts => api/models/catalog/index.ts} | 18 ++++--
.../models/catalog/interface.ts} | 15 +++--
paimon-web-ui-new/src/api/request.ts | 3 +-
paimon-web-ui-new/src/router/modules/metadata.ts | 1 -
paimon-web-ui-new/src/store/catalog/index.ts | 67 ++++++++++++++++++++++
.../views/metadata/components/menu-tree/index.tsx | 41 +++++++------
6 files changed, 111 insertions(+), 34 deletions(-)
diff --git a/paimon-web-ui-new/src/router/modules/metadata.ts
b/paimon-web-ui-new/src/api/models/catalog/index.ts
similarity index 72%
copy from paimon-web-ui-new/src/router/modules/metadata.ts
copy to paimon-web-ui-new/src/api/models/catalog/index.ts
index becbb8f..edacc5d 100644
--- a/paimon-web-ui-new/src/router/modules/metadata.ts
+++ b/paimon-web-ui-new/src/api/models/catalog/index.ts
@@ -15,10 +15,18 @@ KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License. */
-export default {
- path: '/metadata',
- name: 'metadata',
- meta: { title: 'Metadata' },
- component: () => import('@/views/metadata')
+import httpRequest from '@/api/request'
+import type { Catalog } from './interface'
+
+export * from './interface'
+
+// #region catalog-controller
+
+/**
+ * # Get all catalog
+ */
+export const getAllCatalogs = () => {
+ return httpRequest.get<any, Catalog[]>('/catalog/getAllCatalogs')
}
+// #endregion
diff --git a/paimon-web-ui-new/src/router/modules/metadata.ts
b/paimon-web-ui-new/src/api/models/catalog/interface.ts
similarity index 80%
copy from paimon-web-ui-new/src/router/modules/metadata.ts
copy to paimon-web-ui-new/src/api/models/catalog/interface.ts
index becbb8f..49d7366 100644
--- a/paimon-web-ui-new/src/router/modules/metadata.ts
+++ b/paimon-web-ui-new/src/api/models/catalog/interface.ts
@@ -15,10 +15,13 @@ KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License. */
-export default {
- path: '/metadata',
- name: 'metadata',
- meta: { title: 'Metadata' },
- component: () => import('@/views/metadata')
+export interface Catalog {
+ id: number;
+ createTime: string;
+ updateTime?: string;
+ type: string;
+ name: string;
+ warehouse: string;
+ hiveUri?: string;
+ hiveConfDir?: string;
}
-
diff --git a/paimon-web-ui-new/src/api/request.ts
b/paimon-web-ui-new/src/api/request.ts
index 72cbbfc..1d63bc9 100644
--- a/paimon-web-ui-new/src/api/request.ts
+++ b/paimon-web-ui-new/src/api/request.ts
@@ -68,10 +68,11 @@ class HttpRequest {
return useAxle(options)
}
- get<R = any, P = any>(url: string, options: AxleConfigOptions<R, P>) {
+ get<R = any, P = any>(url: string, options?: AxleConfigOptions<R, P>) {
return this.request<R, P>({
url,
runner: axle.get,
+ data: null as any,
...options
})
}
diff --git a/paimon-web-ui-new/src/router/modules/metadata.ts
b/paimon-web-ui-new/src/router/modules/metadata.ts
index becbb8f..c3218a6 100644
--- a/paimon-web-ui-new/src/router/modules/metadata.ts
+++ b/paimon-web-ui-new/src/router/modules/metadata.ts
@@ -21,4 +21,3 @@ export default {
meta: { title: 'Metadata' },
component: () => import('@/views/metadata')
}
-
diff --git a/paimon-web-ui-new/src/store/catalog/index.ts
b/paimon-web-ui-new/src/store/catalog/index.ts
new file mode 100644
index 0000000..0e5bb55
--- /dev/null
+++ b/paimon-web-ui-new/src/store/catalog/index.ts
@@ -0,0 +1,67 @@
+/* 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. */
+
+import { NIcon, type TreeOption } from 'naive-ui'
+import { FolderOpenOutline } from '@vicons/ionicons5'
+
+
+import { getAllCatalogs, type Catalog } from "@/api/models/catalog"
+
+export interface CatalogState {
+ _catalogs: Catalog[];
+ _catalogLoading: boolean;
+}
+
+export const useCatalogStore = defineStore('catalog', {
+ state: (): CatalogState => ({
+ _catalogs: [],
+ _catalogLoading: false
+ }),
+ persist: true,
+ getters: {
+ catalogs: (state): TreeOption[] => {
+ return transformCatalog(state._catalogs)
+ },
+ catalogLoading: (state): boolean => {
+ return state._catalogLoading
+ }
+ },
+ actions: {
+ async getAllCatalogs(): Promise<void> {
+ const [, useAllCatalog] = getAllCatalogs()
+
+ this._catalogLoading = true
+ const res = await useAllCatalog()
+ this._catalogs = res.data
+ this._catalogLoading = false
+ }
+ }
+})
+
+const transformCatalog = (catalogs: Catalog[]): TreeOption[] => {
+ return catalogs.map(catalog => ({
+ label: catalog.name,
+ type: catalog.type,
+ key: catalog.id,
+ isLeaf: false,
+ children: [],
+ prefix: () =>
+ h(NIcon, null, {
+ default: () => h(FolderOpenOutline)
+ }),
+ }))
+}
diff --git
a/paimon-web-ui-new/src/views/metadata/components/menu-tree/index.tsx
b/paimon-web-ui-new/src/views/metadata/components/menu-tree/index.tsx
index 5ec874e..a0fe236 100644
--- a/paimon-web-ui-new/src/views/metadata/components/menu-tree/index.tsx
+++ b/paimon-web-ui-new/src/views/metadata/components/menu-tree/index.tsx
@@ -15,25 +15,27 @@ KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License. */
-import { FileTrayFullOutline, Search, FolderOpenOutline } from
'@vicons/ionicons5';
+import { FileTrayFullOutline, Search, FolderOpenOutline } from
'@vicons/ionicons5'
+import { NIcon } from 'naive-ui'
+
+import { useCatalogStore } from '@/store/catalog'
+
import styles from './index.module.scss'
-import { NIcon } from 'naive-ui';
export default defineComponent({
name: 'MenuTree',
setup() {
const { t } = useLocaleHooks()
+ const catalogStore = useCatalogStore()
+ const catalogStoreRef = storeToRefs(catalogStore)
+
const treeVariables = reactive({
treeData: [
{
key: 'paimon2',
label: 'paimon2',
type: 'folder',
- prefix: () =>
- h(NIcon, null, {
- default: () => h(FolderOpenOutline)
- }),
children: [
{
key: 'user',
@@ -70,7 +72,6 @@ export default defineComponent({
}
],
filterValue: '',
- selectedKeys: []
})
const dropdownMenu = [
@@ -91,17 +92,15 @@ export default defineComponent({
}
}
- const handleTreeSelect = (value: never[], option: { children: any; }[]) =>
{
- if (option[0]?.children) return
- treeVariables.selectedKeys = value
- }
+ onMounted(catalogStore.getAllCatalogs)
return {
+ menuLoading: catalogStoreRef.catalogLoading,
+ menuList: catalogStoreRef.catalogs,
dropdownMenu,
t,
...toRefs(treeVariables),
nodeProps,
- handleTreeSelect,
}
},
render() {
@@ -116,15 +115,15 @@ export default defineComponent({
}}
>
</n-input>
- <n-tree
- block-line
- expand-on-click
- selected-keys={this.selectedKeys}
- on-update:selected-keys={this.handleTreeSelect}
- data={this.treeData}
- pattern={this.filterValue}
- node-props={this.nodeProps}
- />
+ <n-spin show={this.menuLoading}>
+ <n-tree
+ block-line
+ on-load={() => {}}
+ data={this.menuList}
+ pattern={this.filterValue}
+ node-props={this.nodeProps}
+ />
+ </n-spin>
</n-space>
</n-card>
</div>
