Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(react-components): make sure rule selection spinner terminates #4701

Merged
merged 3 commits into from
Aug 13, 2024
Merged

fix(react-components): make sure rule selection spinner terminates #4701

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
9536498
fix(react-components): make sure rule selection spinner terminates
haakonflatval-cognite Aug 13, 2024
df053f8
chore: lint fix
haakonflatval-cognite Aug 13, 2024
b10abfc
Merge branch 'master' into hflatval/avoid-infinite-rule-item-spinner
haakonflatval-cognite Aug 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 3 additions & 7 deletions react-components/src/components/Reveal3DResources/Reveal3DResources.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,11 +83,7 @@ export const Reveal3DResources = ({
[reveal3DModels]
);

const {
styledModels: styledCadModelOptions,
isModelMappingsFetched,
isModelMappingsLoading
} = useCalculateCadStyling(
const { styledModels: styledCadModelOptions, isModelMappingsLoading } = useCalculateCadStyling(
cadModelOptions,
instanceStyling?.filter(isCadAssetMappingStylingGroup) ?? EMPTY_ARRAY,
defaultResourceStyling
Expand All @@ -96,8 +92,8 @@ export const Reveal3DResources = ({
const setModel3DStylingLoading = useReveal3DResourcesStylingLoadingSetter();

useEffect(() => {
setModel3DStylingLoading(!(isModelMappingsFetched || !isModelMappingsLoading));
}, [isModelMappingsFetched, isModelMappingsLoading]);
setModel3DStylingLoading(isModelMappingsLoading);
}, [isModelMappingsLoading]);

const instaceStylingWithAssetMappings =
instanceStyling?.filter(isAssetMappingStylingGroup) ?? EMPTY_ARRAY;
Expand Down
42 changes: 25 additions & 17 deletions react-components/src/components/Reveal3DResources/useCalculateCadStyling.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,13 +43,11 @@ type ModelStyleGroup = {

type ModelStyleGroupWithMappingsFetched = {
combinedMappedStyleGroups: ModelStyleGroup[];
isModelMappingsFetched: boolean;
isModelMappingsLoading: boolean;
};

type StyledModelWithMappingsFetched = {
styledModels: StyledModel[];
isModelMappingsFetched: boolean;
isModelMappingsLoading: boolean;
};

Expand Down Expand Up @@ -77,10 +75,12 @@ export const useCalculateCadStyling = (
modelsMappedStyleGroups.combinedMappedStyleGroups,
modelInstanceStyleGroupsAndMappingFetched.combinedMappedStyleGroups
);

return {
styledModels: joinedStyleGroups,
isModelMappingsFetched: modelInstanceStyleGroupsAndMappingFetched.isModelMappingsFetched,
isModelMappingsLoading: modelInstanceStyleGroupsAndMappingFetched.isModelMappingsLoading
isModelMappingsLoading:
modelInstanceStyleGroupsAndMappingFetched.isModelMappingsLoading ||
modelsMappedStyleGroups.isModelMappingsLoading
};
};

Expand All @@ -92,21 +92,26 @@ function useCalculateMappedStyling(
() => getMappedCadModelsOptions(),
[models, defaultMappedNodeAppearance]
);
const { data: mappedEquipmentEdges, isLoading: isFDMEquipmentMappingLoading } =
useMappedEdgesForRevisions(modelsRevisionsWithMappedEquipment);
const {
data: mappedEquipmentEdges,
isLoading: isFDMEquipmentMappingsLoading,
isFetched: isFDMEquipmentMappingsFetched,
isError: isFDMEquipmentMappingsError
} = useMappedEdgesForRevisions(modelsRevisionsWithMappedEquipment);

const {
data: assetMappingData,
isFetched: isModelMappingsFetched,
isLoading: isModelMappingsLoading
isLoading: isAssetMappingsLoading,
isFetched: isAssetMappingsFetched,
isError: isAssetMappingsError
} = useAssetMappedNodesForRevisions(modelsRevisionsWithMappedEquipment);

const modelsMappedFdmStyleGroups = useMemo(() => {
const isFdmMappingUnavailableOrLoading =
models.length === 0 ||
mappedEquipmentEdges === undefined ||
mappedEquipmentEdges.size === 0 ||
isFDMEquipmentMappingLoading;
isFDMEquipmentMappingsLoading;

if (isFdmMappingUnavailableOrLoading) {
return [];
Expand All @@ -124,15 +129,15 @@ function useCalculateMappedStyling(
modelsRevisionsWithMappedEquipment,
mappedEquipmentEdges,
defaultMappedNodeAppearance,
isFDMEquipmentMappingLoading
isFDMEquipmentMappingsLoading
]);

const modelsMappedAssetStyleGroups = useMemo(() => {
const isAssetMappingUnavailableOrLoading =
models.length === 0 ||
assetMappingData === undefined ||
assetMappingData.length === 0 ||
isModelMappingsLoading;
isAssetMappingsLoading;

if (isAssetMappingUnavailableOrLoading) {
return [];
Expand All @@ -151,7 +156,7 @@ function useCalculateMappedStyling(
modelsRevisionsWithMappedEquipment,
assetMappingData,
defaultMappedNodeAppearance,
isModelMappingsLoading
isAssetMappingsLoading
]);

const combinedMappedStyleGroups = useMemo(
Expand All @@ -165,8 +170,11 @@ function useCalculateMappedStyling(

return {
combinedMappedStyleGroups,
isModelMappingsFetched,
isModelMappingsLoading
isModelMappingsLoading:
(!isFDMEquipmentMappingsError &&
isFDMEquipmentMappingsLoading &&
!isFDMEquipmentMappingsFetched) ||
(!isAssetMappingsError && isAssetMappingsLoading && !isAssetMappingsFetched)
};

function getMappedCadModelsOptions(): CadModelOptions[] {
Expand Down Expand Up @@ -195,8 +203,9 @@ function useCalculateInstanceStyling(

const {
data: modelAssetMappings,
isLoading: isModelMappingsLoading,
isFetched: isModelMappingsFetched,
isLoading: isModelMappingsLoading
isError
} = useNodesForAssets(models, assetIdsFromInstanceGroups);

const fdmModelInstanceStyleGroups = useFdmInstanceStyleGroups(
Expand All @@ -222,8 +231,7 @@ function useCalculateInstanceStyling(

return {
combinedMappedStyleGroups,
isModelMappingsFetched,
isModelMappingsLoading
isModelMappingsLoading: !isError && isModelMappingsLoading && !isModelMappingsFetched
};
}

Expand Down
10 changes: 1 addition & 9 deletions react-components/src/components/RevealToolbar/RuleBasedOutputsButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,7 @@ import { type CadModelOptions } from '../Reveal3DResources/types';
import { useAssetMappedNodesForRevisions } from '../CacheProvider/AssetMappingAndNode3DCacheProvider';
import { RuleBasedSelectionItem } from '../RuleBasedOutputs/components/RuleBasedSelectionItem';
import { generateEmptyRuleForSelection, getRuleBasedById } from '../RuleBasedOutputs/utils';
import {
useReveal3DResourcesStylingLoading,
useReveal3DResourcesStylingLoadingSetter
} from '../Reveal3DResources/Reveal3DResourcesInfoContext';
import { useReveal3DResourcesStylingLoading } from '../Reveal3DResources/Reveal3DResourcesInfoContext';

type RuleBasedOutputsButtonProps = {
onRuleSetStylingChanged?: (stylings: AssetStylingGroup[] | undefined) => void;
Expand All @@ -49,7 +46,6 @@ export const RuleBasedOutputsButton = ({

const [newRuleSetEnabled, setNewRuleSetEnabled] = useState<RuleAndEnabled>();
const isRuleLoadingFromContext = useReveal3DResourcesStylingLoading();
const setModel3DStylingLoading = useReveal3DResourcesStylingLoadingSetter();

const { data: ruleInstancesResult } = useFetchRuleInstances();

Expand All @@ -64,7 +60,6 @@ export const RuleBasedOutputsButton = ({
const hasNewRuleSetEnabled = newRuleSetEnabled !== undefined;

setIsRuleLoading(hasNewRuleSetEnabled);
setModel3DStylingLoading(hasNewRuleSetEnabled);
}, [newRuleSetEnabled]);

useEffect(() => {
Expand All @@ -73,7 +68,6 @@ export const RuleBasedOutputsButton = ({
currentStylingGroups.length > 0 &&
isRuleLoadingFromContext;
setIsRuleLoading(hasRuleLoading);
setModel3DStylingLoading(hasRuleLoading);
}, [isRuleLoadingFromContext, currentStylingGroups]);

const onChange = useCallback(
Expand All @@ -98,8 +92,6 @@ export const RuleBasedOutputsButton = ({

setEmptyRuleSelected(emptySelection);
setNewRuleSetEnabled(selectedRule);
setIsRuleLoading(true);
setModel3DStylingLoading(true);
},
[ruleInstances, onRuleSetStylingChanged, onRuleSetSelectedChanged]
);
Expand Down
Loading