mirror of
https://gitlab.nic.cz/turris/reforis/foris-js.git
synced 2024-11-14 17:35:35 +01:00
Don't use default exports.
This commit is contained in:
parent
3bb760ceb3
commit
e9910f269f
|
@ -27,14 +27,19 @@ module.exports = {
|
||||||
"react/prop-types": "warn",
|
"react/prop-types": "warn",
|
||||||
"react/no-array-index-key": "warn",
|
"react/no-array-index-key": "warn",
|
||||||
"react/button-has-type": "warn",
|
"react/button-has-type": "warn",
|
||||||
|
"import/prefer-default-export": "off",
|
||||||
"import/no-unresolved": [
|
"import/no-unresolved": [
|
||||||
"error",
|
"error",
|
||||||
// Ignore imports used only in tests
|
// Ignore imports used only in tests
|
||||||
{ignore: ["mockWS", "customTestRender"]}
|
{ ignore: ["mockWS", "customTestRender"] }
|
||||||
],
|
],
|
||||||
"import/no-cycle": "warn",
|
"import/no-cycle": "warn",
|
||||||
"no-console": "error",
|
"no-console": "error",
|
||||||
"no-use-before-define": ["error", {functions: false, classes: true, variables: true}],
|
"no-use-before-define": ["error", {
|
||||||
|
functions: false,
|
||||||
|
classes: true,
|
||||||
|
variables: true
|
||||||
|
}],
|
||||||
"no-restricted-syntax": "warn",
|
"no-restricted-syntax": "warn",
|
||||||
// Should be enabled in the future
|
// Should be enabled in the future
|
||||||
"camelcase": "off",
|
"camelcase": "off",
|
||||||
|
|
|
@ -1,15 +1,10 @@
|
||||||
module.exports = {
|
module.exports = {
|
||||||
presets: [
|
presets: [
|
||||||
["@babel/preset-env", {
|
"@babel/preset-env",
|
||||||
targets: {
|
|
||||||
esmodules: true,
|
|
||||||
},
|
|
||||||
}],
|
|
||||||
"@babel/preset-react",
|
"@babel/preset-react",
|
||||||
],
|
],
|
||||||
plugins: [
|
plugins: [
|
||||||
"@babel/plugin-transform-runtime",
|
"@babel/plugin-transform-runtime",
|
||||||
"@babel/plugin-syntax-export-namespace-from",
|
|
||||||
"@babel/plugin-syntax-export-default-from",
|
"@babel/plugin-syntax-export-default-from",
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
33
package-lock.json
generated
33
package-lock.json
generated
|
@ -123,20 +123,6 @@
|
||||||
"@babel/types": "^7.4.4"
|
"@babel/types": "^7.4.4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"@babel/helper-create-class-features-plugin": {
|
|
||||||
"version": "7.5.5",
|
|
||||||
"resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.5.5.tgz",
|
|
||||||
"integrity": "sha512-ZsxkyYiRA7Bg+ZTRpPvB6AbOFKTFFK4LrvTet8lInm0V468MWCaSYJE+I7v2z2r8KNLtYiV+K5kTCnR7dvyZjg==",
|
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
|
||||||
"@babel/helper-function-name": "^7.1.0",
|
|
||||||
"@babel/helper-member-expression-to-functions": "^7.5.5",
|
|
||||||
"@babel/helper-optimise-call-expression": "^7.0.0",
|
|
||||||
"@babel/helper-plugin-utils": "^7.0.0",
|
|
||||||
"@babel/helper-replace-supers": "^7.5.5",
|
|
||||||
"@babel/helper-split-export-declaration": "^7.4.4"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"@babel/helper-define-map": {
|
"@babel/helper-define-map": {
|
||||||
"version": "7.5.5",
|
"version": "7.5.5",
|
||||||
"resolved": "https://registry.npmjs.org/@babel/helper-define-map/-/helper-define-map-7.5.5.tgz",
|
"resolved": "https://registry.npmjs.org/@babel/helper-define-map/-/helper-define-map-7.5.5.tgz",
|
||||||
|
@ -338,16 +324,6 @@
|
||||||
"@babel/plugin-syntax-async-generators": "^7.2.0"
|
"@babel/plugin-syntax-async-generators": "^7.2.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"@babel/plugin-proposal-class-properties": {
|
|
||||||
"version": "7.5.5",
|
|
||||||
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.5.5.tgz",
|
|
||||||
"integrity": "sha512-AF79FsnWFxjlaosgdi421vmYG6/jg79bVD0dpD44QdgobzHKuLZ6S3vl8la9qIeSwGi8i1fS0O1mfuDAAdo1/A==",
|
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
|
||||||
"@babel/helper-create-class-features-plugin": "^7.5.5",
|
|
||||||
"@babel/helper-plugin-utils": "^7.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"@babel/plugin-proposal-dynamic-import": {
|
"@babel/plugin-proposal-dynamic-import": {
|
||||||
"version": "7.5.0",
|
"version": "7.5.0",
|
||||||
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.5.0.tgz",
|
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-dynamic-import/-/plugin-proposal-dynamic-import-7.5.0.tgz",
|
||||||
|
@ -426,15 +402,6 @@
|
||||||
"@babel/helper-plugin-utils": "^7.0.0"
|
"@babel/helper-plugin-utils": "^7.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"@babel/plugin-syntax-export-namespace-from": {
|
|
||||||
"version": "7.2.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-export-namespace-from/-/plugin-syntax-export-namespace-from-7.2.0.tgz",
|
|
||||||
"integrity": "sha512-1zGA3UNch6A+A11nIzBVEaE3DDJbjfB+eLIcf0GGOh/BJr/8NxL3546MGhV/r0RhH4xADFIEso39TKCfEMlsGA==",
|
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
|
||||||
"@babel/helper-plugin-utils": "^7.0.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"@babel/plugin-syntax-json-strings": {
|
"@babel/plugin-syntax-json-strings": {
|
||||||
"version": "7.2.0",
|
"version": "7.2.0",
|
||||||
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.2.0.tgz",
|
||||||
|
|
|
@ -30,9 +30,7 @@
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/cli": "^7.4.4",
|
"@babel/cli": "^7.4.4",
|
||||||
"@babel/core": "^7.4.5",
|
"@babel/core": "^7.4.5",
|
||||||
"@babel/plugin-proposal-class-properties": "^7.4.4",
|
|
||||||
"@babel/plugin-syntax-export-default-from": "^7.2.0",
|
"@babel/plugin-syntax-export-default-from": "^7.2.0",
|
||||||
"@babel/plugin-syntax-export-namespace-from": "^7.2.0",
|
|
||||||
"@babel/plugin-transform-runtime": "^7.4.4",
|
"@babel/plugin-transform-runtime": "^7.4.4",
|
||||||
"@babel/preset-env": "^7.4.5",
|
"@babel/preset-env": "^7.4.5",
|
||||||
"@babel/preset-react": "^7.0.0",
|
"@babel/preset-react": "^7.0.0",
|
||||||
|
|
|
@ -22,7 +22,7 @@ Alert.propTypes = {
|
||||||
onDismiss: PropTypes.func,
|
onDismiss: PropTypes.func,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function Alert({
|
export function Alert({
|
||||||
type, message, onDismiss, children,
|
type, message, onDismiss, children,
|
||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
|
|
|
@ -29,7 +29,7 @@ Button.propTypes = {
|
||||||
]).isRequired,
|
]).isRequired,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function Button({
|
export function Button({
|
||||||
className, loading, forisFormSize, children, ...props
|
className, loading, forisFormSize, children, ...props
|
||||||
}) {
|
}) {
|
||||||
className = className ? `btn ${className}` : "btn btn-primary ";
|
className = className ? `btn ${className}` : "btn btn-primary ";
|
||||||
|
|
|
@ -27,7 +27,7 @@ CheckBox.defaultProps = {
|
||||||
disabled: false,
|
disabled: false,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function CheckBox({
|
export function CheckBox({
|
||||||
label, helpText, useDefaultSize, disabled, ...props
|
label, helpText, useDefaultSize, disabled, ...props
|
||||||
}) {
|
}) {
|
||||||
const uid = useUID();
|
const uid = useUID();
|
||||||
|
|
|
@ -10,7 +10,7 @@ import PropTypes from "prop-types";
|
||||||
import Datetime from "react-datetime/DateTime";
|
import Datetime from "react-datetime/DateTime";
|
||||||
import moment from "moment/moment";
|
import moment from "moment/moment";
|
||||||
|
|
||||||
import Input from "./Input";
|
import { Input } from "./Input";
|
||||||
|
|
||||||
DataTimeInput.propTypes = {
|
DataTimeInput.propTypes = {
|
||||||
/** Field label. */
|
/** Field label. */
|
||||||
|
@ -35,7 +35,7 @@ DataTimeInput.propTypes = {
|
||||||
const DEFAULT_DATE_FORMAT = "YYYY-MM-DD";
|
const DEFAULT_DATE_FORMAT = "YYYY-MM-DD";
|
||||||
const DEFAULT_TIME_FORMAT = "HH:mm:ss";
|
const DEFAULT_TIME_FORMAT = "HH:mm:ss";
|
||||||
|
|
||||||
export default function DataTimeInput({
|
export function DataTimeInput({
|
||||||
value, onChange, isValidDate, dateFormat, timeFormat, children, ...props
|
value, onChange, isValidDate, dateFormat, timeFormat, children, ...props
|
||||||
}) {
|
}) {
|
||||||
function renderInput(datetimeProps) {
|
function renderInput(datetimeProps) {
|
||||||
|
|
|
@ -8,9 +8,9 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
import Input from "./Input";
|
import { Input } from "./Input";
|
||||||
|
|
||||||
const EmailInput = ({ ...props }) => <Input type="email" {...props} />;
|
export const EmailInput = ({ ...props }) => <Input type="email" {...props} />;
|
||||||
|
|
||||||
|
|
||||||
EmailInput.propTypes = {
|
EmailInput.propTypes = {
|
||||||
|
@ -23,5 +23,3 @@ EmailInput.propTypes = {
|
||||||
/** Email value. */
|
/** Email value. */
|
||||||
value: PropTypes.string,
|
value: PropTypes.string,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default EmailInput;
|
|
||||||
|
|
|
@ -8,6 +8,7 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { useUID } from "react-uid/dist/es5/index";
|
import { useUID } from "react-uid/dist/es5/index";
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
import { formFieldsSize } from "./constants";
|
import { formFieldsSize } from "./constants";
|
||||||
|
|
||||||
Input.propTypes = {
|
Input.propTypes = {
|
||||||
|
@ -23,7 +24,7 @@ Input.propTypes = {
|
||||||
};
|
};
|
||||||
|
|
||||||
/** Base bootstrap input component. */
|
/** Base bootstrap input component. */
|
||||||
export default function Input({
|
export function Input({
|
||||||
type, label, helpText, error, className, children, ...props
|
type, label, helpText, error, className, children, ...props
|
||||||
}) {
|
}) {
|
||||||
const uid = useUID();
|
const uid = useUID();
|
||||||
|
|
|
@ -7,7 +7,8 @@
|
||||||
|
|
||||||
import React, { useEffect, useRef } from "react";
|
import React, { useEffect, useRef } from "react";
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
import Portal from "utils/Portal";
|
|
||||||
|
import { Portal } from "utils/Portal";
|
||||||
|
|
||||||
Modal.propTypes = {
|
Modal.propTypes = {
|
||||||
/** Is modal shown value */
|
/** Is modal shown value */
|
||||||
|
|
|
@ -8,9 +8,9 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
import Input from "./Input";
|
import { Input } from "./Input";
|
||||||
|
|
||||||
const NumberInput = ({ ...props }) => <Input type="number" {...props} />;
|
export const NumberInput = ({ ...props }) => <Input type="number" {...props} />;
|
||||||
|
|
||||||
NumberInput.propTypes = {
|
NumberInput.propTypes = {
|
||||||
/** Field label. */
|
/** Field label. */
|
||||||
|
@ -25,5 +25,3 @@ NumberInput.propTypes = {
|
||||||
PropTypes.number,
|
PropTypes.number,
|
||||||
]),
|
]),
|
||||||
};
|
};
|
||||||
|
|
||||||
export default NumberInput;
|
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
import React, { useState } from "react";
|
import React, { useState } from "react";
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
import Input from "./Input";
|
import { Input } from "./Input";
|
||||||
|
|
||||||
PasswordInput.propTypes = {
|
PasswordInput.propTypes = {
|
||||||
/** Field label. */
|
/** Field label. */
|
||||||
|
@ -23,7 +23,7 @@ PasswordInput.propTypes = {
|
||||||
withEye: PropTypes.bool,
|
withEye: PropTypes.bool,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function PasswordInput({ withEye, ...props }) {
|
export function PasswordInput({ withEye, ...props }) {
|
||||||
const [isHidden, setHidden] = useState(true);
|
const [isHidden, setHidden] = useState(true);
|
||||||
return (
|
return (
|
||||||
<Input
|
<Input
|
||||||
|
|
|
@ -30,7 +30,7 @@ RadioSet.propTypes = {
|
||||||
helpText: PropTypes.string,
|
helpText: PropTypes.string,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function RadioSet({
|
export function RadioSet({
|
||||||
name, label, choices, value, helpText, ...props
|
name, label, choices, value, helpText, ...props
|
||||||
}) {
|
}) {
|
||||||
const uid = useUID();
|
const uid = useUID();
|
||||||
|
|
|
@ -24,7 +24,7 @@ Select.propTypes = {
|
||||||
helpText: PropTypes.string,
|
helpText: PropTypes.string,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function Select({
|
export function Select({
|
||||||
label, choices, helpText, ...props
|
label, choices, helpText, ...props
|
||||||
}) {
|
}) {
|
||||||
const uid = useUID();
|
const uid = useUID();
|
||||||
|
|
|
@ -8,10 +8,10 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
import Input from "./Input";
|
import { Input } from "./Input";
|
||||||
|
|
||||||
|
|
||||||
const TextInput = ({ ...props }) => <Input type="text" {...props} />;
|
export const TextInput = ({ ...props }) => <Input type="text" {...props} />;
|
||||||
|
|
||||||
|
|
||||||
TextInput.propTypes = {
|
TextInput.propTypes = {
|
||||||
|
@ -22,5 +22,3 @@ TextInput.propTypes = {
|
||||||
/** Help text message. */
|
/** Help text message. */
|
||||||
helpText: PropTypes.string,
|
helpText: PropTypes.string,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default TextInput;
|
|
||||||
|
|
|
@ -5,25 +5,28 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import {render} from 'customTestRender';
|
import { render } from "customTestRender";
|
||||||
|
|
||||||
import Button from '../Button'
|
import { Button } from "../Button";
|
||||||
|
|
||||||
describe('<Button />', () => {
|
describe("<Button />", () => {
|
||||||
it('Render button correctly', () => {
|
it("Render button correctly", () => {
|
||||||
const {container} = render(<Button>Test Button</Button>);
|
const { container } = render(<Button>Test Button</Button>);
|
||||||
expect(container.firstChild).toMatchSnapshot()
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('Render button with custom classes', () => {
|
it("Render button with custom classes", () => {
|
||||||
const {container} = render(<Button className="one two three">Test Button</Button>)
|
const { container } = render(<Button className="one two three">Test Button</Button>);
|
||||||
expect(container.firstChild).toMatchSnapshot()
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('Render button with spinner', () => {
|
it("Render button with spinner", () => {
|
||||||
const {container} = render(<Button loading={true}>Test Button</Button>)
|
const { container } = render(<Button loading={true}>Test Button</Button>);
|
||||||
expect(container.firstChild).toMatchSnapshot()
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -5,32 +5,35 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import {render} from 'customTestRender';
|
import { render } from "customTestRender";
|
||||||
|
|
||||||
import CheckBox from '../Checkbox'
|
import { CheckBox } from "../Checkbox";
|
||||||
|
|
||||||
describe('<Checkbox/>', () => {
|
describe("<Checkbox/>", () => {
|
||||||
it('Render checkbox', () => {
|
it("Render checkbox", () => {
|
||||||
const {container} = render(
|
const { container } = render(
|
||||||
<CheckBox
|
<CheckBox
|
||||||
label="Test label"
|
label="Test label"
|
||||||
checked
|
checked
|
||||||
helpText="Some help text"
|
helpText="Some help text"
|
||||||
onChange={()=>{}}
|
onChange={() => {
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(container.firstChild).toMatchSnapshot();
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('Render uncheked checkbox', () => {
|
it("Render uncheked checkbox", () => {
|
||||||
const {container} = render(
|
const { container } = render(
|
||||||
<CheckBox
|
<CheckBox
|
||||||
label="Test label"
|
label="Test label"
|
||||||
helpText="Some help text"
|
helpText="Some help text"
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(container.firstChild).toMatchSnapshot();
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -5,16 +5,16 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import {render} from 'customTestRender';
|
import { render } from "customTestRender";
|
||||||
|
|
||||||
import NumberInput from '../NumberInput';
|
import { NumberInput } from "../NumberInput";
|
||||||
|
|
||||||
|
|
||||||
describe('<NumberInput/>', () => {
|
describe("<NumberInput/>", () => {
|
||||||
it('Render number input', () => {
|
it("Render number input", () => {
|
||||||
const {container} = render(
|
const { container } = render(
|
||||||
<NumberInput
|
<NumberInput
|
||||||
label="Test label"
|
label="Test label"
|
||||||
helpText="Some help text"
|
helpText="Some help text"
|
||||||
|
@ -23,6 +23,7 @@ describe('<NumberInput/>', () => {
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(container.firstChild).toMatchSnapshot();
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -5,15 +5,15 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import {render} from 'customTestRender';
|
import { render } from "customTestRender";
|
||||||
|
|
||||||
import PasswordInput from '../PasswordInput';
|
import { PasswordInput } from "../PasswordInput";
|
||||||
|
|
||||||
describe('<PasswordInput/>', () => {
|
describe("<PasswordInput/>", () => {
|
||||||
it('Render password input', () => {
|
it("Render password input", () => {
|
||||||
const {container} = render(
|
const { container } = render(
|
||||||
<PasswordInput
|
<PasswordInput
|
||||||
label="Test label"
|
label="Test label"
|
||||||
helpText="Some help text"
|
helpText="Some help text"
|
||||||
|
@ -22,6 +22,7 @@ describe('<PasswordInput/>', () => {
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(container.firstChild).toMatchSnapshot();
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -5,31 +5,41 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import {render} from 'customTestRender';
|
import { render } from "customTestRender";
|
||||||
|
|
||||||
import RadioSet from '../RadioSet';
|
import { RadioSet } from "../RadioSet";
|
||||||
|
|
||||||
const TEST_CHOICES = [
|
const TEST_CHOICES = [
|
||||||
{label: 'label', value: 'value'},
|
{
|
||||||
{label: 'another label', value: 'another value'},
|
label: "label",
|
||||||
{label: 'another one label', value: 'another on value'}
|
value: "value"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "another label",
|
||||||
|
value: "another value"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "another one label",
|
||||||
|
value: "another on value"
|
||||||
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
describe('<RadioSet/>', () => {
|
describe("<RadioSet/>", () => {
|
||||||
it('Render radio set', () => {
|
it("Render radio set", () => {
|
||||||
const {container} = render(
|
const { container } = render(
|
||||||
<RadioSet
|
<RadioSet
|
||||||
name={'test_name'}
|
name={"test_name"}
|
||||||
label='Radios set label'
|
label='Radios set label'
|
||||||
value='value'
|
value='value'
|
||||||
choices={TEST_CHOICES}
|
choices={TEST_CHOICES}
|
||||||
helpText={'Some help text'}
|
helpText={"Some help text"}
|
||||||
onChange={() => {
|
onChange={() => {
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(container.firstChild).toMatchSnapshot();
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -5,23 +5,23 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import {fireEvent, getByDisplayValue, getByText, render} from 'customTestRender';
|
import { fireEvent, getByDisplayValue, getByText, render } from "customTestRender";
|
||||||
|
|
||||||
import Select from '../Select';
|
import { Select } from "../Select";
|
||||||
|
|
||||||
const TEST_CHOICES = {
|
const TEST_CHOICES = {
|
||||||
'1': 'one',
|
"1": "one",
|
||||||
'2': 'two',
|
"2": "two",
|
||||||
'3': 'three',
|
"3": "three",
|
||||||
};
|
};
|
||||||
|
|
||||||
describe('<Select/>', () => {
|
describe("<Select/>", () => {
|
||||||
var selectContainer;
|
var selectContainer;
|
||||||
const onChangeHandler = jest.fn();
|
const onChangeHandler = jest.fn();
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
const {container} = render(
|
const { container } = render(
|
||||||
<Select
|
<Select
|
||||||
label='Test label'
|
label='Test label'
|
||||||
value='1'
|
value='1'
|
||||||
|
@ -34,18 +34,22 @@ describe('<Select/>', () => {
|
||||||
selectContainer = container;
|
selectContainer = container;
|
||||||
});
|
});
|
||||||
|
|
||||||
it('Test with snapshot.', () => {
|
it("Test with snapshot.", () => {
|
||||||
expect(selectContainer).toMatchSnapshot();
|
expect(selectContainer)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
it('Test onChange handling.', () => {
|
it("Test onChange handling.", () => {
|
||||||
const select = getByDisplayValue(selectContainer, 'one');
|
const select = getByDisplayValue(selectContainer, "one");
|
||||||
expect(select.value).toBe('1');
|
expect(select.value)
|
||||||
fireEvent.change(select, {target: {value: '2'}});
|
.toBe("1");
|
||||||
|
fireEvent.change(select, { target: { value: "2" } });
|
||||||
|
|
||||||
const option = getByText(selectContainer, 'two');
|
const option = getByText(selectContainer, "two");
|
||||||
expect(onChangeHandler).toBeCalled();
|
expect(onChangeHandler)
|
||||||
|
.toBeCalled();
|
||||||
|
|
||||||
expect(option.value).toBe('2');
|
expect(option.value)
|
||||||
})
|
.toBe("2");
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -5,15 +5,15 @@
|
||||||
* See /LICENSE for more information.
|
* See /LICENSE for more information.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from "react";
|
||||||
|
|
||||||
import {render} from 'customTestRender';
|
import { render } from "customTestRender";
|
||||||
|
|
||||||
import TextInput from '../TextInput';
|
import { TextInput } from "../TextInput";
|
||||||
|
|
||||||
describe('<TextInput/>', () => {
|
describe("<TextInput/>", () => {
|
||||||
it('Render text input', () => {
|
it("Render text input", () => {
|
||||||
const {container} = render(
|
const { container } = render(
|
||||||
<TextInput
|
<TextInput
|
||||||
label="Test label"
|
label="Test label"
|
||||||
helpText="Some help text"
|
helpText="Some help text"
|
||||||
|
@ -22,6 +22,7 @@ describe('<TextInput/>', () => {
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
expect(container.firstChild).toMatchSnapshot();
|
expect(container.firstChild)
|
||||||
|
.toMatchSnapshot();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -7,9 +7,9 @@
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import {act, fireEvent, render, waitForElement} from 'customTestRender';
|
import { act, fireEvent, render, waitForElement } from 'customTestRender';
|
||||||
import mockAxios from 'jest-mock-axios';
|
import mockAxios from 'jest-mock-axios';
|
||||||
import ForisForm from "../components/ForisForm";
|
import { ForisForm } from "../components/ForisForm";
|
||||||
|
|
||||||
|
|
||||||
// It's possible to unittest each hooks via react-hooks-testing-library.
|
// It's possible to unittest each hooks via react-hooks-testing-library.
|
||||||
|
|
|
@ -10,75 +10,129 @@ import {
|
||||||
validateDUID,
|
validateDUID,
|
||||||
validateIPv4Address,
|
validateIPv4Address,
|
||||||
validateIPv6Address,
|
validateIPv6Address,
|
||||||
validateIPv6Prefix, validateMAC
|
validateIPv6Prefix,
|
||||||
} from 'validations';
|
validateMAC
|
||||||
|
} from "validations";
|
||||||
|
|
||||||
describe('Validation functions', () => {
|
describe("Validation functions", () => {
|
||||||
it('validateIPv4Address valid', () => {
|
it("validateIPv4Address valid", () => {
|
||||||
expect(validateIPv4Address('192.168.1.1')).toBe(undefined);
|
expect(validateIPv4Address("192.168.1.1"))
|
||||||
expect(validateIPv4Address('1.1.1.1')).toBe(undefined);
|
.toBe(undefined);
|
||||||
expect(validateIPv4Address('0.0.0.0')).toBe(undefined);
|
expect(validateIPv4Address("1.1.1.1"))
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv4Address("0.0.0.0"))
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
it('validateIPv4Address invalid', () => {
|
it("validateIPv4Address invalid", () => {
|
||||||
expect(validateIPv4Address('invalid')).not.toBe(undefined);
|
expect(validateIPv4Address("invalid"))
|
||||||
expect(validateIPv4Address('192.256.1.1')).not.toBe(undefined);
|
.not
|
||||||
expect(validateIPv4Address('192.168.256.1')).not.toBe(undefined);
|
.toBe(undefined);
|
||||||
expect(validateIPv4Address('192.168.1.256')).not.toBe(undefined);
|
expect(validateIPv4Address("192.256.1.1"))
|
||||||
expect(validateIPv4Address('192.168.1.256')).not.toBe(undefined);
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv4Address("192.168.256.1"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv4Address("192.168.1.256"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv4Address("192.168.1.256"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('validateIPv6Address valid', () => {
|
it("validateIPv6Address valid", () => {
|
||||||
expect(validateIPv6Address('2001:0db8:85a3:0000:0000:8a2e:0370:7334')).toBe(undefined);
|
expect(validateIPv6Address("2001:0db8:85a3:0000:0000:8a2e:0370:7334"))
|
||||||
expect(validateIPv6Address('0:0:0:0:0:0:0:1')).toBe(undefined);
|
.toBe(undefined);
|
||||||
expect(validateIPv6Address('::1')).toBe(undefined);
|
expect(validateIPv6Address("0:0:0:0:0:0:0:1"))
|
||||||
expect(validateIPv6Address('::')).toBe(undefined);
|
.toBe(undefined);
|
||||||
|
expect(validateIPv6Address("::1"))
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv6Address("::"))
|
||||||
|
.toBe(undefined);
|
||||||
|
|
||||||
});
|
});
|
||||||
it('validateIPv6Address invalid', () => {
|
it("validateIPv6Address invalid", () => {
|
||||||
expect(validateIPv6Address('invalid')).not.toBe(undefined);
|
expect(validateIPv6Address("invalid"))
|
||||||
expect(validateIPv6Address('1.1.1.1')).not.toBe(undefined);
|
.not
|
||||||
expect(validateIPv6Address('1200::AB00:1234::2552:7777:1313')).not.toBe(undefined);
|
.toBe(undefined);
|
||||||
expect(validateIPv6Address('1200:0000:AB00:1234:O000:2552:7777:1313')).not.toBe(undefined);
|
expect(validateIPv6Address("1.1.1.1"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv6Address("1200::AB00:1234::2552:7777:1313"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv6Address("1200:0000:AB00:1234:O000:2552:7777:1313"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('validateIPv6Prefix valid', () => {
|
it("validateIPv6Prefix valid", () => {
|
||||||
expect(validateIPv6Prefix('2002:0000::/16')).toBe(undefined);
|
expect(validateIPv6Prefix("2002:0000::/16"))
|
||||||
expect(validateIPv6Prefix('0::/0')).toBe(undefined);
|
.toBe(undefined);
|
||||||
|
expect(validateIPv6Prefix("0::/0"))
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
it('validateIPv6Prefix invalid', () => {
|
it("validateIPv6Prefix invalid", () => {
|
||||||
expect(validateIPv6Prefix('2001:0db8:85a3:0000:0000:8a2e:0370:7334')).not.toBe(undefined);
|
expect(validateIPv6Prefix("2001:0db8:85a3:0000:0000:8a2e:0370:7334"))
|
||||||
expect(validateIPv6Prefix('::1')).not.toBe(undefined);
|
.not
|
||||||
expect(validateIPv6Prefix('2002:0000::/999')).not.toBe(undefined);
|
.toBe(undefined);
|
||||||
|
expect(validateIPv6Prefix("::1"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateIPv6Prefix("2002:0000::/999"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
it('validateDomain valid', () => {
|
it("validateDomain valid", () => {
|
||||||
expect(validateDomain('example.com')).toBe(undefined);
|
expect(validateDomain("example.com"))
|
||||||
expect(validateDomain('one.two.three')).toBe(undefined);
|
.toBe(undefined);
|
||||||
|
expect(validateDomain("one.two.three"))
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
it('validateDomain invalid', () => {
|
it("validateDomain invalid", () => {
|
||||||
expect(validateDomain('test/')).not.toBe(undefined);
|
expect(validateDomain("test/"))
|
||||||
expect(validateDomain('.')).not.toBe(undefined);
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateDomain("."))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('validateDUID valid', () => {
|
it("validateDUID valid", () => {
|
||||||
expect(validateDUID('abcdefAB')).toBe(undefined);
|
expect(validateDUID("abcdefAB"))
|
||||||
expect(validateDUID('ABCDEF12')).toBe(undefined);
|
.toBe(undefined);
|
||||||
expect(validateDUID('ABCDEF12AB')).toBe(undefined);
|
expect(validateDUID("ABCDEF12"))
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateDUID("ABCDEF12AB"))
|
||||||
|
.toBe(undefined);
|
||||||
|
|
||||||
});
|
});
|
||||||
it('validateDUID invalid', () => {
|
it("validateDUID invalid", () => {
|
||||||
expect(validateDUID('gggggggg')).not.toBe(undefined);
|
expect(validateDUID("gggggggg"))
|
||||||
expect(validateDUID('abcdefABa')).not.toBe(undefined);
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateDUID("abcdefABa"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('validateMAC valid', () => {
|
it("validateMAC valid", () => {
|
||||||
expect(validateMAC('00:D0:56:F2:B5:12')).toBe(undefined);
|
expect(validateMAC("00:D0:56:F2:B5:12"))
|
||||||
expect(validateMAC('00:26:DD:14:C4:EE')).toBe(undefined);
|
.toBe(undefined);
|
||||||
expect(validateMAC('06:00:00:00:00:00')).toBe(undefined);
|
expect(validateMAC("00:26:DD:14:C4:EE"))
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateMAC("06:00:00:00:00:00"))
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
it('validateMAC invalid', () => {
|
it("validateMAC invalid", () => {
|
||||||
expect(validateMAC('00:00:00:00:00:0G')).not.toBe(undefined);
|
expect(validateMAC("00:00:00:00:00:0G"))
|
||||||
expect(validateMAC('06:00:00:00:00:00:00')).not.toBe(undefined);
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
|
expect(validateMAC("06:00:00:00:00:00:00"))
|
||||||
|
.not
|
||||||
|
.toBe(undefined);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -57,7 +57,7 @@ ForisForm.defaultProps = {
|
||||||
};
|
};
|
||||||
|
|
||||||
/** Serves as HOC for all foris forms components. */
|
/** Serves as HOC for all foris forms components. */
|
||||||
export default function ForisForm({
|
export function ForisForm({
|
||||||
ws,
|
ws,
|
||||||
forisConfig,
|
forisConfig,
|
||||||
prepData,
|
prepData,
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
import Button from "bootstrap/Button";
|
import { Button } from "bootstrap/Button";
|
||||||
|
|
||||||
export const STATES = {
|
export const STATES = {
|
||||||
READY: 1,
|
READY: 1,
|
||||||
|
@ -18,7 +18,8 @@ export const STATES = {
|
||||||
|
|
||||||
SubmitButton.propTypes = {
|
SubmitButton.propTypes = {
|
||||||
disabled: PropTypes.bool,
|
disabled: PropTypes.bool,
|
||||||
state: PropTypes.oneOf(Object.keys(STATES).map((key) => STATES[key])),
|
state: PropTypes.oneOf(Object.keys(STATES)
|
||||||
|
.map((key) => STATES[key])),
|
||||||
};
|
};
|
||||||
|
|
||||||
export function SubmitButton({ disabled, state, ...props }) {
|
export function SubmitButton({ disabled, state, ...props }) {
|
||||||
|
|
|
@ -8,8 +8,8 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import PropTypes from "prop-types";
|
import PropTypes from "prop-types";
|
||||||
|
|
||||||
import Alert from "bootstrap/Alert";
|
import { Alert } from "bootstrap/Alert";
|
||||||
import Portal from "utils/Portal";
|
import { Portal } from "utils/Portal";
|
||||||
|
|
||||||
SuccessAlert.propTypes = {
|
SuccessAlert.propTypes = {
|
||||||
onDismiss: PropTypes.func.isRequired,
|
onDismiss: PropTypes.func.isRequired,
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { useCallback, useEffect, useReducer } from "react";
|
||||||
import update from "immutability-helper";
|
import update from "immutability-helper";
|
||||||
|
|
||||||
import { useAPIGet } from "api/hooks";
|
import { useAPIGet } from "api/hooks";
|
||||||
import useWSForisModule from "webSockets/hooks";
|
import { useWSForisModule } from "webSockets/hooks";
|
||||||
|
|
||||||
|
|
||||||
const FORM_ACTIONS = {
|
const FORM_ACTIONS = {
|
||||||
|
|
53
src/index.js
53
src/index.js
|
@ -1,40 +1,20 @@
|
||||||
import * as Alert from "bootstrap/Alert";
|
|
||||||
import * as Button from "bootstrap/Button";
|
|
||||||
import * as CheckBox from "bootstrap/Checkbox";
|
|
||||||
import * as formFieldsSize from "bootstrap/constants";
|
|
||||||
import * as DataTimeInput from "bootstrap/DataTimeInput";
|
|
||||||
import * as EmailInput from "bootstrap/EmailInput";
|
|
||||||
import * as Input from "bootstrap/Input";
|
|
||||||
import * as NumberInput from "bootstrap/NumberInput";
|
|
||||||
import * as PasswordInput from "bootstrap/PasswordInput";
|
|
||||||
import * as RadioSet from "bootstrap/RadioSet";
|
|
||||||
import * as Select from "bootstrap/Select";
|
|
||||||
import * as TextInput from "bootstrap/TextInput";
|
|
||||||
|
|
||||||
import * as useWSForisModule from "webSockets/hooks";
|
|
||||||
import * as WebSockets from "webSockets/WebSockets";
|
|
||||||
import * as Portal from "utils/Portal";
|
|
||||||
|
|
||||||
import ForisForm from "form/components/ForisForm";
|
|
||||||
|
|
||||||
// API
|
// API
|
||||||
export { useAPIGet, useAPIPost } from "./api/hooks";
|
export { useAPIGet, useAPIPost } from "./api/hooks";
|
||||||
|
|
||||||
// Bootstrap
|
// Bootstrap
|
||||||
export {
|
export { Alert } from "bootstrap/Alert";
|
||||||
Alert,
|
export { Button } from "bootstrap/Button";
|
||||||
Button,
|
export { CheckBox } from "bootstrap/Checkbox";
|
||||||
CheckBox,
|
export { formFieldsSize } from "bootstrap/constants";
|
||||||
formFieldsSize,
|
export { DataTimeInput } from "bootstrap/DataTimeInput";
|
||||||
DataTimeInput,
|
export { EmailInput } from "bootstrap/EmailInput";
|
||||||
EmailInput,
|
export { Input } from "bootstrap/Input";
|
||||||
Input,
|
export { NumberInput } from "bootstrap/NumberInput";
|
||||||
NumberInput,
|
export { PasswordInput } from "bootstrap/PasswordInput";
|
||||||
PasswordInput,
|
export { RadioSet } from "bootstrap/RadioSet";
|
||||||
RadioSet,
|
export { Select } from "bootstrap/Select";
|
||||||
Select,
|
export { TextInput } from "bootstrap/TextInput";
|
||||||
TextInput,
|
|
||||||
};
|
|
||||||
export {
|
export {
|
||||||
Spinner,
|
Spinner,
|
||||||
SpinnerElement,
|
SpinnerElement,
|
||||||
|
@ -48,7 +28,7 @@ export {
|
||||||
|
|
||||||
|
|
||||||
// Form
|
// Form
|
||||||
export { ForisForm };
|
export { ForisForm } from "form/components/ForisForm";
|
||||||
export { SubmitButton, STATES as SUBMIT_BUTTON_STATES } from "form/components/SubmitButton";
|
export { SubmitButton, STATES as SUBMIT_BUTTON_STATES } from "form/components/SubmitButton";
|
||||||
export { useForisModule, useForm } from "form/hooks";
|
export { useForisModule, useForm } from "form/hooks";
|
||||||
|
|
||||||
|
@ -57,10 +37,11 @@ export { useForisModule, useForm } from "form/hooks";
|
||||||
export { mockedWS } from "testUtils/mockWS";
|
export { mockedWS } from "testUtils/mockWS";
|
||||||
|
|
||||||
// WebSockets
|
// WebSockets
|
||||||
export { useWSForisModule, WebSockets };
|
export { useWSForisModule } from "webSockets/hooks";
|
||||||
|
export { WebSockets } from "webSockets/WebSockets";
|
||||||
|
|
||||||
// Utils
|
// Utils
|
||||||
export { Portal };
|
export { Portal } from "utils/Portal";
|
||||||
|
|
||||||
// Foris URL
|
// Foris URL
|
||||||
export { ForisURLs, REFORIS_URL_PREFIX } from "./forisUrls";
|
export { ForisURLs, REFORIS_URL_PREFIX } from "./forisUrls";
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
|
|
||||||
import ReactDOM from "react-dom";
|
import ReactDOM from "react-dom";
|
||||||
|
|
||||||
export default function Portal({ containerId, children }) {
|
export function Portal({ containerId, children }) {
|
||||||
const container = document.getElementById(containerId);
|
const container = document.getElementById(containerId);
|
||||||
if (container) return ReactDOM.createPortal(children, container);
|
if (container) return ReactDOM.createPortal(children, container);
|
||||||
return null;
|
return null;
|
||||||
|
|
|
@ -17,7 +17,7 @@ const URL = process.env.LIGHTTPD
|
||||||
|
|
||||||
const WAITING_FOR_CONNECTION_TIMEOUT = 500;
|
const WAITING_FOR_CONNECTION_TIMEOUT = 500;
|
||||||
|
|
||||||
export default class WebSockets {
|
export class WebSockets {
|
||||||
constructor() {
|
constructor() {
|
||||||
this.ws = new WebSocket(URL);
|
this.ws = new WebSocket(URL);
|
||||||
this.ws.onerror = (e) => {
|
this.ws.onerror = (e) => {
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
|
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
|
|
||||||
export default function useWSForisModule(ws, module, action = "update_settings") {
|
export function useWSForisModule(ws, module, action = "update_settings") {
|
||||||
const [data, setData] = useState(null);
|
const [data, setData] = useState(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
Loading…
Reference in New Issue
Block a user