Fixed #530 Add dashboard URL on dashboard details page (#555)

This commit is contained in:
Sachin Chaurasiya 2021-09-21 22:47:09 +05:30 committed by GitHub
parent b09744fdb3
commit c6379cd95f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 1 deletions

View File

@ -13,6 +13,7 @@ import { TitleBreadcrumbProps } from '../title-breadcrumb/title-breadcrumb.inter
type ExtraInfo = {
key?: string;
value: string | number;
isLink?: boolean;
};
type Props = {
@ -108,7 +109,25 @@ const EntityPageInfo = ({
{info.key} :
</span>{' '}
<span className="tw-pl-1 tw-font-normal">
{info.value || '--'}
{info.isLink ? (
<a
className="link-text"
href={info.value as string}
rel="noopener noreferrer"
target="_blank">
<>
<span className="tw-mr-1">{info.value}</span>
<SVGIcons
alt="external-link"
className="tw-align-middle"
icon="external-link"
width="12px"
/>
</>
</a>
) : (
info.value || '--'
)}
</span>
{extraInfo.length !== 1 && index < extraInfo.length - 1 ? (
<span className="tw-mx-3 tw-inline-block tw-text-gray-400">

View File

@ -68,6 +68,7 @@ const MyDashBoardPage = () => {
const [activeTab, setActiveTab] = useState<number>(1);
const [isEdit, setIsEdit] = useState<boolean>(false);
const [charts, setCharts] = useState<ChartType[]>([]);
const [dashboardUrl, setDashboardUrl] = useState<string>('');
// const [usage, setUsage] = useState('');
// const [weeklyUsageCount, setWeeklyUsageCount] = useState('');
const [slashedDashboardName, setSlashedDashboardName] = useState<
@ -117,6 +118,7 @@ const MyDashBoardPage = () => {
const extraInfo = [
{ key: 'Owner', value: owner?.name || '' },
{ key: 'Tier', value: tier ? tier.split('.')[1] : '' },
{ key: 'Dashboard Url', value: dashboardUrl, isLink: true },
// { key: 'Usage', value: usage },
// { key: 'Queries', value: `${weeklyUsageCount} past week` },
];
@ -178,6 +180,7 @@ const MyDashBoardPage = () => {
owner,
displayName,
charts,
dashboardUrl,
// usageSummary,
} = res.data;
setDashboardDetails(res.data);
@ -218,6 +221,7 @@ const MyDashBoardPage = () => {
});
}
);
setDashboardUrl(dashboardUrl);
fetchCharts(charts).then((charts) => setCharts(charts));
// if (!isNil(usageSummary?.weeklyStats.percentileRank)) {
// const percentile = getUsagePercentile(