From a457e7a6641a9846508be7865faf93ef2f13a194 Mon Sep 17 00:00:00 2001
From: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com>
Date: Tue, 2 Jan 2024 17:32:32 +0530
Subject: [PATCH] fix(ui): pass encoded fqn to fetch table permission (#14538)

---
 .../SchemaTable/SchemaTable.component.tsx        | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/SchemaTable/SchemaTable.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/SchemaTable/SchemaTable.component.tsx
index c0c4970e595..00aaed15fe7 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/SchemaTable/SchemaTable.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/SchemaTable/SchemaTable.component.tsx
@@ -28,6 +28,7 @@ import {
 import { EntityTags, TagFilterOptions } from 'Models';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
+import { useParams } from 'react-router-dom';
 import { ReactComponent as IconEdit } from '../../assets/svg/edit-new.svg';
 import FilterTablePlaceHolder from '../../components/common/ErrorWithPlaceholder/FilterTablePlaceHolder';
 import EntityNameModal from '../../components/Modals/EntityNameModal/EntityNameModal.component';
@@ -48,6 +49,7 @@ import {
   getEntityName,
   getFrequentlyJoinedColumns,
 } from '../../utils/EntityUtils';
+import { getDecodedFqn } from '../../utils/StringsUtils';
 import {
   getAllTags,
   searchTagInData,
@@ -79,7 +81,6 @@ const SchemaTable = ({
   joins,
   isReadOnly = false,
   onThreadLinkSelect,
-  entityFqn,
   tableConstraints,
   tablePartitioned,
 }: SchemaTableProps) => {
@@ -90,6 +91,8 @@ const SchemaTable = ({
   const [tablePermissions, setTablePermissions] =
     useState<OperationPermission>();
   const [editColumn, setEditColumn] = useState<Column>();
+  const { fqn: entityFqn } = useParams<{ fqn: string }>();
+  const decodedEntityFqn = getDecodedFqn(entityFqn);
 
   const [editColumnDisplayName, setEditColumnDisplayName] = useState<Column>();
   const { getEntityPermissionByFqn } = usePermissionProvider();
@@ -114,13 +117,16 @@ const SchemaTable = ({
       );
     }
   };
+
   const data = React.useMemo(
     () => makeData(searchedColumns),
     [searchedColumns]
   );
+
   useEffect(() => {
     fetchResourcePermission(entityFqn);
   }, [entityFqn]);
+
   const handleEditColumn = (column: Column): void => {
     setEditColumn(column);
   };
@@ -253,7 +259,7 @@ const SchemaTable = ({
             fqn: record.fullyQualifiedName ?? '',
             field: record.description,
           }}
-          entityFqn={entityFqn}
+          entityFqn={decodedEntityFqn}
           entityType={EntityType.TABLE}
           hasEditPermission={hasDescriptionEditAccess}
           index={index}
@@ -426,7 +432,7 @@ const SchemaTable = ({
         filterIcon: getFilterIcon('tag-filter'),
         render: (tags: TagLabel[], record: Column, index: number) => (
           <TableTags<Column>
-            entityFqn={entityFqn}
+            entityFqn={decodedEntityFqn}
             entityType={EntityType.TABLE}
             handleTagSelection={handleTagSelection}
             hasTagEditAccess={hasTagEditAccess}
@@ -451,7 +457,7 @@ const SchemaTable = ({
         filterIcon: getFilterIcon('glossary-filter'),
         render: (tags: TagLabel[], record: Column, index: number) => (
           <TableTags<Column>
-            entityFqn={entityFqn}
+            entityFqn={decodedEntityFqn}
             entityType={EntityType.TABLE}
             handleTagSelection={handleTagSelection}
             hasTagEditAccess={hasTagEditAccess}
@@ -469,7 +475,7 @@ const SchemaTable = ({
       },
     ],
     [
-      entityFqn,
+      decodedEntityFqn,
       isReadOnly,
       tableConstraints,
       hasTagEditAccess,