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

H 261 fix default image urls #339

Merged
merged 2 commits into from
Oct 27, 2021
Merged

H 261 fix default image urls #339

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
861ff98
H #261 fix default image urls
RamRamez Oct 25, 2021
67944fa
fix default image views on final step in project creation
RamRamez Oct 25, 2021
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
29 changes: 14 additions & 15 deletions src/components/account/projectEdition/imageSection.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ function ImageSection({ image, register, setValue }) {
/>
)
}

return (
<>
<Grid
Expand Down Expand Up @@ -91,8 +92,10 @@ function ImageSection({ image, register, setValue }) {
objectFit='cover'
// sx={{ objectFit: 'cover', maxHeight: '150px' }}
/>
) : displayImage?.startsWith('data:') || displayImage?.startsWith('http') ? (
<Image src={displayImage} sx={{ objectFit: 'cover', maxHeight: '150px' }} />
) : displayImage?.startsWith('data:') ||
displayImage?.startsWith('http') ||
displayImage?.startsWith('/assets') ? (
<Image alt='image' src={displayImage} sx={{ objectFit: 'cover', maxHeight: '150px' }} />
) : (
<Flex sx={{ justifyContent: 'center' }}>
{displayImage === '1' && (
Expand Down Expand Up @@ -123,19 +126,15 @@ function ImageSection({ image, register, setValue }) {
</Flex>
</Grid>
<Flex sx={{ flexDirection: 'row' }}>
{[1, 2, 3, 4].map((i, index) => {
return (
<Selection
key={index}
type='button'
onClick={() => {
setDisplayImage(i?.toString())
}}
>
{ProjectImage(i)}
</Selection>
)
})}
{[1, 2, 3, 4].map(i => (
<Selection
key={i}
type='button'
onClick={() => setDisplayImage(`/assets/create/projectImageGallery${i}.svg`)}
>
{ProjectImage(i)}
</Selection>
))}
</Flex>
</>
)
Expand Down
30 changes: 3 additions & 27 deletions src/components/create-project-form/FinalVerificationStep.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,7 @@
import React from 'react'
import { Text, Button, Flex, Image, Box } from 'theme-ui'
import { Text, Button, Flex, Image } from 'theme-ui'
import dynamic from 'next/dynamic'

import ProjectImageGallery1 from '../../images/svg/create/projectImageGallery1.svg'
import ProjectImageGallery2 from '../../images/svg/create/projectImageGallery2.svg'
import ProjectImageGallery3 from '../../images/svg/create/projectImageGallery3.svg'
import ProjectImageGallery4 from '../../images/svg/create/projectImageGallery4.svg'

const RichTextViewer = dynamic(() => import('../richTextViewer'), {
ssr: false
})
Expand Down Expand Up @@ -250,7 +245,7 @@ const FinalVerificationStep = ({ formData, setStep, categoryList }) => {
</Button>
</Flex>

{formData.projectImage?.startsWith('data:') ? (
{formData.projectImage && (
<Image
src={formData.projectImage}
sx={{
Expand All @@ -259,27 +254,8 @@ const FinalVerificationStep = ({ formData, setStep, categoryList }) => {
maxWidth: '600px',
mt: '20px'
}}
alt='project image'
/>
) : (
<Box
sx={{
mt: '20px',
'*': { borderRadius: 10, p: 1 }
}}
>
{formData.projectImage === '1' && (
<ProjectImageGallery1 style={{ width: '40%', height: '40%' }} />
)}
{formData.projectImage === '2' && (
<ProjectImageGallery2 style={{ width: '40%', height: '40%' }} />
)}
{formData.projectImage === '3' && (
<ProjectImageGallery3 style={{ width: '40%', height: '40%' }} />
)}
{formData.projectImage === '4' && (
<ProjectImageGallery4 style={{ width: '40%', height: '40%' }} />
)}
</Box>
)}
</Flex>
<br />
Expand Down
28 changes: 13 additions & 15 deletions src/components/create-project-form/inputs/ProjectImageInput.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,8 +103,10 @@ export const ProjectImageInput = ({ register, currentValue, setValue, goBack })
/>
{displayImage === undefined ? (
<NextImage src={'/placeholder.png'} width='100%' height='100%' objectFit='cover' />
) : displayImage?.startsWith('data:') ? (
<Image src={displayImage} sx={{ objectFit: 'cover', maxHeight: '150px' }} />
) : displayImage?.startsWith('data:') ||
displayImage?.startsWith('http') ||
displayImage?.startsWith('/assets') ? (
<Image alt='image' src={displayImage} sx={{ objectFit: 'cover', maxHeight: '150px' }} />
) : (
<Flex sx={{ justifyContent: 'center' }}>
{displayImage === '1' && (
Expand Down Expand Up @@ -146,19 +148,15 @@ export const ProjectImageInput = ({ register, currentValue, setValue, goBack })
mt: '16px'
}}
>
{[1, 2, 3, 4].map((i, index) => {
return (
<Selection
key={index}
type='button'
onClick={() => {
setDisplayImage(i?.toString())
}}
>
{ProjectImage(i)}
</Selection>
)
})}
{[1, 2, 3, 4].map(i => (
<Selection
key={i}
type='button'
onClick={() => setDisplayImage(`/assets/create/projectImageGallery${i}.svg`)}
>
{ProjectImage(i)}
</Selection>
))}
</Grid>
<Flex
sx={{
Expand Down