feat: add onboarding parameter handling in EditBoardPage for improved user experience
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { useMemo, useState } from "react";
|
import { useEffect, useMemo, useState } from "react";
|
||||||
import { useParams, useRouter } from "next/navigation";
|
import { useParams, useRouter, useSearchParams } from "next/navigation";
|
||||||
|
|
||||||
import { SignInButton, SignedIn, SignedOut, useAuth } from "@clerk/nextjs";
|
import { SignInButton, SignedIn, SignedOut, useAuth } from "@clerk/nextjs";
|
||||||
|
|
||||||
@@ -49,6 +49,7 @@ const toDateInput = (value?: string | null) => {
|
|||||||
export default function EditBoardPage() {
|
export default function EditBoardPage() {
|
||||||
const { isSignedIn } = useAuth();
|
const { isSignedIn } = useAuth();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
const searchParams = useSearchParams();
|
||||||
const params = useParams();
|
const params = useParams();
|
||||||
const boardIdParam = params?.boardId;
|
const boardIdParam = params?.boardId;
|
||||||
const boardId = Array.isArray(boardIdParam) ? boardIdParam[0] : boardIdParam;
|
const boardId = Array.isArray(boardIdParam) ? boardIdParam[0] : boardIdParam;
|
||||||
@@ -67,6 +68,27 @@ export default function EditBoardPage() {
|
|||||||
const [metricsError, setMetricsError] = useState<string | null>(null);
|
const [metricsError, setMetricsError] = useState<string | null>(null);
|
||||||
const [isOnboardingOpen, setIsOnboardingOpen] = useState(false);
|
const [isOnboardingOpen, setIsOnboardingOpen] = useState(false);
|
||||||
|
|
||||||
|
const onboardingParam = searchParams.get("onboarding");
|
||||||
|
const searchParamsString = searchParams.toString();
|
||||||
|
const shouldAutoOpenOnboarding =
|
||||||
|
onboardingParam !== null &&
|
||||||
|
onboardingParam !== "" &&
|
||||||
|
onboardingParam !== "0" &&
|
||||||
|
onboardingParam.toLowerCase() !== "false";
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!boardId) return;
|
||||||
|
if (!shouldAutoOpenOnboarding) return;
|
||||||
|
|
||||||
|
setIsOnboardingOpen(true);
|
||||||
|
|
||||||
|
// Remove the flag from the URL so refreshes don't constantly reopen it.
|
||||||
|
const nextParams = new URLSearchParams(searchParamsString);
|
||||||
|
nextParams.delete("onboarding");
|
||||||
|
const qs = nextParams.toString();
|
||||||
|
router.replace(qs ? `/boards/${boardId}/edit?${qs}` : `/boards/${boardId}/edit`);
|
||||||
|
}, [boardId, router, searchParamsString, shouldAutoOpenOnboarding]);
|
||||||
|
|
||||||
const gatewaysQuery = useListGatewaysApiV1GatewaysGet<
|
const gatewaysQuery = useListGatewaysApiV1GatewaysGet<
|
||||||
listGatewaysApiV1GatewaysGetResponse,
|
listGatewaysApiV1GatewaysGetResponse,
|
||||||
ApiError
|
ApiError
|
||||||
|
|||||||
@@ -49,7 +49,7 @@ export default function NewBoardPage() {
|
|||||||
mutation: {
|
mutation: {
|
||||||
onSuccess: (result) => {
|
onSuccess: (result) => {
|
||||||
if (result.status === 200) {
|
if (result.status === 200) {
|
||||||
router.push(`/boards/${result.data.id}`);
|
router.push(`/boards/${result.data.id}/edit?onboarding=1`);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onError: (err) => {
|
onError: (err) => {
|
||||||
|
|||||||
Reference in New Issue
Block a user