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.

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

solution #1095

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

solution #1095

wants to merge 2 commits into from

Conversation

svitlanak31
Copy link

Copy link

@volodymyr-soltys97 volodymyr-soltys97 left a comment

Choose a reason for hiding this comment

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

Good job 👍
Let's make your code better

src/App.jsx Outdated
return (
<div className="section">
<h1 className="title">
Selected tab is {tabs.find(tab => tab.id === activeTabId).title}

Choose a reason for hiding this comment

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

Move this logic to the helper variable and use it here

src/App.jsx Outdated
<h1 className="title">
Selected tab is {tabs.find(tab => tab.id === activeTabId).title}
</h1>
<Tabs tabs={tabs} activeTabId={activeTabId} onTabSelected={setActiveTabId} />

Choose a reason for hiding this comment

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

Suggested change
<Tabs tabs={tabs} activeTabId={activeTabId} onTabSelected={setActiveTabId} />
<Tabs
tabs={tabs}
activeTabId={activeTabId}
onTabSelected={setActiveTabId}
/>

{tabs.map((tab) => (
<li
key={tab.id}
className={tab.id === currentTabId ? 'is-active' : ''}

Choose a reason for hiding this comment

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

Use the classnames library for add classes with condition

data-cy="TabLink"
onClick={() => handleTabClick(tab.id)}
>
{tab.title}

Choose a reason for hiding this comment

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

Use destructuring for tab

</ul>
</div>
<div className="block" data-cy="TabContent">
{tabs.find((tab) => tab.id === currentTabId)?.content}

Choose a reason for hiding this comment

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

Move this logic from jsx to the helper variable and use it here

Copy link

@lerastarynets lerastarynets left a comment

Choose a reason for hiding this comment

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

lgtm 🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants