canvas-planner: upgrade to instUI 5
closes: ADMIN-1073 test plan: * make sure the themeing stuff still works * generally click around on all the components, they have been upgraded to use instUI 5 (from instUI 4) * look at this changelog for things that might be interesting here: https://instructure.design/#CHANGELOG * especially make sure that any of the <Select> elements still work, they changed from using a native <select> to some custom stuff. * make sure that changing them works and what they send to the server is correct (as-in if you refresh it has what you changed it to) Change-Id: I4afbeb03beda42106815de28983a418627d271e9 Reviewed-on: https://gerrit.instructure.com/150263 Tested-by: Jenkins Reviewed-by: Jon Willesen <jonw+gerrit@instructure.com> Reviewed-by: Ryan Shaw <ryan@instructure.com> QA-Review: Luke Kingsley <lkingsley@instructure.com> Product-Review: Jon Willesen <jonw+gerrit@instructure.com>
This commit is contained in:
parent
5259afeb73
commit
aaab29c91f
|
@ -6,7 +6,7 @@ if (env === 'test') {
|
|||
['env', {
|
||||
modules: 'commonjs',
|
||||
// use the same polyfills we use in the code we send to browsers
|
||||
targets: { browsers: require('@instructure/ui-presets/browserslist') }
|
||||
targets: { browsers: require('@instructure/canvas-supported-browsers') }
|
||||
}],
|
||||
'stage-1',
|
||||
'react'
|
||||
|
|
|
@ -41,11 +41,16 @@
|
|||
"license": "AGPL-3.0",
|
||||
"dependencies": {
|
||||
"@instructure/ui-a11y": "^5",
|
||||
"@instructure/ui-core": "^4.8.0",
|
||||
"@instructure/ui-alerts": "^5",
|
||||
"@instructure/ui-buttons": "^5",
|
||||
"@instructure/ui-elements": "^5",
|
||||
"@instructure/ui-forms": "^5",
|
||||
"@instructure/ui-icons": "^5",
|
||||
"@instructure/ui-layout": "^5",
|
||||
"@instructure/ui-overlays": "^5",
|
||||
"@instructure/ui-themeable": "^5",
|
||||
"@instructure/ui-toggle-details": "^5",
|
||||
"@instructure/ui-utils": "^5",
|
||||
"axios": "^0.16.0",
|
||||
"babel-plugin-inline-react-svg": "^0.4.0",
|
||||
"change-case": "^3.0.1",
|
||||
|
@ -54,7 +59,6 @@
|
|||
"format-message": "^5.1.2",
|
||||
"format-message-parse": "^5.1.2",
|
||||
"format-message-print": "^5.1.2",
|
||||
"instructure-icons": "^4.3.0",
|
||||
"keycode": "^2.1.9",
|
||||
"lodash": "^4",
|
||||
"moment-timezone": "^0.5.13",
|
||||
|
@ -73,7 +77,8 @@
|
|||
"velocity-animate": "^1.5.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@instructure/ui-presets": "^4.7.2",
|
||||
"@instructure/canvas-supported-browsers": "latest",
|
||||
"@instructure/ui-presets": "^5",
|
||||
"babel-cli": "^6",
|
||||
"babel-core": "^6",
|
||||
"babel-eslint": "^7",
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
import React from 'react';
|
||||
import { shallow } from 'enzyme';
|
||||
import BadgeList from '../index';
|
||||
import Pill from '@instructure/ui-core/lib/components/Pill';
|
||||
import Pill from '@instructure/ui-elements/lib/components/Pill';
|
||||
|
||||
it('renders Pill components as list items', () => {
|
||||
const wrapper = shallow(
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
import React, { Children, Component } from 'react';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import CustomPropTypes from '@instructure/ui-utils/lib/react/CustomPropTypes';
|
||||
import Pill from '@instructure/ui-core/lib/components/Pill';
|
||||
import Pill from '@instructure/ui-elements/lib/components/Pill';
|
||||
|
||||
import styles from './styles.css';
|
||||
import theme from './theme.js';
|
||||
|
|
|
@ -19,7 +19,7 @@ import React, { Component } from 'react';
|
|||
import classnames from 'classnames';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import ToggleDetails from '@instructure/ui-toggle-details/lib/components/ToggleDetails';
|
||||
import Pill from '@instructure/ui-core/lib/components/Pill';
|
||||
import Pill from '@instructure/ui-elements/lib/components/Pill';
|
||||
import BadgeList from '../BadgeList';
|
||||
import NotificationBadge, { MissingIndicator, NewActivityIndicator} from '../NotificationBadge';
|
||||
import { func, number, string, arrayOf, shape, oneOf } from 'prop-types';
|
||||
|
|
|
@ -20,8 +20,8 @@ import React, { Component } from 'react';
|
|||
import classnames from 'classnames';
|
||||
import moment from 'moment-timezone';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import Heading from '@instructure/ui-core/lib/components/Heading';
|
||||
import Text from '@instructure/ui-core/lib/components/Text';
|
||||
import Heading from '@instructure/ui-elements/lib/components/Heading';
|
||||
import Text from '@instructure/ui-elements/lib/components/Text';
|
||||
import View from '@instructure/ui-layout/lib/components/View';
|
||||
import { shape, string, number, arrayOf, func } from 'prop-types';
|
||||
import { userShape, itemShape } from '../plannerPropTypes';
|
||||
|
|
|
@ -21,8 +21,8 @@ import React, { Component } from 'react';
|
|||
import moment from 'moment-timezone';
|
||||
import classnames from 'classnames';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import Heading from '@instructure/ui-core/lib/components/Heading';
|
||||
import Text from '@instructure/ui-core/lib/components/Text';
|
||||
import Heading from '@instructure/ui-elements/lib/components/Heading';
|
||||
import Text from '@instructure/ui-elements/lib/components/Text';
|
||||
import View from '@instructure/ui-layout/lib/components/View';
|
||||
import { string } from 'prop-types';
|
||||
import styles from './styles.css';
|
||||
|
|
|
@ -2,8 +2,10 @@
|
|||
|
||||
exports[`renders 1`] = `
|
||||
<Alert
|
||||
liveRegionPoliteness="assertive"
|
||||
margin="small"
|
||||
open={true}
|
||||
screenReaderOnly={false}
|
||||
timeout={0}
|
||||
transition="fade"
|
||||
variant="error"
|
||||
|
@ -14,8 +16,10 @@ exports[`renders 1`] = `
|
|||
|
||||
exports[`renders with Error details 1`] = `
|
||||
<Alert
|
||||
liveRegionPoliteness="assertive"
|
||||
margin="small"
|
||||
open={true}
|
||||
screenReaderOnly={false}
|
||||
timeout={0}
|
||||
transition="fade"
|
||||
variant="error"
|
||||
|
@ -35,8 +39,10 @@ exports[`renders with Error details 1`] = `
|
|||
|
||||
exports[`renders with string details 1`] = `
|
||||
<Alert
|
||||
liveRegionPoliteness="assertive"
|
||||
margin="small"
|
||||
open={true}
|
||||
screenReaderOnly={false}
|
||||
timeout={0}
|
||||
transition="fade"
|
||||
variant="error"
|
||||
|
|
|
@ -17,7 +17,7 @@
|
|||
*/
|
||||
import React, { Component } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import Alert from '@instructure/ui-core/lib/components/Alert';
|
||||
import Alert from '@instructure/ui-alerts/lib/components/Alert';
|
||||
|
||||
export default class ErrorAlert extends Component {
|
||||
static propTypes = {
|
||||
|
|
|
@ -56,6 +56,7 @@ exports[`renders loading when indicated 1`] = `
|
|||
display="auto"
|
||||
>
|
||||
<Spinner
|
||||
as="div"
|
||||
margin="0 x-small 0 0"
|
||||
size="small"
|
||||
title="Loading..."
|
||||
|
|
|
@ -17,10 +17,10 @@
|
|||
*/
|
||||
import React, { Component } from 'react';
|
||||
import {bool, func, string} from 'prop-types';
|
||||
import Button from '@instructure/ui-core/lib/components/Button';
|
||||
import Button from '@instructure/ui-buttons/lib/components/Button';
|
||||
import View from '@instructure/ui-layout/lib/components/View';
|
||||
import Spinner from '@instructure/ui-core/lib/components/Spinner';
|
||||
import Text from '@instructure/ui-core/lib/components/Text';
|
||||
import Spinner from '@instructure/ui-elements/lib/components/Spinner';
|
||||
import Text from '@instructure/ui-elements/lib/components/Text';
|
||||
import ErrorAlert from '../ErrorAlert';
|
||||
import formatMessage from '../../format-message';
|
||||
|
||||
|
|
|
@ -79,6 +79,7 @@ exports[`renders spinner while loading 1`] = `
|
|||
textAlign="center"
|
||||
>
|
||||
<Spinner
|
||||
as="div"
|
||||
margin="0 x-small 0 0"
|
||||
size="small"
|
||||
title="Loading past items"
|
||||
|
|
|
@ -18,8 +18,8 @@
|
|||
import React, { Component } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import View from '@instructure/ui-layout/lib/components/View';
|
||||
import Spinner from '@instructure/ui-core/lib/components/Spinner';
|
||||
import Text from '@instructure/ui-core/lib/components/Text';
|
||||
import Spinner from '@instructure/ui-elements/lib/components/Spinner';
|
||||
import Text from '@instructure/ui-elements/lib/components/Text';
|
||||
import ErrorAlert from '../ErrorAlert';
|
||||
import formatMessage from '../../format-message';
|
||||
import TV from './tv.svg';
|
||||
|
|
|
@ -18,8 +18,8 @@
|
|||
|
||||
import React, { Component } from 'react';
|
||||
import { string, func } from 'prop-types';
|
||||
import Badge from '@instructure/ui-core/lib/components/Badge';
|
||||
import ScreenReaderContent from '@instructure/ui-core/lib/components/ScreenReaderContent';
|
||||
import Badge from '@instructure/ui-elements/lib/components/Badge';
|
||||
import ScreenReaderContent from '@instructure/ui-a11y/lib/components/ScreenReaderContent';
|
||||
|
||||
export default class Indicator extends Component {
|
||||
static propTypes = {
|
||||
|
|
|
@ -26,7 +26,7 @@ exports[`renders nothing if no opportunities 1`] = `
|
|||
<span>
|
||||
Close
|
||||
</span>
|
||||
<IconXLine />
|
||||
<IconX />
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
|
@ -62,7 +62,7 @@ exports[`renders the base component correctly with one opportunity 1`] = `
|
|||
<span>
|
||||
Close
|
||||
</span>
|
||||
<IconXLine />
|
||||
<IconX />
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
|
@ -110,7 +110,7 @@ exports[`renders the right course with the right opportunity 1`] = `
|
|||
<span>
|
||||
Close
|
||||
</span>
|
||||
<IconXLine />
|
||||
<IconX />
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
|
|
|
@ -23,12 +23,12 @@ import scopeTab from '@instructure/ui-a11y/lib/utils/scopeTab';
|
|||
import keycode from 'keycode';
|
||||
|
||||
import Opportunity from '../Opportunity';
|
||||
import Button from '@instructure/ui-core/lib/components/Button';
|
||||
import Button from '@instructure/ui-buttons/lib/components/Button';
|
||||
import { findDOMNode } from 'react-dom';
|
||||
import { array, string, func, number, oneOfType} from 'prop-types';
|
||||
import formatMessage from '../../format-message';
|
||||
|
||||
import IconXLine from 'instructure-icons/lib/Line/IconXLine';
|
||||
import IconXLine from '@instructure/ui-icons/lib/Line/IconX';
|
||||
|
||||
import styles from './styles.css';
|
||||
import theme from './theme.js';
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
import React from 'react';
|
||||
import { shallow, mount } from 'enzyme';
|
||||
import { Opportunity } from '../index';
|
||||
import Pill from '@instructure/ui-core/lib/components/Pill';
|
||||
import Pill from '@instructure/ui-elements/lib/components/Pill';
|
||||
|
||||
function defaultProps (options) {
|
||||
return {
|
||||
|
|
|
@ -30,7 +30,7 @@ exports[`renders the base component correctly 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconXLine
|
||||
<IconX
|
||||
title="Dismiss this is a description about the opportunity"
|
||||
/>
|
||||
</Button>
|
||||
|
@ -99,7 +99,7 @@ exports[`renders the base component correctly without points 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconXLine
|
||||
<IconX
|
||||
title="Dismiss this is a description about the opportunity"
|
||||
/>
|
||||
</Button>
|
||||
|
|
|
@ -21,12 +21,12 @@ import {animatable} from '../../dynamic-ui';
|
|||
import formatMessage from '../../format-message';
|
||||
import moment from 'moment-timezone';
|
||||
import { getFullDateAndTime } from '../../utilities/dateUtils';
|
||||
import Button from '@instructure/ui-core/lib/components/Button';
|
||||
import Link from '@instructure/ui-core/lib/components/Link';
|
||||
import Pill from '@instructure/ui-core/lib/components/Pill';
|
||||
import PresentationContent from '@instructure/ui-core/lib/components/PresentationContent';
|
||||
import ScreenReaderContent from '@instructure/ui-core/lib/components/ScreenReaderContent';
|
||||
import IconXLine from 'instructure-icons/lib/Line/IconXLine';
|
||||
import Button from '@instructure/ui-buttons/lib/components/Button';
|
||||
import Link from '@instructure/ui-elements/lib/components/Link';
|
||||
import Pill from '@instructure/ui-elements/lib/components/Pill';
|
||||
import PresentationContent from '@instructure/ui-a11y/lib/components/PresentationContent';
|
||||
import ScreenReaderContent from '@instructure/ui-a11y/lib/components/ScreenReaderContent';
|
||||
import IconXLine from '@instructure/ui-icons/lib/Line/IconX';
|
||||
import { bool, string, number, func, object } from 'prop-types';
|
||||
import styles from './styles.css';
|
||||
import theme from './theme.js';
|
||||
|
|
|
@ -524,6 +524,7 @@ exports[`PlannerApp shows only the loading component when the isLoading prop is
|
|||
textAlign="center"
|
||||
>
|
||||
<Spinner
|
||||
as="div"
|
||||
size="medium"
|
||||
title="Loading planner items"
|
||||
variant="default"
|
||||
|
|
|
@ -21,7 +21,7 @@ import classnames from 'classnames';
|
|||
import moment from 'moment-timezone';
|
||||
import { connect } from 'react-redux';
|
||||
import View from '@instructure/ui-layout/lib/components/View';
|
||||
import Spinner from '@instructure/ui-core/lib/components/Spinner';
|
||||
import Spinner from '@instructure/ui-elements/lib/components/Spinner';
|
||||
import { arrayOf, oneOfType, shape, bool, object, string, number, func } from 'prop-types';
|
||||
import { momentObj } from 'react-moment-proptypes';
|
||||
import { userShape, sizeShape } from '../plannerPropTypes';
|
||||
|
|
|
@ -20,8 +20,8 @@ import classnames from 'classnames';
|
|||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import { func } from 'prop-types';
|
||||
|
||||
import Heading from '@instructure/ui-core/lib/components/Heading';
|
||||
import Link from '@instructure/ui-core/lib/components/Link';
|
||||
import Heading from '@instructure/ui-elements/lib/components/Heading';
|
||||
import Link from '@instructure/ui-elements/lib/components/Link';
|
||||
|
||||
import formatMessage from '../../format-message';
|
||||
import DesertSvg from './empty-desert.svg'; // Currently uses react-svg-loader
|
||||
|
|
|
@ -136,7 +136,7 @@ it('toggles aria-hidden on the ariaHideElement when opening the add to do item t
|
|||
<PlannerHeader {...defaultProps()} ariaHideElement={fakeElement} />
|
||||
);
|
||||
|
||||
const button = wrapper.find('IconPlusLine').parent();
|
||||
const button = wrapper.find('IconPlus').parent();
|
||||
|
||||
button.simulate('click');
|
||||
expect(fakeElement.getAttribute('aria-hidden')).toBe('true');
|
||||
|
|
|
@ -25,7 +25,7 @@ exports[`new activity button does not show when there is no new activity 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconPlusLine
|
||||
<IconPlus
|
||||
title="Add To Do"
|
||||
/>
|
||||
</Button>
|
||||
|
@ -39,21 +39,19 @@ exports[`new activity button does not show when there is no new activity 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconGradebookLine
|
||||
<IconGradebook
|
||||
title="Show My Grades"
|
||||
/>
|
||||
</Button>
|
||||
<Popover
|
||||
alignArrow={false}
|
||||
applicationElement={null}
|
||||
closeButtonLabel={null}
|
||||
closeButtonRef={[Function]}
|
||||
constrain="none"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
defaultShow={false}
|
||||
insertAt="bottom"
|
||||
label={null}
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
offsetX={0}
|
||||
offsetY={0}
|
||||
|
@ -76,6 +74,7 @@ exports[`new activity button does not show when there is no new activity 1`] = `
|
|||
shouldRenderOffscreen={false}
|
||||
shouldReturnFocus={true}
|
||||
show={false}
|
||||
stacking="topmost"
|
||||
trackPosition={true}
|
||||
variant="default"
|
||||
withArrow={true}
|
||||
|
@ -93,6 +92,7 @@ exports[`new activity button does not show when there is no new activity 1`] = `
|
|||
>
|
||||
<Badge
|
||||
count={1}
|
||||
elementRef={[Function]}
|
||||
formatOverflowText={[Function]}
|
||||
placement="top end"
|
||||
pulse={false}
|
||||
|
@ -100,7 +100,7 @@ exports[`new activity button does not show when there is no new activity 1`] = `
|
|||
type="count"
|
||||
variant="primary"
|
||||
>
|
||||
<IconAlertsLine
|
||||
<IconAlerts
|
||||
title="1 opportunity"
|
||||
/>
|
||||
</Badge>
|
||||
|
@ -139,12 +139,11 @@ exports[`new activity button does not show when there is no new activity 1`] = `
|
|||
applicationElement={[Function]}
|
||||
border={false}
|
||||
closeButtonLabel="Close"
|
||||
closeButtonRef={[Function]}
|
||||
closeButtonVariant="icon"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
insertAt="bottom"
|
||||
label="Add To Do"
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
onClose={[Function]}
|
||||
onDismiss={[Function]}
|
||||
|
@ -180,15 +179,12 @@ exports[`new activity button does not show when there is no new activity 1`] = `
|
|||
/>
|
||||
</Tray>
|
||||
<Tray
|
||||
applicationElement={[Function]}
|
||||
border={false}
|
||||
closeButtonLabel={null}
|
||||
closeButtonRef={[Function]}
|
||||
closeButtonVariant="icon"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
insertAt="bottom"
|
||||
label="My Grades"
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
onClose={[Function]}
|
||||
onDismiss={[Function]}
|
||||
|
@ -265,7 +261,7 @@ exports[`new activity button shows when there is new activity 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconPlusLine
|
||||
<IconPlus
|
||||
title="Add To Do"
|
||||
/>
|
||||
</Button>
|
||||
|
@ -279,21 +275,19 @@ exports[`new activity button shows when there is new activity 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconGradebookLine
|
||||
<IconGradebook
|
||||
title="Show My Grades"
|
||||
/>
|
||||
</Button>
|
||||
<Popover
|
||||
alignArrow={false}
|
||||
applicationElement={null}
|
||||
closeButtonLabel={null}
|
||||
closeButtonRef={[Function]}
|
||||
constrain="none"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
defaultShow={false}
|
||||
insertAt="bottom"
|
||||
label={null}
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
offsetX={0}
|
||||
offsetY={0}
|
||||
|
@ -316,6 +310,7 @@ exports[`new activity button shows when there is new activity 1`] = `
|
|||
shouldRenderOffscreen={false}
|
||||
shouldReturnFocus={true}
|
||||
show={false}
|
||||
stacking="topmost"
|
||||
trackPosition={true}
|
||||
variant="default"
|
||||
withArrow={true}
|
||||
|
@ -333,6 +328,7 @@ exports[`new activity button shows when there is new activity 1`] = `
|
|||
>
|
||||
<Badge
|
||||
count={1}
|
||||
elementRef={[Function]}
|
||||
formatOverflowText={[Function]}
|
||||
placement="top end"
|
||||
pulse={false}
|
||||
|
@ -340,7 +336,7 @@ exports[`new activity button shows when there is new activity 1`] = `
|
|||
type="count"
|
||||
variant="primary"
|
||||
>
|
||||
<IconAlertsLine
|
||||
<IconAlerts
|
||||
title="1 opportunity"
|
||||
/>
|
||||
</Badge>
|
||||
|
@ -379,12 +375,11 @@ exports[`new activity button shows when there is new activity 1`] = `
|
|||
applicationElement={[Function]}
|
||||
border={false}
|
||||
closeButtonLabel="Close"
|
||||
closeButtonRef={[Function]}
|
||||
closeButtonVariant="icon"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
insertAt="bottom"
|
||||
label="Add To Do"
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
onClose={[Function]}
|
||||
onDismiss={[Function]}
|
||||
|
@ -420,15 +415,12 @@ exports[`new activity button shows when there is new activity 1`] = `
|
|||
/>
|
||||
</Tray>
|
||||
<Tray
|
||||
applicationElement={[Function]}
|
||||
border={false}
|
||||
closeButtonLabel={null}
|
||||
closeButtonRef={[Function]}
|
||||
closeButtonVariant="icon"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
insertAt="bottom"
|
||||
label="My Grades"
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
onClose={[Function]}
|
||||
onDismiss={[Function]}
|
||||
|
@ -516,7 +508,7 @@ exports[`renders the base component correctly with buttons and trays 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconPlusLine
|
||||
<IconPlus
|
||||
title="Add To Do"
|
||||
/>
|
||||
</Button>
|
||||
|
@ -530,21 +522,19 @@ exports[`renders the base component correctly with buttons and trays 1`] = `
|
|||
type="button"
|
||||
variant="icon"
|
||||
>
|
||||
<IconGradebookLine
|
||||
<IconGradebook
|
||||
title="Show My Grades"
|
||||
/>
|
||||
</Button>
|
||||
<Popover
|
||||
alignArrow={false}
|
||||
applicationElement={null}
|
||||
closeButtonLabel={null}
|
||||
closeButtonRef={[Function]}
|
||||
constrain="none"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
defaultShow={false}
|
||||
insertAt="bottom"
|
||||
label={null}
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
offsetX={0}
|
||||
offsetY={0}
|
||||
|
@ -567,6 +557,7 @@ exports[`renders the base component correctly with buttons and trays 1`] = `
|
|||
shouldRenderOffscreen={false}
|
||||
shouldReturnFocus={true}
|
||||
show={false}
|
||||
stacking="topmost"
|
||||
trackPosition={true}
|
||||
variant="default"
|
||||
withArrow={true}
|
||||
|
@ -584,6 +575,7 @@ exports[`renders the base component correctly with buttons and trays 1`] = `
|
|||
>
|
||||
<Badge
|
||||
count={1}
|
||||
elementRef={[Function]}
|
||||
formatOverflowText={[Function]}
|
||||
placement="top end"
|
||||
pulse={false}
|
||||
|
@ -591,7 +583,7 @@ exports[`renders the base component correctly with buttons and trays 1`] = `
|
|||
type="count"
|
||||
variant="primary"
|
||||
>
|
||||
<IconAlertsLine
|
||||
<IconAlerts
|
||||
title="1 opportunity"
|
||||
/>
|
||||
</Badge>
|
||||
|
@ -630,12 +622,11 @@ exports[`renders the base component correctly with buttons and trays 1`] = `
|
|||
applicationElement={[Function]}
|
||||
border={false}
|
||||
closeButtonLabel="Close"
|
||||
closeButtonRef={[Function]}
|
||||
closeButtonVariant="icon"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
insertAt="bottom"
|
||||
label="Add To Do"
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
onClose={[Function]}
|
||||
onDismiss={[Function]}
|
||||
|
@ -671,15 +662,12 @@ exports[`renders the base component correctly with buttons and trays 1`] = `
|
|||
/>
|
||||
</Tray>
|
||||
<Tray
|
||||
applicationElement={[Function]}
|
||||
border={false}
|
||||
closeButtonLabel={null}
|
||||
closeButtonRef={[Function]}
|
||||
closeButtonVariant="icon"
|
||||
contentRef={[Function]}
|
||||
defaultFocusElement={null}
|
||||
insertAt="bottom"
|
||||
label="My Grades"
|
||||
liveRegion={null}
|
||||
mountNode={null}
|
||||
onClose={[Function]}
|
||||
onDismiss={[Function]}
|
||||
|
|
|
@ -18,17 +18,17 @@
|
|||
import React, { Component } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import Button from '@instructure/ui-core/lib/components/Button';
|
||||
import Button from '@instructure/ui-buttons/lib/components/Button';
|
||||
import CloseButton from '@instructure/ui-buttons/lib/components/CloseButton';
|
||||
import View from '@instructure/ui-layout/lib/components/View';
|
||||
import IconPlusLine from 'instructure-icons/lib/Line/IconPlusLine';
|
||||
import IconAlertsLine from 'instructure-icons/lib/Line/IconAlertsLine';
|
||||
import IconGradebookLine from 'instructure-icons/lib/Line/IconGradebookLine';
|
||||
import Popover, {PopoverTrigger, PopoverContent} from '@instructure/ui-core/lib/components/Popover';
|
||||
import IconPlusLine from '@instructure/ui-icons/lib/Line/IconPlus';
|
||||
import IconAlertsLine from '@instructure/ui-icons/lib/Line/IconAlerts';
|
||||
import IconGradebookLine from '@instructure/ui-icons/lib/Line/IconGradebook';
|
||||
import Popover, {PopoverTrigger, PopoverContent} from '@instructure/ui-overlays/lib/components/Popover';
|
||||
import PropTypes from 'prop-types';
|
||||
import UpdateItemTray from '../UpdateItemTray';
|
||||
import Tray from '@instructure/ui-core/lib/components/Tray';
|
||||
import Badge from '@instructure/ui-core/lib/components/Badge';
|
||||
import Tray from '@instructure/ui-overlays/lib/components/Tray';
|
||||
import Badge from '@instructure/ui-elements/lib/components/Badge';
|
||||
import Opportunities from '../Opportunities';
|
||||
import GradesDisplay from '../GradesDisplay';
|
||||
import StickyButton from '../StickyButton';
|
||||
|
@ -369,7 +369,6 @@ export class PlannerHeader extends Component {
|
|||
placement="end"
|
||||
shouldContainFocus
|
||||
shouldReturnFocus
|
||||
applicationElement={() => document.getElementById('application') }
|
||||
onDismiss={this.toggleGradesTray}
|
||||
>
|
||||
<View as="div" padding="large large medium">
|
||||
|
|
|
@ -34,7 +34,7 @@ exports[`renders Announcement correctly with everything 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAnnouncementLine />
|
||||
<IconAnnouncement />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -165,7 +165,7 @@ exports[`renders Announcement correctly with just date 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAnnouncementLine />
|
||||
<IconAnnouncement />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -272,7 +272,7 @@ exports[`renders Announcement correctly with just points 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAnnouncementLine />
|
||||
<IconAnnouncement />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -403,7 +403,7 @@ exports[`renders Announcement correctly without right side content 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAnnouncementLine />
|
||||
<IconAnnouncement />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -510,7 +510,7 @@ exports[`renders Assignment correctly with everything 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAssignmentLine />
|
||||
<IconAssignment />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -641,7 +641,7 @@ exports[`renders Assignment correctly with just date 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAssignmentLine />
|
||||
<IconAssignment />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -748,7 +748,7 @@ exports[`renders Assignment correctly with just points 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAssignmentLine />
|
||||
<IconAssignment />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -879,7 +879,7 @@ exports[`renders Assignment correctly without right side content 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAssignmentLine />
|
||||
<IconAssignment />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -986,7 +986,7 @@ exports[`renders Calendar Event correctly with an all day date 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconCalendarMonthLine />
|
||||
<IconCalendarMonth />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1093,7 +1093,7 @@ exports[`renders Calendar Event correctly with everything 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconCalendarMonthLine />
|
||||
<IconCalendarMonth />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1224,7 +1224,7 @@ exports[`renders Calendar Event correctly with just date 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconCalendarMonthLine />
|
||||
<IconCalendarMonth />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1331,7 +1331,7 @@ exports[`renders Calendar Event correctly without right side content 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconCalendarMonthLine />
|
||||
<IconCalendarMonth />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1438,7 +1438,7 @@ exports[`renders Discussion correctly with everything 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconDiscussionLine />
|
||||
<IconDiscussion />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1569,7 +1569,7 @@ exports[`renders Discussion correctly with just date 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconDiscussionLine />
|
||||
<IconDiscussion />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1676,7 +1676,7 @@ exports[`renders Discussion correctly with just points 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconDiscussionLine />
|
||||
<IconDiscussion />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1807,7 +1807,7 @@ exports[`renders Discussion correctly without right side content 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconDiscussionLine />
|
||||
<IconDiscussion />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -1914,7 +1914,7 @@ exports[`renders Note correctly with Group 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconMsWordLine />
|
||||
<IconMsWord />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -2247,7 +2247,7 @@ exports[`renders Page correctly with everything 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconMsWordLine />
|
||||
<IconMsWord />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -2378,7 +2378,7 @@ exports[`renders Page correctly with just date 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconMsWordLine />
|
||||
<IconMsWord />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -2485,7 +2485,7 @@ exports[`renders Page correctly with just points 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconMsWordLine />
|
||||
<IconMsWord />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -2616,7 +2616,7 @@ exports[`renders Page correctly without right side content 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconMsWordLine />
|
||||
<IconMsWord />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -2723,7 +2723,7 @@ exports[`renders Quiz correctly with everything 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconQuizLine />
|
||||
<IconQuiz />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -2854,7 +2854,7 @@ exports[`renders Quiz correctly with just date 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconQuizLine />
|
||||
<IconQuiz />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -2961,7 +2961,7 @@ exports[`renders Quiz correctly with just points 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconQuizLine />
|
||||
<IconQuiz />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -3092,7 +3092,7 @@ exports[`renders Quiz correctly without right side content 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconQuizLine />
|
||||
<IconQuiz />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
@ -3199,7 +3199,7 @@ exports[`renders correctly 1`] = `
|
|||
}
|
||||
}
|
||||
>
|
||||
<IconAssignmentLine />
|
||||
<IconAssignment />
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
|
|
|
@ -18,19 +18,19 @@
|
|||
import React, { Component } from 'react';
|
||||
import classnames from 'classnames';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import Text from '@instructure/ui-core/lib/components/Text';
|
||||
import Checkbox from '@instructure/ui-core/lib/components/Checkbox';
|
||||
import Link from '@instructure/ui-core/lib/components/Link';
|
||||
import ScreenReaderContent from '@instructure/ui-core/lib/components/ScreenReaderContent';
|
||||
import PresentationContent from '@instructure/ui-core/lib/components/PresentationContent';
|
||||
import Pill from '@instructure/ui-core/lib/components/Pill';
|
||||
import Avatar from '@instructure/ui-core/lib/components/Avatar';
|
||||
import Assignment from 'instructure-icons/lib/Line/IconAssignmentLine';
|
||||
import Quiz from 'instructure-icons/lib/Line/IconQuizLine';
|
||||
import Announcement from 'instructure-icons/lib/Line/IconAnnouncementLine';
|
||||
import Discussion from 'instructure-icons/lib/Line/IconDiscussionLine';
|
||||
import Calendar from 'instructure-icons/lib/Line/IconCalendarMonthLine';
|
||||
import Page from 'instructure-icons/lib/Line/IconMsWordLine';
|
||||
import Text from '@instructure/ui-elements/lib/components/Text';
|
||||
import Checkbox, {CheckboxFacade} from '@instructure/ui-forms/lib/components/Checkbox';
|
||||
import Link from '@instructure/ui-elements/lib/components/Link';
|
||||
import ScreenReaderContent from '@instructure/ui-a11y/lib/components/ScreenReaderContent';
|
||||
import PresentationContent from '@instructure/ui-a11y/lib/components/PresentationContent';
|
||||
import Pill from '@instructure/ui-elements/lib/components/Pill';
|
||||
import Avatar from '@instructure/ui-elements/lib/components/Avatar';
|
||||
import Assignment from '@instructure/ui-icons/lib/Line/IconAssignment';
|
||||
import Quiz from '@instructure/ui-icons/lib/Line/IconQuiz';
|
||||
import Announcement from '@instructure/ui-icons/lib/Line/IconAnnouncement';
|
||||
import Discussion from '@instructure/ui-icons/lib/Line/IconDiscussion';
|
||||
import Calendar from '@instructure/ui-icons/lib/Line/IconCalendarMonth';
|
||||
import Page from '@instructure/ui-icons/lib/Line/IconMsWord';
|
||||
import NotificationBadge, { MissingIndicator, NewActivityIndicator } from '../NotificationBadge';
|
||||
import BadgeList from '../BadgeList';
|
||||
import responsiviser from '../responsiviser';
|
||||
|
@ -42,8 +42,7 @@ import { showPillForOverdueStatus } from '../../utilities/statusUtils';
|
|||
import { momentObj } from 'react-moment-proptypes';
|
||||
import formatMessage from '../../format-message';
|
||||
import {animatable} from '../../dynamic-ui';
|
||||
import ApplyTheme from '@instructure/ui-core/lib/components/ApplyTheme';
|
||||
import CheckboxFacade from '@instructure/ui-core/lib/components/Checkbox/CheckboxFacade';
|
||||
import ApplyTheme from '@instructure/ui-themeable/lib/components/ApplyTheme';
|
||||
|
||||
export class PlannerItem extends Component {
|
||||
static propTypes = {
|
||||
|
|
|
@ -20,8 +20,8 @@ import { findDOMNode } from 'react-dom';
|
|||
import { node, object, func } from 'prop-types';
|
||||
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import Button from '@instructure/ui-core/lib/components/Button';
|
||||
import ScreenReaderContent from '@instructure/ui-core/lib/components/ScreenReaderContent';
|
||||
import Button from '@instructure/ui-buttons/lib/components/Button';
|
||||
import ScreenReaderContent from '@instructure/ui-a11y/lib/components/ScreenReaderContent';
|
||||
|
||||
import styles from './styles.css';
|
||||
import theme from './theme.js';
|
||||
|
|
|
@ -18,8 +18,8 @@
|
|||
import React from 'react';
|
||||
import StickyButton from '../index';
|
||||
import {shallow} from 'enzyme';
|
||||
import IconArrowUpSolid from 'instructure-icons/lib/Solid/IconArrowUpSolid';
|
||||
import IconArrowDownLine from 'instructure-icons/lib/Line/IconArrowDownLine';
|
||||
import IconArrowUpSolid from '@instructure/ui-icons/lib/Solid/IconArrowUp';
|
||||
import IconArrowDownLine from '@instructure/ui-icons/lib/Line/IconArrowDown';
|
||||
|
||||
|
||||
it('renders', () => {
|
||||
|
|
|
@ -19,8 +19,8 @@ import React, { Component } from 'react';
|
|||
import classnames from 'classnames';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import { bool, func, node, number, string, oneOf } from 'prop-types';
|
||||
import IconArrowUpSolid from 'instructure-icons/lib/Solid/IconArrowUpSolid';
|
||||
import IconArrowDownLine from 'instructure-icons/lib/Line/IconArrowDownLine';
|
||||
import IconArrowUpSolid from '@instructure/ui-icons/lib/Solid/IconArrowUp';
|
||||
import IconArrowDownLine from '@instructure/ui-icons/lib/Line/IconArrowDown';
|
||||
|
||||
import styles from './styles.css';
|
||||
import theme from './theme.js';
|
||||
|
|
|
@ -259,7 +259,7 @@ it('invokes save callback with updated data', () => {
|
|||
/>);
|
||||
wrapper.instance().handleTitleChange({target: {value: 'new title'}});
|
||||
wrapper.instance().handleDateChange({}, '2017-05-01T14:00:00Z');
|
||||
wrapper.instance().handleCourseIdChange({target: {value: '43'}});
|
||||
wrapper.instance().handleCourseIdChange(null, {value: '43'});
|
||||
wrapper.instance().handleChange('details', 'new details');
|
||||
wrapper.instance().handleSave();
|
||||
expect(saveMock).toHaveBeenCalledWith({
|
||||
|
|
|
@ -31,6 +31,7 @@ exports[`renders the item to update if provided 1`] = `
|
|||
layout="stacked"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
size="medium"
|
||||
textAlign="start"
|
||||
type="text"
|
||||
|
@ -62,16 +63,25 @@ exports[`renders the item to update if provided 1`] = `
|
|||
value="2017-04-25T08:49:00.000Z"
|
||||
/>
|
||||
<Select
|
||||
disabled={false}
|
||||
inline={false}
|
||||
allowEmpty={true}
|
||||
closeOnSelect={true}
|
||||
editable={false}
|
||||
emptyOption="---"
|
||||
filter={[Function]}
|
||||
formatSelectedOption={[Function]}
|
||||
inputRef={[Function]}
|
||||
label="Course"
|
||||
layout="stacked"
|
||||
messages={Array []}
|
||||
loadingText={null}
|
||||
onChange={[Function]}
|
||||
selectRef={[Function]}
|
||||
optionsMaxWidth={null}
|
||||
selectedOption={
|
||||
Object {
|
||||
"label": "a course",
|
||||
"value": "1",
|
||||
}
|
||||
}
|
||||
size="medium"
|
||||
type="text"
|
||||
value="1"
|
||||
visibleOptionsCount={8}
|
||||
>
|
||||
<option
|
||||
value="none"
|
||||
|
@ -93,6 +103,7 @@ exports[`renders the item to update if provided 1`] = `
|
|||
layout="stacked"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
resize="none"
|
||||
size="medium"
|
||||
textareaRef={[Function]}
|
||||
|
@ -166,6 +177,7 @@ exports[`updates state when new note is passed in 1`] = `
|
|||
layout="stacked"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
size="medium"
|
||||
textAlign="start"
|
||||
type="text"
|
||||
|
@ -197,16 +209,25 @@ exports[`updates state when new note is passed in 1`] = `
|
|||
value="2017-04-28T11:00:00.000Z"
|
||||
/>
|
||||
<Select
|
||||
disabled={false}
|
||||
inline={false}
|
||||
allowEmpty={true}
|
||||
closeOnSelect={true}
|
||||
editable={false}
|
||||
emptyOption="---"
|
||||
filter={[Function]}
|
||||
formatSelectedOption={[Function]}
|
||||
inputRef={[Function]}
|
||||
label="Course"
|
||||
layout="stacked"
|
||||
messages={Array []}
|
||||
loadingText={null}
|
||||
onChange={[Function]}
|
||||
selectRef={[Function]}
|
||||
optionsMaxWidth={null}
|
||||
selectedOption={
|
||||
Object {
|
||||
"label": "first course",
|
||||
"value": "1",
|
||||
}
|
||||
}
|
||||
size="medium"
|
||||
type="text"
|
||||
value="1"
|
||||
visibleOptionsCount={8}
|
||||
>
|
||||
<option
|
||||
value="none"
|
||||
|
@ -233,6 +254,7 @@ exports[`updates state when new note is passed in 1`] = `
|
|||
layout="stacked"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
resize="none"
|
||||
size="medium"
|
||||
textareaRef={[Function]}
|
||||
|
@ -306,6 +328,7 @@ exports[`updates state when new note is passed in 2`] = `
|
|||
layout="stacked"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
size="medium"
|
||||
textAlign="start"
|
||||
type="text"
|
||||
|
@ -337,16 +360,25 @@ exports[`updates state when new note is passed in 2`] = `
|
|||
value="2017-04-28T11:00:00.000Z"
|
||||
/>
|
||||
<Select
|
||||
disabled={false}
|
||||
inline={false}
|
||||
allowEmpty={true}
|
||||
closeOnSelect={true}
|
||||
editable={false}
|
||||
emptyOption="---"
|
||||
filter={[Function]}
|
||||
formatSelectedOption={[Function]}
|
||||
inputRef={[Function]}
|
||||
label="Course"
|
||||
layout="stacked"
|
||||
messages={Array []}
|
||||
loadingText={null}
|
||||
onChange={[Function]}
|
||||
selectRef={[Function]}
|
||||
optionsMaxWidth={null}
|
||||
selectedOption={
|
||||
Object {
|
||||
"label": "second course",
|
||||
"value": "2",
|
||||
}
|
||||
}
|
||||
size="medium"
|
||||
type="text"
|
||||
value="2"
|
||||
visibleOptionsCount={8}
|
||||
>
|
||||
<option
|
||||
value="none"
|
||||
|
@ -373,6 +405,7 @@ exports[`updates state when new note is passed in 2`] = `
|
|||
layout="stacked"
|
||||
messages={Array []}
|
||||
onChange={[Function]}
|
||||
readOnly={false}
|
||||
resize="none"
|
||||
size="medium"
|
||||
textareaRef={[Function]}
|
||||
|
|
|
@ -19,14 +19,14 @@ import React, { Component } from 'react';
|
|||
import _ from 'lodash';
|
||||
import themeable from '@instructure/ui-themeable/lib';
|
||||
import View from '@instructure/ui-layout/lib/components/View';
|
||||
import FormFieldGroup from '@instructure/ui-core/lib/components/FormFieldGroup';
|
||||
import ScreenReaderContent from '@instructure/ui-core/lib/components/ScreenReaderContent';
|
||||
import Button from '@instructure/ui-core/lib/components/Button';
|
||||
import FormFieldGroup from '@instructure/ui-forms/lib/components/FormFieldGroup';
|
||||
import ScreenReaderContent from '@instructure/ui-a11y/lib/components/ScreenReaderContent';
|
||||
import Button from '@instructure/ui-buttons/lib/components/Button';
|
||||
import formatMessage from '../../format-message';
|
||||
import PropTypes from 'prop-types';
|
||||
import TextInput from '@instructure/ui-core/lib/components/TextInput';
|
||||
import Select from '@instructure/ui-core/lib/components/Select';
|
||||
import TextArea from '@instructure/ui-core/lib/components/TextArea';
|
||||
import TextInput from '@instructure/ui-forms/lib/components/TextInput';
|
||||
import Select from '@instructure/ui-forms/lib/components/Select';
|
||||
import TextArea from '@instructure/ui-forms/lib/components/TextArea';
|
||||
import DateTimeInput from '@instructure/ui-forms/lib/components/DateTimeInput';
|
||||
import moment from 'moment-timezone';
|
||||
|
||||
|
@ -106,8 +106,9 @@ export class UpdateItemTray extends Component {
|
|||
}, this.updateMessages);
|
||||
}
|
||||
|
||||
handleCourseIdChange = (e) => {
|
||||
let value = e.target.value;
|
||||
handleCourseIdChange = (e, option) => {
|
||||
if (!option) return
|
||||
let value = option.value;
|
||||
if (value === 'none') value = undefined;
|
||||
this.handleChange('courseId', value);
|
||||
}
|
||||
|
@ -216,24 +217,32 @@ export class UpdateItemTray extends Component {
|
|||
);
|
||||
}
|
||||
|
||||
renderCourseSelectOptions () {
|
||||
if (!this.props.courses) return [];
|
||||
return this.props.courses.map(course => {
|
||||
return <option key={course.id} value={course.id}>{course.longName}</option>;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
renderCourseSelect () {
|
||||
let courseId = this.findCurrentValue('courseId');
|
||||
if (courseId == null) courseId = 'none';
|
||||
const noneOption = {
|
||||
value: "none",
|
||||
label: formatMessage("Optional: Add Course")
|
||||
}
|
||||
const courseOptions = (this.props.courses || []).map(course => ({
|
||||
value: course.id,
|
||||
label: course.longName
|
||||
}))
|
||||
|
||||
const courseId = this.findCurrentValue('courseId');
|
||||
const selectedOption = courseId
|
||||
? courseOptions.find(o => o.value === courseId)
|
||||
: noneOption
|
||||
|
||||
return (
|
||||
<Select
|
||||
label={formatMessage("Course")}
|
||||
value={courseId}
|
||||
selectedOption={selectedOption}
|
||||
onChange={this.handleCourseIdChange}
|
||||
>
|
||||
<option value="none">{formatMessage("Optional: Add Course")}</option>
|
||||
{this.renderCourseSelectOptions()}
|
||||
{[noneOption, ...courseOptions].map(props => (
|
||||
<option key={props.value} value={props.value}>{props.label}</option>
|
||||
))}
|
||||
</Select>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -29,10 +29,10 @@ import moment from 'moment-timezone';
|
|||
import CanvasPlanner, { store as PlannerStore } from './index';
|
||||
import { addDay, getPlannerItems } from '../src/actions';
|
||||
|
||||
import Button from '@instructure/ui-core/lib/components/Button';
|
||||
import Button from '@instructure/ui-buttons/lib/components/Button';
|
||||
import Select from '@instructure/ui-core/lib/components/Select';
|
||||
import Grid, { GridCol, GridRow } from '@instructure/ui-core/lib/components/Grid';
|
||||
import Text from '@instructure/ui-core/lib/components/Text';
|
||||
import Grid, { GridCol, GridRow } from '@instructure/ui-layout/lib/components/Grid';
|
||||
import Text from '@instructure/ui-elements/lib/components/Text';
|
||||
import THEMES from '@instructure/ui-themes/lib';
|
||||
|
||||
const COURSES = [{
|
||||
|
|
|
@ -24,7 +24,7 @@ import ReactDOM from 'react-dom';
|
|||
import { Provider } from 'react-redux';
|
||||
import PlannerApp from './components/PlannerApp';
|
||||
import PlannerHeader from './components/PlannerHeader';
|
||||
import ApplyTheme from '@instructure/ui-core/lib/components/ApplyTheme';
|
||||
import ApplyTheme from '@instructure/ui-themeable/lib/components/ApplyTheme';
|
||||
import i18n from './i18n';
|
||||
import configureStore from './store/configureStore';
|
||||
import { initialOptions, getPlannerItems, scrollIntoPast, loadFutureItems } from './actions';
|
||||
|
|
|
@ -16,11 +16,11 @@
|
|||
* with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*/
|
||||
import { handleActions } from 'redux-actions';
|
||||
import _ from 'lodash';
|
||||
import {cloneDeep} from 'lodash';
|
||||
|
||||
export default handleActions({
|
||||
UPDATE_TODO: (state, action) => {
|
||||
return _.cloneDeep(action.payload);
|
||||
return cloneDeep(action.payload);
|
||||
},
|
||||
OPEN_EDITING_PLANNER_ITEM: (state, action) => {
|
||||
return state.updateTodoItem ? state : {updateTodoItem: {}};
|
||||
|
|
|
@ -438,17 +438,21 @@ describe "student planner" do
|
|||
title: "Student to do 2")
|
||||
view_todo_item
|
||||
modal = todo_sidebar_modal(@student_to_do.title)
|
||||
expect(f('input', modal)[:value]).to eq(@student_to_do.title)
|
||||
expect((f('select', modal)[:value]).to_i).to eq(@course.id)
|
||||
title_input = f('input', modal)
|
||||
course_name_dropdown = fj('span:contains("Course")>span>span>input', modal)
|
||||
|
||||
expect(title_input[:value]).to eq(@student_to_do.title)
|
||||
expect(course_name_dropdown[:value]).to eq("#{@course.name} - #{@course.short_name}")
|
||||
|
||||
flnpt(student_to_do2.title).click
|
||||
expect(f('input', modal)[:value]).to eq(student_to_do2.title)
|
||||
expect(f('select', modal)[:value]).to eq("none")
|
||||
expect(title_input[:value]).to eq(student_to_do2.title)
|
||||
expect(course_name_dropdown[:value]).to eq("Optional: Add Course")
|
||||
end
|
||||
|
||||
it "allows editing the course of a to-do item", priority: "1", test_id: 3418827 do
|
||||
view_todo_item
|
||||
element = fj("select:contains('Unnamed Course')")
|
||||
fj("option:contains('Optional: Add Course')", element).click
|
||||
fj(":contains('Unnamed Course')>span>input[role=combobox]").click
|
||||
fj("[role='option'] :contains('Optional: Add Course')").click
|
||||
todo_save_button.click
|
||||
@student_to_do.reload
|
||||
expect(@student_to_do.course_id).to be nil
|
||||
|
@ -457,8 +461,8 @@ describe "student planner" do
|
|||
it "has courses in the course combo box.", priority: "1", test_id: 3263160 do
|
||||
go_to_list_view
|
||||
todo_modal_button.click
|
||||
element = fj("select:contains('Optional: Add Course')")
|
||||
expect(fj("option:contains('Unnamed Course')", element)).to be
|
||||
fj(":contains('Optional: Add Course')>span>input[role=combobox]").click
|
||||
expect(fj("[role='option'] :contains('Unnamed Course')")).to be
|
||||
end
|
||||
|
||||
it "ensures time zones with offsets higher than UTC update the planner items" do
|
||||
|
|
Loading…
Reference in New Issue