in website/src/components/DemoPage/DemoTabs.tsx [4:31]
function DemoTabs({ overview, local, deploy, resources }) {
const [selectedKey, setSelectedKey] = React.useState('overview')
const handleLinkClick = (item?: PivotItem) => {
if (item) {
setSelectedKey(item.props.itemKey!)
}
}
return (
<div>
<div className="mb-8 w-full overflow-visible" style={{ margin: '20px' }}>
<Pivot aria-label="Details about the demo" selectedKey={selectedKey} onLinkClick={handleLinkClick} headersOnly={true}>
{overview && <PivotItem headerText="Overview" itemKey="overview" />}
{local && <PivotItem headerText="Run locally" itemKey="local" />}
{deploy && <PivotItem headerText="One-click deploy to Azure" itemKey="deploy" />}
{resources && <PivotItem headerText="Resources" itemKey="resources" />}
</Pivot>
</div>
<div className="font-sans font-light">
{selectedKey === 'overview' && overview}
{selectedKey === 'local' && local}
{selectedKey === 'deploy' && deploy}
{selectedKey === 'resources' && resources}
</div>
</div>
)
}