fix: misc bugfixes (#22)

## Description

- Fixed a bug with co-hosts
- Fixed a bug with event category description
- Refactored how dates are sent into the server
- Added a small advice regarding dates

Closes: BON-812 BON-813

<!-- Add a description of the changes that this PR introduces and the
files that
are the most critical to review. -->

---

### Author Checklist

*All items are required. Please add a note to the item if the item is
not applicable and
please add links to any relevant follow up issues.*

I have...

- [ ] included the correct [type
prefix](https://github.com/commitizen/conventional-commit-types/blob/v3.0.0/index.json)
  in the PR title
- [ ] targeted the correct branch
- [ ] provided a link to the relevant issue or specification
- [ ] reviewed "Files changed" and left comments if necessary
- [ ] confirmed all CI checks have passed

### Reviewers Checklist

*All items are required. Please add a note if the item is not applicable
and please add
your handle next to the items reviewed if you only reviewed selected
items.*

I have...

- [ ] confirmed the
correct [type
prefix](https://github.com/commitizen/conventional-commit-types/blob/v3.0.0/index.json)
in the PR title
- [ ] confirmed all author checklist items have been addressed

app/creator/create/BondscapeDateTimePicker/BondscapeDateTimePicker.tsx

@@ -1,5 +1,7 @@
 import { DatePicker } from "antd";
 import dayjs from "dayjs";
+import timezone from "dayjs/plugin/timezone";
+import utc from "dayjs/plugin/utc";
 import React, { useState } from "react";
 import "./style.css";
 
@@ -25,6 +27,9 @@ const BondscapeDateTimePicker = ({
   const [minDate, setMinDate] = useState<dayjs.Dayjs>();
   const [maxDate, setMaxDate] = useState<dayjs.Dayjs>();
 
+  dayjs.extend(utc);
+  dayjs.extend(timezone);
+
   const ClearIcon = () => {
     return (
       <svg
@@ -62,15 +67,11 @@ const BondscapeDateTimePicker = ({
         <div className="flex flex-1">
           <DatePicker
             value={initialStartValue ? dayjs(initialStartValue) : undefined}
-            disabledDate={
-              maxDate
-                ? (current) => current > maxDate || current < dayjs()
-                : (current) => current < dayjs()
-            }
+            disabledDate={maxDate ? (current) => current > maxDate : undefined}
             onChange={(date) => {
-              setMinDate(date || dayjs());
+              setMinDate(date || undefined);
               if (date) {
-                onChangeStart(date.toISOString());
+                onChangeStart(dayjs.utc(date).tz().format());
               } else {
                 onChangeStart(undefined);
               }
@@ -96,15 +97,11 @@ const BondscapeDateTimePicker = ({
         <div className="flex flex-1">
           <DatePicker
             value={initialEndValue ? dayjs(initialEndValue) : undefined}
-            disabledDate={
-              minDate
-                ? (current) => current < minDate
-                : (current) => current < dayjs().add(1, "hour")
-            }
+            disabledDate={minDate ? (current) => current < minDate : undefined}
             onChange={(date) => {
               setMaxDate(date || undefined);
               if (date) {
-                onChangeEnd(date.toISOString());
+                onChangeEnd(dayjs.utc(date).tz().format());
               } else {
                 onChangeEnd(undefined);
               }

app/creator/create/[[...id]]/CreateTicketCategory.tsx

@@ -112,7 +112,7 @@ const CreateTicketCategory = ({
                       />
                       <BigTextInput
                         title={"Description"}
-                        inputName={"ticketDescription"}
+                        inputName={"description"}
                         placeholder={
                           "Add an optional description of the advantages granted by your NFT ticket, if any."
                         }
@@ -195,6 +195,11 @@ const CreateTicketCategory = ({
                           setFieldValue("availableUntil", value)
                         }
                       />
+                      <div className="text-bondscape-text_neutral_900 text-[12px] font-normal">
+                        {
+                          "The availability time will be in the time zone based on where the event will be held."
+                        }
+                      </div>
                       <div className="flex flex-col bg-bondscape-text_neutral_100 rounded-[16px] gap-[0.75rem] py-[16px]">
                         <BondscapeSelectValidators
                           label={"Verifiers"}

app/creator/create/[[...id]]/MainSection.tsx

@@ -1,16 +1,16 @@
-import { ErrorMessage, Form, FormikProps } from "formik";
-import CoverPicDropZone from "@/creator/create/CoverPicDropZone";
+import BondscapeButton from "@/components/BondscapeButton";
 import BigTextInput from "@/creator/create/BigTextInput";
 import BondscapeDateTimePicker from "@/creator/create/BondscapeDateTimePicker/BondscapeDateTimePicker";
 import BondscapeSelectCategory from "@/creator/create/BondscapeSelectCategory";
-import SmallTextInput from "@/creator/create/SmallTextInput";
-import LocationInput from "@/creator/create/LocationInput";
 import BondscapeSelectCoHosts from "@/creator/create/BondscapeSelectCoHosts";
 import BondscapeSelectTags from "@/creator/create/BondscapeSelectTags";
-import BondscapeButton from "@/components/BondscapeButton";
-import React from "react";
+import CoverPicDropZone from "@/creator/create/CoverPicDropZone";
+import LocationInput from "@/creator/create/LocationInput";
+import SmallTextInput from "@/creator/create/SmallTextInput";
 import useUser from "@/hooks/user/useUser";
 import { CreateEventValues, Organizer } from "@/types/event";
+import { ErrorMessage, Form, FormikProps } from "formik";
+import React from "react";
 
 interface MainSectionProps {
   readonly title: string;
@@ -90,6 +90,11 @@ const MainSection = ({
               onChangeStart={(value) => setFieldValue("startDate", value)}
               onChangeEnd={(value) => setFieldValue("endDate", value)}
             />
+            <div className="text-bondscape-text_neutral_900 text-[12px] font-normal">
+              {
+                "The start/end time of the event will be in the time zone based on where the event will be held."
+              }
+            </div>
             <BondscapeSelectCategory
               initialCategories={values.categories}
               required={false}

app/hooks/events/useCreateEvent.ts

@@ -110,9 +110,8 @@ export const useCreateEvent = () => {
         (organizer) => organizer.organizerAddress,
       );
       // Add the user's address to the list of organizers if it's a new event
-      if (!eventId) {
-        organizersAddresses.unshift(user.profile.address);
-      }
+      organizersAddresses.unshift(user.profile.address);
+      console.log(organizersAddresses);
       // Load the cover picture if it exists
       let coverPicUrl = values.coverPicUrl;
       if (values.coverPic) {
@@ -127,7 +126,15 @@ export const useCreateEvent = () => {
         }
       }
 
-      let eventCreationResult: any;
+      let eventCreationResult: Result<
+        {
+          data: {
+            event_id: string;
+          };
+          type: "create" | "edit";
+        },
+        Error
+      >;
 
       const eventParams = {
         status: values.status,
@@ -148,20 +155,16 @@ export const useCreateEvent = () => {
           eventId,
           ...eventParams,
         });
-      } else {
-        eventCreationResult = await CreateEvent({
-          ...eventParams,
-        });
-      }
-
-      // Check the result: if it's ok, create ticket categories and then redirect to the events page and show a success toast, otherwise show an error toast
-      let ticketCategoryDeleteResult;
-      if (eventCreationResult.isOk() || eventId) {
+        if (eventCreationResult.isErr()) {
+          toast.error(eventCreationResult.error.message);
+          return;
+        }
+        let ticketCategoryDeleteResult;
         if (ticketCategoriesToDelete.length > 0) {
           ticketCategoryDeleteResult = await Promise.all(
             ticketCategoriesToDelete.map(async (ticketCategoryId) => {
               return DeleteTicketCategory({
-                eventId: eventCreationResult.value.data.event_id ?? eventId,
+                eventId,
                 categoryId: ticketCategoryId,
               });
             }),
@@ -176,13 +179,26 @@ export const useCreateEvent = () => {
           });
           return;
         }
+      } else {
+        eventCreationResult = await CreateEvent({
+          ...eventParams,
+        });
+
+        if (eventCreationResult.isErr()) {
+          toast.error(eventCreationResult.error.message);
+          return;
+        }
+      }
 
+      // Check the result: if it's ok, create ticket categories and then redirect to the events page and show a success toast, otherwise show an error toast
+      if (eventCreationResult.isOk()) {
         let ticketCategoryCreationResult: Result<any, Error>[] = [];
+        const id = eventCreationResult.value.data.event_id ?? eventId;
         if (values.ticketsCategories) {
           ticketCategoryCreationResult = await Promise.all(
             values.ticketsCategories.map((ticketCategory) => {
               return createTicketCategory(
-                eventCreationResult.value.data.event_id ?? eventId,
+                id,
                 ticketCategory,
                 ticketCategory.id,
               );
@@ -205,8 +221,6 @@ export const useCreateEvent = () => {
             : "Event updated successfully",
         );
         router.replace(`/creator/events`);
-      } else {
-        toast.error(eventCreationResult.error.message);
       }
     },
     [createTicketCategory, router, ticketCategoriesToDelete, user],

app/services/axios/requests/EditEvent/index.ts

@@ -17,7 +17,15 @@ const EditEvent = ({
   website,
 }: EventRequestParams & {
   eventId: string;
-}): ResultAsync<any, Error> => {
+}): ResultAsync<
+  {
+    data: {
+      event_id: string;
+    };
+    type: "create" | "edit";
+  },
+  Error
+> => {
   return ResultAsync.fromPromise(
     axiosInstance.put(`/events/${eventId}`, {
       status,