From c06905bfd0e6aeafc92ed5eec7eaed553b9cf21e Mon Sep 17 00:00:00 2001
From: ajnart <ajnart@pm.me>
Date: Wed, 23 Aug 2023 22:10:16 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A5=20Remove=20onboarding=20step?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Onboarding/onboarding-steps.tsx           |  4 ---
 .../Onboarding/step-documentation.tsx         | 31 -------------------
 .../Onboarding/step-onboarding-finished.tsx   | 30 +++++++++++-------
 3 files changed, 18 insertions(+), 47 deletions(-)
 delete mode 100644 src/components/Onboarding/step-documentation.tsx

diff --git a/src/components/Onboarding/onboarding-steps.tsx b/src/components/Onboarding/onboarding-steps.tsx
index 0e9f8c245..f9173d201 100644
--- a/src/components/Onboarding/onboarding-steps.tsx
+++ b/src/components/Onboarding/onboarding-steps.tsx
@@ -2,7 +2,6 @@ import { Stack, Stepper } from '@mantine/core';
 import { useState } from 'react';
 
 import { StepCreateAccount } from './step-create-account';
-import { StepDocumentation } from './step-documentation';
 import { StepOnboardingFinished } from './step-onboarding-finished';
 import { StepUpdatePathMappings } from './step-update-path-mappings';
 
@@ -30,9 +29,6 @@ export const OnboardingSteps = ({ isUpdate }: { isUpdate: boolean }) => {
         <Stepper.Step label="Your account" description="Create an account">
           <StepCreateAccount next={nextStep} previous={prevStep} />
         </Stepper.Step>
-        <Stepper.Step label="Documentation" description="Introduction into Homarr">
-          <StepDocumentation next={nextStep} />
-        </Stepper.Step>
         <Stepper.Completed>
           <StepOnboardingFinished />
         </Stepper.Completed>
diff --git a/src/components/Onboarding/step-documentation.tsx b/src/components/Onboarding/step-documentation.tsx
deleted file mode 100644
index 6b2a32dd2..000000000
--- a/src/components/Onboarding/step-documentation.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Button, Divider, Stack, Text, Title } from '@mantine/core';
-import { IconArrowRight, IconExternalLink } from '@tabler/icons-react';
-
-import { OnboardingStepWrapper } from './common-wrapper';
-
-export const StepDocumentation = ({ next }: { next: () => void }) => {
-  return (
-    <OnboardingStepWrapper>
-      <Title order={2} align="center" mb="lg">
-        Documentation
-      </Title>
-
-      <Stack align="center">
-        <Text>We highly encourage you to read the documentation, before you continue.</Text>
-        <Button
-          component="a"
-          href="https://homarr.dev/docs/introduction/after-the-installation"
-          target="_blank"
-          rightIcon={<IconExternalLink size="1rem" />}
-          variant="default"
-        >
-          Open documentation
-        </Button>
-        <Divider h={30} />
-        <Button onClick={next} rightIcon={<IconArrowRight size="1rem" />} fullWidth>
-          Finish
-        </Button>
-      </Stack>
-    </OnboardingStepWrapper>
-  );
-};
diff --git a/src/components/Onboarding/step-onboarding-finished.tsx b/src/components/Onboarding/step-onboarding-finished.tsx
index 856a8bdf5..c1dc40e12 100644
--- a/src/components/Onboarding/step-onboarding-finished.tsx
+++ b/src/components/Onboarding/step-onboarding-finished.tsx
@@ -1,7 +1,8 @@
-import { NavLink, Stack, Text, Title, createStyles } from '@mantine/core';
+import { Divider, NavLink, Stack, Text, Title, createStyles } from '@mantine/core';
 import {
   IconChevronRight,
   IconDashboard,
+  IconExternalLink,
   IconFileText,
   IconManualGearbox,
 } from '@tabler/icons-react';
@@ -22,6 +23,22 @@ export const StepOnboardingFinished = () => {
         <Text>Awesome! What do you want to do next?</Text>
 
         <Stack>
+          <Text>
+            We <b>highly recommend you</b> to take a look at the documentation before starting to
+            use Homarr if you've never used it before.
+          </Text>
+          <NavLink
+            component={Link}
+            href="https://homarr.dev/docs/introduction/after-the-installation"
+            target="_blank"
+            rightSection={<IconExternalLink size="0.8rem" stroke={1.5} />}
+            className={classes.link}
+            icon={<IconFileText />}
+            label="Check out the documentation"
+            variant="light"
+            active
+          />
+          <Divider />
           <NavLink
             component={Link}
             href="/b/default"
@@ -42,17 +59,6 @@ export const StepOnboardingFinished = () => {
             variant="light"
             active
           />
-          <NavLink
-            component='a'
-            href="https://homarr.dev"
-            target="_blank"
-            rightSection={<IconChevronRight size="0.8rem" stroke={1.5} />}
-            className={classes.link}
-            icon={<IconFileText />}
-            label="Check out the documentation"
-            variant="light"
-            active
-          />
         </Stack>
       </Stack>
     </OnboardingStepWrapper>