Skip to content

Commit

Permalink
Added metadata summary
Browse files Browse the repository at this point in the history
  • Loading branch information
rmathis committed Apr 28, 2021
1 parent 0ed5247 commit 1cf70d1
Show file tree
Hide file tree
Showing 23 changed files with 834 additions and 41 deletions.
1 change: 1 addition & 0 deletions ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
"@testing-library/user-event": "^12.1.10",
"bootstrap": "^4.6.0",
"date-fns": "^2.21.1",
"file-saver": "^2.0.5",
"http-proxy-middleware": "^1.2.0",
"lodash": "^4.17.21",
"prop-types": "^15.7.2",
Expand Down
1 change: 1 addition & 0 deletions ui/src/app/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ function App() {
interceptors: {
request: async ({options, url, path, route}) => {
options.headers['X-XSRF-TOKEN'] = get_cookie('XSRF-TOKEN');

return options;
}
}
Expand Down
7 changes: 7 additions & 0 deletions ui/src/app/core/utility/download_as_xml.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import * as FileSaver from 'file-saver';

export const downloadAsXml = (entity, xml) => {
const name = entity.name ? entity.name : entity.serviceProviderName;
const blob = new Blob([xml], { type: 'text/xml;charset=utf-8' });
FileSaver.saveAs(blob, `${name}.xml`);
}
39 changes: 24 additions & 15 deletions ui/src/app/metadata/Metadata.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,28 +6,37 @@ import { MetadataHistory } from './component/MetadataHistory';
import { MetadataEditor } from './editor/MetadataEditor';
import { MetadataSelector } from './hoc/MetadataSelector';
import { MetadataSchema } from './hoc/MetadataSchema';
import { MetadataXmlLoader } from './hoc/MetadataXmlLoader';
import { MetadataXml } from './component/MetadataXml';

export function Metadata () {

let { path } = useRouteMatch();

return (
<MetadataSelector>
<MetadataSchema>
<Switch>
<Route path={`${path}/configuration/options`} render={ () =>
<MetadataDetail>
<MetadataOptions></MetadataOptions>
</MetadataDetail>
} />
<Route path={`${path}/configuration/history`} render={ () =>
<MetadataDetail>
<MetadataHistory></MetadataHistory>
</MetadataDetail>
} />
<Route path={`${path}/edit`} component={ MetadataEditor } />
</Switch>
</MetadataSchema>
<MetadataXmlLoader>
<MetadataSchema>
<Switch>
<Route path={`${path}/configuration/options`} render={ () =>
<MetadataDetail>
<MetadataOptions></MetadataOptions>
</MetadataDetail>
} />
<Route path={`${path}/configuration/xml`} render={() =>
<MetadataDetail>
<MetadataXml></MetadataXml>
</MetadataDetail>
} />
<Route path={`${path}/configuration/history`} render={ () =>
<MetadataDetail>
<MetadataHistory></MetadataHistory>
</MetadataDetail>
} />
<Route path={`${path}/edit`} component={ MetadataEditor } />
</Switch>
</MetadataSchema>
</MetadataXmlLoader>
</MetadataSelector>
);
}
74 changes: 73 additions & 1 deletion ui/src/app/metadata/component/MetadataHistory.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,85 @@
import React from 'react';
import { useParams } from 'react-router';
import { Link } from 'react-router-dom';
import FormattedDate from '../../core/components/FormattedDate';

import Translate from '../../i18n/components/translate';
import { useMetadataHistory } from '../hooks/api';

export function MetadataHistory () {
const { type, id } = useParams();

const { data, loading } = useMetadataHistory(type, id, {}, []);

const toggleVersionSelected = () => {};
const restore = () => {};
const compare = () => {};

const selected = [];

return (
<>
<h2 className="mb-4">
<Translate value={`label.version-history`}>version history</Translate>
<Translate value="label.version-history">version history</Translate>
</h2>
{data && !loading && <div className="container">
<>
<table className="table">
<caption className="sr-only"><Translate value="label.name-and-entityid">Metadata Version History</Translate></caption>
<thead>
<tr>
<th scope="col">
<span className="sr-only"><Translate value="label.select-version">Select Version</Translate></span>
</th>
<th scope="col"><Translate value="label.save-date">Save Date</Translate></th>
<th scope="col"><Translate value="label.changed-by">Changed By</Translate></th>
<th scope="col"><Translate value="label.actions">Actions</Translate></th>
</tr>
</thead>
<tbody>
{data.map((version, i) =>
<tr key={i}>
<td>
<div className="custom-control custom-checkbox" onClick={() => toggleVersionSelected(version)}>
<input title={`check-${i}`} type="checkbox" className="custom-control-input" checked={selected.indexOf(version) > -1} onChange={() => {}} />
<label className="custom-control-label" htmlFor={`check-${i}`}>
<span className="sr-only"><Translate value="label.check-to-select">Check to select</Translate></span>
</label>
</div>
</td>
<td>
{i === 0 ? <Link to="['../', 'options']">
<FormattedDate date={version.date} />&nbsp;(<Translate value="label.current">Current</Translate>)
</Link>
:
<Link to="['../', 'version', version.id, 'options']">
<FormattedDate date={version.date} />
</Link>
}
</td>
<td>{ version.creator }</td>
<td>
{i > 0 &&
<button className="btn btn-text btn-link" onClick={ () => restore(version) }>
<i className="fa fa-undo"></i>&nbsp;
<Translate value="action.restore">Restore</Translate>
</button>
}
</td>
</tr>
)}
</tbody>
</table>
<button className="btn btn-primary" onClick={ () => compare() } disabled={!selected.length}>
<Translate value="label.compare-selected">Compare Selected</Translate>
{selected.length > 0 && <span>({ selected.length })</span> }
</button>
</>
</div>}
{loading && <div className="d-flex justify-content-center">
<i className="fa fa-spinner fa-pulse fa-4x fa-fw"></i>
<span className="sr-only">Loading...</span>
</div>}
</>
);
}
14 changes: 2 additions & 12 deletions ui/src/app/metadata/component/MetadataOptions.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import { MetadataConfiguration } from './MetadataConfiguration';


import { useMetadataConfiguration } from '../hooks/configuration';
import { MetadataViewToggle } from './MetadataViewToggle';

export function MetadataOptions () {

Expand Down Expand Up @@ -43,18 +44,7 @@ export function MetadataOptions () {
</button>
}
</div>
{/*<div *ngIf="hasXml$ | async">
<div className="btn-group" role="group" aria-label="Options selected">
<a className="btn" routerLink="../options" routerLinkActive="btn-primary" aria-pressed="true">
<span className="sr-only"><Translate value="action.toggle-view">Toggle view:</Translate></span>
Options
</a>
<a className="btn" routerLink="../xml" routerLinkActive="btn-primary">
<span className="sr-only"><Translate value="action.toggle-view">Toggle view:</Translate></span>
XML
</a>
</div>
</div>*/}
<MetadataViewToggle />
</div>
<MetadataConfiguration configuration={ configuration } />
</div>
Expand Down
26 changes: 26 additions & 0 deletions ui/src/app/metadata/component/MetadataViewToggle.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import React from 'react';
import { NavLink } from 'react-router-dom';

import {Translate} from '../../i18n/components/translate';
import { MetadataXmlContext } from '../hoc/MetadataXmlLoader';

export function MetadataViewToggle () {
const xml = React.useContext(MetadataXmlContext);

return (
<>
{xml ?
<div className="btn-group" role="group" aria-label="Options selected">
<NavLink className="btn" to="options" activeClassName="btn-primary" aria-pressed="true">
<span className="sr-only"><Translate value="action.toggle-view">Toggle view:</Translate></span>
Options
</NavLink>
<NavLink className="btn" to="xml" activeClassName="btn-primary">
<span className="sr-only"><Translate value="action.toggle-view">Toggle view:</Translate></span>
XML
</NavLink>
</div>
: ''}
</>
);
}
45 changes: 45 additions & 0 deletions ui/src/app/metadata/component/MetadataXml.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
import { faSave } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import React from 'react';

import { useParams } from 'react-router';
import Translate from '../../i18n/components/translate';
import { MetadataObjectContext } from '../hoc/MetadataSelector';

import { MetadataXmlContext } from '../hoc/MetadataXmlLoader';
import { MetadataViewToggle } from './MetadataViewToggle';
import { downloadAsXml } from '../../core/utility/download_as_xml';

export function MetadataXml () {
const xml = React.useContext(MetadataXmlContext);
const entity = React.useContext(MetadataObjectContext);
const { type } = useParams();

const download = () => downloadAsXml(entity, xml);

return (
<>
<h2 className="mb-4">
<Translate value={type === 'source' ? 'label.source' : 'label.provider'}>Source</Translate>&nbsp;Configuration
</h2>
<div className="container-fluid">
<div className="px-3 my-3 d-flex justify-content-end">
<MetadataViewToggle />
</div>
<div className="px-3 my-3">
<figure role="img" aria-labelledby="pre-caption" tabIndex="0">
<pre className="border p-2 bg-light rounded"><code>{xml}</code></pre>
<figcaption id="pre-caption" className="sr-only">
{ xml }
</figcaption>
</figure>

<button type="button" className="btn btn-primary" onClick={() => download()}>
<FontAwesomeIcon icon={faSave} />&nbsp;
<Translate value="action.download-file">Download File</Translate>
</button>
</div>
</div>
</>
);
}
2 changes: 0 additions & 2 deletions ui/src/app/metadata/component/properties/PropertyValue.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,6 @@ export function PropertyValue ({ name, value, columns }) {

const id = useGuid();

console.log(value)

return (
<>
{ name && value && value !== false ?
Expand Down
5 changes: 4 additions & 1 deletion ui/src/app/metadata/domain/index.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import { MetadataProviderEditorTypes } from './provider';
import { SourceEditor } from "./source/SourceDefinition";

export const editors = {
source: SourceEditor
};

export const ProviderEditorTypes = [];
export const ProviderEditorTypes = [
...MetadataProviderEditorTypes
];
export const FilterEditorTypes = [];


Expand Down
26 changes: 26 additions & 0 deletions ui/src/app/metadata/domain/provider/BaseProviderDefinition.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import { metadataFilterProcessor } from './utility/providerFilterProcessor';

export const BaseProviderDefinition = {
schemaPreprocessor: metadataFilterProcessor,
parser: (changes) => (changes.metadataFilters ? ({
...changes,
metadataFilters: [
...Object.keys(changes.metadataFilters).reduce((collection, filterName) => ([
...collection,
{
...changes.metadataFilters[filterName],
'@type': filterName
}
]), [])
]
}) : changes),
formatter: (changes) => (changes.metadataFilters ? ({
...changes,
metadataFilters: {
...(changes.metadataFilters || []).reduce((collection, filter) => ({
...collection,
[filter['@type']]: filter
}), {})
}
}) : changes),
}
Loading

0 comments on commit 1cf70d1

Please sign in to comment.