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

feat(web): getting started dots navigation and footer button logic #3036

Merged

Conversation

LetItRock
Copy link
Contributor

What change does this PR introduce?

Getting Started page:

  • dots navigation
  • footer buttons logic - create the workflow and try digest playground
  • show the getting started in the nav bar always
  • fixed responsiveness

Why was this change needed?

Other information (Screenshots)

Screenshot 2023-03-17 at 14 12 20
Screenshot 2023-03-17 at 14 12 28
Screenshot 2023-03-17 at 14 12 48

Screenshot 2023-03-17 at 14 12 59

Screen.Recording.2023-03-17.at.14.13.52.mov

@LetItRock LetItRock self-assigned this Mar 17, 2023
@linear
Copy link

linear bot commented Mar 17, 2023

import { errorMessage } from '../../../utils/notifications';
import { useNotificationGroup } from '../../../hooks';

export const useCreateDigestDemoWorkflow = () => {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

moved the code to reusable hook, used on the getting started page and on the templates placeholder

},
'100%': {
boxShadow: '0 0 0 0 rgba(255, 82, 82, 0)',
[`&:not(:disabled):not([data-loading])`]: {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

do not show the pulse animation if button is loading or disabled

@@ -18,6 +18,7 @@ interface IInputProps extends SpacingProps {
min?: string | number;
max?: string | number;
onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
autoFocus?: boolean;
Copy link
Contributor Author

Choose a reason for hiding this comment

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

added autoFocus prop to input

</Grid>
<LeftSide>{leftSide}</LeftSide>
<MiddleSide>
<DotsNavigation selectedIndex={selectedIndex} size={2} onClick={handleOnNavigationClick} />
Copy link
Contributor Author

Choose a reason for hiding this comment

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

the getting started page footer dots navigation

@@ -28,21 +42,21 @@ export function GetStarted() {
leftSide: <LearnMoreRef />,
rightSide: (
<NavButton navigateTo={getStartedSteps.second} variant={'gradient'}>
<div style={{ fontSize: '16px' }}>Next Page</div>
<div style={{ fontSize: '16px' }}>Next</div>
Copy link
Contributor Author

Choose a reason for hiding this comment

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

it's super tight on the smaller screens so I've changed the text to be smaller

@@ -76,7 +76,7 @@ export function SideNav({}: Props) {

const menuItems = [
{
condition: !readonly && currentUser?.showOnBoarding,
condition: !readonly,
Copy link
Contributor Author

Choose a reason for hiding this comment

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

getting started page navigation item will be always visible (that's what Nikolay wanted)

Copy link
Contributor

@scopsy scopsy left a comment

Choose a reason for hiding this comment

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

🎉 Looks great!

Comment on lines +29 to +32
let isIntegrationActive = !!integrations?.some((integration) => integration.channel === channel.type);
if (channel.type === ChannelTypeEnum.EMAIL) {
isIntegrationActive = isIntegrationActive || !isLimitReached;
}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

the logic to show the "active" label near to the channel

@LetItRock LetItRock merged commit e565a5f into getting-started-flow Mar 17, 2023
@LetItRock LetItRock deleted the nv-1832-getting-started-dots-navigation branch March 17, 2023 14:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants