content.tsx36 lines · main

1	import { CodeBlock } from 'ui-patterns/CodeBlock'
2
3	import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types'
4	import examples from '@/components/interfaces/ConnectSheet/DirectConnectionExamples'
5
6	/**
7	* Step component for direct connection install commands.
8	*/
9	function DirectInstallContent({ state }: StepContentProps) {
10	const connectionType = (state.connectionType as string) ?? 'uri'
11	const example = examples[connectionType as keyof typeof examples]
12	const exampleInstallCommands = example?.installCommands ?? []
13
14	if (exampleInstallCommands.length === 0) {
15	return null
16	}
17
18	return (
19	<div className="flex flex-col gap-2">
20	{exampleInstallCommands.map((cmd) => (
21	<CodeBlock
22	key={`example-install-command-${cmd}`}
23	className="[&_code]:text-foreground"
24	wrapperClassName="lg:col-span-2"
25	value={cmd}
26	hideLineNumbers
27	language="bash"
28	>
29	{cmd}
30	</CodeBlock>
31	))}
32	</div>
33	)
34	}
35
36	export default DirectInstallContent