Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-25 00:07:47 +01:00
Code Issues Projects Releases Wiki Activity

fix: improve steps for demo guide toggle topic (#3728)

Browse Source 
https://linear.app/unleash/issue/2-1006/steps-improvement-enabledisable-a-feature-toggle

Step improvements for the "toggle" topic.
Includes a smarter "Next" label that can also be "Start" or "Finish"
depending (nice-to-have).

Relates to [roadmap](https://github.com/orgs/Unleash/projects/10) item:
#3537
This commit is contained in:
Nuno Góis 2023-05-09 20:33:01 +01:00 committed by GitHub
parent be11c08f41
commit 9d680a782d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/component/demo/DemoSteps/DemoStepTooltip/DemoStepTooltip.tsx
View File

@ -86,6 +86,13 @@ export const DemoStepTooltip = ({
onBack, onBack,
onNext, onNext,
}: IDemoStepTooltipProps) => { }: IDemoStepTooltipProps) => {
const nextLabel =
stepIndex === 0
? 'Start'
: stepIndex === topics[topic].steps.length - 1
? 'Finish'
: 'Next';
if (step.target === 'body') { if (step.target === 'body') {
return ( return (
<div {...tooltipProps}> <div {...tooltipProps}>
@ -136,11 +143,7 @@ export const DemoStepTooltip = ({
sx={{ alignSelf: 'flex-end' }} sx={{ alignSelf: 'flex-end' }}
data-testid="DEMO_NEXT_BUTTON" data-testid="DEMO_NEXT_BUTTON"
> >
{topic === topics.length - 1 && {nextLabel}
stepIndex ===
topics[topic].steps.length - 1
? 'Finish'
: 'Next'}
</Button> </Button>
} }
/> />
@ -192,10 +195,7 @@ export const DemoStepTooltip = ({
sx={{ alignSelf: 'flex-end' }} sx={{ alignSelf: 'flex-end' }}
data-testid="DEMO_NEXT_BUTTON" data-testid="DEMO_NEXT_BUTTON"
> >
{topic === topics.length - 1 && {nextLabel}
stepIndex === topics[topic].steps.length - 1
? 'Finish'
: 'Next'}
</Button> </Button>
} }
/> />

6
frontend/src/component/demo/demo-topics.tsx
View File

@ -69,11 +69,11 @@ export const TOPICS: ITutorialTopic[] = [
content: ( content: (
<> <>
<Description> <Description>
The simplest way to use a feature toggle is to Enable or disable the feature for everyone by
enable or disable it for everyone (on/off). toggling the highlighted switch.
</Description> </Description>
<Badge sx={{ mt: 2 }} icon={<InfoOutlinedIcon />}> <Badge sx={{ mt: 2 }} icon={<InfoOutlinedIcon />}>
Look at the demo page when toggling! Look at the demo page to see your changes!
</Badge> </Badge>
</> </>
), ),