Skip to content

Commit cc2b329

Browse files
tudddorrrtudddorrr
authored
Merge pull request #117 from TaloDev/develop
Release 0.24.1
2 parents eed79e3 + d74fc63 commit cc2b329

File tree

10 files changed

+917
-160
lines changed

10 files changed

+917
-160
lines changed

‎LICENSE.md‎

Lines changed: 661 additions & 0 deletions
Large diffs are not rendered by default.

‎package.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@
4242
"devDependencies": {
4343
"@testing-library/cypress": "^9.0.0",
4444
"@testing-library/jest-dom": "^5.16.5",
45-
"@testing-library/react": "^13.4.0",
45+
"@testing-library/react": "^14.0.0",
4646
"@testing-library/user-event": "^14.4.3",
4747
"@types/react": "^18.0.27",
4848
"@types/react-dom": "^18.0.10",
@@ -64,14 +64,14 @@
6464
"start-server-and-test": "^1.15.2",
6565
"tailwindcss": "^3.2.4",
6666
"vite": "^4.0.4",
67-
"vitest": "^0.28.0"
67+
"vitest": "^0.28.5"
6868
},
6969
"license": "MIT",
7070
"browserslist": ">0.75%",
7171
"lint-staged": {
7272
"*.{js,jsx}": "eslint --fix"
7373
},
74-
"version": "0.24.0",
74+
"version": "0.24.1",
7575
"engines": {
7676
"node": "16.x"
7777
}

‎src/components/DateInput.jsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ export default function DateInput({ id, value, onChange }) {
2929
mode='single'
3030
selected={date}
3131
onSelect={setDate}
32+
defaultMonth={date}
3233
/>
3334
)}
3435
visible={isOpen}
@@ -41,7 +42,8 @@ export default function DateInput({ id, value, onChange }) {
4142
containerClassName='w-28'
4243
value={format(date, 'dd MMM Y')}
4344
inputExtra={{
44-
onFocus: () => setOpen(true)
45+
onFocus: () => setOpen(true),
46+
name: id
4547
}}
4648
/>
4749
</div>

‎src/modals/ConfirmPlanChange.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ export default function ConfirmPlanChange({ modalState, plan, pricingInterval, i
108108
isLoading={isLoading}
109109
onClick={onConfirmClick}
110110
extra={{
111-
'data-testId': 'confirm-plan-change'
111+
'data-testid': 'confirm-plan-change'
112112
}}
113113
>
114114
Confirm

‎src/modals/groups/GroupDetails.jsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import { useDebounce } from 'use-debounce'
2222
import prepareRule from '../../utils/group-rules/prepareRule'
2323
import isGroupRuleValid from '../../utils/group-rules/isGroupRuleValid'
2424
import { useEffect } from 'react'
25+
import { metaGroupFields } from '../../constants/metaProps'
2526

2627
const validationSchema = yup.object({
2728
name: yup.string().label('Name').required(),
@@ -31,17 +32,21 @@ const validationSchema = yup.object({
3132
export function unpackRules(rules) {
3233
if (!rules) return rules
3334
return rules.map((rule) => {
35+
const metaField = metaGroupFields.find((f) => `props.${f.mapsTo}` === rule.field)
36+
const isUserDefinedProp = rule.field.startsWith('props.') && !metaField
37+
3438
return {
3539
name: rule.name,
3640
negate: rule.negate,
3741
castType: rule.castType,
38-
field: rule.field.startsWith('props.') ? groupPropKeyField : rule.field,
39-
propKey: rule.field.startsWith('props.') ? rule.field.split('props.')[1] : '',
42+
field: rule.field.startsWith('props.') ? (metaField?.field ?? groupPropKeyField) : rule.field,
43+
propKey: isUserDefinedProp ? rule.field.split('props.')[1] : '',
4044
operands: rule.operands.reduce((acc, curr, idx) => ({
4145
...acc,
4246
[idx]: curr
4347
}), {}),
44-
operandCount: rule.operands.length
48+
operandCount: rule.operands.length,
49+
mapsTo: isUserDefinedProp ? 'props' : rule.field
4550
}
4651
})
4752
}

‎src/modals/groups/GroupRules.jsx‎

Lines changed: 113 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -94,12 +94,15 @@ export default function GroupRules({ ruleModeState, rulesState }) {
9494

9595
if (Object.keys(partial).includes('name')) {
9696
updatedRule.operandCount = availableRule.operandCount
97+
if (updatedRule.operandCount === 0) {
98+
updatedRule.operands = {}
99+
}
97100
} else if (Object.keys(partial).includes('field')) {
98101
const availableField = availableFields.find((f) => f.field === partial.field)
99102

100103
updatedRule.name = findRuleByName('EQUALS').name
101104
updatedRule.propKey = availableField.mapsTo.startsWith('META_') ? availableField.mapsTo : ''
102-
updatedRule.mapsTo = availableField.mapsTo
105+
updatedRule.mapsTo = availableField.mapsTo.startsWith('META_') ? 'props' : availableField.mapsTo
103106
updatedRule.castType = availableField.defaultCastType
104107
for (const key in updatedRule.operands) {
105108
updatedRule.operands[key] = ''
@@ -142,84 +145,106 @@ export default function GroupRules({ ruleModeState, rulesState }) {
142145
<p className='text-sm'>All players</p>
143146

144147
{rules.length > 0 &&
145-
<div className='divide-y space-y-4'>
146-
{rules.map((rule, idx) => (
147-
<div key={idx} className='text-sm space-y-2 pt-4 first:pt-0'>
148-
<div className='flex items-center space-x-2'>
149-
<div className='-translate-y-0.5 w-[12px] h-[8px] border-l border-b border-gray-300' />
148+
<div className='divide-y space-y-4'>
149+
{rules.map((rule, idx) => (
150+
<div key={idx} className='text-sm space-y-2 pt-4 first:pt-0'>
151+
<div className='flex items-center space-x-2'>
152+
<div className='-translate-y-0.5 w-[12px] h-[8px] border-l border-b border-gray-300' />
153+
154+
<div>
155+
{idx === 0 && <span className='text-gray-500'>where</span>}
156+
157+
{idx > 0 &&
158+
<DropdownMenu
159+
options={[
160+
{ label: 'and', onClick: () => setRuleMode('$and') },
161+
{ label: 'or', onClick: () => setRuleMode('$or') }
162+
]}
163+
>
164+
{(setOpen) => (
165+
<Button
166+
type='button'
167+
onClick={setOpen}
168+
variant='small'
169+
>
170+
{ruleMode.substring(1, ruleMode.length)}
171+
</Button>
172+
)}
173+
</DropdownMenu>
174+
}
175+
</div>
176+
177+
<DropdownMenu
178+
options={availableFields.map(({ field }) => ({
179+
label: field,
180+
onClick: () => {
181+
updateRule(idx, { field })
182+
}
183+
}))}
184+
>
185+
{(setOpen) => (
186+
<Button
187+
type='button'
188+
onClick={setOpen}
189+
variant='small'
190+
>
191+
{rule.field}
192+
</Button>
193+
)}
194+
</DropdownMenu>
195+
196+
{rule.field === groupPropKeyField &&
197+
<TextInput
198+
id='prop-key'
199+
variant='modal'
200+
containerClassName='w-24 md:w-32'
201+
onChange={(propKey) => updateRule(idx, { propKey })}
202+
value={rule.propKey ?? ''}
203+
/>
204+
}
205+
206+
<div className='!ml-auto'>
207+
<Button
208+
type='button'
209+
onClick={() => onDeleteClick(idx)}
210+
variant='small'
211+
icon={<IconTrash size={16} />}
212+
extra={{ 'aria-label': `Delete rule ${idx + 1}` }}
213+
/>
214+
</div>
215+
</div>
150216

151-
<div>
152-
{idx === 0 && <span className='text-gray-500'>where</span>}
217+
{rule.field === groupPropKeyField &&
218+
<div className='flex items-center space-x-2 ml-5'>
219+
<span>value as</span>
153220

154-
{idx > 0 &&
155221
<DropdownMenu
156-
options={[
157-
{ label: 'and', onClick: () => setRuleMode('$and') },
158-
{ label: 'or', onClick: () => setRuleMode('$or') }
159-
]}
222+
options={['CHAR', 'DOUBLE', 'DATETIME'].map((castType) => ({
223+
label: getCastTypeDescription(castType),
224+
onClick: () => {
225+
updateRule(idx, { castType })
226+
}
227+
}))}
160228
>
161229
{(setOpen) => (
162230
<Button
163231
type='button'
164232
onClick={setOpen}
165233
variant='small'
166234
>
167-
{ruleMode.substring(1, ruleMode.length)}
235+
<span>{getCastTypeDescription(rule.castType)}</span>
168236
</Button>
169237
)}
170238
</DropdownMenu>
171-
}
172-
</div>
173-
174-
<DropdownMenu
175-
options={availableFields.map(({ field }) => ({
176-
label: field,
177-
onClick: () => {
178-
updateRule(idx, { field })
179-
}
180-
}))}
181-
>
182-
{(setOpen) => (
183-
<Button
184-
type='button'
185-
onClick={setOpen}
186-
variant='small'
187-
>
188-
{rule.field}
189-
</Button>
190-
)}
191-
</DropdownMenu>
192-
193-
{rule.field === groupPropKeyField &&
194-
<TextInput
195-
id='prop-key'
196-
variant='modal'
197-
containerClassName='w-24 md:w-32'
198-
onChange={(propKey) => updateRule(idx, { propKey })}
199-
value={rule.propKey ?? ''}
200-
/>
239+
</div>
201240
}
202241

203-
<div className='!ml-auto'>
204-
<Button
205-
type='button'
206-
onClick={() => onDeleteClick(idx)}
207-
variant='small'
208-
icon={<IconTrash size={16} />}
209-
extra={{ 'aria-label': `Delete rule ${idx + 1}` }}
210-
/>
211-
</div>
212-
</div>
213-
214-
{rule.field === groupPropKeyField &&
215242
<div className='flex items-center space-x-2 ml-5'>
216-
<span>value as</span>
217-
218243
<DropdownMenu
219-
options={['CHAR', 'DOUBLE', 'DATETIME'].map((castType) => ({
220-
label: getCastTypeDescription(castType),
244+
options={availableRules.filter((availableRule) => availableRule.castTypes.includes(rule.castType)).map(({ name, negate }) => ({
245+
label: getRuleDescription(name, negate),
221246
onClick: () => {
222-
updateRule(idx, { castType })
247+
updateRule(idx, { name, negate })
223248
}
224249
}))}
225250
>
@@ -229,61 +254,39 @@ export default function GroupRules({ ruleModeState, rulesState }) {
229254
onClick={setOpen}
230255
variant='small'
231256
>
232-
<span>{getCastTypeDescription(rule.castType)}</span>
257+
{getRuleDescription(rule.name, rule.negate)}
233258
</Button>
234259
)}
235260
</DropdownMenu>
236-
</div>
237-
}
238261

239-
<div className='flex items-center space-x-2 ml-5'>
240-
<DropdownMenu
241-
options={availableRules.filter((availableRule) => availableRule.castTypes.includes(rule.castType)).map(({ name, negate }) => ({
242-
label: getRuleDescription(name, negate),
243-
onClick: () => {
244-
updateRule(idx, { name, negate })
262+
{[...new Array(findRuleByName(rule.name).operandCount)].map((_, operandIdx) => {
263+
if (rule.castType === 'DATETIME') {
264+
return (
265+
<DateInput
266+
key={operandIdx}
267+
id={`operand-${operandIdx}`}
268+
mode='single'
269+
onChange={(value) => updateOperands(idx, operandIdx, value)}
270+
value={rule.operands[operandIdx]}
271+
/>
272+
)
273+
} else {
274+
return (
275+
<TextInput
276+
key={operandIdx}
277+
id={`operand-${operandIdx}`}
278+
variant='modal'
279+
containerClassName='w-14 md:w-20'
280+
onChange={(value) => updateOperands(idx, operandIdx, value)}
281+
value={rule.operands[operandIdx] ?? ''}
282+
/>
283+
)
245284
}
246-
}))}
247-
>
248-
{(setOpen) => (
249-
<Button
250-
type='button'
251-
onClick={setOpen}
252-
variant='small'
253-
>
254-
{getRuleDescription(rule.name, rule.negate)}
255-
</Button>
256-
)}
257-
</DropdownMenu>
258-
259-
{[...new Array(findRuleByName(rule.name).operandCount)].map((_, operandIdx) => {
260-
if (rule.castType === 'DATETIME') {
261-
return (
262-
<DateInput
263-
key={operandIdx}
264-
id={`operand-${operandIdx}`}
265-
mode='single'
266-
onChange={(value) => updateOperands(idx, operandIdx, value)}
267-
value={rule.operands[operandIdx]}
268-
/>
269-
)
270-
} else {
271-
return (
272-
<TextInput
273-
key={operandIdx}
274-
id={`operand-${operandIdx}`}
275-
variant='modal'
276-
containerClassName='w-14 md:w-20'
277-
onChange={(value) => updateOperands(idx, operandIdx, value)}
278-
value={rule.operands[operandIdx] ?? ''}
279-
/>
280-
)
281-
}
282-
})}
285+
})}
286+
</div>
283287
</div>
284-
</div>
285-
))}
286-
</div>
288+
))}
289+
</div>
287290
}
288291

289292
<div className='w-32'>

0 commit comments

Comments
 (0)