**BREAKING:** All `@payloadcms/ui/client` exports have been renamed to `@payloadcms/ui`. A simple find & replace across your entire project will be enough to migrate. This change greatly improves import auto-completions in IDEs which lack proper support for package.json exports, like Webstorm.
40 lines
982 B
TypeScript
40 lines
982 B
TypeScript
'use client'
|
|
import { ReactSelect, useLocale, useTranslation } from '@payloadcms/ui'
|
|
import React from 'react'
|
|
|
|
import type { Props } from './types.js'
|
|
|
|
import './index.scss'
|
|
|
|
const baseClass = 'select-version-locales'
|
|
|
|
export const SelectLocales: React.FC<Props> = ({ onChange, options, value }) => {
|
|
const { t } = useTranslation()
|
|
const { code } = useLocale()
|
|
|
|
const format = (items) => {
|
|
return items.map((item) => {
|
|
if (typeof item.label === 'string') return item
|
|
if (typeof item.label !== 'string' && item.label[code]) {
|
|
return {
|
|
label: item.label[code],
|
|
value: item.value,
|
|
}
|
|
}
|
|
})
|
|
}
|
|
|
|
return (
|
|
<div className={baseClass}>
|
|
<div className={`${baseClass}__label`}>{t('version:showLocales')}</div>
|
|
<ReactSelect
|
|
isMulti
|
|
onChange={onChange}
|
|
options={format(options)}
|
|
placeholder={t('version:selectLocales')}
|
|
value={format(value)}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|