-
Notifications
You must be signed in to change notification settings - Fork 12
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.
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
feat: add content-list #468
Conversation
6c1239a
to
706baae
Compare
Preview is ready. |
0fe3eb3
to
760ef6a
Compare
const iconData = getMediaImage(iconThemed); | ||
|
||
return ( | ||
<div className={b('item')} key={title || text}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
if we dont have title or text we dont have key, and we'll have error with this example
contentList = [{icon: '...'}, {icon: '...'}], {icon: '...'}]]
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you can use import {v4 as uuidv4} from 'uuid';
for key
src/sub-blocks/Content/Content.tsx
Outdated
@@ -72,6 +75,7 @@ const Content = (props: ContentBlockProps & ClassNameProps) => { | |||
/> | |||
</div> | |||
)} | |||
{contentList && <ContentList contentList={contentList} size={size} />} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
maybe just check the length of the array and not even render the component if it's empty?
src/sub-blocks/Content/Content.tsx
Outdated
@@ -72,6 +75,7 @@ const Content = (props: ContentBlockProps & ClassNameProps) => { | |||
/> | |||
</div> | |||
)} | |||
{contentList?.length && <ContentList contentList={contentList} size={size} />} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
if contentList is empty array, 0
will be rendered here
@@ -21,6 +30,7 @@ const MediaContent = (props: MediaContentProps) => { | |||
links={links} | |||
theme="default" | |||
buttons={allButtons} | |||
contentList={contentList} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
contentList
-> items
const b = block('content-list'); | ||
|
||
interface ContentListProps { | ||
contentList: ContentItemProps[]; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
contentList -> items
src/sub-blocks/Content/Content.tsx
Outdated
@@ -75,7 +75,7 @@ const Content = (props: ContentBlockProps & ClassNameProps) => { | |||
/> | |||
</div> | |||
)} | |||
{list?.length && <ContentList list={list} size={size} />} | |||
{list?.length && Boolean(list.length) && <ContentList list={list} size={size} />} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
list?.length ? <ContentList list={list} size={size} /> : null
content component size L and S: https://preview.gravity-ui.com/page-constructor/468/?path=/story/components-content--size
Content Layout Block: https://preview.gravity-ui.com/page-constructor/468/?path=/story/blocks-contentlayout--default
Media Block: https://preview.gravity-ui.com/page-constructor/468/?path=/story/blocks-media--default