Merge pull request #113 from HiEventsDev/add-date-quotestion-type

Add Date question type

Author: daveearley

backend/app/DomainObjects/Enums/QuestionTypeEnum.php

@@ -15,4 +15,5 @@ enum QuestionTypeEnum
     case RADIO;
     case DROPDOWN;
     case MULTI_SELECT_DROPDOWN;
+    case DATE;
 }

frontend/src/components/common/CheckoutQuestion/index.tsx

@@ -6,6 +6,7 @@ import countries from "../../../../data/countries.json";
 import {InputGroup} from "../InputGroup";
 import classes from "./CheckoutQuestion.module.scss";
 import {UserGeneratedContent} from "../UserGeneratedContent";
+import {DatePicker} from "@mantine/dates";
 
 interface CheckoutQuestionProps {
     questions: Question[],
@@ -62,6 +63,18 @@ const MultiLineTextInput = ({question, name, form}: QuestionInputProps) => {
     );
 }
 
+const DateInput = ({question, name, form}: QuestionInputProps) => {
+    return (
+        <>
+            <TextInput withAsterisk={question.required}
+                       type="date"
+                       {...form.getInputProps(`${name}.answer`)}
+                       label={question.title}
+            />
+        </>
+    );
+}
+
 const SingleLineTextInput = ({question, name, form}: QuestionInputProps) => {
     return (
         <>
@@ -181,6 +194,9 @@ export const QuestionInput = ({question, name, form}: QuestionInputProps) => {
         case QuestionType.SINGLE_LINE_TEXT:
             input = <SingleLineTextInput question={question} name={name} form={form}/>;
             break;
+        case QuestionType.DATE:
+            input = <DateInput question={question} name={name} form={form}/>;
+            break;
     }
 
     return (

frontend/src/components/forms/QuestionForm/index.tsx

@@ -4,6 +4,7 @@ import {QuestionBelongsToType, QuestionType, Ticket} from "../../../types.ts";
 import {Button, Group, MultiSelect, Switch, TextInput} from "@mantine/core";
 import {
     IconAlignBoxLeftTop,
+    IconCalendar,
     IconCircleCheck,
     IconForms,
     IconMapPin,
@@ -129,6 +130,12 @@ export const QuestionForm = ({form, tickets}: QuestionFormProps) => {
             value: QuestionType.ADDRESS,
             description: t`Shows common address fields, including country`,
         },
+        {
+            icon: <IconCalendar/>,
+            label: t`Date`,
+            value: QuestionType.DATE,
+            description: t`A date input. Perfect for asking for a date of birth etc.`,
+        }
     ];
     const multiAnswerQuestionTypes = [
         QuestionType.CHECKBOX.toString(),
@@ -151,6 +158,7 @@ export const QuestionForm = ({form, tickets}: QuestionFormProps) => {
                     mt={20}
                     label={t`What tickets should this question be apply to?`}
                     multiple
+                    placeholder={t`Select tickets`}
                     data={tickets?.map(ticket => {
                         return {
                             value: String(ticket.id),
@@ -194,6 +202,7 @@ export const QuestionForm = ({form, tickets}: QuestionFormProps) => {
                     variant="transparent"
                     ml={0}
                     pl={0}
+                    mb={10}
                     onClick={() => setShowDescription(true)}
                 >
                     {t`Add description`}
@@ -217,4 +226,4 @@ export const QuestionForm = ({form, tickets}: QuestionFormProps) => {
             />
         </>
     )
-}
+}

frontend/src/locales/de.js

@@ -109,6 +109,10 @@ msgstr "01.01.2024 18:00"
 msgid "94103"
 msgstr "94103"
 
+#: src/components/forms/QuestionForm/index.tsx:136
+msgid "A date input. Perfect for asking for a date of birth etc."
+msgstr "Ein Datumseingabefeld. Perfekt, um nach einem Geburtsdatum usw. zu fragen."
+
 #: src/components/forms/TaxAndFeeForm/index.tsx:87
 msgid "A default {type} is automaticaly applied to all new tickets. You can override this on a per ticket basis."
 msgstr "Auf alle neuen Tickets wird automatisch ein Standard-{type} angewendet. Sie können dies für jedes Ticket einzeln überschreiben."
@@ -204,7 +208,7 @@ msgstr "Aktiv"
 msgid "Add"
 msgstr "Hinzufügen"
 
-#: src/components/forms/QuestionForm/index.tsx:199
+#: src/components/forms/QuestionForm/index.tsx:207
 msgid "Add description"
 msgstr "Beschreibung hinzufügen"
 
@@ -249,15 +253,15 @@ msgstr "Zusatzoptionen"
 msgid "Address"
 msgstr "Adresse"
 
-#: src/components/common/CheckoutQuestion/index.tsx:139
+#: src/components/common/CheckoutQuestion/index.tsx:152
 msgid "Address line 1"
 msgstr "Anschrift Zeile 1"
 
 #: src/components/routes/event/Settings/Sections/LocationSettings/index.tsx:113
 msgid "Address Line 1"
 msgstr "Anschrift Zeile 1"
 
-#: src/components/common/CheckoutQuestion/index.tsx:142
+#: src/components/common/CheckoutQuestion/index.tsx:155
 msgid "Address line 2"
 msgstr "Adresszeile 2"
 
@@ -592,7 +596,7 @@ msgstr "Wählen Sie eine Farbe für Ihren Hintergrund"
 msgid "Choose an account"
 msgstr "Wähle einen Account"
 
-#: src/components/common/CheckoutQuestion/index.tsx:145
+#: src/components/common/CheckoutQuestion/index.tsx:158
 #: src/components/routes/event/Settings/Sections/LocationSettings/index.tsx:125
 msgid "City"
 msgstr "Stadt"
@@ -772,7 +776,7 @@ msgstr "Link kopieren"
 msgid "Copy URL"
 msgstr "URL kopieren"
 
-#: src/components/common/CheckoutQuestion/index.tsx:157
+#: src/components/common/CheckoutQuestion/index.tsx:170
 #: src/components/routes/event/Settings/Sections/LocationSettings/index.tsx:143
 msgid "Country"
 msgstr "Land"
@@ -907,6 +911,7 @@ msgid "Dashboard"
 msgstr "Armaturenbrett"
 
 #: src/components/common/OrderDetails/index.tsx:31
+#: src/components/forms/QuestionForm/index.tsx:134
 msgid "Date"
 msgstr "Datum"
 
@@ -1420,7 +1425,7 @@ msgstr "versteckte Frage"
 msgid "hidden questions"
 msgstr "versteckte Fragen"
 
-#: src/components/forms/QuestionForm/index.tsx:215
+#: src/components/forms/QuestionForm/index.tsx:223
 msgid "Hidden questions are only visible to the event organizer and not to the customer."
 msgstr "Versteckte Fragen sind nur für den Veranstalter und nicht für den Kunden sichtbar."
 
@@ -1441,7 +1446,7 @@ msgstr "Versteckte Fragen ausblenden"
 msgid "Hide the getting started page from the sidebar"
 msgstr "Blenden Sie die Seite „Erste Schritte“ in der Seitenleiste aus."
 
-#: src/components/forms/QuestionForm/index.tsx:216
+#: src/components/forms/QuestionForm/index.tsx:224
 msgid "Hide this question"
 msgstr "Diese Frage verbergen"
 
@@ -1657,7 +1662,7 @@ msgstr "Ausloggen"
 msgid "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam placerat elementum..."
 msgstr "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ich habe das Element platziert …"
 
-#: src/components/forms/QuestionForm/index.tsx:209
+#: src/components/forms/QuestionForm/index.tsx:217
 msgid "Make this question mandatory"
 msgstr "Machen Sie diese Frage obligatorisch"
 
@@ -1699,7 +1704,7 @@ msgstr "Verwalten Sie Ihre Stripe-Zahlungsdetails"
 msgid "Manage your users and their permissions"
 msgstr "Verwalten Sie Ihre Benutzer und deren Berechtigungen"
 
-#: src/components/forms/QuestionForm/index.tsx:208
+#: src/components/forms/QuestionForm/index.tsx:216
 msgid "Mandatory questions must be answered before the customer can checkout."
 msgstr "Bevor der Kunde zur Kasse gehen kann, müssen obligatorische Fragen beantwortet werden."
 
@@ -2269,7 +2274,7 @@ msgstr "Promo-Codes"
 msgid "Promo codes can be used to offer discounts, presale access, or provide special access to your event."
 msgstr "Mit Promo-Codes können Sie Rabatte oder Vorverkaufszugang anbieten oder Sonderzugang zu Ihrer Veranstaltung gewähren."
 
-#: src/components/forms/QuestionForm/index.tsx:187
+#: src/components/forms/QuestionForm/index.tsx:194
 msgid ""
 "Provide additional context or instructions for this question. Use this field to add terms\n"
 "and conditions, guidelines, or any important information that attendees need to know before answering."
@@ -2288,11 +2293,11 @@ msgstr "Verfügbare Menge"
 msgid "Question deleted"
 msgstr "Frage gelöscht"
 
-#: src/components/forms/QuestionForm/index.tsx:186
+#: src/components/forms/QuestionForm/index.tsx:193
 msgid "Question Description"
 msgstr "Fragebeschreibung"
 
-#: src/components/forms/QuestionForm/index.tsx:176
+#: src/components/forms/QuestionForm/index.tsx:183
 msgid "Question Title"
 msgstr "Fragentitel"
 
@@ -2525,6 +2530,10 @@ msgstr "Ticket auswählen"
 msgid "Select Ticket Tier"
 msgstr "Ticketstufe auswählen"
 
+#: src/components/forms/QuestionForm/index.tsx:160
+msgid "Select tickets"
+msgstr "Tickets auswählen"
+
 #: src/components/forms/TicketForm/index.tsx:270
 msgid "Select..."
 msgstr "Wählen..."
@@ -2713,7 +2722,7 @@ msgstr "Standardticket zum Festpreis"
 msgid "Start Date"
 msgstr "Startdatum"
 
-#: src/components/common/CheckoutQuestion/index.tsx:148
+#: src/components/common/CheckoutQuestion/index.tsx:161
 #: src/components/routes/event/Settings/Sections/LocationSettings/index.tsx:130
 msgid "State or Region"
 msgstr "Staat oder Region"
@@ -3330,15 +3339,15 @@ msgstr "Was sind Stufentickets?"
 msgid "What tickets does this code apply to? (Applies to all by default)"
 msgstr "Für welche Tickets gilt dieser Code? (Gilt standardmäßig für alle)"
 
-#: src/components/forms/QuestionForm/index.tsx:152
+#: src/components/forms/QuestionForm/index.tsx:158
 msgid "What tickets should this question be apply to?"
 msgstr "Auf welche Tickets soll sich diese Frage beziehen?"
 
-#: src/components/forms/QuestionForm/index.tsx:177
+#: src/components/forms/QuestionForm/index.tsx:184
 msgid "What time will you be arriving?"
 msgstr "Um wie viel Uhr werden Sie ankommen?"
 
-#: src/components/forms/QuestionForm/index.tsx:167
+#: src/components/forms/QuestionForm/index.tsx:174
 msgid "What type of question is this?"
 msgstr "Um welche Art von Frage handelt es sich?"
 
@@ -3350,7 +3359,7 @@ msgstr "Wer organisiert diese Veranstaltung?"
 msgid "Who is this message to?"
 msgstr "An wen ist diese Nachricht gerichtet?"
 
-#: src/components/forms/QuestionForm/index.tsx:143
+#: src/components/forms/QuestionForm/index.tsx:149
 msgid "Who should be asked this question?"
 msgstr "Wem sollte diese Frage gestellt werden?"
 
@@ -3545,7 +3554,7 @@ msgstr "Ihre Rückerstattung wird bearbeitet."
 msgid "Your ticket for"
 msgstr "Ihr Ticket für"
 
-#: src/components/common/CheckoutQuestion/index.tsx:153
+#: src/components/common/CheckoutQuestion/index.tsx:166
 #: src/components/routes/event/Settings/Sections/LocationSettings/index.tsx:137
 msgid "Zip or Postal Code"
 msgstr "Postleitzahl"