superset-frontend/src/components/MetadataBar/ContentConfig.tsx
/**
* 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 { ensureIsArray, styled, t } from '@superset-ui/core';
import Icons from 'src/components/Icons';
import { ContentType, MetadataType } from '.';
const Header = styled.div`
font-weight: ${({ theme }) => theme.typography.weights.bold};
`;
const Info = ({
text,
header,
}: {
text?: string | string[];
header?: string;
}) => {
const values = ensureIsArray(text);
return (
<>
{header && <Header>{header}</Header>}
{values.map(value => (
<div key={value}>{value}</div>
))}
</>
);
};
const config = (contentType: ContentType) => {
const { type } = contentType;
/**
* Tooltips are very similar. It's pretty much blocks
* of header/text pairs. That's why they are implemented here.
* If more complex tooltips emerge, then we should extract the different
* types of tooltips to their own components and reference them here.
*/
switch (type) {
case MetadataType.Dashboards:
return {
icon: Icons.FundProjectionScreenOutlined,
title: contentType.title,
tooltip: contentType.description ? (
<div>
<Info header={contentType.title} text={contentType.description} />
</div>
) : undefined,
};
case MetadataType.Description:
return {
icon: Icons.BookOutlined,
title: contentType.value,
};
case MetadataType.LastModified:
return {
icon: Icons.EditOutlined,
title: contentType.value,
tooltip: (
<div>
<Info header={t('Last modified')} text={contentType.value} />
<Info header={t('Modified by')} text={contentType.modifiedBy} />
</div>
),
};
case MetadataType.Owner:
return {
icon: Icons.UserOutlined,
title: contentType.createdBy,
tooltip: (
<div>
<Info header={t('Created by')} text={contentType.createdBy} />
{!!contentType.owners && (
<Info header={t('Owners')} text={contentType.owners} />
)}
<Info header={t('Created on')} text={contentType.createdOn} />
</div>
),
};
case MetadataType.Rows:
return {
icon: Icons.InsertRowBelowOutlined,
title: contentType.title,
tooltip: contentType.title,
};
case MetadataType.Sql:
return {
icon: Icons.ConsoleSqlOutlined,
title: contentType.title,
tooltip: contentType.title,
};
case MetadataType.Table:
return {
icon: Icons.Table,
title: contentType.title,
tooltip: contentType.title,
};
case MetadataType.Tags:
return {
icon: Icons.TagsOutlined,
title: contentType.values.join(', '),
tooltip: (
<div>
<Info header={t('Tags')} text={contentType.values} />
</div>
),
};
default:
throw Error(`Invalid type provided: ${type}`);
}
};
export { config };