@aarhus-university/au-lib-react-components 8.20.1 → 8.81.0

package/src/components/AUModalComponent.js

@@ -1,94 +0,0 @@
-/* eslint-env browser */
-/* eslint jsx-a11y/click-events-have-key-events: 0 */
-/* eslint jsx-a11y/no-noninteractive-element-interactions: 0 */
-/* eslint jsx-a11y/no-static-element-interactions: 0 */
-import React from 'react';
-import ReactDOM from 'react-dom';
-import PropTypes from 'prop-types';
-
-const AUModalComponent = (props) => {
-  const {
-    classNames,
-    content,
-    children,
-    show,
-    onClose,
-    closeButton,
-    outsideClick,
-  } = props;
-
-  const className = `au-modal ${classNames}`;
-
-  if (show) {
-    return [
-      ReactDOM.createPortal(
-        <div
-          className="au-modal-overlay"
-          onClick={() => {
-            if (typeof onClose === 'function' && outsideClick) {
-              onClose();
-            }
-          }}
-        />,
-        document.querySelector('body'),
-      ),
-      <div key={0} className={className}>
-        {
-          closeButton && (
-            <button
-              type="button"
-              className="button close"
-              onClick={() => {
-                if (typeof onClose === 'function') {
-                  onClose();
-                }
-              }}
-            >
-              c
-            </button>
-          )
-        }
-        {children || content}
-      </div>,
-    ];
-  }
-
-  return <div />;
-};
-
-AUModalComponent.defaultProps = {
-  children: null,
-  content: null,
-  classNames: '',
-  onClose: null,
-  closeButton: true,
-  outsideClick: true,
-};
-
-AUModalComponent.propTypes = {
-  /**
-   * True når modalen skal vises
-   */
-  show: PropTypes.bool.isRequired,
-  /**
-  * Det element der trigger beskeden
-  */
-  children: PropTypes.element,
-  /**
-  * Det samme som children
-  */
-  content: PropTypes.element,
-  /**
-   * Hvis der skal tilføjes ekstra klasser til alert-komponentet
-   */
-  classNames: PropTypes.string,
-  /**
-   * Kaldes ved luk
-   */
-  onClose: PropTypes.func,
-  closeButton: PropTypes.bool,
-  outsideClick: PropTypes.bool,
-};
-
-AUModalComponent.displayName = 'AUModalComponent';
-export default AUModalComponent;

package/src/components/AUPaginationComponent.js

@@ -1,103 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-class AUPaginationComponent extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.goTo = this.goTo.bind(this);
-  }
-
-  goTo(page) {
-    const { onPageChange } = this.props;
-    if (typeof onPageChange === 'function') {
-      onPageChange(page);
-    }
-  }
-
-  render() {
-    const { page, pages } = this.props;
-
-    const createBtn = (label, nextPage, disabled = false) => (
-      <button
-        type="button"
-        disabled={disabled}
-        onClick={() => {
-          this.goTo(nextPage);
-        }}
-      >
-        {label}
-      </button>
-    );
-
-    let hellipBefore = false;
-    let hellipAfter = false;
-    const renderPages = [...Array(pages).keys()].map((_p) => {
-      const p = _p + 1;
-      if (p === page) {
-        return (
-          <li key={p} className="current">
-            {createBtn(p, p)}
-          </li>
-        );
-      }
-      if (p === 1 || p === pages) {
-        return <li key={p}>{createBtn(p, p)}</li>;
-      }
-      if (!hellipBefore && p <= page - 2) {
-        hellipBefore = true;
-        return <li key={p}>{createBtn('...', p, true)}</li>;
-      }
-      if (!hellipAfter && p >= page + 2) {
-        hellipAfter = true;
-        return <li key={p}>{createBtn('...', p, true)}</li>;
-      }
-      if (p === page - 1 || p === page + 1) {
-        return <li key={p}>{createBtn(p, p)}</li>;
-      }
-      return null;
-    });
-
-    return (
-      <ul className="resetlist au-pagination">
-        <li>
-          <button
-            type="button"
-            disabled={page === 1}
-            onClick={() => {
-              this.goTo(page - 1);
-            }}
-          >
-            {'<'}
-          </button>
-        </li>
-        {renderPages}
-        <li>
-          <button
-            type="button"
-            disabled={page === pages}
-            onClick={() => {
-              this.goTo(page + 1);
-            }}
-          >
-            {'>'}
-          </button>
-        </li>
-      </ul>
-    );
-  }
-}
-
-AUPaginationComponent.defaultProps = {
-  page: 1,
-  onPageChange: null,
-};
-
-AUPaginationComponent.propTypes = {
-  page: PropTypes.number,
-  pages: PropTypes.number.isRequired,
-  onPageChange: PropTypes.func,
-};
-
-AUPaginationComponent.displayName = 'AUPaginationComponent';
-export default AUPaginationComponent;

package/src/components/context/AUUserContextComponent.js

@@ -1,91 +0,0 @@
-/* eslint-env browser */
-import React, { useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import AUSpinnerComponent from '../delphinus/AUSpinnerComponent';
-
-const AUUserContextComponent = ({
-  auid,
-  contextKey,
-  spinner,
-  children,
-  handleContext,
-  handleError,
-  loginComponent,
-  emptyComponent,
-  clearCache,
-  loggedIn,
-  enrichContext,
-}) => {
-  const { auAuth } = window;
-  const [hasContext, setHasContext] = useState(false);
-  const setContext = () => {
-    if ((loggedIn || auAuth.getUser() != null) && !hasContext) {
-      auAuth.setUserContext(auid, contextKey, clearCache, (userContext) => {
-        setHasContext(true);
-        handleContext(userContext);
-        console.log(`Context for key ${contextKey} has been received and sent to handler`);
-      }, (status, json) => {
-        setHasContext(true); // Her skal vi måske have en special fejltilstand?
-        handleError(status, json);
-      }, true, loggedIn, enrichContext);
-    }
-  };
-  useEffect(() => {
-    if (!spinner) {
-      setContext();
-    }
-  });
-
-  // Hvis vi vil vise en loginskærm, fx på mitstudie
-  if (loginComponent != null && auAuth.getUser() == null && !loggedIn) {
-    return loginComponent;
-  }
-
-  // Hvis spinner er slået til, viser vi content deri
-  if (spinner) {
-    return (
-      <AUSpinnerComponent
-        onLoad={setContext}
-        loadingCondition={!hasContext}
-        loaded={hasContext}
-      >
-        {children}
-      </AUSpinnerComponent>
-    );
-  }
-
-  // Hvis vi ikke er indlæst har vi mulighed for at vise en tom tilstand
-  if (!hasContext) {
-    return emptyComponent;
-  }
-
-  return children;
-};
-
-AUUserContextComponent.defaultProps = {
-  auid: 0,
-  spinner: true,
-  loginComponent: null,
-  emptyComponent: null,
-  clearCache: false,
-  loggedIn: false,
-  handleError: (status, json) => console.error(status, json),
-  enrichContext: async (json) => json,
-};
-
-AUUserContextComponent.propTypes = {
-  auid: PropTypes.number,
-  contextKey: PropTypes.string,
-  spinner: PropTypes.bool,
-  children: PropTypes.element.isRequired,
-  handleContext: PropTypes.func.isRequired,
-  handleError: PropTypes.func.isRequired,
-  loginComponent: PropTypes.element,
-  emptyComponent: PropTypes.element,
-  clearCache: PropTypes.bool,
-  loggedIn: PropTypes.bool,
-  enrichContext: PropTypes.func.isRequired,
-};
-
-AUUserContextComponent.displayName = 'AUUserContextComponent';
-export default AUUserContextComponent;

package/src/components/context/ImpersonateComponent.js

@@ -1,54 +0,0 @@
-/* eslint-disable jsx-a11y/label-has-associated-control */
-/* eslint-disable jsx-a11y/label-has-for */
-/* eslint-env browser */
-import React, { useState } from 'react';
-
-const ImpersonateComponent = ({ impersonating, children }) => {
-  const [auId, setAuid] = useState(window.API_AUID || '');
-
-  let form = null;
-  if (impersonating && !window.location.href.includes('showForm=false')) {
-    form = (
-      <div key="impersonate" className="page__content__block">
-        <form method="get" action="" id="impersonate-form">
-          <h1 className="pagetitle">
-            Test af frontend-applikation
-          </h1>
-          <div className="form__field">
-            <label htmlFor="impersonate-auId" />
-            <input
-              type="text"
-              className="test"
-              id="impersonate-auId"
-              name="auId"
-              value={auId}
-              onChange={(e) => {
-                setAuid(e.target.value);
-              }}
-              placeholder="Indtast auId eller studienummer for den studerende, du vil udgive dig for"
-            />
-          </div>
-          <div className="form__field form__field--horizontal">
-            <label htmlFor="presentation-mode">
-              {'Præsentationsvisning'}
-            </label>
-            <input type="checkbox" name="showForm" value="false" />
-          </div>
-          <div className="form__field">
-            <input type="submit" className="button" value="Test" />
-          </div>
-        </form>
-      </div>
-    );
-  }
-
-  const content = impersonating && !window.API_AUID ? null : children;
-
-  return [
-    form,
-    content,
-  ];
-};
-
-ImpersonateComponent.displayName = 'ImpersonateComponent';
-export default ImpersonateComponent;