diff --git a/__tests__/AnnotationCreation.test.js b/__tests__/AnnotationCreation.test.js
index d0a355d..698cc0c 100644
--- a/__tests__/AnnotationCreation.test.js
+++ b/__tests__/AnnotationCreation.test.js
@@ -1,5 +1,7 @@
import React from 'react';
import { shallow } from 'enzyme';
+import { I18nextProvider, initReactI18next } from 'react-i18next';
+import i18n from 'i18next';
import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
import AnnotationCreation from '../src/AnnotationCreation';
import AnnotationDrawing from '../src/AnnotationDrawing';
@@ -7,15 +9,19 @@ import TextEditor from '../src/TextEditor';
/** */
function createWrapper(props) {
+ const i18nconfig = i18n.createInstance();
+ i18nconfig.use(initReactI18next).init({ lng: 'en', resources: {} });
return shallow(
- ,
- );
+
+
+ ,
+ ).dive().dive().dive();
}
describe('AnnotationCreation', () => {
diff --git a/package.json b/package.json
index 6b8f48c..2c1b375 100644
--- a/package.json
+++ b/package.json
@@ -40,6 +40,7 @@
"prop-types": "^15.7.2",
"react": "^17.0",
"react-dom": "^17.0",
+ "react-i18next": "^11.7.0",
"uuid": "^8.0.0"
},
"devDependencies": {
@@ -70,6 +71,7 @@
"prop-types": "^15.7.2",
"react": "^17.0",
"react-dom": "^17.0",
+ "react-i18next": "^11.7.0",
"uuid": "^8.2.0"
},
"author": "",
diff --git a/src/AnnotationCreation.js b/src/AnnotationCreation.js
index 3ce88cf..1f03663 100644
--- a/src/AnnotationCreation.js
+++ b/src/AnnotationCreation.js
@@ -1,5 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
+import compose from 'lodash/flowRight';
+import { withTranslation } from 'react-i18next';
import Button from '@material-ui/core/Button';
import Typography from '@material-ui/core/Typography';
import Paper from '@material-ui/core/Paper';
@@ -22,6 +24,7 @@ import Divider from '@material-ui/core/Divider';
import MenuItem from '@material-ui/core/MenuItem';
import ClickAwayListener from '@material-ui/core/ClickAwayListener';
import MenuList from '@material-ui/core/MenuList';
+import Select from '@material-ui/core/Select';
import { SketchPicker } from 'react-color';
import { v4 as uuid } from 'uuid';
import { withStyles } from '@material-ui/core/styles';
@@ -63,6 +66,8 @@ class AnnotationCreation extends Component {
annoState.svg = props.annotation.target.selector.value;
}
}
+
+ annoState.motivation = props.annotation.motivation;
}
const toolState = {
@@ -70,6 +75,7 @@ class AnnotationCreation extends Component {
closedMode: 'closed',
currentColorType: false,
fillColor: null,
+ motivation: (props.config.annotation.motivations && props.config.annotation.motivations[0]),
strokeColor: '#00BFFF',
strokeWidth: 3,
...(props.config.annotation.defaults || {}),
@@ -98,6 +104,7 @@ class AnnotationCreation extends Component {
this.handleCloseLineWeight = this.handleCloseLineWeight.bind(this);
this.closeChooseColor = this.closeChooseColor.bind(this);
this.updateStrokeColor = this.updateStrokeColor.bind(this);
+ this.changeMotivation = this.changeMotivation.bind(this);
}
/** */
@@ -158,7 +165,7 @@ class AnnotationCreation extends Component {
annotation, canvases, closeCompanionWindow, receiveAnnotation, config,
} = this.props;
const {
- annoBody, tags, xywh, svg,
+ annoBody, tags, motivation, xywh, svg,
} = this.state;
canvases.forEach((canvas) => {
const storageAdapter = config.annotation.adapter(canvas.id);
@@ -167,6 +174,7 @@ class AnnotationCreation extends Component {
canvasId: canvas.id,
id: (annotation && annotation.id) || `${uuid()}`,
manifestId: canvas.options.resource.id,
+ motivation,
svg,
tags,
xywh,
@@ -194,6 +202,13 @@ class AnnotationCreation extends Component {
});
}
+ /** */
+ changeMotivation(e) {
+ this.setState({
+ motivation: e.target.value,
+ });
+ }
+
/** */
changeClosedMode(e) {
this.setState({
@@ -216,12 +231,13 @@ class AnnotationCreation extends Component {
/** */
render() {
const {
- annotation, classes, closeCompanionWindow, id, windowId,
+ annotation, classes, closeCompanionWindow, config, id, t, windowId,
} = this.props;
const {
activeTool, colorPopoverOpen, currentColorType, fillColor, popoverAnchorEl, strokeColor,
popoverLineWeightAnchorEl, lineWeightPopoverOpen, strokeWidth, closedMode, annoBody, svg,
+ motivation,
} = this.state;
return (