Merge branch 'feature/shibui-1788' of bitbucket.org:unicon/shib-idp-u…

…i into feature/shibui-1788
TIER · Jun 28, 2021 · b93526a · b93526a
2 parents e059c9b + 554d345
commit b93526a
Show file tree

Hide file tree

Showing 26 changed files with 219 additions and 116 deletions.
diff --git a/backend/src/main/resources/nameid-filter.schema.json b/backend/src/main/resources/nameid-filter.schema.json
@@ -21,7 +21,7 @@
             "type": "object",
             "properties": {
                 "nameIdFormatFilterTargetType": {
-                    "title": "",
+                    "title": "label.filter-target-type",
                     "type": "string",
                     "default": "ENTITY",
                     "enum": [

diff --git a/ui/package-lock.json b/ui/package-lock.json
diff --git a/ui/package.json b/ui/package.json
@@ -20,12 +20,12 @@
     "react": "^17.0.2",
     "react-bootstrap": "^1.5.2",
     "react-bootstrap-typeahead": "^5.1.4",
-    "react-contenteditable": "^3.3.5",
     "react-dom": "^17.0.2",
     "react-hook-form": "^7.5.2",
     "react-infinite-scroll-component": "^6.1.0",
     "react-router-dom": "^5.2.0",
     "react-scroll": "^1.8.2",
+    "react-simple-code-editor": "^0.11.0",
     "use-http": "^1.0.20",
     "use-query-params": "^1.2.2",
     "web-vitals": "^1.0.1"

diff --git a/ui/src/app/admin/container/SourcesActions.js b/ui/src/app/admin/container/SourcesActions.js
@@ -8,20 +8,10 @@ export function SourcesActions ({sources, reloadSources}) {
 
     const { dispatch } = React.useContext(NotificationContext);
 
-    const { put, del, response } = useMetadataEntity('source', {
+    const { put, response } = useMetadataEntity('source', {
         cachePolicy: 'no-cache'
     });
 
-    async function deleteSource(id) {
-        await del(`/${id}`);
-        if (response.ok) {
-            dispatch(createNotificationAction(
-                `Metadata Source has been removed.`
-            ));
-            reloadSources();
-        }
-    }
-
     async function enableSource(source) {
         await put(`/${source.id}`, {
             ...source,
@@ -36,6 +26,6 @@ export function SourcesActions ({sources, reloadSources}) {
     }
 
     return (
-        <SourceList entities={sources} onDelete={ deleteSource } onEnable={ enableSource } />
+        <SourceList entities={sources} onDelete={ reloadSources } onEnable={ enableSource } />
     );
 }
diff --git a/ui/src/app/core/components/FormattedDate.js b/ui/src/app/core/components/FormattedDate.js
@@ -1,8 +1,17 @@
 import React from 'react';
 import { format, parseISO } from 'date-fns';
 
+export function useDateFormatter() {
+    return (date, time) => format(parseISO(date), `MMM d, Y${time ? ' HH:mm:ss' : ''}`);
+}
+
+export function useFormattedDate (date, time = false) {
+    const formatter = useDateFormatter();
+    return React.useMemo(() => formatter(date, time), [date, time, formatter]);
+}
+
 export function FormattedDate ({ date, time = false }) {
-    const formatted = React.useMemo(() => format(parseISO(date), `MMM d, Y${time ? ' HH:mm:ss' : ''}`), [date, time]);
+    const formatted = useFormattedDate(date, time);
 
     return (<>{ formatted }</>);
 }

diff --git a/ui/src/app/dashboard/view/Dashboard.js b/ui/src/app/dashboard/view/Dashboard.js
@@ -40,7 +40,7 @@ export function Dashboard () {
     }
 
     async function loadSources() {
-        const s = sourceLoader.get();
+        const s = await sourceLoader.get();
         if (response.ok) {
             setSources(s);
         }

diff --git a/ui/src/app/dashboard/view/SourcesTab.js b/ui/src/app/dashboard/view/SourcesTab.js
@@ -16,7 +16,7 @@ export function SourcesTab () {
     });
 
     async function loadSources() {
-        const sources = await get('/');
+        const sources = await get('');
         if (response.ok) {
             setSources(sources);
         }

diff --git a/ui/src/app/form/component/fields/FilterTargetField.js b/ui/src/app/form/component/fields/FilterTargetField.js
@@ -6,12 +6,15 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faAsterisk, faCaretDown, faCaretUp, faEye, faEyeSlash, faPlus, faSpinner, faTrash } from '@fortawesome/free-solid-svg-icons';
 import { useTranslator } from '../../../i18n/hooks';
 import { InfoIcon } from '../InfoIcon';
-import ContentEditable from 'react-contenteditable';
 import { AsyncTypeahead } from 'react-bootstrap-typeahead';
 import useFetch from 'use-http';
 import queryString from 'query-string';
 import API_BASE_PATH from '../../../App.constant';
 import isNil from 'lodash/isNil';
+import Editor from 'react-simple-code-editor';
+// import { highlight, languages } from 'prismjs/components/prism-core';
+// import 'prismjs/components/prism-clike';
+// import 'prismjs/components/prism-javascript';
 
 import { FilterTargetPreview } from '../../../metadata/hoc/FilterTargetPreview';
 
@@ -89,8 +92,6 @@ const FilterTargetField = ({
     const displayType = selectedType?.label || '';
     const targetType = selectedType?.value || null;
 
-    const ref = React.useRef(selectedTarget[0]);
-
     var handleTextChange = function (value) {
         setSelectedTarget([value]);
     };
@@ -187,20 +188,22 @@ const FilterTargetField = ({
                                     </>
                                 }
                                 { targetType === 'CONDITION_SCRIPT' &&
-                                    <>
-                                    <ContentEditable
-                                        role="textbox"
-                                        className="codearea form-control"
-                                        rows="8"
-                                        onChange={({ target: { value } }) => handleTextChange(value)}
-                                        html={ selectedTarget[0] }
-                                        innerRef={ref}
-                                        dangerouslySetInnerHTML={true}>
-                                    </ContentEditable>
-                                    <small id="script-help" className="text-danger">
+                                    <div className="editor">
+                                    <Editor
+                                        value={selectedTarget[0]}
+                                        highlight={(code) => code}
+                                        onValueChange={(code) => handleTextChange(code)}
+                                        padding={10}
+                                        className={`codearea border rounded ${!selectedTarget[0] && 'is-invalid border-danger'}`}
+                                        style={{
+                                            fontFamily: 'monospace',
+                                            fontSize: 15,
+                                        }}>
+                                    </Editor>
+                                    {!selectedTarget[0] && <small id="script-help" className="text-danger">
                                         <Translate value="message.required-for-scripts">Required for Scripts</Translate>
-                                    </small>
-                                </> }
+                                    </small>}
+                                </div> }
                                 {targetType === 'REGEX' &&
                                     <>
                                         <input id="targetInput"

diff --git a/ui/src/app/form/component/fields/StringListWithDefaultField.js b/ui/src/app/form/component/fields/StringListWithDefaultField.js
@@ -95,29 +95,34 @@ const StringListWithDefaultField = ({
         <div>
             <Row className="">
                 <Col className="">
-                    <div className="d-flex align-items-center mb-3">
-                        {<ArrayFieldTitle
-                            key={`array-field-title-${props.idSchema.$id}`}
-                            TitleField={fields.TitleField}
-                            idSchema={props.idSchema}
-                            title={props.uiSchema["ui:title"] || props.title}
-                            required={props.required}
-                        />}
-                        <AddButton
-                            className="array-item-add mx-2"
-                            onClick={onAdd}
-                            disabled={props.disabled || props.readonly}
-                        />
-                        {(props.uiSchema["ui:description"] || schema.description) && (
-                            <ArrayFieldDescription
-                                key={`array-field-description-${props.idSchema.$id}`}
-                                DescriptionField={fields.DescriptionField}
+                    <div className="d-flex align-items-center justify-content-between mb-3">
+                        <div className="d-flex align-items-center mb-3">
+                            {<ArrayFieldTitle
+                                key={`array-field-title-${props.idSchema.$id}`}
+                                TitleField={fields.TitleField}
                                 idSchema={props.idSchema}
-                                description={
-                                    props.uiSchema["ui:description"] || schema.description
-                                }
+                                title={props.uiSchema["ui:title"] || props.title}
+                                required={props.required}
+                            />}
+                            <AddButton
+                                className="array-item-add mx-2"
+                                onClick={onAdd}
+                                disabled={props.disabled || props.readonly}
                             />
-                        )}
+                            {(props.uiSchema["ui:description"] || schema.description) && (
+                                <ArrayFieldDescription
+                                    key={`array-field-description-${props.idSchema.$id}`}
+                                    DescriptionField={fields.DescriptionField}
+                                    idSchema={props.idSchema}
+                                    description={
+                                        props.uiSchema["ui:description"] || schema.description
+                                    }
+                                />
+                            )}
+                        </div>
+                        <div className="mr-3">
+                            Default
+                        </div>
                     </div>
                     <div>
                         {items && items.map((p, idx) =>
@@ -127,7 +132,7 @@ const StringListWithDefaultField = ({
                                     className="flex-grow-1"
                                     value={p.value}
                                     onChange={({ target: { value } }) => setValue(p, value)}></Form.Control>
-                                <Form.Control custom name="default" type="radio" className="mx-4"
+                                <Form.Control className="mx-4" custom name="default" type="radio"
                                     checked={ p.default }
                                     onChange={ () => setDefault(p) }
                                 ></Form.Control>

diff --git a/ui/src/app/form/component/widgets/RadioWidget.js b/ui/src/app/form/component/widgets/RadioWidget.js
@@ -46,7 +46,7 @@ const RadioWidget = ({
                 const itemDisabled =
                     Array.isArray(enumDisabled) &&
                     enumDisabled.indexOf(option.value) !== -1;
-                const checked = option.value.toString() === value.toString();
+                const checked = option?.value?.toString() === value?.toString();
 
                 const radio = (
                     <Form.Check

diff --git a/ui/src/app/metadata/Metadata.js b/ui/src/app/metadata/Metadata.js
@@ -11,6 +11,7 @@ import { MetadataComparison } from './view/MetadataComparison';
 import { MetadataVersion } from './view/MetadataVersion';
 import { MetadataEdit } from './view/MetadataEdit';
 import { MetadataRestore } from './view/MetadataRestore';
+import { MetadataConfirmRestore } from './view/MetadataConfirmRestore';
 
 export function Metadata () {
 
@@ -51,7 +52,10 @@ export function Metadata () {
                             <Route path={`${path}/edit/:section`} render={ () =>
                                 <MetadataEdit />
                             } />
-                            <Route path={`${path}/restore/:versionId/:section`} render={ () =>
+                            <Route path={`${path}/restore/:versionId/:section`} exact render={ () =>
+                                <MetadataConfirmRestore />
+                            } />
+                            <Route path={`${path}/restore/:versionId/:section/edit`} render={ () =>
                                 <MetadataRestore />
                             } />
                             <Redirect exact path={`${path}`} to={`${path}/configuration/options`} />

diff --git a/ui/src/app/metadata/component/properties/PrimitiveProperty.js b/ui/src/app/metadata/component/properties/PrimitiveProperty.js
@@ -9,6 +9,10 @@ export function PrimitiveProperty ({ property, columns }) {
 
     const width = usePropertyWidth(columns);
 
+    const getValue = (v) => {
+        return property.enum && property.enumNames ? property.enumNames[property.enum.indexOf(v)] : v;
+    }
+
     return (
         <div tabIndex="0">
             {property.differences && <span className="sr-only">Changed:</span> }
@@ -21,7 +25,7 @@ export function PrimitiveProperty ({ property, columns }) {
                                 <Translate value={property.name}>{ property.name }</Translate>
                         </span>
                         {property.value.map((v, valIdx) =>
-                            <PropertyValue key={`prop-${valIdx}`} value={v} name={property.name} columns={columns} index={valIdx} />
+                            <PropertyValue key={`prop-${valIdx}`} value={getValue(v)} name={property.name} columns={columns} index={valIdx} />
                         ) }
                     </div>
 

diff --git a/ui/src/app/metadata/component/properties/PropertyValue.js b/ui/src/app/metadata/component/properties/PropertyValue.js
@@ -3,6 +3,7 @@ import Popover from 'react-bootstrap/Popover';
 import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
 
 import { usePropertyWidth } from './hooks';
+import Translate from '../../../i18n/components/translate';
 
 export function PropertyValue ({ name, value, columns, className }) {
 
@@ -20,7 +21,9 @@ export function PropertyValue ({ name, value, columns, className }) {
                     className={`d-block text-truncate ${className}`}
                     role="definition"
                     style={columns ? { width } : {}}>
-                    {value !== undefined ? value.toString() : (value === false) ? value.toString() : '-'}
+                    <Translate value={value !== undefined ? value.toString() : (value === false) ? value.toString() : '-'}>
+                        {value !== undefined ? value.toString() : (value === false) ? value.toString() : '-'}
+                    </Translate>
                 </span>
             </OverlayTrigger>
         : <span className={`d-block text-truncate ${className}`} style={columns ? { width } : {}}>-</span>}

diff --git a/ui/src/app/metadata/domain/attribute/CustomAttributeDefinition.js b/ui/src/app/metadata/domain/attribute/CustomAttributeDefinition.js
@@ -77,13 +77,6 @@ export const CustomAttributeDefinition = {
             }
         }
 
-        if (attributeType === 'STRING') {
-            parsed = {
-                ...parsed,
-                defaultValue: data.defaultValueString
-            }
-        }
-
         return parsed;
     },
 
@@ -112,13 +105,6 @@ export const CustomAttributeDefinition = {
             }
         }
 
-        if (attributeType === 'STRING') {
-            formatted = {
-                ...formatted,
-                defaultValueString: formatted.defaultValue
-            }
-        }
-
         return formatted;
     }
 }

diff --git a/ui/src/app/metadata/domain/filter/EntityAttributesFilterDefinition.js b/ui/src/app/metadata/domain/filter/EntityAttributesFilterDefinition.js
@@ -53,6 +53,13 @@ export const EntityAttributesFilterWizard = {
                     errors.entityAttributesFilterTarget.value.addError('message.invalid-regex-pattern');
                 }
             }
+
+            if (formData?.entityAttributesFilterTarget?.entityAttributesFilterTargetType === 'CONDITION_SCRIPT') {
+                const { entityAttributesFilterTarget: { value } } = formData;
+                if (!value[0]) {
+                    errors.entityAttributesFilterTarget.value.addError('message.required-for-scripts');
+                }
+            }
             return errors;
         }
     },

diff --git a/ui/src/app/metadata/domain/filter/NameIdFilterDefinition.js b/ui/src/app/metadata/domain/filter/NameIdFilterDefinition.js
@@ -41,6 +41,13 @@ export const NameIDFilterWizard = {
                     errors.nameIdFormatFilterTarget.value.addError('message.invalid-regex-pattern');
                 }
             }
+
+            if (formData?.nameIdFormatFilterTarget?.nameIdFormatFilterTargetType === 'CONDITION_SCRIPT') {
+                const { nameIdFormatFilterTarget: { value } } = formData;
+                if (!value[0]) {
+                    errors.nameIdFormatFilterTarget.value.addError('message.required-for-scripts');
+                }
+            }
             return errors;
         }
     },