Skip to content

Commit

Permalink
Remove comment field from join event form when not required
Browse files Browse the repository at this point in the history
  • Loading branch information
@ivarnakken
ivarnakken committed Oct 28, 2024
1 parent d9d37a8 commit 16c6920
Show file tree
Hide file tree
Showing 2 changed files with 59 additions and 67 deletions.
5 changes: 2 additions & 3 deletions app/routes/events/components/EventAdministrate/Allergies.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -133,9 +133,8 @@ const Allergies = () => {
title: 'Tilbakemelding',
dataIndex: 'feedback',
centered: false,
render: (feedback: RegistrationWithAllergies['feedback']) => (
<span>{feedback || '-'}</span>
),
render: (feedback: RegistrationWithAllergies['feedback']) =>
feedback ? <span>{feedback}</span> : <EmptyState body="-" />,
sorter: (a: RegistrationWithAllergies, b: RegistrationWithAllergies) =>
a.feedback.localeCompare(b.feedback),
})
Expand Down
121 changes: 57 additions & 64 deletions app/routes/events/components/JoinEventForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,6 @@ const PaymentForm = ({
);

type FormValues = {
feedbackRequired: string;
feedback?: string;
captchaResponse: string;
};
Expand Down Expand Up @@ -207,8 +206,6 @@ const JoinEventForm = ({ title, event, registration }: Props) => {

const joinTitle = !registration ? 'Meld deg på' : 'Avregistrer';
const registrationType = !registration ? 'register' : 'unregister';
const feedbackName = getFeedbackName(event);
const feedbackLabel = getFeedbackLabel(event);
const disabledForUser =
!fetching && !formOpen && !event.activationTime && !registration;
const showPenaltyNotice = Boolean(
Expand Down Expand Up @@ -271,7 +268,7 @@ const JoinEventForm = ({ title, event, registration }: Props) => {
register({
eventId: event.id,
captchaResponse: values.captchaResponse,
feedback: values[feedbackName] ?? '',
feedback: values.feedback ?? '',
userId: currentUser.id,
}),
);
Expand Down Expand Up @@ -307,7 +304,7 @@ const JoinEventForm = ({ title, event, registration }: Props) => {
};

const validate = createValidator({
[feedbackName]: [
feedback: [
requiredIf(
() => !registration && event.feedbackRequired,
'Svar er påkrevd for dette arrangementet',
Expand All @@ -318,8 +315,8 @@ const JoinEventForm = ({ title, event, registration }: Props) => {
],
});

const initialValues = registration
? { [feedbackName]: registration.feedback }
const initialValues: Partial<FormValues> = registration
? { feedback: registration.feedback }
: {};

return (
Expand Down Expand Up @@ -384,7 +381,7 @@ const JoinEventForm = ({ title, event, registration }: Props) => {
>
{({ form, handleSubmit, submitting, pristine, invalid }) => {
if (event.feedbackRequired) {
form.blur('feedbackRequired');
form.blur('feedback');
}

const isInvalid = registrationOpensIn !== null || invalid;
Expand Down Expand Up @@ -462,60 +459,64 @@ const JoinEventForm = ({ title, event, registration }: Props) => {
/>
)}

<div>
<label
htmlFor={feedbackName}
className={styles.feedbackLabel}
>
{feedbackLabel}
</label>
<Flex alignItems="center" gap="var(--spacing-md)">
{spyValues((values: FormValues) => (
<Field
id={feedbackName}
placeholder="Kommentar"
name={feedbackName}
component={TextInput.Field}
className={styles.feedbackText}
onKeyDown={(e) => {
if (e.key === 'Enter' && registration) {
// Prevent user from unregistering by pressing enter
e.preventDefault();

if (!pristine) {
{(event.feedbackRequired ||
(event.feedbackDescription &&
event.feedbackDescription !== '')) && (
<div>
<label
htmlFor="feedback"
className={styles.feedbackLabel}
>
{event.feedbackDescription}
</label>
<Flex alignItems="center" gap="var(--spacing-md)">
{spyValues((values: FormValues) => (
<Field
id="feedback"
name="feedback"
placeholder="Kommentar"
component={TextInput.Field}
className={styles.feedbackText}
onKeyDown={(e) => {
if (e.key === 'Enter' && registration) {
// Prevent user from unregistering by pressing enter
e.preventDefault();

if (!pristine) {
dispatch(
updateFeedback(
event.id,
registration.id,
values.feedback ?? '',
),
);
}
}
}}
withoutMargin
parse={(value) => value} // Prevent react-final-form from removing empty string in patch request
/>
))}
{registration &&
spyValues((values: FormValues) => (
<Button
onPress={() => {
dispatch(
updateFeedback(
event.id,
registration.id,
values[feedbackName] ?? '',
values.feedback ?? '',
),
);
}
}
}}
withoutMargin
parse={(value) => value} // Prevent react-final-form from removing empty string in patch request
/>
))}
{registration &&
spyValues((values: FormValues) => (
<Button
onPress={() => {
dispatch(
updateFeedback(
event.id,
registration.id,
values[feedbackName] ?? '',
),
);
}}
disabled={pristine}
>
Oppdater
</Button>
))}
</Flex>
</div>
}}
disabled={pristine}
>
Oppdater
</Button>
))}
</Flex>
</div>
)}
</Form>
);
}}
Expand All @@ -537,12 +538,4 @@ const JoinEventForm = ({ title, event, registration }: Props) => {
);
};

function getFeedbackName(event: UserDetailedEvent) {
return event.feedbackRequired ? 'feedbackRequired' : 'feedback';
}

function getFeedbackLabel(event: UserDetailedEvent) {
return event.feedbackDescription || 'Kommentar';
}

export default JoinEventForm;

0 comments on commit 16c6920

Please sign in to comment.