Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fixing bugs and issues in Dashboard and SIS group management #138

Merged
merged 6 commits into from
Nov 16, 2017
Merged

Fixing bugs and issues in Dashboard and SIS group management #138

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
786227b
Fixed bug with SIS group creation.
Nov 11, 2017
3ec60d3
Dashboard SIS groups issue with rerendering resolved.
Nov 16, 2017
c2d0e23
Small improvement in form presentation.
Nov 16, 2017
02de08f
Intermediate commit (WP).
Nov 16, 2017
3105b00
Merge branch 'master' of https://github.com/ReCodEx/web-app into fix-…
Nov 16, 2017
d2ba1d5
Fixed ESLint bugs.
Nov 16, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 9 additions & 1 deletion src/components/forms/Fields/SelectField.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,8 @@ const SelectField = ({
meta: { touched, error },
label,
options,
addEmptyOption = false,
emptyOptionCaption = '...',
...props
}) =>
<FormGroup
Expand All @@ -24,6 +26,10 @@ const SelectField = ({
{label}
</ControlLabel>
<FormControl {...input} {...props} componentClass="select">
{addEmptyOption &&
<option value={''} key={'-1'}>
{emptyOptionCaption}
</option>}
{options.map(({ key, name }, i) =>
<option value={key} key={i}>
{name}
Expand Down Expand Up @@ -51,7 +57,9 @@ SelectField.propTypes = {
PropTypes.string,
PropTypes.shape({ type: PropTypes.oneOf([FormattedMessage]) })
]).isRequired,
options: PropTypes.array.isRequired
options: PropTypes.array.isRequired,
addEmptyOption: PropTypes.bool,
emptyOptionCaption: PropTypes.string
};

export default SelectField;
16 changes: 10 additions & 6 deletions src/components/forms/SisBindGroupForm/SisBindGroupForm.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import FormBox from '../../widgets/FormBox';
import { SelectField } from '../Fields';
import SubmitButton from '../SubmitButton';

import { getLocalizedName } from '../../../helpers/getLocalizedData';
import { getGroupCanonicalLocalizedName } from '../../../helpers/getLocalizedData';

const SisBindGroupForm = ({
invalid,
Expand All @@ -18,6 +18,7 @@ const SisBindGroupForm = ({
submitting,
hasSucceeded,
groups,
groupsAccessor,
intl: { locale }
}) =>
<FormBox
Expand All @@ -27,7 +28,8 @@ const SisBindGroupForm = ({
defaultMessage="Bind existing ReCodEx group to SIS"
/>
}
type={hasSucceeded ? 'success' : undefined}
succeeded={hasSucceeded}
dirty={anyTouched}
footer={
<div className="text-center">
<SubmitButton
Expand Down Expand Up @@ -80,12 +82,13 @@ const SisBindGroupForm = ({
defaultMessage="Group:"
/>
}
options={[{ key: '', name: '...' }].concat(
groups.map(group => ({
options={groups
.map(group => ({
key: group.id,
name: getLocalizedName(group, locale)
name: getGroupCanonicalLocalizedName(group, groupsAccessor, locale)
}))
)}
.sort((a, b) => a.name.localeCompare(b.name, locale))}
addEmptyOption
/>
</FormBox>;

Expand All @@ -98,6 +101,7 @@ SisBindGroupForm.propTypes = {
hasSucceeded: PropTypes.bool,
submitFailed: PropTypes.bool,
groups: PropTypes.array,
groupsAccessor: PropTypes.func.isRequired,
intl: PropTypes.shape({ locale: PropTypes.string.isRequired }).isRequired
};

Expand Down
171 changes: 93 additions & 78 deletions src/components/forms/SisCreateGroupForm/SisCreateGroupForm.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from 'react';
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { reduxForm, Field } from 'redux-form';
import { FormattedMessage, injectIntl } from 'react-intl';
Expand All @@ -7,86 +7,100 @@ import { Alert } from 'react-bootstrap';
import FormBox from '../../widgets/FormBox';
import { SelectField } from '../Fields';
import SubmitButton from '../SubmitButton';
import { getLocalizedName } from '../../../helpers/getLocalizedData';
import { getGroupCanonicalLocalizedName } from '../../../helpers/getLocalizedData';

const SisCreateGroupForm = ({
invalid,
anyTouched,
handleSubmit,
submitFailed: hasFailed,
submitting,
hasSucceeded,
groups,
intl: { locale }
}) =>
<FormBox
title={
<FormattedMessage
id="app.sisCreateGroupForm.title"
defaultMessage="Create ReCodEx group from SIS"
/>
}
type={hasSucceeded ? 'success' : undefined}
footer={
<div className="text-center">
<SubmitButton
id="sisCreateGroup"
invalid={invalid}
submitting={submitting}
dirty={anyTouched}
hasSucceeded={hasSucceeded}
hasFailed={hasFailed}
handleSubmit={handleSubmit}
messages={{
submit: (
<FormattedMessage
id="app.sisCreateGroupForm.submit"
defaultMessage="Create"
/>
),
submitting: (
<FormattedMessage
id="app.sisCreateGroupForm.submitting"
defaultMessage="Creating ..."
/>
),
success: (
<FormattedMessage
id="app.sisCreateGroupForm.success"
defaultMessage="The group was created."
/>
)
}}
/>
</div>
}
>
{hasFailed &&
<Alert bsStyle="danger">
<FormattedMessage
id="app.sisCreateGroupForm.failed"
defaultMessage="Creating group failed. Please try again later."
/>
</Alert>}
class SisCreateGroupForm extends Component {
render() {
const {
invalid,
anyTouched,
handleSubmit,
submitFailed: hasFailed,
submitting,
hasSucceeded,
groups,
groupsAccessor,
intl: { locale }
} = this.props;

<Field
name="parentGroupId"
required
component={SelectField}
label={
<FormattedMessage
id="app.sisCreateGroupForm.parentGroup"
defaultMessage="Parent group:"
return (
<FormBox
title={
<FormattedMessage
id="app.sisCreateGroupForm.title"
defaultMessage="Create ReCodEx group from SIS"
/>
}
succeeded={hasSucceeded}
dirty={anyTouched}
footer={
<div className="text-center">
<SubmitButton
id="sisCreateGroup"
invalid={invalid}
submitting={submitting}
dirty={anyTouched}
hasSucceeded={hasSucceeded}
hasFailed={hasFailed}
handleSubmit={handleSubmit}
messages={{
submit: (
<FormattedMessage
id="app.sisCreateGroupForm.submit"
defaultMessage="Create"
/>
),
submitting: (
<FormattedMessage
id="app.sisCreateGroupForm.submitting"
defaultMessage="Creating ..."
/>
),
success: (
<FormattedMessage
id="app.sisCreateGroupForm.success"
defaultMessage="The group was created."
/>
)
}}
/>
</div>
}
>
{hasFailed &&
<Alert bsStyle="danger">
<FormattedMessage
id="app.sisCreateGroupForm.failed"
defaultMessage="Creating group failed. Please try again later."
/>
</Alert>}

<Field
name="parentGroupId"
required
component={SelectField}
label={
<FormattedMessage
id="app.sisCreateGroupForm.parentGroup"
defaultMessage="Parent group:"
/>
}
options={groups
.map(group => ({
key: group.id,
name: getGroupCanonicalLocalizedName(
group,
groupsAccessor,
locale
)
}))
.sort((a, b) => a.name.localeCompare(b.name, locale))}
addEmptyOption
/>
}
options={[{ key: '', name: '...' }].concat(
groups.map(group => ({
key: group.id,
name: getLocalizedName(group, locale)
}))
)}
/>
</FormBox>;
</FormBox>
);
}
}

SisCreateGroupForm.propTypes = {
onSubmit: PropTypes.func.isRequired,
Expand All @@ -97,6 +111,7 @@ SisCreateGroupForm.propTypes = {
hasSucceeded: PropTypes.bool,
submitFailed: PropTypes.bool,
groups: PropTypes.array,
groupsAccessor: PropTypes.func.isRequired,
intl: PropTypes.shape({ locale: PropTypes.string.isRequired }).isRequired
};

Expand Down
28 changes: 17 additions & 11 deletions src/containers/SisIntegrationContainer/SisIntegrationContainer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import Button from '../../components/widgets/FlatButton';
import { LinkContainer } from 'react-router-bootstrap';
import Icon from 'react-fontawesome';

import UsersNameContainer from '../UsersNameContainer';
import { fetchSisStatusIfNeeded } from '../../redux/modules/sisStatus';
import { fetchSisSubscribedGroups } from '../../redux/modules/sisSubscribedGroups';
import { sisStateSelector } from '../../redux/selectors/sisStatus';
Expand Down Expand Up @@ -93,8 +94,8 @@ class SisIntegrationContainer extends Component {
</th>
<th>
<FormattedMessage
id="app.sisIntegration.groupExtId"
defaultMessage="SIS ID"
id="app.sisIntegration.groupAdmins"
defaultMessage="Group Administrators"
/>
</th>
<th />
Expand All @@ -108,9 +109,12 @@ class SisIntegrationContainer extends Component {
{getLocalizedName(group, locale)}
</td>
<td>
<code>
{group.externalId}
</code>
{group.primaryAdminsIds.map(id =>
<UsersNameContainer
key={id}
userId={id}
/>
)}
</td>
<td className="text-right">
<span>
Expand Down Expand Up @@ -140,12 +144,14 @@ class SisIntegrationContainer extends Component {
</tbody>
</Table>
: <div className="text-center">
<b>
<FormattedMessage
id="app.sisIntegration.noSisGroups"
defaultMessage="Currently there are no ReCodEx groups matching your SIS subjects for this time period."
/>
</b>
<p>
<b>
<FormattedMessage
id="app.sisIntegration.noSisGroups"
defaultMessage="Currently there are no ReCodEx groups matching your SIS subjects for this time period."
/>
</b>
</p>
</div>}
</div>}
</ResourceRenderer>
Expand Down
Loading