Closed Bonapara closed 5 days ago
To reset the Rating field to 'No Value' on star re-click, follow these steps:
Modify RatingInput
Component:
Update the onClick
handler to reset the value if the clicked star is already selected.
const handleClick = (index: number) => {
if (readonly) return;
const newValue = index === selectedIndex ? null : RATING_VALUES[index];
onChange?.(newValue);
};
return (
<StyledContainer
role="slider"
aria-label="Rating"
aria-valuemax={RATING_VALUES.length}
aria-valuemin={1}
aria-valuenow={selectedIndex + 1}
tabIndex={0}
>
{RATING_VALUES.map((value, index) => {
const isActive = index <= selectedIndex;
return (
<StyledRatingIconContainer
key={index}
color={isActive ? activeColor : inactiveColor}
onClick={() => handleClick(index)}
onMouseEnter={readonly ? undefined : () => setHoveredValue(value)}
onMouseLeave={readonly ? undefined : () => setHoveredValue(null)}
>
<IconTwentyStarFilled size={iconSizeMd} />
</StyledRatingIconContainer>
);
})}
</StyledContainer>
);
Update useRatingField
Hook:
Ensure it supports setting the field to a 'no value' state (e.g., null
).
const [fieldValue, setFieldValue] = useRecoilState<FieldRatingValue | null>(
recordStoreFamilySelector({
recordId: entityId,
fieldName: fieldName,
}),
);
const rating = fieldValue ?? null;
Update RatingFieldInput
Component:
Ensure it handles null
values correctly.
const handleChange = (newRating: FieldRatingValue | null) => {
onSubmit?.(() => persistField(newRating));
};
/packages/twenty-front/src/modules/ui/field/input/components/RatingInput.tsx /packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RatingFieldInput.tsx /packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useRatingField.ts /packages/twenty-front/src/modules/object-record/record-field/meta-types/constants/RatingValues.ts
@Bonapara can i work on this issue
Sure @saloni0419, thanks for contributing!
is it still open i would like to work on this issue ?
@devansh-m12 i am currently working , I will let you know if I am able to solve then
Hi @Bonapara,
I have worked out a solution for this issue. I noticed that @saloni0419 is currently working on it. If the issue does not get closed, I am ready to create a PR with my solution.
Hi @Bonapara,
I have worked out a solution for this issue. I noticed that @saloni0419 is currently working on it. If the issue does not get closed, I am ready to create a PR with my solution.
@Bonapara shall I create a PR?
Hi @Ashmash100, yes you can create a PR as it's been 3 days, we will merge the first one! Thanks
Current Behavior
Once a rating field value is set, it's impossible to return the field to its "no value" state.
https://github.com/twentyhq/twenty/assets/19412894/cd7e3391-78bd-4797-a584-7c28707beb62
Desired Behavior
Clicking again on the selected star should reset the field to its original "no value" state.
For instance, if the field is set to 3, clicking again on the third star should reset the field to "no value."