Ntrfcs 207 (#303)

* added showLegendAlwaysOpenForDesktop * test fixes * small change * small change * format chjanges * added changeset * added openLegendInitially flag * added change log * updated test cases * lint changes
ticketevolution · Jan 27, 2025 · 67229cf · 67229cf
1 parent ac70595
commit 67229cf
Show file tree

Hide file tree

Showing 8 changed files with 24 additions and 1 deletion.
diff --git a/.changeset/funny-islands-dance.md b/.changeset/funny-islands-dance.md
@@ -0,0 +1,5 @@
+---
+"@ticketevolution/seatmaps-client": patch
+---
+
+Added openLegendInitially flag
diff --git a/.changeset/light-suns-agree.md b/.changeset/light-suns-agree.md
@@ -0,0 +1,5 @@
+---
+"@ticketevolution/seatmaps-client": minor
+---
+
+Added showLegendOpenAlwaysForDesktop flag to always display the map legend on desktop when this flag is set to true.
diff --git a/packages/seatmaps-client/src/Actions/index.tsx b/packages/seatmaps-client/src/Actions/index.tsx
@@ -21,6 +21,7 @@ export interface Props {
 interface DefaultProps {
   showLegend: boolean;
   showLegendOpenAlwaysForDesktop: boolean;
+  openLegendInitially: boolean;
   showControls: boolean;
   onClearSelection(): void;
 }
@@ -46,6 +47,7 @@ export default class Actions extends React.Component<
     showLegend: true,
     showLegendOpenAlwaysForDesktop: false,
     showControls: true,
+    openLegendInitially: false,
     onClearSelection: () => {},
   };
 
@@ -175,6 +177,7 @@ export default class Actions extends React.Component<
               showLegendOpenAlwaysForDesktop={
                 this.props.showLegendOpenAlwaysForDesktop
               }
+              openLegendInitially={this.props.openLegendInitially}
             />
           </ActionGroup>
         )}

diff --git a/packages/seatmaps-client/src/Legend/index.tsx b/packages/seatmaps-client/src/Legend/index.tsx
@@ -21,6 +21,7 @@ export interface Props {
   ranges: Range[];
   isMobile?: boolean;
   showLegendOpenAlwaysForDesktop?: boolean;
+  openLegendInitially?: boolean;
 }
 
 interface State {
@@ -31,10 +32,11 @@ export default class Legend extends Component<Props, State> {
   static defaultProps = {
     isMobile: false,
     showLegendOpenAlwaysForDesktop: false,
+    openLegendInitially: false,
   };
 
   state = {
-    isOpen: false,
+    isOpen: this.props.openLegendInitially || false,
   };
 
   render() {

diff --git a/packages/seatmaps-client/src/TicketMap/index.tsx b/packages/seatmaps-client/src/TicketMap/index.tsx
@@ -69,6 +69,7 @@ export class TicketMap extends Component<Props & DefaultProps, State> {
     showLegend: true,
     showLegendOpenAlwaysForDesktop: false,
     showControls: true,
+    openLegendInitially: false,
     mouseControlEnabled: true,
     showZoomHelper: true,
     mapFontFamily: "inherit",
@@ -673,6 +674,7 @@ export class TicketMap extends Component<Props & DefaultProps, State> {
               this.props.showLegendOpenAlwaysForDesktop
             }
             showControls={this.props.showControls}
+            openLegendInitially={this.props.openLegendInitially}
             onZoomIn={this.handleZoomIn}
             onZoomOut={this.handleZoomOut}
             onResetZoom={this.handleResetZoom}

diff --git a/packages/seatmaps-client/src/__tests__/Actions/__snapshots__/index.test.tsx.snap b/packages/seatmaps-client/src/__tests__/Actions/__snapshots__/index.test.tsx.snap
@@ -6,6 +6,7 @@ exports[`Actions when controls are visible on desktop browsers matches snapshot
   onResetZoom={[MockFunction]}
   onZoomIn={[MockFunction]}
   onZoomOut={[MockFunction]}
+  openLegendInitially={false}
   ranges={[]}
   showControls={true}
   showLegend={true}
@@ -251,6 +252,7 @@ exports[`Actions when controls are visible on desktop browsers matches snapshot
       >
         <Legend
           isMobile={false}
+          openLegendInitially={false}
           ranges={[]}
           showLegendOpenAlwaysForDesktop={false}
         >
@@ -313,6 +315,7 @@ exports[`Actions when controls are visible on mobile browsers matches snapshot 1
   onResetZoom={[MockFunction]}
   onZoomIn={[MockFunction]}
   onZoomOut={[MockFunction]}
+  openLegendInitially={false}
   ranges={[]}
   showControls={true}
   showLegend={true}
@@ -558,6 +561,7 @@ exports[`Actions when controls are visible on mobile browsers matches snapshot 1
       >
         <Legend
           isMobile={false}
+          openLegendInitially={false}
           ranges={[]}
           showLegendOpenAlwaysForDesktop={false}
         >

diff --git a/packages/seatmaps-client/src/index.tsx b/packages/seatmaps-client/src/index.tsx
@@ -25,6 +25,7 @@ const optionalConfigKeys: (keyof DefaultProps)[] = [
   "showControls",
   "showLegendOpenAlwaysForDesktop",
   "showLegend",
+  "openLegendInitially",
   "mouseControlEnabled",
   "showZoomHelper",
 ];

diff --git a/packages/seatmaps-client/src/types/TicketMap.ts b/packages/seatmaps-client/src/types/TicketMap.ts
@@ -38,6 +38,7 @@ export interface DefaultProps {
   onSelection(sections: string[]): void;
   showControls: boolean;
   showLegendOpenAlwaysForDesktop: boolean;
+  openLegendInitially: boolean;
   mouseControlEnabled: boolean;
   showZoomHelper: boolean;
   missingSeatMapLogo?: React.ReactNode;