2927: Started work on upgrading poster component to work with v2 api

Author: tuj

src/components/slide/content/poster-selector.jsx

@@ -79,6 +79,8 @@ function PosterSelector({
         "singleSelectedOccurrence"
       );
 
+      console.log(occurrenceId, "occurrenceId");
+
       if (eventId !== null) {
         fetch(`${url}?path=${eventId}`, {
           headers,
@@ -93,12 +95,12 @@ function PosterSelector({
       }
 
       if (occurrenceId !== null) {
-        fetch(`${url}?path=${occurrenceId}`, {
+        fetch(`${url}?path=/occurrences/${occurrenceId}`, {
           headers,
         })
           .then((response) => response.json())
           .then((data) => {
-            setSingleSelectedOccurrence(data);
+            setSingleSelectedOccurrence(data["hydra:member"][0]);
           })
           .catch(() => {
             // TODO: Display error.
@@ -121,7 +123,7 @@ function PosterSelector({
       target: {
         id: "singleSelectedOccurrence",
         value: singleSelectedOccurrence
-          ? singleSelectedOccurrence["@id"]
+          ? singleSelectedOccurrence.entityId
           : null,
       },
     });
@@ -235,7 +237,7 @@ function PosterSelector({
 
     switch (singleSearchType) {
       case "title":
-        query = `${query}&name=${singleSearch}`;
+        query = `${query}&title=${singleSearch}`;
         break;
       case "url":
         query = `${query}&url=${singleSearch}`;
@@ -303,7 +305,7 @@ function PosterSelector({
     let query = `?type=${type}&display=options`;
 
     if (inputValue) {
-      query = `${query}&name=${inputValue}`;
+      query = `${query}&title=${inputValue}`;
     }
 
     // TODO: Get this endpoint in a different way.
@@ -391,7 +393,7 @@ function PosterSelector({
                           {singleSelectedEvent && (
                             <div>
                               <strong>Valgt begivenhed:</strong>{" "}
-                              {singleSelectedEvent.name} (
+                              {singleSelectedEvent.title} (
                               {singleSelectedEvent?.organizer?.name})
                             </div>
                           )}
@@ -400,7 +402,7 @@ function PosterSelector({
                               <strong>
                                 {t("poster-selector.chosen-occurrence")}:
                               </strong>{" "}
-                              {formatDate(singleSelectedOccurrence.startDate)} -
+                              {formatDate(singleSelectedOccurrence.start)} -
                               {singleSelectedOccurrence.ticketPriceRange}
                             </div>
                           )}
@@ -596,23 +598,23 @@ function PosterSelector({
                                   onClick={() => handleSelectEvent(searchEvent)}
                                 >
                                   <td>
-                                    {searchEvent?.images?.small && (
+                                    {searchEvent?.imageUrls?.small && (
                                       <img
-                                        src={searchEvent?.images?.small}
-                                        alt={searchEvent?.name}
+                                        src={searchEvent?.imageUrls?.small}
+                                        alt={searchEvent?.title}
                                         style={{ maxWidth: "80px" }}
                                       />
                                     )}
                                   </td>
                                   <td>
-                                    <strong>{searchEvent.name}</strong>
+                                    <strong>{searchEvent.title}</strong>
                                     <br />
                                     {searchEvent.organizer.name}
                                   </td>
                                   <td>
                                     {searchEvent?.occurrences?.length > 0 &&
                                       formatDate(
-                                        searchEvent?.occurrences[0]?.startDate
+                                        searchEvent?.occurrences[0]?.start
                                       )}
                                     {searchEvent?.occurrences?.length > 1 && (
                                       <span>, ...</span>
@@ -658,7 +660,7 @@ function PosterSelector({
                                   {singleSelectedEvent?.occurrences?.map(
                                     (occurrence) => (
                                       <tr>
-                                        <td>{occurrence.startDate}</td>
+                                        <td>{occurrence.start}</td>
                                         <td>{occurrence.ticketPriceRange}</td>
                                         <td>
                                           <Button
@@ -844,7 +846,7 @@ function PosterSelector({
                                   <tr>
                                     <td>
                                       <img
-                                        src={event?.images?.small}
+                                        src={event?.imageUrls?.small}
                                         alt={event.name}
                                         style={{ maxWidth: "80px" }}
                                       />
@@ -862,10 +864,10 @@ function PosterSelector({
                                       {firstOccurrence && (
                                         <>
                                           {`${formatDate(
-                                            firstOccurrence.startDate,
+                                            firstOccurrence.start,
                                             "L"
                                           )} - ${formatDate(
-                                            firstOccurrence.endDate,
+                                            firstOccurrence.end,
                                             "L"
                                           )}`}
                                         </>