Merge pull request #13 from DefGuard/mark_optional_step

feat: add asterisk to mark optional VPN step
DefGuard · Aug 23, 2023 · b4a98b1 · b4a98b1
2 parents 2c151c9 + a222f19
commit b4a98b1
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/web/src/pages/enrollment/components/EnrollmentSideBar/EnrollmentSideBar.tsx b/web/src/pages/enrollment/components/EnrollmentSideBar/EnrollmentSideBar.tsx
@@ -13,16 +13,19 @@ import { TimeLeft } from '../TimeLeft/TimeLeft';
 export const EnrollmentSideBar = () => {
   const { LL } = useI18nContext();
 
+  const vpnOptional = useEnrollmentStore((state) => state.vpnOptional);
+
   const steps = useMemo((): LocalizedString[] => {
     const steps = LL.pages.enrollment.sideBar.steps;
+    const vpnStep = vpnOptional ? `${steps.vpn()}*` : steps.vpn();
     return [
       steps.welcome(),
       steps.verification(),
       steps.password(),
-      steps.vpn(),
+      vpnStep as LocalizedString,
       steps.finish(),
     ];
-  }, [LL.pages.enrollment.sideBar.steps]);
+  }, [LL.pages.enrollment.sideBar.steps, vpnOptional]);
 
   return (
     <div id="enrollment-side-bar">