Merge pull request #569 from Studio-Yandex-Practicum/bugfix-festival-…

…event-card Bugfix-festival-event-card
Studio-Yandex-Practicum · Sep 3, 2024 · 10c6137 · 10c6137
2 parents a0e8bf3 + a5fe1bd
commit 10c6137
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 6 deletions.
diff --git a/src/components/festival-event-card/festival-event-card.module.css b/src/components/festival-event-card/festival-event-card.module.css
@@ -112,12 +112,21 @@
 
 .actions {
   display: flex;
-  align-items: flex-start;
-  justify-content: flex-end;
+  flex-direction: row;
+  align-items: stretch;
+  justify-content: space-between;
   grid-area: actions;
+
+  @media (min-width: $tablet-portrait) {
+    width: fit-content;
+    flex-direction: column;
+    justify-content: flex-start;
+    gap: 16px;
+  }
 }
 
 .button {
+  justify-content: flex-start;
   padding: 0 2px 2px 0;
 }
 

diff --git a/src/components/festival-event-card/festival-event-card.tsx b/src/components/festival-event-card/festival-event-card.tsx
@@ -15,6 +15,7 @@ export interface FestivalEventCardProps {
   title: string
   description?: string
   credits: CreditsRole[]
+  aboutUrl?: string
   actionUrl?: Url | null
   className?: string
 }
@@ -29,6 +30,7 @@ export const FestivalEventCard: React.VFC<FestivalEventCardProps> = (props) => {
     title,
     description,
     credits,
+    aboutUrl,
     actionUrl,
     className
   } = props;
@@ -73,8 +75,27 @@ export const FestivalEventCard: React.VFC<FestivalEventCardProps> = (props) => {
         className={cx('credits')}
         roles={credits}
       />
-      {actionUrl && (
-        <div className={cx('actions')}>
+      <div className={cx('actions')}>
+        {aboutUrl && (
+          <Button
+            size="s"
+            border="bottom-left"
+            icon={(
+              <Icon
+                glyph="arrow-right"
+                width="100%"
+                height="100%"
+              />
+            )}
+            href={aboutUrl}
+            className={cx('button')}
+            target="_blank"
+            upperCase
+          >
+            О спектакле
+          </Button>
+        )}
+        {actionUrl && (
           <Button
             size="s"
             border="bottom-left"
@@ -92,8 +113,9 @@ export const FestivalEventCard: React.VFC<FestivalEventCardProps> = (props) => {
           >
             Регистрация
           </Button>
-        </div>
-      )}
+        )}
+      </div>
+
     </article>
   );
 };
diff --git a/src/components/festival-schedule/festival-schedule.tsx b/src/components/festival-schedule/festival-schedule.tsx
@@ -94,6 +94,7 @@ export const FestivalSchedule: React.VFC<FestivalScheduleProps> = withSWRFallbac
                   title={event.title}
                   image={event.artworkUrl}
                   description={event.description}
+                  aboutUrl={event.performanceId !== null ? (`/performances/${event.performanceId}`) : undefined}
                   actionUrl={event.registrationUrl}
                   credits={event.team}
                 />

diff --git a/src/core/schedule/types.ts b/src/core/schedule/types.ts
@@ -19,4 +19,5 @@ export type FestivalEvent = {
   date: DateTimeIsoString
   registrationOpeningDate: DateTimeIsoString
   registrationUrl?: Url | null
+  performanceId: number | null
 }
diff --git a/src/services/api/schedule-adapter.ts b/src/services/api/schedule-adapter.ts
@@ -73,6 +73,7 @@ function mapDTOToFestivalEvents(dto: EventsDTO): PaginatedFestivalEvents {
       date: event.date_time,
       registrationOpeningDate: event.opening_date_time,
       registrationUrl: event.action_url,
+      performanceId: event.performance_id
     })),
     pagination,
   };