mirror of
https://github.com/datahub-project/datahub.git
synced 2025-12-27 09:58:14 +00:00
fix(react): url encoding urns and tag profile fix (#2623)
This commit is contained in:
parent
6b9d0d0129
commit
47554d2d4a
@ -20,7 +20,8 @@ interface Props {
|
||||
* Responsible for rendering an Entity Profile
|
||||
*/
|
||||
export const EntityPage = ({ entityType }: Props) => {
|
||||
const { urn } = useParams<RouteParams>();
|
||||
const { urn: encodedUrn } = useParams<RouteParams>();
|
||||
const urn = decodeURIComponent(encodedUrn);
|
||||
const entityRegistry = useEntityRegistry();
|
||||
const isBrowsable = entityRegistry.getEntity(entityType).isBrowseEnabled();
|
||||
const isLineageSupported = entityRegistry.getEntity(entityType).isLineageEnabled();
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import { EntityType, SearchResult } from '../../types.generated';
|
||||
import { FetchedEntity } from '../lineage/types';
|
||||
import { Entity, IconStyleType, PreviewType } from './Entity';
|
||||
import { urlEncodeUrn } from './shared/utils';
|
||||
|
||||
function validatedGet<K, V>(key: K, map: Map<K, V>): V {
|
||||
if (map.has(key)) {
|
||||
@ -71,6 +72,10 @@ export default class EntityRegistry {
|
||||
return entity.getPathName();
|
||||
}
|
||||
|
||||
getEntityUrl(type: EntityType, urn: string): string {
|
||||
return `/${this.getPathName(type)}/${urlEncodeUrn(urn)}`;
|
||||
}
|
||||
|
||||
getTypeFromPathName(pathName: string): EntityType {
|
||||
return validatedGet(pathName, this.pathNameToEntityType);
|
||||
}
|
||||
|
||||
@ -27,7 +27,7 @@ export const ChartPreview = ({
|
||||
|
||||
return (
|
||||
<DefaultPreviewCard
|
||||
url={`/${entityRegistry.getPathName(EntityType.Chart)}/${urn}`}
|
||||
url={entityRegistry.getEntityUrl(EntityType.Chart, urn)}
|
||||
name={name || ''}
|
||||
description={description || ''}
|
||||
type="Chart"
|
||||
|
||||
@ -27,7 +27,7 @@ export const DashboardPreview = ({
|
||||
|
||||
return (
|
||||
<DefaultPreviewCard
|
||||
url={`/${entityRegistry.getPathName(EntityType.Dashboard)}/${urn}`}
|
||||
url={entityRegistry.getEntityUrl(EntityType.Dashboard, urn)}
|
||||
name={name || ''}
|
||||
description={description || ''}
|
||||
type="Dashboard"
|
||||
|
||||
@ -27,7 +27,7 @@ export const Preview = ({
|
||||
const capitalizedPlatform = capitalizeFirstLetter(platformName);
|
||||
return (
|
||||
<DefaultPreviewCard
|
||||
url={`/${entityRegistry.getPathName(EntityType.DataFlow)}/${urn}`}
|
||||
url={entityRegistry.getEntityUrl(EntityType.DataFlow, urn)}
|
||||
name={name}
|
||||
description={description || ''}
|
||||
type="Data Pipeline"
|
||||
|
||||
@ -27,7 +27,7 @@ export const Preview = ({
|
||||
const capitalizedPlatform = capitalizeFirstLetter(platformName);
|
||||
return (
|
||||
<DefaultPreviewCard
|
||||
url={`/${entityRegistry.getPathName(EntityType.DataJob)}/${urn}`}
|
||||
url={entityRegistry.getEntityUrl(EntityType.DataJob, urn)}
|
||||
name={name}
|
||||
description={description || ''}
|
||||
type="Data Task"
|
||||
|
||||
@ -31,7 +31,7 @@ export const Preview = ({
|
||||
const capitalPlatformName = capitalizeFirstLetter(platformName);
|
||||
return (
|
||||
<DefaultPreviewCard
|
||||
url={`/${entityRegistry.getPathName(EntityType.Dataset)}/${urn}`}
|
||||
url={entityRegistry.getEntityUrl(EntityType.Dataset, urn)}
|
||||
name={name || ''}
|
||||
description={description || ''}
|
||||
type="Dataset"
|
||||
|
||||
@ -18,7 +18,7 @@ export const Preview = ({
|
||||
const entityRegistry = useEntityRegistry();
|
||||
return (
|
||||
<DefaultPreviewCard
|
||||
url={`/${entityRegistry.getPathName(EntityType.GlossaryTerm)}/${urn}`}
|
||||
url={entityRegistry.getEntityUrl(EntityType.GlossaryTerm, urn)}
|
||||
name={name || ''}
|
||||
description={definition || ''}
|
||||
owners={owners}
|
||||
|
||||
3
datahub-web-react/src/app/entity/shared/utils.ts
Normal file
3
datahub-web-react/src/app/entity/shared/utils.ts
Normal file
@ -0,0 +1,3 @@
|
||||
export function urlEncodeUrn(urn: string) {
|
||||
return urn && urn.replace(/%/g, '%25').replace(/\//g, '%2F').replace(/\?/g, '%3F').replace(/#/g, '%23');
|
||||
}
|
||||
@ -152,7 +152,7 @@ export default function TagProfile() {
|
||||
onClick={() =>
|
||||
navigateToSearchUrl({
|
||||
type: type as EntityType,
|
||||
query: `tags:${data?.tag?.name}`,
|
||||
query: `tags:"${data?.tag?.name}"`,
|
||||
history,
|
||||
entityRegistry,
|
||||
})
|
||||
|
||||
@ -24,7 +24,7 @@ export const Preview = ({
|
||||
const entityRegistry = useEntityRegistry();
|
||||
|
||||
return (
|
||||
<Link to={`/${entityRegistry.getPathName(EntityType.CorpUser)}/${urn}`}>
|
||||
<Link to={entityRegistry.getEntityUrl(EntityType.CorpUser, urn)}>
|
||||
<Space size={28}>
|
||||
<CustomAvatar size={60} photoUrl={photoUrl} name={name} />
|
||||
<Space direction="vertical" size={4}>
|
||||
|
||||
@ -29,7 +29,7 @@ export const Preview = ({
|
||||
const entityRegistry = useEntityRegistry();
|
||||
|
||||
return (
|
||||
<Link to={`/${entityRegistry.getPathName(EntityType.CorpGroup)}/${urn}`}>
|
||||
<Link to={entityRegistry.getEntityUrl(EntityType.CorpGroup, urn)}>
|
||||
<Space size={28}>
|
||||
<CustomAvatar size={60} photoUrl={photoUrl} name={name} isGroup />
|
||||
<Space direction="vertical" size={4}>
|
||||
|
||||
@ -95,7 +95,7 @@ export default function LineageExplorer({ urn, type }: Props) {
|
||||
}}
|
||||
onEntityCenter={(params: EntitySelectParams) => {
|
||||
history.push(
|
||||
`/${entityRegistry.getPathName(params.type)}/${params.urn}/?is_lineage_mode=true`,
|
||||
`${entityRegistry.getEntityUrl(params.type, params.urn)}/?is_lineage_mode=true`,
|
||||
);
|
||||
}}
|
||||
onLineageExpand={(params: LineageExpandParams) => {
|
||||
@ -121,7 +121,7 @@ export default function LineageExplorer({ urn, type }: Props) {
|
||||
<Col span={8} offset={8}>
|
||||
<Button
|
||||
type="primary"
|
||||
href={`/${entityRegistry.getPathName(selectedEntity.type)}/${selectedEntity.urn}/`}
|
||||
href={entityRegistry.getEntityUrl(selectedEntity.type, selectedEntity.urn)}
|
||||
>
|
||||
View Profile
|
||||
</Button>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user