Merge pull request #1451 from creative-commoners/pulls/2/security-ext…

…ensions

NEW migrate functionality from security-extensions module

client/lang/src/da.json

@@ -29,5 +29,10 @@
     "Admin.VALIDATOR_MESSAGE_DATE": "{name} er ikke et korrekt dato format.",
     "Admin.VALIDATOR_MESSAGE_ALPHANUMERIC": "{name} er ikke en alfanumeriskværdi.",
     "Admin.VALIDATOR_MESSAGE_ALPHA": "{name} er ikke kun bogstaver.",
-    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} er ikke en gyldig værdi."
-}
+    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} er ikke en gyldig værdi.",
+    "Admin.VERIFY_ITS_YOU": "Bekræft først at det er dig.",
+    "Admin.WHATS_THIS": "Hvad er dette?",
+    "Admin.VERIFY_TO_CONTINUE": "Bekræft for at forsætte",
+    "Admin.ENTER_PASSWORD": "Indtast dit kodeord",
+    "Admin.VERIFY": "Bekræft"
+}

client/lang/src/en.json

@@ -31,5 +31,10 @@
     "Admin.VALIDATOR_MESSAGE_DATE": "{name} is not a proper date format.",
     "Admin.VALIDATOR_MESSAGE_ALPHANUMERIC": "{name} is not an alphanumeric value.",
     "Admin.VALIDATOR_MESSAGE_ALPHA": "{name} is not only letters.",
-    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} is not a valid value."
-}
+    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} is not a valid value.",
+    "Admin.ENTER_PASSWORD": "Enter your password",
+    "Admin.VERIFY": "Verify",
+    "Admin.VERIFY_ITS_YOU": "Verify it's you first.",
+    "Admin.VERIFY_TO_CONTINUE": "Verify to continue",
+    "Admin.WHATS_THIS": "What is this?"
+}

client/lang/src/eo.json

@@ -29,5 +29,10 @@
     "Admin.VALIDATOR_MESSAGE_DATE": "{name} ne estas ĝusta data formato.",
     "Admin.VALIDATOR_MESSAGE_ALPHANUMERIC": "{name} ne estas litercifera valoro.",
     "Admin.VALIDATOR_MESSAGE_ALPHA": "{name} ne estas nur literoj.",
-    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} ne estas valida valoro."
-}
+    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} ne estas valida valoro.",
+    "Admin.VERIFY_ITS_YOU": "Unue aŭtentigi vin.",
+    "Admin.WHATS_THIS": "Kio estas tio?",
+    "Admin.VERIFY_TO_CONTINUE": "Aŭtentigi por daŭrigi",
+    "Admin.ENTER_PASSWORD": "Enigu vian pasvorton",
+    "Admin.VERIFY": "Aŭtentigi"
+}

client/lang/src/nl.json

@@ -29,5 +29,10 @@
     "Admin.VALIDATOR_MESSAGE_DATE": "{name} is niet in het juiste datum formaat.",
     "Admin.VALIDATOR_MESSAGE_ALPHANUMERIC": "{name} is geen alpha numerieke waarde.",
     "Admin.VALIDATOR_MESSAGE_ALPHA": "{name} bestaat niet alleen uit letters.",
-    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} is geen geldige waarde."
-}
+    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} is geen geldige waarde.",
+    "Admin.VERIFY_ITS_YOU": "Verifieer dat dit je eerste is.",
+    "Admin.WHATS_THIS": "Wat is dit?",
+    "Admin.VERIFY_TO_CONTINUE": "Bevestig om door te gaan",
+    "Admin.ENTER_PASSWORD": "Voer wachtwoord in",
+    "Admin.VERIFY": "Bevestig"
+}

client/lang/src/sl.json

@@ -29,5 +29,10 @@
     "Admin.VALIDATOR_MESSAGE_DATE": "{name} ni pravilna oblika datuma.",
     "Admin.VALIDATOR_MESSAGE_ALPHANUMERIC": "{name} ni alfanumerična vrednost.",
     "Admin.VALIDATOR_MESSAGE_ALPHA": "{name} niso samo črke.",
-    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} ni veljavna vrednost."
-}
+    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} ni veljavna vrednost.",
+    "Admin.VERIFY_ITS_YOU": "Najprej potrdite, da ste to res vi.",
+    "Admin.WHATS_THIS": "Kaj je to?",
+    "Admin.VERIFY_TO_CONTINUE": "Za nadaljevanje potrdite",
+    "Admin.ENTER_PASSWORD": "Vnesite vaše geslo",
+    "Admin.VERIFY": "Preveri"
+}

client/lang/src/sv.json

@@ -29,5 +29,10 @@
     "Admin.VALIDATOR_MESSAGE_DATE": "{name} is not a proper date format.",
     "Admin.VALIDATOR_MESSAGE_ALPHANUMERIC": "{name} is not an alphanumeric value.",
     "Admin.VALIDATOR_MESSAGE_ALPHA": "{name} is not only letters.",
-    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} is not a valid value."
-}
+    "Admin.VALIDATOR_MESSAGE_DEFAULT": "{name} is not a valid value.",
+    "Admin.VERIFY_ITS_YOU": "Verify it's you first.",
+    "Admin.WHATS_THIS": "Vad är detta?",
+    "Admin.VERIFY_TO_CONTINUE": "Verifiera för att fortsätta",
+    "Admin.ENTER_PASSWORD": "Ange ditt lösenord",
+    "Admin.VERIFY": "Verifiera"
+}

client/src/boot/registerComponents.js

@@ -35,6 +35,7 @@ import Preview from 'components/Preview/Preview';
 import ReduxForm from 'containers/Form/Form';
 import UsedOnTable from 'components/UsedOnTable/UsedOnTable';
 import Loading from 'components/Loading/Loading';
+import CircularLoading from 'components/Loading/CircularLoading';
 import VersionedBadge from 'components/VersionedBadge/VersionedBadge';
 import ViewModeToggle from 'components/ViewModeToggle/ViewModeToggle';
 import ResizeAware from 'components/ResizeAware/ResizeAware';
@@ -87,6 +88,7 @@ export default () => {
     NotFoundComponent,
     UsedOnTable,
     Loading,
+    CircularLoading,
     VersionedBadge,
     ViewModeToggle,
     ResizeAware,

client/src/bundles/bundle.js

@@ -28,6 +28,7 @@ import 'expose-loader?exposes=FormBuilderLoader!containers/FormBuilderLoader/For
 import 'expose-loader?exposes=FormBuilderModal!components/FormBuilderModal/FormBuilderModal';
 import 'expose-loader?exposes=FileSchemaModalHandler!containers/InsertLinkModal/fileSchemaModalHandler';
 import 'expose-loader?exposes=InsertLinkModal!containers/InsertLinkModal/InsertLinkModal';
+import 'expose-loader?exposes=SudoMode!containers/SudoMode/SudoMode';
 import 'expose-loader?exposes=RecordsActions!state/records/RecordsActions';
 import 'expose-loader?exposes=GridField!components/GridField/GridField';
 import 'expose-loader?exposes=GridFieldCell!components/GridField/GridFieldCell';
@@ -43,6 +44,7 @@ import 'expose-loader?exposes=HiddenField!components/HiddenField/HiddenField';
 import 'expose-loader?exposes=ListGroup!components/ListGroup/ListGroup';
 import 'expose-loader?exposes=ListGroupItem!components/ListGroup/ListGroupItem';
 import 'expose-loader?exposes=Loading!components/Loading/Loading';
+import 'expose-loader?exposes=CircularLoading!components/Loading/CircularLoading';
 import 'expose-loader?exposes=TextField!components/TextField/TextField';
 import 'expose-loader?exposes=LiteralField!components/LiteralField/LiteralField';
 import 'expose-loader?exposes=Toolbar!components/Toolbar/Toolbar';

client/src/components/Loading/CircularLoading.js

@@ -0,0 +1,28 @@
+import React, { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+import classnames from 'classnames';
+
+class CircularLoading extends PureComponent {
+  render() {
+    const { className, size, block } = this.props;
+
+    const classNames = classnames('ss-circular-loading-indicator', className, {
+      'ss-circular-loading-indicator--block': block,
+    });
+
+    return <div style={{ height: size, width: size }} className={classNames} />;
+  }
+}
+
+CircularLoading.propTypes = {
+  className: PropTypes.string,
+  block: PropTypes.bool,
+  size: PropTypes.string,
+};
+
+CircularLoading.defaultProps = {
+  block: false,
+  size: '6em',
+};
+
+export default CircularLoading;

client/src/components/Loading/CircularLoading.scss

@@ -0,0 +1,55 @@
+$color-blue: rgba(0, 113, 196, 1);
+$font-size-small: 10px;
+
+$loading-indicator-size: 6em;
+$loading-indicator-border-size: .4em;
+$loading-indicator-border: $loading-indicator-border-size solid transparent;
+$loading-indicator-speed: 1.1s;
+$loading-indicator-animation: spinner-loader $loading-indicator-speed infinite linear;
+
+.ss-circular-loading-indicator {
+  &,
+  &:after {
+    border-radius: 50%;
+    width: $loading-indicator-size;
+    height: $loading-indicator-size;
+  }
+
+  &--block {
+    margin: 30px auto;
+  }
+
+  font-size: $font-size-small;
+  position: relative;
+  text-indent: -9999em;
+  border: $loading-indicator-border;
+  border-left: $loading-indicator-border-size solid $color-blue;
+  -webkit-transform: translateZ(0);
+  -ms-transform: translateZ(0);
+  transform: translateZ(0);
+  -webkit-animation: $loading-indicator-animation;
+  animation: $loading-indicator-animation;
+}
+
+@-webkit-keyframes spinner-loader {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+@keyframes spinner-loader {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}

client/src/components/Loading/Loading.js

@@ -3,7 +3,7 @@ import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 
 /**
- * Renders a SilverStripe loading animation
+ * Renders a Silverstripe loading animation styled after the Silverstripe logo
  */
 class Loading extends PureComponent {
   render() {

client/src/components/Loading/tests/CircularLoading-test.js

@@ -0,0 +1,27 @@
+/* global jest, describe, it, expect */
+import React from 'react';
+import Enzyme, { shallow } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+import CircularLoading from '../CircularLoading';
+
+Enzyme.configure({ adapter: new Adapter() });
+
+describe('CircularLoading', () => {
+  describe('render()', () => {
+    it('can be displayed as "block"', () => {
+      const wrapper = shallow(
+        <CircularLoading block />
+      );
+
+      expect(wrapper.find('.ss-circular-loading-indicator--block')).toHaveLength(1);
+    });
+
+    it('allows extra classes to be provided', () => {
+      const wrapper = shallow(
+        <CircularLoading className="hello-world" />
+      );
+
+      expect(wrapper.find('.ss-circular-loading-indicator.hello-world')).toHaveLength(1);
+    });
+  });
+});