Skip to content

Commit

Permalink
Initial implementation
Browse files Browse the repository at this point in the history
  • Loading branch information
rmathis committed Oct 21, 2022
1 parent 93d32e1 commit 5eacee3
Show file tree
Hide file tree
Showing 16 changed files with 595 additions and 43 deletions.
20 changes: 20 additions & 0 deletions ui/public/assets/data/registration.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
{
"resourceId": "foobar",
"name": "Foobar",
"redirect_uris": [],
"response_types": [],
"grant_types": "",
"application_type": "",
"contacts": "",
"subject_type": "",
"jwks": "",
"jwks_uri": "",
"token_endpoint_auth_method": "",
"logo_uri": "",
"policy_uri": "",
"tos_uri": "",
"scope": "",
"enabled": true,
"modifiedDate": "2022-10-21T11:57:24.391649",
"createdData": "2022-10-21T11:57:24.391649"
}
1 change: 1 addition & 0 deletions ui/public/assets/data/registrations.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
[
{
"resourceId": "foobar",
"name": "Foobar",
"redirect_uris": [],
"response_types": [],
Expand Down
13 changes: 13 additions & 0 deletions ui/public/assets/schema/dynamic-registration/oidc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
{
"type": "object",
"required": ["name"],
"properties": {
"name": {
"title": "label.dynamic-registration-name",
"description": "tooltip.dynamic-registration-name",
"type": "string",
"minLength": 1,
"maxLength": 255
}
}
}
4 changes: 1 addition & 3 deletions ui/src/app/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -85,9 +85,7 @@ function App() {
<Route path="/dashboard" component={Dashboard} />
<Route path="/metadata/source/new" component={NewSource} />
<Route path="/dynamic-registration" render={() =>
<DynamicRegistrationsApi>
<DynamicRegistration />
</DynamicRegistrationsApi>
<DynamicRegistration />
} />
<Route path="/metadata/provider/new" render={() =>
<ProtectRoute redirectTo="/dashboard">
Expand Down
4 changes: 4 additions & 0 deletions ui/src/app/core/components/Header.js
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,10 @@ export function Header () {
<FontAwesomeIcon icon={faCubes} className="me-2" fixedWidth />
<Translate value="action.add-new-provider" />
</Dropdown.Item> }
<Dropdown.Item as={Link} to="/dynamic-registration/new" className="text-primary py-2" id="metadata-nav-dropdown-dynreg">
<FontAwesomeIcon icon={faCube} className="me-2" fixedWidth />
<Translate value="action.add-new-dynamic-registration" />
</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
{isAdmin &&
Expand Down
4 changes: 2 additions & 2 deletions ui/src/app/dashboard/view/Dashboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ export function Dashboard () {
</Nav.Item>
}
<Nav.Item>
<NavLink className="nav-link" to={`${path}/dynamic-registrations`}>
<NavLink className="nav-link" to={`${path}/dynamic-registration`}>
<Translate value="label.dynamic-registration">Dynamic Registration</Translate>
</NavLink>
</Nav.Item>
Expand All @@ -111,7 +111,7 @@ export function Dashboard () {
</Route>
<Route path={`${path}/metadata/manager/resolvers`} component={SourcesTab} />
<Route path={`${path}/metadata/manager/providers`} component={ProvidersTab} />
<Route path={`${path}/dynamic-registrations`} render={() =>
<Route path={`${path}/dynamic-registration`} render={() =>
<DynamicRegistrationsApi>
<DynamicRegistrationsTab />
</DynamicRegistrationsApi>
Expand Down
7 changes: 4 additions & 3 deletions ui/src/app/dashboard/view/DynamicRegistrationsTab.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,16 +5,17 @@ import { Ordered } from '../component/Ordered';
import { Search } from '../component/Search';

import {DynamicRegistrationList} from '../../dynamic-registration/component/DynamicRegistrationList';
import { useDynamicRegistrationCollection, useDynamicRegistrationApi } from '../../dynamic-registration/hoc/DynamicRegistrationContext';

const searchProps = ['name'];

export function DynamicRegistrationsTab () {

// const dispatcher = useDynamicRegistrationDispatcher();
const registrations = useDynamicRegistrationCollection();
const { load } = useDynamicRegistrationApi();

/*eslint-disable react-hooks/exhaustive-deps*/
// React.useEffect(() => { loadRegistrations() }, []);
const registrations = [];
React.useEffect(() => { load() }, []);

return (
<section className="section">
Expand Down
49 changes: 21 additions & 28 deletions ui/src/app/dynamic-registration/DynamicRegistration.js
Original file line number Diff line number Diff line change
@@ -1,38 +1,31 @@
import React from 'react';
import { useDynamicRegistrationDispatcher } from './hoc/DynamicRegistrationContext';
import Translate from '../i18n/components/translate';
import { Search } from '../dashboard/component/Search';
import { Switch, Route, useRouteMatch } from 'react-router-dom';

import {DynamicRegistrationList} from './component/DynamicRegistrationList';
import { DynamicRegistrationDetail } from './view/DynamicRegistrationDetail';

const searchProps = ['name'];
import { DynamicRegistrationsApi } from './hoc/DynamicRegistrationContext';
import { DynamicRegistrationEdit } from './view/DynamicRegistrationEdit';
import { DynamicRegistrationCreate } from './view/DynamicRegistrationCreate';

export function DynamicRegistration () {

// const dispatcher = useDynamicRegistrationDispatcher();

/*eslint-disable react-hooks/exhaustive-deps*/
// React.useEffect(() => { loadRegistrations() }, []);
const registrations = [];
const { path } = useRouteMatch();

return (
<section className="section">
<div className="section-body border border-top-0 border-primary">
<>
<div className="section-header bg-primary p-2 text-light">
<span className="lead">
<Translate value="label.current-dynamic-registrations">Dynamic Registrations</Translate>
</span>
</div>
<div className="p-3">
<Search entities={registrations} searchable={searchProps}>
{(searched) =>
<DynamicRegistrationList entities={searched} />
}
</Search>
</div>
</>
</div>
</section>
<div className='container-fluid p-3'>
<DynamicRegistrationsApi>
<Switch>
<Route exact path={`${path}/new`} render={() =>
<DynamicRegistrationCreate />
} />
<Route exact path={`${path}/:id`} render={() =>
<DynamicRegistrationDetail />
} />
<Route path={`${path}/:id/edit`} render={() =>
<DynamicRegistrationEdit />
} />
</Switch>
</DynamicRegistrationsApi>
</div>
)
}
26 changes: 26 additions & 0 deletions ui/src/app/dynamic-registration/api.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import useFetch from 'use-http';

import {API_BASE_PATH, BASE_PATH} from '../App.constant';

export function useDynamicRegistration(id, opts = {}, onMount) {
//
return useFetch(`${BASE_PATH}/assets/data/registration.json`, opts, onMount);
}

export function useDynamicRegistrations(opts = {}, onMount) {
//
return useFetch(`${BASE_PATH}/assets/data/registrations.json`, opts, onMount);
}

export function useDynamicRegistrationJsonSchema(opts = {}) {
return useFetch(`${BASE_PATH}/assets/schema/dynamic-registration/oidc.json`, opts, []);
}

export function useDynamicRegistrationUiSchema() {
return {};
}
export function useDynamicRegistrationValidator() {
return (formData, errors) => {
return errors;
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
import React from 'react';
import Button from 'react-bootstrap/Button';
import Form from '../../form/Form';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faSpinner, faSave } from '@fortawesome/free-solid-svg-icons';
import Translate from '../../i18n/components/translate';

import { FormContext, setFormDataAction, setFormErrorAction } from '../../form/FormManager';
import { useDynamicRegistrationUiSchema, useDynamicRegistrationValidator } from '../api';

export function DynamicRegistrationForm ({registration = {}, errors = [], loading = false, schema, onSave, onCancel}) {

const { dispatch } = React.useContext(FormContext);
const onChange = ({formData, errors}) => {
dispatch(setFormDataAction(formData));
dispatch(setFormErrorAction(errors));
};

const uiSchema = useDynamicRegistrationUiSchema();
const validator = useDynamicRegistrationValidator();

return (<>
<div className="container-fluid">
<div className="d-flex justify-content-end align-items-center">
<React.Fragment>
<Button variant="info" className="me-2"
type="button"
onClick={() => onSave(registration)}
disabled={errors.length > 0 || loading}
aria-label="Save changes to the dynamic registration. You will return to the dashboard">
<FontAwesomeIcon icon={loading ? faSpinner : faSave} pulse={loading} />&nbsp;
<Translate value="action.save">Save</Translate>
</Button>
<Button variant="secondary"
type="button"
onClick={() => onCancel()} aria-label="Cancel changes, go back to dashboard">
<Translate value="action.cancel">Cancel</Translate>
</Button>
</React.Fragment>
</div>
<hr />
<div className="row">
<div className="col-12 col-lg-6 order-2">
<Form formData={registration}
noHtml5Validate={true}
onChange={(form) => onChange(form)}
validate={validator}
schema={schema}
uiSchema={uiSchema}
liveValidate={true}>
<></>
</Form>
</div>
</div>
</div>
</>)
}
/**/
Original file line number Diff line number Diff line change
@@ -1,5 +1,34 @@
import React from 'react';
import { Link } from 'react-router-dom';
import Translate from '../../i18n/components/translate';
import { Scroller } from '../../dashboard/component/Scroller';

export function DynamicRegistrationList ({entities}) {
return <><pre>{JSON.stringify(entities, null, 4)}</pre></>
export function DynamicRegistrationList ({entities, children}) {
return (
<React.Fragment>
<Scroller entities={entities}>
{(limited) =>
<div className="table-responsive mt-3 source-list">
<table className="table table-striped w-100 table-hover">
<thead>
<tr>
<th className="w-25"><Translate value="label.title">Title</Translate></th>
</tr>
</thead>
<tbody>
{limited.map((reg, idx) =>
<tr key={idx}>
<td className="align-middle">
<Link to={`/dynamic-registration/${reg.resourceId}`}>{reg.name}</Link>
</td>
</tr>
)}
</tbody>
</table>
</div>
}
</Scroller>
{children}
</React.Fragment>
);
}
Loading

0 comments on commit 5eacee3

Please sign in to comment.