Skip to content

Commit fcbe25e

Browse files
committed
Reorder input fields for better logical flow
1 parent 47675bc commit fcbe25e

File tree

2 files changed

+99
-87
lines changed

2 files changed

+99
-87
lines changed

frontend/src/components/grant-form/index.tsx

Lines changed: 92 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -374,6 +374,23 @@ export const GrantForm = ({
374374
required={false}
375375
/>
376376
</InputWrapper>
377+
378+
<InputWrapper
379+
required={true}
380+
title={<FormattedMessage id="grants.form.fields.nationality" />}
381+
description={
382+
<FormattedMessage id="grants.form.fields.nationality.description" />
383+
}
384+
>
385+
<Input
386+
{...text("nationality")}
387+
required={true}
388+
maxLength={100}
389+
placeholder={inputPlaceholderText}
390+
errors={getErrors("nationality")}
391+
/>
392+
</InputWrapper>
393+
377394
<InputWrapper
378395
required={true}
379396
title={<FormattedMessage id="grants.form.fields.ageGroup" />}
@@ -458,88 +475,6 @@ export const GrantForm = ({
458475
</Select>
459476
</InputWrapper>
460477

461-
<InputWrapper
462-
required={true}
463-
title={
464-
<FormattedMessage id="grants.form.fields.travellingFrom" />
465-
}
466-
description={
467-
<FormattedMessage id="grants.form.fields.travellingFrom.description" />
468-
}
469-
>
470-
<Select
471-
{...select("travellingFrom")}
472-
required={true}
473-
errors={getErrors("travellingFrom")}
474-
>
475-
<FormattedMessage id="input.selectCountryPlaceholder">
476-
{(msg) => (
477-
<option value="" disabled>
478-
{msg}
479-
</option>
480-
)}
481-
</FormattedMessage>
482-
{countries.map((c) => (
483-
<option key={c.value} value={c.value}>
484-
{c.label}
485-
</option>
486-
))}
487-
</Select>
488-
</InputWrapper>
489-
490-
<InputWrapper
491-
required={true}
492-
title={<FormattedMessage id="grants.form.fields.nationality" />}
493-
description={
494-
<FormattedMessage id="grants.form.fields.nationality.description" />
495-
}
496-
>
497-
<Input
498-
{...text("nationality")}
499-
required={true}
500-
maxLength={100}
501-
placeholder={inputPlaceholderText}
502-
errors={getErrors("nationality")}
503-
/>
504-
</InputWrapper>
505-
506-
<InputWrapper
507-
required={true}
508-
title={<FormattedMessage id="grants.form.fields.departureCity" />}
509-
description={
510-
<FormattedMessage id="grants.form.fields.departureCity.description" />
511-
}
512-
>
513-
<Input
514-
{...text("departureCity")}
515-
required={true}
516-
maxLength={100}
517-
placeholder={inputPlaceholderText}
518-
errors={getErrors("departureCity")}
519-
/>
520-
</InputWrapper>
521-
<InputWrapper
522-
title={
523-
<FormattedMessage id="grants.form.fields.needsFundsForTravel" />
524-
}
525-
description={
526-
<FormattedMessage id="grants.form.fields.needsFundsForTravel.description" />
527-
}
528-
required={true}
529-
>
530-
<Select {...select("needsFundsForTravel")} required={true}>
531-
<FormattedMessage id="global.selectOption">
532-
{(msg) => <option value="">{msg}</option>}
533-
</FormattedMessage>
534-
<FormattedMessage id="global.no">
535-
{(msg) => <option value="false">{msg}</option>}
536-
</FormattedMessage>
537-
<FormattedMessage id="global.yes">
538-
{(msg) => <option value="true">{msg}</option>}
539-
</FormattedMessage>
540-
</Select>
541-
</InputWrapper>
542-
543478
<InputWrapper
544479
title={<FormattedMessage id="grants.form.fields.needVisa" />}
545480
description={
@@ -602,6 +537,81 @@ export const GrantForm = ({
602537
</MultiplePartsCard>
603538
<Spacer size="medium" />
604539

540+
<MultiplePartsCard>
541+
<CardPart contentAlign="left">
542+
<Heading size={3}>
543+
<FormattedMessage id="grants.form.travel" />
544+
</Heading>
545+
</CardPart>
546+
<CardPart contentAlign="left" background="milk">
547+
<InputWrapper
548+
title={
549+
<FormattedMessage id="grants.form.fields.needsFundsForTravel" />
550+
}
551+
description={
552+
<FormattedMessage id="grants.form.fields.needsFundsForTravel.description" />
553+
}
554+
required={true}
555+
>
556+
<Select {...select("needsFundsForTravel")} required={true}>
557+
<FormattedMessage id="global.selectOption">
558+
{(msg) => <option value="">{msg}</option>}
559+
</FormattedMessage>
560+
<FormattedMessage id="global.no">
561+
{(msg) => <option value="false">{msg}</option>}
562+
</FormattedMessage>
563+
<FormattedMessage id="global.yes">
564+
{(msg) => <option value="true">{msg}</option>}
565+
</FormattedMessage>
566+
</Select>
567+
</InputWrapper>
568+
569+
<InputWrapper
570+
required={true}
571+
title={<FormattedMessage id="grants.form.fields.travellingFrom" />}
572+
description={
573+
<FormattedMessage id="grants.form.fields.travellingFrom.description" />
574+
}
575+
>
576+
<Select
577+
{...select("travellingFrom")}
578+
required={true}
579+
errors={getErrors("travellingFrom")}
580+
>
581+
<FormattedMessage id="input.selectCountryPlaceholder">
582+
{(msg) => (
583+
<option value="" disabled>
584+
{msg}
585+
</option>
586+
)}
587+
</FormattedMessage>
588+
{countries.map((c) => (
589+
<option key={c.value} value={c.value}>
590+
{c.label}
591+
</option>
592+
))}
593+
</Select>
594+
</InputWrapper>
595+
596+
<InputWrapper
597+
required={true}
598+
title={<FormattedMessage id="grants.form.fields.departureCity" />}
599+
description={
600+
<FormattedMessage id="grants.form.fields.departureCity.description" />
601+
}
602+
>
603+
<Input
604+
{...text("departureCity")}
605+
required={true}
606+
maxLength={100}
607+
placeholder={inputPlaceholderText}
608+
errors={getErrors("departureCity")}
609+
/>
610+
</InputWrapper>
611+
</CardPart>
612+
</MultiplePartsCard>
613+
614+
<Spacer size="medium" />
605615
<MultiplePartsCard>
606616
<CardPart contentAlign="left">
607617
<Heading size={3}>

frontend/src/locale/index.ts

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -694,6 +694,7 @@ We look forward to reading about you and hope to see you at PyCon Italia 2024!
694694
"grants.form.sent.linkMyGrant.text": "profile page",
695695
"grants.form.aboutYou": "About you",
696696
"grants.form.yourGrant": "Your grant",
697+
"grants.form.travel": "Travel",
697698
"grants.form.youAndPython": "You and Python",
698699

699700
"grants.form.optionalInformation": "Optional information",
@@ -708,6 +709,9 @@ We look forward to reading about you and hope to see you at PyCon Italia 2024!
708709
"grants.form.fields.email": "Email",
709710
"grants.form.fields.email.description":
710711
"Here you will receive a notification about your application.",
712+
"grants.form.fields.nationality": "What is your nationality?",
713+
"grants.form.fields.nationality.description":
714+
"Please indicate your nationality.",
711715
"grants.form.fields.ageGroup": "Age group",
712716
"grants.form.fields.ageGroup.description":
713717
"Select your age group. This helps us understand the demographic distribution of our applicants.",
@@ -739,9 +743,6 @@ We look forward to reading about you and hope to see you at PyCon Italia 2024!
739743
"Which country will you be travelling from?",
740744
"grants.form.fields.travellingFrom.description":
741745
"Please select the country you will be departing from to attend the conference.",
742-
"grants.form.fields.nationality": "What is your nationality?",
743-
"grants.form.fields.nationality.description":
744-
"Please indicate your nationality.",
745746
"grants.form.fields.departureCity":
746747
"What city will you be travelling from?",
747748
"grants.form.fields.departureCity.description":
@@ -1425,6 +1426,7 @@ Non vediamo l'ora di leggere la tua storia e speriamo di vederti a PyCon Italia
14251426
"Richiesta di grant inviata! Ti invieremo un'email appena ci saranno novità! Nel frattempo, puoi controllare lo stato e modificare il tuo grant nella tua {linkMyGrant} fino al {grantsDeadline}.",
14261427
"grants.form.sent.linkMyGrant.text": "pagina del profilo",
14271428
"grants.form.aboutYou": "Su di te",
1429+
"grants.form.travel": "Viaggio",
14281430
"grants.form.optionalInformation": "Informazioni opzionali",
14291431
"grants.form.optionalInformation.description":
14301432
"Questo informazioni ci aiutano a rendere la conferenza più inclusiva e diversa.",
@@ -1438,6 +1440,8 @@ Non vediamo l'ora di leggere la tua storia e speriamo di vederti a PyCon Italia
14381440
"grants.form.fields.email": "Email",
14391441
"grants.form.fields.email.description":
14401442
"Qui riceverai una notifica sulla tua richiesta",
1443+
"grants.form.fields.nationality": "Da quale città partirai?",
1444+
"grants.form.fields.nationality.description": "Indica la tua nazionalità.",
14411445
"grants.form.fields.ageGroup": "Fascia d'età",
14421446
"grants.form.fields.ageGroup.description":
14431447
"Seleziona la tua fascia d'età. Questo ci aiuta a comprendere la distribuzione demografica dei nostri candidati.",
@@ -1467,8 +1471,6 @@ Non vediamo l'ora di leggere la tua storia e speriamo di vederti a PyCon Italia
14671471
"grants.form.fields.travellingFrom": "Da quale paese partirai?",
14681472
"grants.form.fields.travellingFrom.description":
14691473
"Seleziona il paese da cui partirai per partecipare alla conferenza.",
1470-
"grants.form.fields.nationality": "Da quale città partirai?",
1471-
"grants.form.fields.nationality.description": "Indica la tua nazionalità.",
14721474
"grants.form.fields.departureCity": "Qual è la tua nazionalità?",
14731475
"grants.form.fields.departureCity.description":
14741476
"Indica la città da cui inizierai il tuo viaggio.",

0 commit comments

Comments
 (0)