(gravitino) branch main updated: [#11223][#11243][#11244] web-v2(ui): fix view sql scroll issue, copy issue and not found column tag & policy issue (#11247)

[mchades]

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

mchades pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/gravitino.git


The following commit(s) were added to refs/heads/main by this push:
     new ca6e4bccfe [#11223][#11243][#11244] web-v2(ui): fix view sql scroll 
issue, copy issue and not found column tag & policy issue (#11247)
ca6e4bccfe is described below

commit ca6e4bccfe4731e429a014a914457ec7437dd980
Author: Qian Xia <q...@datastrato.com>
AuthorDate: Fri May 29 14:07:38 2026 +0800

    [#11223][#11243][#11244] web-v2(ui): fix view sql scroll issue, copy issue 
and not found column tag & policy issue (#11247)
    
    ### What changes were proposed in this pull request?
    1. fix view sql scroll issue
    2. copy issue
    3. not found column tag
    
    ### Why are the changes needed?
    
    
    Fix: #11223
    Fix: #11243
    Fix: #11244
    
    ### Does this PR introduce _any_ user-facing change?
    N/A
    
    ### How was this patch tested?
    manually
---
 .../rightContent/entitiesContent/TableDetailsPage.js      |  4 ++--
 .../rightContent/entitiesContent/ViewDetailsPage.js       | 15 ++++++++-------
 web-v2/web/src/lib/store/metalakes/index.js               |  5 +++++
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git 
a/web-v2/web/src/app/catalogs/rightContent/entitiesContent/TableDetailsPage.js 
b/web-v2/web/src/app/catalogs/rightContent/entitiesContent/TableDetailsPage.js
index 3567f0cc64..90ad4a0d2e 100644
--- 
a/web-v2/web/src/app/catalogs/rightContent/entitiesContent/TableDetailsPage.js
+++ 
b/web-v2/web/src/app/catalogs/rightContent/entitiesContent/TableDetailsPage.js
@@ -396,7 +396,7 @@ export default function TableDetailsPage({ ...props }) {
         dataIndex: 'tags',
         key: 'tags',
         render: (_, record) =>
-          !record?.node ? (
+          record?.node === 'tableColumn' ? (
             <Tags
               metadataObjectType={'column'}
               
metadataObjectFullName={`${catalog}.${schema}.${table}.${record.name}`}
@@ -408,7 +408,7 @@ export default function TableDetailsPage({ ...props }) {
         dataIndex: 'policies',
         key: 'policies',
         render: (_, record) =>
-          !record?.node ? (
+          record?.node === 'tableColumn' ? (
             <Policies
               metadataObjectType={'column'}
               
metadataObjectFullName={`${catalog}.${schema}.${table}.${record.name}`}
diff --git 
a/web-v2/web/src/app/catalogs/rightContent/entitiesContent/ViewDetailsPage.js 
b/web-v2/web/src/app/catalogs/rightContent/entitiesContent/ViewDetailsPage.js
index ac497fd6b4..8984156116 100644
--- 
a/web-v2/web/src/app/catalogs/rightContent/entitiesContent/ViewDetailsPage.js
+++ 
b/web-v2/web/src/app/catalogs/rightContent/entitiesContent/ViewDetailsPage.js
@@ -20,6 +20,7 @@
 'use client'
 
 import { useEffect, useMemo, useState } from 'react'
+import { copyToClipboard } from '@/lib/utils'
 import {
   Descriptions,
   Divider,
@@ -58,7 +59,6 @@ export default function ViewDetailsPage() {
   const [search, setSearch] = useState('')
   const [tabKey, setTabKey] = useState('Columns')
   const [activeSqlKey, setActiveSqlKey] = useState(null)
-  const [messageApi, contextHolder] = message.useMessage()
   const { ref, width } = useResizeObserver()
 
   const tableData = viewData?.columns
@@ -118,10 +118,11 @@ export default function ViewDetailsPage() {
 
   const onCopySql = async sql => {
     try {
-      await navigator.clipboard.writeText(sql)
-      messageApi.success('SQL copied')
-    } catch {
-      messageApi.error('Failed to copy SQL')
+      await copyToClipboard(sql)
+      message.success('SQL copied!')
+    } catch (err) {
+      console.error('Failed to copy SQL: ', err)
+      message.error('Failed to copy SQL')
     }
   }
 
@@ -222,7 +223,6 @@ export default function ViewDetailsPage() {
 
   return (
     <>
-      {contextHolder}
       <Spin spinning={store.activatedDetailsLoading}>
         <Flex className='mb-2' gap='small' align='flex-start' ref={ref}>
           <div className='size-8'>
@@ -337,7 +337,8 @@ export default function ViewDetailsPage() {
                     </button>
                   </Tooltip>
                   <pre
-                    className='m-0 whitespace-pre-wrap break-all font-mono 
text-sm leading-6'
+                    className='m-0 whitespace-pre-wrap break-all font-mono 
text-sm leading-6 overflow-auto'
+                    style={{ maxHeight: 'calc(100vh - 40rem)' }}
                     dangerouslySetInnerHTML={{ __html: 
highlightSql(activeSqlItem.formattedSql) }}
                   />
                 </div>
diff --git a/web-v2/web/src/lib/store/metalakes/index.js 
b/web-v2/web/src/lib/store/metalakes/index.js
index a7e5bbe3ba..3f92b24abc 100644
--- a/web-v2/web/src/lib/store/metalakes/index.js
+++ b/web-v2/web/src/lib/store/metalakes/index.js
@@ -1215,6 +1215,11 @@ export const getTableDetails = createAsyncThunk(
       }
     ]
 
+    resTable.columns = (resTable.columns || []).map(col => ({
+      ...col,
+      node: 'tableColumn'
+    }))
+
     dispatch(setTableProps(tableProps))
 
     dispatch(