mirror of
https://github.com/sourcebot-dev/sourcebot.git
synced 2025-12-12 12:25:22 +00:00
add back button in onboard connection creation flow
This commit is contained in:
parent
c0b62a28da
commit
3d6c7dcca5
2 changed files with 45 additions and 4 deletions
|
|
@ -15,6 +15,8 @@ import { useCallback } from "react";
|
|||
import { OnboardingSteps } from "@/lib/constants";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import useCaptureEvent from "@/hooks/useCaptureEvent";
|
||||
import { BackButton } from "./onboardBackButton";
|
||||
|
||||
interface ConnectCodeHostProps {
|
||||
nextStep: OnboardingSteps;
|
||||
}
|
||||
|
|
@ -26,6 +28,10 @@ export const ConnectCodeHost = ({ nextStep }: ConnectCodeHostProps) => {
|
|||
router.push(`?step=${nextStep}`);
|
||||
}, [nextStep, router]);
|
||||
|
||||
const onBack = useCallback(() => {
|
||||
setSelectedCodeHost(null);
|
||||
}, []);
|
||||
|
||||
if (!selectedCodeHost) {
|
||||
return (
|
||||
<CodeHostSelection onSelect={setSelectedCodeHost} />
|
||||
|
|
@ -34,25 +40,37 @@ export const ConnectCodeHost = ({ nextStep }: ConnectCodeHostProps) => {
|
|||
|
||||
if (selectedCodeHost === "github") {
|
||||
return (
|
||||
<GitHubConnectionCreationForm onCreated={onCreated} />
|
||||
<>
|
||||
<BackButton onClick={onBack} />
|
||||
<GitHubConnectionCreationForm onCreated={onCreated} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
if (selectedCodeHost === "gitlab") {
|
||||
return (
|
||||
<GitLabConnectionCreationForm onCreated={onCreated} />
|
||||
<>
|
||||
<BackButton onClick={onBack} />
|
||||
<GitLabConnectionCreationForm onCreated={onCreated} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
if (selectedCodeHost === "gitea") {
|
||||
return (
|
||||
<GiteaConnectionCreationForm onCreated={onCreated} />
|
||||
<>
|
||||
<BackButton onClick={onBack} />
|
||||
<GiteaConnectionCreationForm onCreated={onCreated} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
if (selectedCodeHost === "gerrit") {
|
||||
return (
|
||||
<GerritConnectionCreationForm onCreated={onCreated} />
|
||||
<>
|
||||
<BackButton onClick={onBack} />
|
||||
<GerritConnectionCreationForm onCreated={onCreated} />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
import { Button } from "@/components/ui/button"
|
||||
import { ArrowLeft } from "lucide-react"
|
||||
|
||||
interface BackButtonProps {
|
||||
onClick: () => void
|
||||
}
|
||||
|
||||
export function BackButton({ onClick }: BackButtonProps) {
|
||||
return (
|
||||
<div className="mb-4">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={onClick}
|
||||
className="text-gray-400 hover:text-white hover:bg-gray-800 focus-visible:ring-offset-gray-900 h-8 px-3 rounded-md"
|
||||
>
|
||||
<ArrowLeft size={16} className="mr-1" />
|
||||
<span>Back</span>
|
||||
</Button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
Reference in a new issue