@aarhus-university/au-lib-react-components 9.11.9 → 9.11.13

package/src/components/news/NewsCollageBannerComponent.js

@@ -1,71 +1,71 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { AUNewsHelpers } from '../../lib/au-news';
-
-const NewsCollageBannerComponent = (props) => {
-  const {
-    lang,
-    item,
-    title,
-    type,
-  } = props;
-  const className = `aubanner hastext aubanner-2 ${(type === 'events' ? 'bg-dark-magenta' : 'bg-dark-staff')}`;
-  const isEvent = AUNewsHelpers.typeIdToText(item.type) === 'event';
-  let multipleDates = false;
-  let dateStr = item.date;
-  if (isEvent) {
-    const { fromDate, toDate } = AUNewsHelpers.getEventDates(item, lang);
-    multipleDates = fromDate.getTime() !== toDate.getTime();
-    dateStr = `${item.event_from.date} ${item.event_from.time} - ${(multipleDates ? `${item.event_to.date} ` : '')}${item.event_to.time}`;
-  }
-
-  return (
-    <div className={className}>
-      <a href={item.url} className="au_noborder">
-        {(() => {
-          if (item.image.href !== '') {
-            return <img src={item.image.href} alt="" />;
-          }
-          return null;
-        })()}
-        <div className="aubanner-content">
-          <h3>{title}</h3>
-          <h2 dangerouslySetInnerHTML={{ __html: item.header }} />
-          <p dangerouslySetInnerHTML={{ __html: item.subheader }} />
-          <p>
-            <span>{dateStr}</span>
-            <span>{item.event_where}</span>
-          </p>
-        </div>
-      </a>
-    </div>
-  );
-};
-
-NewsCollageBannerComponent.propTypes = {
-  lang: PropTypes.string.isRequired,
-  item: PropTypes.shape({
-    image: PropTypes.shape({
-      href: PropTypes.string.isRequired,
-    }).isRequired,
-    header: PropTypes.string.isRequired,
-    event_from: PropTypes.shape({
-      date: PropTypes.string.isRequired,
-      time: PropTypes.string.isRequired,
-    }).isRequired,
-    event_to: PropTypes.shape({
-      date: PropTypes.string.isRequired,
-      time: PropTypes.string.isRequired,
-    }).isRequired,
-    event_where: PropTypes.string.isRequired,
-    url: PropTypes.string.isRequired,
-    type: PropTypes.string.isRequired,
-    date: PropTypes.string.isRequired,
-    subheader: PropTypes.string.isRequired,
-  }).isRequired,
-  title: PropTypes.string.isRequired,
-  type: PropTypes.string.isRequired,
-};
-
-NewsCollageBannerComponent.displayName = 'NewsCollageBannerComponent';
-export default NewsCollageBannerComponent;
+import React from 'react';
+import PropTypes from 'prop-types';
+import { AUNewsHelpers } from '../../lib/au-news';
+
+const NewsCollageBannerComponent = (props) => {
+  const {
+    lang,
+    item,
+    title,
+    type,
+  } = props;
+  const className = `aubanner hastext aubanner-2 ${(type === 'events' ? 'bg-dark-magenta' : 'bg-dark-staff')}`;
+  const isEvent = AUNewsHelpers.typeIdToText(item.type) === 'event';
+  let multipleDates = false;
+  let dateStr = item.date;
+  if (isEvent) {
+    const { fromDate, toDate } = AUNewsHelpers.getEventDates(item, lang);
+    multipleDates = fromDate.getTime() !== toDate.getTime();
+    dateStr = `${item.event_from.date} ${item.event_from.time} - ${(multipleDates ? `${item.event_to.date} ` : '')}${item.event_to.time}`;
+  }
+
+  return (
+    <div className={className}>
+      <a href={item.url} className="au_noborder">
+        {(() => {
+          if (item.image.href !== '') {
+            return <img src={item.image.href} alt="" />;
+          }
+          return null;
+        })()}
+        <div className="aubanner-content">
+          <h3>{title}</h3>
+          <h2 dangerouslySetInnerHTML={{ __html: item.header }} />
+          <p dangerouslySetInnerHTML={{ __html: item.subheader }} />
+          <p>
+            <span>{dateStr}</span>
+            <span>{item.event_where}</span>
+          </p>
+        </div>
+      </a>
+    </div>
+  );
+};
+
+NewsCollageBannerComponent.propTypes = {
+  lang: PropTypes.string.isRequired,
+  item: PropTypes.shape({
+    image: PropTypes.shape({
+      href: PropTypes.string.isRequired,
+    }).isRequired,
+    header: PropTypes.string.isRequired,
+    event_from: PropTypes.shape({
+      date: PropTypes.string.isRequired,
+      time: PropTypes.string.isRequired,
+    }).isRequired,
+    event_to: PropTypes.shape({
+      date: PropTypes.string.isRequired,
+      time: PropTypes.string.isRequired,
+    }).isRequired,
+    event_where: PropTypes.string.isRequired,
+    url: PropTypes.string.isRequired,
+    type: PropTypes.string.isRequired,
+    date: PropTypes.string.isRequired,
+    subheader: PropTypes.string.isRequired,
+  }).isRequired,
+  title: PropTypes.string.isRequired,
+  type: PropTypes.string.isRequired,
+};
+
+NewsCollageBannerComponent.displayName = 'NewsCollageBannerComponent';
+export default NewsCollageBannerComponent;

package/src/components/news/NewsCollageBannerRSSComponent.js

@@ -1,79 +1,79 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-const appendZero = (datePart) => `${datePart < 10 ? '0' : ''}${datePart}`;
-const strDateTime = (dateTime, lang, showTime = false) => {
-  if (lang === 'da') {
-    if (showTime) {
-      return `${appendZero(dateTime.getDate())}.${appendZero(dateTime.getMonth() + 1)}.${dateTime.getFullYear()} ${appendZero(dateTime.getHours())}:${appendZero(dateTime.getMinutes())}`;
-    }
-    return `${appendZero(dateTime.getDate())}.${appendZero(dateTime.getMonth() + 1)}.${dateTime.getFullYear()}`;
-  }
-
-  if (showTime) {
-    return `${appendZero(dateTime.getMonth() + 1)}.${appendZero(dateTime.getDate())}.${dateTime.getFullYear()} ${appendZero(dateTime.getHours())}:${appendZero(dateTime.getMinutes())}`;
-  }
-
-  return `${appendZero(dateTime.getMonth() + 1)}.${appendZero(dateTime.getDate())}.${dateTime.getFullYear()}`;
-};
-
-const NewsCollageBannerComponent = (props) => {
-  const {
-    lang,
-    item,
-    title,
-    type,
-  } = props;
-  const className = `aubanner hastext aubanner-2 ${(type === 'events' ? 'bg-dark-magenta' : 'bg-dark-staff')}`;
-  const isEvent = item.Type === 1; // Enum fra C#
-  const published = new Date(item.Published);
-  let dateStr = strDateTime(published, lang);
-
-  if (isEvent) {
-    const eventFrom = new Date(item.EventFrom);
-    const eventTo = new Date(item.EventTo);
-    const multipleDates = eventFrom !== eventTo;
-    dateStr = `${strDateTime(eventFrom, lang, true)}${multipleDates ? ` – ${strDateTime(eventTo, lang, true)}` : ''}`;
-  }
-
-  return (
-    <div className={className}>
-      <a href={item.Uri} className="au_noborder">
-        {
-          !!item.Image && (
-            <img src={item.Image} alt={item.Header} />
-          )
-        }
-        <div className="aubanner-content">
-          <h3>{title}</h3>
-          <h2 dangerouslySetInnerHTML={{ __html: item.Header }} />
-          <p dangerouslySetInnerHTML={{ __html: item.SubHeader }} />
-          <p>
-            <span>{dateStr}</span>
-            <span>{item.EventWhere}</span>
-          </p>
-        </div>
-      </a>
-    </div>
-  );
-};
-
-NewsCollageBannerComponent.propTypes = {
-  lang: PropTypes.string.isRequired,
-  item: PropTypes.shape({
-    Published: PropTypes.instanceOf(Date).isRequired,
-    Type: PropTypes.number.isRequired,
-    Image: PropTypes.string.isRequired,
-    Header: PropTypes.string.isRequired,
-    SubHeader: PropTypes.string.isRequired,
-    Uri: PropTypes.string.isRequired,
-    EventWhere: PropTypes.string.isRequired,
-    EventFrom: PropTypes.instanceOf(Date).isRequired,
-    EventTo: PropTypes.instanceOf(Date).isRequired,
-  }).isRequired,
-  title: PropTypes.string.isRequired,
-  type: PropTypes.string.isRequired,
-};
-
-NewsCollageBannerComponent.displayName = 'NewsCollageBannerComponent';
-export default NewsCollageBannerComponent;
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const appendZero = (datePart) => `${datePart < 10 ? '0' : ''}${datePart}`;
+const strDateTime = (dateTime, lang, showTime = false) => {
+  if (lang === 'da') {
+    if (showTime) {
+      return `${appendZero(dateTime.getDate())}.${appendZero(dateTime.getMonth() + 1)}.${dateTime.getFullYear()} ${appendZero(dateTime.getHours())}:${appendZero(dateTime.getMinutes())}`;
+    }
+    return `${appendZero(dateTime.getDate())}.${appendZero(dateTime.getMonth() + 1)}.${dateTime.getFullYear()}`;
+  }
+
+  if (showTime) {
+    return `${appendZero(dateTime.getMonth() + 1)}.${appendZero(dateTime.getDate())}.${dateTime.getFullYear()} ${appendZero(dateTime.getHours())}:${appendZero(dateTime.getMinutes())}`;
+  }
+
+  return `${appendZero(dateTime.getMonth() + 1)}.${appendZero(dateTime.getDate())}.${dateTime.getFullYear()}`;
+};
+
+const NewsCollageBannerComponent = (props) => {
+  const {
+    lang,
+    item,
+    title,
+    type,
+  } = props;
+  const className = `aubanner hastext aubanner-2 ${(type === 'events' ? 'bg-dark-magenta' : 'bg-dark-staff')}`;
+  const isEvent = item.Type === 1; // Enum fra C#
+  const published = new Date(item.Published);
+  let dateStr = strDateTime(published, lang);
+
+  if (isEvent) {
+    const eventFrom = new Date(item.EventFrom);
+    const eventTo = new Date(item.EventTo);
+    const multipleDates = eventFrom !== eventTo;
+    dateStr = `${strDateTime(eventFrom, lang, true)}${multipleDates ? ` – ${strDateTime(eventTo, lang, true)}` : ''}`;
+  }
+
+  return (
+    <div className={className}>
+      <a href={item.Uri} className="au_noborder">
+        {
+          !!item.Image && (
+            <img src={item.Image} alt={item.Header} />
+          )
+        }
+        <div className="aubanner-content">
+          <h3>{title}</h3>
+          <h2 dangerouslySetInnerHTML={{ __html: item.Header }} />
+          <p dangerouslySetInnerHTML={{ __html: item.SubHeader }} />
+          <p>
+            <span>{dateStr}</span>
+            <span>{item.EventWhere}</span>
+          </p>
+        </div>
+      </a>
+    </div>
+  );
+};
+
+NewsCollageBannerComponent.propTypes = {
+  lang: PropTypes.string.isRequired,
+  item: PropTypes.shape({
+    Published: PropTypes.instanceOf(Date).isRequired,
+    Type: PropTypes.number.isRequired,
+    Image: PropTypes.string.isRequired,
+    Header: PropTypes.string.isRequired,
+    SubHeader: PropTypes.string.isRequired,
+    Uri: PropTypes.string.isRequired,
+    EventWhere: PropTypes.string.isRequired,
+    EventFrom: PropTypes.instanceOf(Date).isRequired,
+    EventTo: PropTypes.instanceOf(Date).isRequired,
+  }).isRequired,
+  title: PropTypes.string.isRequired,
+  type: PropTypes.string.isRequired,
+};
+
+NewsCollageBannerComponent.displayName = 'NewsCollageBannerComponent';
+export default NewsCollageBannerComponent;

package/src/components/news/NewsColumnsComponent.js

@@ -1,125 +1,125 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import EventLayout1Component from './EventLayout1Component';
-import EventLayout2Component from './EventLayout2Component';
-import EventLayout3Component from './EventLayout3Component';
-import NewsLayout1Component from './NewsLayout1Component';
-import NewsLayout2Component from './NewsLayout2Component';
-import NewsLayout3Component from './NewsLayout3Component';
-import NewsLayout4Component from './NewsLayout4Component';
-import NewsLayout5Component from './NewsLayout5Component';
-import NewsLayout6Component from './NewsLayout6Component';
-import NewsLayout7Component from './NewsLayout7Component';
-import NewsLayout8Component from './NewsLayout8Component';
-
-const NewsColumnsComponent = (props) => {
-  const layouts = [
-    <NewsLayout1Component />,
-    <NewsLayout2Component />,
-    <NewsLayout3Component />,
-    <NewsLayout4Component />,
-    <NewsLayout5Component />,
-    <NewsLayout6Component />,
-    <NewsLayout7Component />,
-    <NewsLayout8Component />,
-  ];
-
-  const layoutsEvents = [
-    <EventLayout1Component />,
-    <EventLayout2Component />,
-    <EventLayout3Component />,
-  ];
-
-  const {
-    type,
-    cols,
-    items,
-    setPopupItem,
-    incrementPointer,
-    listid,
-    lang,
-  } = props;
-  let count = -1;
-  const headerElementValue = type === 'events' ? 3 : 6;
-  const renderColumns = cols.map((col, i) => {
-    const outerKey = i; // LOL
-    let isHeader = false;
-    const renderItems = col.map((element, j) => {
-      const innerKey = j; // Mere LOL
-      count += 1;
-      if (parseInt(element, 10) === headerElementValue && !isHeader) {
-        isHeader = true;
-        const hItems = [];
-        for (let x = j; x < col.length; x += 1) {
-          if (parseInt(col[x], 10) === headerElementValue) {
-            hItems.push(items[count + x]);
-          } else {
-            break;
-          }
-        }
-
-        if (type === 'events') {
-          return (
-            <EventLayout3Component
-              key={innerKey}
-              listid={listid}
-              items={hItems}
-              setPopupItem={setPopupItem}
-              lang={lang}
-            />
-          );
-        }
-
-        return (
-          <NewsLayout6Component
-            key={innerKey}
-            listid={listid}
-            items={hItems}
-            setPopupItem={setPopupItem}
-            lang={lang}
-          />
-        );
-      }
-
-      if (parseInt(element, 10) !== headerElementValue) {
-        incrementPointer();
-        isHeader = false;
-        const layoutsArray = type === 'events' ? layoutsEvents : layouts;
-        return React.cloneElement(layoutsArray[parseInt(element, 10) - 1], {
-          key: innerKey,
-          item: items[count],
-          listid,
-          setPopupItem,
-          lang,
-        });
-      }
-
-      return null;
-    });
-
-    return (
-      <div key={outerKey} className="column large-6 medium-6 small-12">
-        {renderItems}
-      </div>
-    );
-  });
-
-  return (
-    <div className="row">
-      {renderColumns}
-    </div>
-  );
-};
-
-NewsColumnsComponent.propTypes = {
-  type: PropTypes.string.isRequired,
-  cols: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
-  items: PropTypes.shape({}).isRequired,
-  setPopupItem: PropTypes.func.isRequired,
-  incrementPointer: PropTypes.func.isRequired,
-  listid: PropTypes.number.isRequired,
-  lang: PropTypes.bool.isRequired,
-};
-
-NewsColumnsComponent.displayName = 'NewsColumnsComponent';
-export default NewsColumnsComponent;
+import React from 'react';
+import PropTypes from 'prop-types';
+import EventLayout1Component from './EventLayout1Component';
+import EventLayout2Component from './EventLayout2Component';
+import EventLayout3Component from './EventLayout3Component';
+import NewsLayout1Component from './NewsLayout1Component';
+import NewsLayout2Component from './NewsLayout2Component';
+import NewsLayout3Component from './NewsLayout3Component';
+import NewsLayout4Component from './NewsLayout4Component';
+import NewsLayout5Component from './NewsLayout5Component';
+import NewsLayout6Component from './NewsLayout6Component';
+import NewsLayout7Component from './NewsLayout7Component';
+import NewsLayout8Component from './NewsLayout8Component';
+
+const NewsColumnsComponent = (props) => {
+  const layouts = [
+    <NewsLayout1Component />,
+    <NewsLayout2Component />,
+    <NewsLayout3Component />,
+    <NewsLayout4Component />,
+    <NewsLayout5Component />,
+    <NewsLayout6Component />,
+    <NewsLayout7Component />,
+    <NewsLayout8Component />,
+  ];
+
+  const layoutsEvents = [
+    <EventLayout1Component />,
+    <EventLayout2Component />,
+    <EventLayout3Component />,
+  ];
+
+  const {
+    type,
+    cols,
+    items,
+    setPopupItem,
+    incrementPointer,
+    listid,
+    lang,
+  } = props;
+  let count = -1;
+  const headerElementValue = type === 'events' ? 3 : 6;
+  const renderColumns = cols.map((col, i) => {
+    const outerKey = i; // LOL
+    let isHeader = false;
+    const renderItems = col.map((element, j) => {
+      const innerKey = j; // Mere LOL
+      count += 1;
+      if (parseInt(element, 10) === headerElementValue && !isHeader) {
+        isHeader = true;
+        const hItems = [];
+        for (let x = j; x < col.length; x += 1) {
+          if (parseInt(col[x], 10) === headerElementValue) {
+            hItems.push(items[count + x]);
+          } else {
+            break;
+          }
+        }
+
+        if (type === 'events') {
+          return (
+            <EventLayout3Component
+              key={innerKey}
+              listid={listid}
+              items={hItems}
+              setPopupItem={setPopupItem}
+              lang={lang}
+            />
+          );
+        }
+
+        return (
+          <NewsLayout6Component
+            key={innerKey}
+            listid={listid}
+            items={hItems}
+            setPopupItem={setPopupItem}
+            lang={lang}
+          />
+        );
+      }
+
+      if (parseInt(element, 10) !== headerElementValue) {
+        incrementPointer();
+        isHeader = false;
+        const layoutsArray = type === 'events' ? layoutsEvents : layouts;
+        return React.cloneElement(layoutsArray[parseInt(element, 10) - 1], {
+          key: innerKey,
+          item: items[count],
+          listid,
+          setPopupItem,
+          lang,
+        });
+      }
+
+      return null;
+    });
+
+    return (
+      <div key={outerKey} className="column large-6 medium-6 small-12">
+        {renderItems}
+      </div>
+    );
+  });
+
+  return (
+    <div className="row">
+      {renderColumns}
+    </div>
+  );
+};
+
+NewsColumnsComponent.propTypes = {
+  type: PropTypes.string.isRequired,
+  cols: PropTypes.arrayOf(PropTypes.shape({})).isRequired,
+  items: PropTypes.shape({}).isRequired,
+  setPopupItem: PropTypes.func.isRequired,
+  incrementPointer: PropTypes.func.isRequired,
+  listid: PropTypes.number.isRequired,
+  lang: PropTypes.bool.isRequired,
+};
+
+NewsColumnsComponent.displayName = 'NewsColumnsComponent';
+export default NewsColumnsComponent;