Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: appends editDepth value to radio & checkbox IDs when inside drawer #6181

Merged
merged 5 commits into from
May 10, 2024
Merged

fix: appends editDepth value to radio & checkbox IDs when inside drawer #6181

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
7d676a0
fix: appends editDepth value to radio & checkbox fields when inside d…
PatrikKozak May 2, 2024
2da4c7d
Merge branch 'main' of github.com:payloadcms/payload into fix/radio-c…
PatrikKozak May 2, 2024
a7ad3f0
Merge branch 'main' of github.com:payloadcms/payload into fix/radio-c…
PatrikKozak May 6, 2024
590fcc6
fix: updates fields richtext e2e tests
PatrikKozak May 6, 2024
40c2870
fix: simplifies ternary in radio & checkbox fields
PatrikKozak May 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
8 changes: 7 additions & 1 deletion packages/payload/src/admin/components/forms/field-types/Checkbox/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import type { Props } from './types'

import { checkbox } from '../../../../../fields/validations'
import { getTranslation } from '../../../../../utilities/getTranslation'
import { useEditDepth } from '../../../utilities/EditDepth'
import DefaultError from '../../Error'
import FieldDescription from '../../FieldDescription'
import useField from '../../useField'
Expand Down Expand Up @@ -41,6 +42,8 @@ const Checkbox: React.FC<Props> = (props) => {

const path = pathFromProps || name

const editDepth = useEditDepth()

const memoizedValidate = useCallback(
(value, options) => {
return validate(value, { ...options, required })
Expand All @@ -62,7 +65,10 @@ const Checkbox: React.FC<Props> = (props) => {
}
}, [onChange, readOnly, setValue, value])

const fieldID = `field-${path.replace(/\./g, '__')}`
const fieldID =
PatrikKozak marked this conversation as resolved.
Show resolved Hide resolved
editDepth > 1
? `field-${path.replace(/\./g, '__')}-${editDepth}`
: `field-${path.replace(/\./g, '__')}`

return (
<div
Expand Down
6 changes: 5 additions & 1 deletion packages/payload/src/admin/components/forms/field-types/RadioGroup/RadioInput/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next'
import type { Props } from './types'

import { getTranslation } from '../../../../../../utilities/getTranslation'
import { useEditDepth } from '../../../../utilities/EditDepth'
import './index.scss'

const baseClass = 'radio-input'
Expand All @@ -12,9 +13,12 @@ const RadioInput: React.FC<Props> = (props) => {
const { isSelected, onChange, option, path, readOnly } = props
const { i18n } = useTranslation()

const editDepth = useEditDepth()

const classes = [baseClass, isSelected && `${baseClass}--is-selected`].filter(Boolean).join(' ')

const id = `field-${path}-${option.value}`
const id =
PatrikKozak marked this conversation as resolved.
Show resolved Hide resolved
editDepth > 1 ? `field-${path}-${option.value}-${editDepth}` : `field-${path}-${option.value}`

return (
<label htmlFor={id}>
Expand Down
8 changes: 4 additions & 4 deletions test/fields/e2e.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1144,7 +1144,7 @@ describe('fields', () => {

// Fill values and click Confirm
await editLinkModal.locator('#field-text').fill('link text')
await editLinkModal.locator('label[for="field-linkType-custom"]').click()
await editLinkModal.locator('label[for="field-linkType-custom-2"]').click()
await editLinkModal.locator('#field-url').fill('')
await wait(200)
await editLinkModal.locator('button[type="submit"]').click()
Expand All @@ -1167,7 +1167,7 @@ describe('fields', () => {

// Fill values and click Confirm
await editLinkModal.locator('#field-text').fill('link text')
await editLinkModal.locator('label[for="field-linkType-custom"]').click()
await editLinkModal.locator('label[for="field-linkType-custom-2"]').click()
await editLinkModal.locator('#field-url').fill('https://payloadcms.com')
await wait(200)
await editLinkModal.locator('button[type="submit"]').click()
Expand All @@ -1193,7 +1193,7 @@ describe('fields', () => {

// Fill values and click Confirm
await editLinkModal.locator('#field-text').fill('link text')
await editLinkModal.locator('label[for="field-linkType-internal"]').click()
await editLinkModal.locator('label[for="field-linkType-internal-2"]').click()
await editLinkModal.locator('#field-doc .rs__control').click()
await page.keyboard.type('dev@')
await editLinkModal
Expand Down Expand Up @@ -1266,7 +1266,7 @@ describe('fields', () => {
const editLinkModal = page.locator('[id^=drawer_1_rich-text-link-]')
await expect(editLinkModal).toBeVisible()

await editLinkModal.locator('label[for="field-linkType-internal"]').click()
await editLinkModal.locator('label[for="field-linkType-internal-2"]').click()
await editLinkModal.locator('.relationship__wrap .rs__control').click()

const menu = page.locator('.relationship__wrap .rs__menu')
Expand Down