mirror of
https://github.com/datahub-project/datahub.git
synced 2025-11-03 12:16:10 +00:00
fix(forms) Fix a couple of small inconsistencies with forms (#9928)
This commit is contained in:
parent
7e5610f358
commit
c8a38188f8
@ -5,7 +5,7 @@ import { GetDatasetQuery } from '../../../../../../graphql/dataset.generated';
|
||||
import { DatasetStatsSummary } from '../../../shared/DatasetStatsSummary';
|
||||
import { getLastUpdatedMs } from '../../../shared/utils';
|
||||
|
||||
export const DatasetStatsSummarySubHeader = () => {
|
||||
export const DatasetStatsSummarySubHeader = ({ properties }: { properties?: any }) => {
|
||||
const result = useBaseEntity<GetDatasetQuery>();
|
||||
const dataset = result?.dataset;
|
||||
|
||||
@ -31,6 +31,7 @@ export const DatasetStatsSummarySubHeader = () => {
|
||||
queryCountLast30Days={queryCountLast30Days}
|
||||
uniqueUserCountLast30Days={uniqueUserCountLast30Days}
|
||||
lastUpdatedMs={lastUpdatedMs}
|
||||
shouldWrap={properties?.shouldWrap}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
@ -30,6 +30,7 @@ type Props = {
|
||||
lastUpdatedMs?: number | null;
|
||||
color?: string;
|
||||
mode?: 'normal' | 'tooltip-content';
|
||||
shouldWrap?: boolean;
|
||||
};
|
||||
|
||||
export const DatasetStatsSummary = ({
|
||||
@ -42,6 +43,7 @@ export const DatasetStatsSummary = ({
|
||||
lastUpdatedMs,
|
||||
color,
|
||||
mode = 'normal',
|
||||
shouldWrap,
|
||||
}: Props) => {
|
||||
const isTooltipMode = mode === 'tooltip-content';
|
||||
const displayedColor = isTooltipMode ? '' : color ?? ANTD_GRAY[7];
|
||||
@ -105,5 +107,5 @@ export const DatasetStatsSummary = ({
|
||||
),
|
||||
].filter((stat) => stat);
|
||||
|
||||
return <>{statsViews.length > 0 && <StatsSummary stats={statsViews} />}</>;
|
||||
return <>{statsViews.length > 0 && <StatsSummary stats={statsViews} shouldWrap={shouldWrap} />}</>;
|
||||
};
|
||||
|
||||
@ -4,12 +4,14 @@ import { ANTD_GRAY } from '../../constants';
|
||||
|
||||
type Props = {
|
||||
stats: Array<React.ReactNode>;
|
||||
shouldWrap?: boolean;
|
||||
};
|
||||
|
||||
const StatsContainer = styled.div`
|
||||
const StatsContainer = styled.div<{ shouldWrap?: boolean }>`
|
||||
margin-top: 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
${(props) => props.shouldWrap && `flex-wrap: wrap;`}
|
||||
`;
|
||||
|
||||
const StatDivider = styled.div`
|
||||
@ -19,11 +21,11 @@ const StatDivider = styled.div`
|
||||
height: 21px;
|
||||
`;
|
||||
|
||||
export const StatsSummary = ({ stats }: Props) => {
|
||||
export const StatsSummary = ({ stats, shouldWrap }: Props) => {
|
||||
return (
|
||||
<>
|
||||
{stats && stats.length > 0 && (
|
||||
<StatsContainer>
|
||||
<StatsContainer shouldWrap={shouldWrap}>
|
||||
{stats.map((statView, index) => (
|
||||
<>
|
||||
{statView}
|
||||
|
||||
@ -50,13 +50,13 @@ export default function EntityInfo({ formUrn }: Props) {
|
||||
<PlatformContent />
|
||||
<EntityName>{entityName}</EntityName>
|
||||
<StyledLink
|
||||
href={entityRegistry.getEntityUrl(entityType, entityData?.urn || '')}
|
||||
href={`${entityRegistry.getEntityUrl(entityType, entityData?.urn || '')}/`}
|
||||
target="_blank"
|
||||
rel="noreferrer noopener"
|
||||
>
|
||||
View Profile <LinkOut style={{ marginLeft: '4px' }} />
|
||||
</StyledLink>
|
||||
<DatasetStatsSummarySubHeader />
|
||||
<DatasetStatsSummarySubHeader properties={{ shouldWrap: true }} />
|
||||
<FormInfoWrapper>
|
||||
<FormInfo shouldDisplayBackground formUrn={formUrn} />
|
||||
</FormInfoWrapper>
|
||||
|
||||
@ -10,4 +10,5 @@ export type OnboardingStep = {
|
||||
content?: ReactNode;
|
||||
selector?: string;
|
||||
style?: any;
|
||||
isActionStep?: boolean; // hide this step until some action is taken to display it
|
||||
};
|
||||
|
||||
@ -86,3 +86,8 @@ export function getStepsToRender(
|
||||
),
|
||||
}));
|
||||
}
|
||||
|
||||
// filter out action steps from the initial steps that should be shown
|
||||
export function getInitialAllowListIds() {
|
||||
return OnboardingConfig.filter((config) => !config.isActionStep).map((config) => config.id as string);
|
||||
}
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { getStepIds } from '../app/onboarding/utils';
|
||||
import { getInitialAllowListIds, getStepIds } from '../app/onboarding/utils';
|
||||
import { useBatchGetStepStatesQuery } from '../graphql/step.generated';
|
||||
import { EducationStepsContext } from './EducationStepsContext';
|
||||
import { StepStateResult } from '../types.generated';
|
||||
import { CURRENT_ONBOARDING_IDS } from '../app/onboarding/OnboardingConfig';
|
||||
import { useUserContext } from '../app/context/useUserContext';
|
||||
|
||||
export function EducationStepsProvider({ children }: { children: React.ReactNode }) {
|
||||
@ -13,7 +12,7 @@ export function EducationStepsProvider({ children }: { children: React.ReactNode
|
||||
const results = data?.batchGetStepStates.results;
|
||||
const [educationSteps, setEducationSteps] = useState<StepStateResult[] | null>(results || null);
|
||||
const [educationStepIdsAllowlist, setEducationStepIdsAllowlist] = useState<Set<string>>(
|
||||
new Set(CURRENT_ONBOARDING_IDS),
|
||||
new Set(getInitialAllowListIds()),
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user