Skip to content
This repository has been archived by the owner on Jul 19, 2024. It is now read-only.

PTL-19 Navigation Arrows #58

Merged
merged 10 commits into from
Mar 23, 2022
Merged

PTL-19 Navigation Arrows #58

Changes from 1 commit
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
1861786
initial implementation of navigation buttons
Mar 17, 2022
87a5a4a
refactor logic
Mar 17, 2022
492ca9b
fix typo
Mar 17, 2022
d6277c3
whitespace
Mar 17, 2022
fca1afa
fix for asset error image not rendering
Mar 21, 2022
0523c14
fix stlying issues between asset could not load and asset loaded modals
Mar 21, 2022
c9c6abf
remove unneeded div
Mar 21, 2022
dc675dc
remove redundant isError and other comment fixes
Mar 21, 2022
9abf82d
add isLoadingCheck to revent visual glitch
Mar 21, 2022
8c8633c
readd enums
Mar 21, 2022
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
7 changes: 5 additions & 2 deletions src/components/AssetModal/AssetModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,13 +16,14 @@ import {EnvironmentName, EnvironmentShortName} from 'utils/enums'
const AssetModal = () => {
const dispatch = useAppDispatch()
const [imageDimensions, setImageDimensions] = useState(null)
const [isError, setIsError] = useState(false)
const imageClasses = imageDimensions ? 'opacity-100 transition-opacity duration-500' : 'opacity-0 transition-opacity'

const selectedAssetEnvironment = useAppSelector(getSelectedAssetEnvironment)
const selectedAssetGroup = useAppSelector(getSelectedAssetGroup)

const selectedAsset = selectedAssetGroup[selectedAssetEnvironment]
const {hasMultipleImagesOfThisType, typeIndex, image, heading, isError, environment} = selectedAsset
const {hasMultipleImagesOfThisType, typeIndex, image, heading, environment} = selectedAsset
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can the isError value on the PlanAsset type be removed completely now that this modal relies on it's own internal state to determine if there is an error or not?

Refer to line 36 in the Asset component.

const {id, url, description, encoding} = image

const urlArray = url.split('/')
Expand Down Expand Up @@ -72,7 +73,8 @@ const AssetModal = () => {
height={imageDimensions?.naturalWeight || 280}
objectFit='contain'
alt={description || heading}
onLoadingComplete={(imageDimensions) => setImageDimensions(imageDimensions)}/>
onLoadingComplete={(imageDimensions) => setImageDimensions(imageDimensions)}
onError={() => setIsError(true)}/>
)
}

Expand All @@ -97,6 +99,7 @@ const AssetModal = () => {
newEnvironment = selectedAssetEnvironment === lastAssetEnvironment ? firstAssetEnvironment : assetArray[currentAssetIndex + 1].environment
}
dispatch(setSelectedAssetEnvironment(newEnvironment))
setIsError(false)
}

const renderNavigationButton = navigationDirection => (
Expand Down