53 lines
1.7 KiB
JavaScript
53 lines
1.7 KiB
JavaScript
import React from 'react'
|
|
import VersionsIcon from 'shared/components/icons/versions.js'
|
|
import Link from 'next/link'
|
|
import { useTranslation } from 'next-i18next'
|
|
import versions from 'site/versions.json'
|
|
import useVersion from 'site/hooks/useVersion.js'
|
|
|
|
export const defaultVersion = 'next'
|
|
|
|
export const formatVersionTitle = version => (!version || version === defaultVersion)
|
|
? `${defaultVersion} version`
|
|
: `Version ${version}`
|
|
|
|
export const formatVersionUri = (version=false, design=false) => {
|
|
if (!version && !design) return '/'
|
|
if (!version && design) return `/${design}`
|
|
if (version && !design) return `/v/${version}`
|
|
|
|
return `/v/${version}/${design}`
|
|
}
|
|
|
|
const PatternPicker = ({ app }) => {
|
|
const { t } = useTranslation(['common'])
|
|
const version = useVersion()
|
|
|
|
return (
|
|
<div className="dropdown w-full md:w-auto">
|
|
<div tabIndex="0" className={`
|
|
m-0 btn btn-neutral flex flex-row gap-2 btn-outline
|
|
md:btn-ghost
|
|
hover:bg-neutral hover:border-neutral-content
|
|
`}>
|
|
<VersionsIcon />
|
|
<span>{formatVersionTitle(version)}</span>
|
|
</div>
|
|
<ul tabIndex="0" className="p-2 shadow menu dropdown-content bg-base-100 rounded-box w-52 overflow-y-scroll navdrop">
|
|
{[defaultVersion, ...versions].map(v => (
|
|
<li key={v}>
|
|
<Link href={formatVersionUri(v)}>
|
|
<button className="btn btn-ghost">
|
|
<span className="text-base-content captialize">
|
|
{formatVersionTitle(v)}
|
|
</span>
|
|
</button>
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default PatternPicker
|