tangled
alpha
login
or
join now
dunkirk.sh
/
pstream-ng
1
fork
atom
pstream is dead; long live pstream
taciturnaxolotl.github.io/pstream-ng/
1
fork
atom
overview
issues
pulls
pipelines
onboarding preserve params
mrjvs
2 years ago
d47722d3
20e35d05
+31
-10
4 changed files
expand all
collapse all
unified
split
src
pages
onboarding
Onboarding.tsx
OnboardingExtension.tsx
OnboardingProxy.tsx
onboardingHooks.ts
+5
-3
src/pages/onboarding/Onboarding.tsx
···
1
1
import classNames from "classnames";
2
2
import { Trans, useTranslation } from "react-i18next";
3
3
-
import { useNavigate } from "react-router-dom";
4
3
5
4
import { Button } from "@/components/buttons/Button";
6
5
import { Stepper } from "@/components/layout/Stepper";
···
8
7
import { Modal, ModalCard, useModal } from "@/components/overlays/Modal";
9
8
import { Heading1, Heading2, Paragraph } from "@/components/utils/Text";
10
9
import { MinimalPageLayout } from "@/pages/layouts/MinimalPageLayout";
11
11
-
import { useRedirectBack } from "@/pages/onboarding/onboardingHooks";
10
10
+
import {
11
11
+
useNavigateOnboarding,
12
12
+
useRedirectBack,
13
13
+
} from "@/pages/onboarding/onboardingHooks";
12
14
import { Card, CardContent, Link } from "@/pages/onboarding/utils";
13
15
import { PageTitle } from "@/pages/parts/util/PageTitle";
14
16
···
21
23
}
22
24
23
25
export function OnboardingPage() {
24
24
-
const navigate = useNavigate();
26
26
+
const navigate = useNavigateOnboarding();
25
27
const skipModal = useModal("skip");
26
28
const { completeAndRedirect } = useRedirectBack();
27
29
const { t } = useTranslation();
+5
-3
src/pages/onboarding/OnboardingExtension.tsx
···
1
1
import { ReactNode } from "react";
2
2
import { Trans, useTranslation } from "react-i18next";
3
3
-
import { useNavigate } from "react-router-dom";
4
3
import { useAsyncFn, useInterval } from "react-use";
5
4
6
5
import { isAllowedExtensionVersion } from "@/backend/extension/compatibility";
···
12
11
import { CenterContainer } from "@/components/layout/ThinContainer";
13
12
import { Heading2, Paragraph } from "@/components/utils/Text";
14
13
import { MinimalPageLayout } from "@/pages/layouts/MinimalPageLayout";
15
15
-
import { useRedirectBack } from "@/pages/onboarding/onboardingHooks";
14
14
+
import {
15
15
+
useNavigateOnboarding,
16
16
+
useRedirectBack,
17
17
+
} from "@/pages/onboarding/onboardingHooks";
16
18
import { Card, Link } from "@/pages/onboarding/utils";
17
19
import { PageTitle } from "@/pages/parts/util/PageTitle";
18
20
···
104
106
105
107
export function OnboardingExtensionPage() {
106
108
const { t } = useTranslation();
107
107
-
const navigate = useNavigate();
109
109
+
const navigate = useNavigateOnboarding();
108
110
const { completeAndRedirect } = useRedirectBack();
109
111
110
112
const [{ loading, value }, exec] = useAsyncFn(
+5
-3
src/pages/onboarding/OnboardingProxy.tsx
···
1
1
import { useState } from "react";
2
2
import { useTranslation } from "react-i18next";
3
3
-
import { useNavigate } from "react-router-dom";
4
3
import { useAsyncFn } from "react-use";
5
4
6
5
import { singularProxiedFetch } from "@/backend/helpers/fetch";
···
12
11
import { ErrorLine } from "@/components/utils/ErrorLine";
13
12
import { Heading2, Paragraph } from "@/components/utils/Text";
14
13
import { MinimalPageLayout } from "@/pages/layouts/MinimalPageLayout";
15
15
-
import { useRedirectBack } from "@/pages/onboarding/onboardingHooks";
14
14
+
import {
15
15
+
useNavigateOnboarding,
16
16
+
useRedirectBack,
17
17
+
} from "@/pages/onboarding/onboardingHooks";
16
18
import { Link } from "@/pages/onboarding/utils";
17
19
import { PageTitle } from "@/pages/parts/util/PageTitle";
18
20
import { useAuthStore } from "@/stores/auth";
···
21
23
22
24
export function OnboardingProxyPage() {
23
25
const { t } = useTranslation();
24
24
-
const navigate = useNavigate();
26
26
+
const navigate = useNavigateOnboarding();
25
27
const { completeAndRedirect } = useRedirectBack();
26
28
const [url, setUrl] = useState("");
27
29
const setProxySet = useAuthStore((s) => s.setProxySet);
+16
-1
src/pages/onboarding/onboardingHooks.ts
···
1
1
import { useCallback } from "react";
2
2
-
import { useNavigate } from "react-router-dom";
2
2
+
import { useLocation, useNavigate } from "react-router-dom";
3
3
4
4
import { useQueryParam } from "@/hooks/useQueryParams";
5
5
import { useOnboardingStore } from "@/stores/onboarding";
···
20
20
21
21
return { completeAndRedirect };
22
22
}
23
23
+
24
24
+
export function useNavigateOnboarding() {
25
25
+
const navigate = useNavigate();
26
26
+
const loc = useLocation();
27
27
+
const nav = useCallback(
28
28
+
(path: string) => {
29
29
+
navigate({
30
30
+
pathname: path,
31
31
+
search: loc.search,
32
32
+
});
33
33
+
},
34
34
+
[navigate, loc],
35
35
+
);
36
36
+
return nav;
37
37
+
}