diff --git a/frontend/src/component/demo/DemoSteps/DemoStepTooltip/DemoStepTooltip.tsx b/frontend/src/component/demo/DemoSteps/DemoStepTooltip/DemoStepTooltip.tsx
index 53b1670742..4e30a2cdb4 100644
--- a/frontend/src/component/demo/DemoSteps/DemoStepTooltip/DemoStepTooltip.tsx
+++ b/frontend/src/component/demo/DemoSteps/DemoStepTooltip/DemoStepTooltip.tsx
@@ -86,6 +86,13 @@ export const DemoStepTooltip = ({
onBack,
onNext,
}: IDemoStepTooltipProps) => {
+ const nextLabel =
+ stepIndex === 0
+ ? 'Start'
+ : stepIndex === topics[topic].steps.length - 1
+ ? 'Finish'
+ : 'Next';
+
if (step.target === 'body') {
return (
@@ -136,11 +143,7 @@ export const DemoStepTooltip = ({
sx={{ alignSelf: 'flex-end' }}
data-testid="DEMO_NEXT_BUTTON"
>
- {topic === topics.length - 1 &&
- stepIndex ===
- topics[topic].steps.length - 1
- ? 'Finish'
- : 'Next'}
+ {nextLabel}
}
/>
@@ -192,10 +195,7 @@ export const DemoStepTooltip = ({
sx={{ alignSelf: 'flex-end' }}
data-testid="DEMO_NEXT_BUTTON"
>
- {topic === topics.length - 1 &&
- stepIndex === topics[topic].steps.length - 1
- ? 'Finish'
- : 'Next'}
+ {nextLabel}
}
/>
diff --git a/frontend/src/component/demo/demo-topics.tsx b/frontend/src/component/demo/demo-topics.tsx
index d984329eb0..5954338714 100644
--- a/frontend/src/component/demo/demo-topics.tsx
+++ b/frontend/src/component/demo/demo-topics.tsx
@@ -69,11 +69,11 @@ export const TOPICS: ITutorialTopic[] = [
content: (
<>
- The simplest way to use a feature toggle is to
- enable or disable it for everyone (on/off).
+ Enable or disable the feature for everyone by
+ toggling the highlighted switch.
}>
- Look at the demo page when toggling!
+ Look at the demo page to see your changes!
>
),