Add next open/close day panel + refactor common funcs to util

2026-08-19 00:32:31 +00:00 · 2018-03-19 14:00:34 +05:30
parent eb3151471a
commit 047bc7c291
11 changed files with 309 additions and 118 deletions
@@ -0,0 +1,75 @@
+import * as React from 'react';
+import * as moment from 'moment-timezone';
+import "./Component.css";
+import { HolidayList } from '../../Data';
+import { Utils, OpenOrClose } from "../../Utils";
+
+export interface NextOpenCloseMiniProps {
+    xDay: moment.Moment;
+    openOrClose: OpenOrClose;
+    allHolidays: HolidayList;
+}
+
+export class NextOpenCloseMini extends React.Component<NextOpenCloseMiniProps, {}> {
+    xDay: moment.Moment;
+    openOrClose: OpenOrClose;
+    allHolidays: HolidayList;
+
+    nextOpenOrCloseDate: moment.Moment | undefined;
+
+    constructor(props: NextOpenCloseMiniProps) {
+        super(props);
+        this.xDay = props.xDay;
+        this.openOrClose = props.openOrClose;
+        this.allHolidays = props.allHolidays;
+
+        this.nextOpenOrCloseDate = Utils.findNextOpenOrCloseFromDate(this.xDay, this.allHolidays, this.openOrClose);
+    }
+
+    getOpeningClosingString() {
+        return this.openOrClose === OpenOrClose.Open ? "opening" : "closing";
+    }
+
+    renderDate(): JSX.Element[] {
+        const tmpNextDate = this.nextOpenOrCloseDate as moment.Moment;
+        var nextDateString = tmpNextDate.format("DD-MM-YYYY");
+        return [
+            (
+                <div className="openCloseDecription" key="title">
+                    Next {this.getOpeningClosingString()} on
+                </div>
+            ),
+            (
+                <div className="dateDescription" key="subTitle">
+                    {nextDateString}
+                </div>
+            )
+        ];
+    }
+
+    renderNotFound(): JSX.Element[] {
+        return [
+            (
+                <div className="openCloseDecription" key="title">
+                    No more {this.getOpeningClosingString()}s
+                </div>
+            ),
+            (
+                <div className="dateDescription" key="subTitle">
+                    this year
+                </div>
+            )
+        ];
+    }
+
+    render() {
+
+        return (
+            <div className="NextOpenCloseMini">
+                <div className="NextOpenCloseMini-inner">
+                    {this.nextOpenOrCloseDate === undefined ? this.renderNotFound() : this.renderDate()}
+                </div>
+            </div>
+        );
+    }
+}