49 lines
1.4 KiB
TypeScript
49 lines
1.4 KiB
TypeScript
'use client'
|
|
|
|
import { Button } from '@workspace/ui/components/button'
|
|
import { useState } from 'react'
|
|
import { useOnboarding } from '../store'
|
|
|
|
type ConnectState = 'initial' | 'repository-select' | 'template-select'
|
|
|
|
/**
|
|
* First step in the onboarding flow
|
|
* Handles GitHub connection and repository selection
|
|
*
|
|
* States:
|
|
* - initial: Shows GitHub connect button
|
|
* - repository-select: Shows list of repositories
|
|
* - template-select: Shows available templates
|
|
*
|
|
* @component
|
|
*/
|
|
export function ConnectStep() {
|
|
const [connectState, setConnectState] = useState<ConnectState>('initial')
|
|
const [projectName, setProjectName] = useState('')
|
|
const { setFormData, nextStep } = useOnboarding()
|
|
|
|
const handleConnect = () => {
|
|
setConnectState('repository-select')
|
|
}
|
|
|
|
return (
|
|
<div className="max-w-2xl w-full">
|
|
{/* <ConnectAccountTabPanel />\ */}
|
|
{connectState === 'initial' ? (
|
|
<div className="flex flex-col items-center justify-center gap-6 p-8">
|
|
<h2 className="text-2xl font-semibold text-center">
|
|
Connect to GitHub
|
|
</h2>
|
|
<p className="text-center text-muted-foreground">
|
|
Connect your GitHub account to get started
|
|
</p>
|
|
<Button onClick={handleConnect} />
|
|
</div>
|
|
) : (
|
|
// <ConnectAccount onAuth={() => {}} />
|
|
<>...connect goes here</>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|