Skip to content
This repository has been archived by the owner on Jan 28, 2020. It is now read-only.

Commit

Permalink
Modifications to feature/aq/delete_vocabulary
Browse files Browse the repository at this point in the history
  • Loading branch information
George Schneeloch committed Sep 9, 2015
1 parent d87fd83 commit 5116900
Show file tree
Hide file tree
Showing 3 changed files with 99 additions and 143 deletions.
94 changes: 49 additions & 45 deletions ui/jstests/test_manage_taxonomies.jsx
Expand Up @@ -181,6 +181,10 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
dataType: 'json',
type: "GET"
});
TestUtils.initMockjax({
url: "/api/v1/repositories/repo/vocabularies/difficulty/",
type: "DELETE"
});
},
afterEach: function() {
TestUtils.cleanup();
Expand Down Expand Up @@ -219,6 +223,10 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
assert.ok(VocabularyComponent, "class object not found");
var done = assert.async();

var showConfirmationDialog = function (options) {
options.confirmationHandler(true);
};

var addTermCalled = 0;
var deleteVocabularyCalled = 0;
var addTerm = function() {
Expand Down Expand Up @@ -256,32 +264,34 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
);
var deleteVocabularyButton = actionButtons[0];
React.addons.TestUtils.Simulate.click(deleteVocabularyButton);
component.forceUpdate(function() {
assert.equal(deleteVocabularyCalled, 1);
//test enter text in input text
var inputNode = React.addons.TestUtils.
findRenderedDOMComponentWithTag(
component.forceUpdate(function () {
waitForAjax(1, function () {
assert.equal(deleteVocabularyCalled, 1);
//test enter text in input text
var inputNode = React.addons.TestUtils.
findRenderedDOMComponentWithTag(
component,
'input'
);
React.addons.TestUtils.Simulate.change(
inputNode,
{target: {value: 'test12'}}
);
component.forceUpdate(function() {
node = React.findDOMNode(component);
var textbox = $(node).find("input")[0];
assert.equal(
'test12',
component.state.newTermLabel
);
React.addons.TestUtils.Simulate.keyUp(textbox, {key: "x"});
assert.equal(addTermCalled, 0);
React.addons.TestUtils.Simulate.change(
inputNode,
{target: {value: 'test12'}}
);
component.forceUpdate(function () {
node = React.findDOMNode(component);
var textbox = $(node).find("input")[0];
assert.equal(
'test12',
component.state.newTermLabel
);
React.addons.TestUtils.Simulate.keyUp(textbox, {key: "x"});
assert.equal(addTermCalled, 0);

React.addons.TestUtils.Simulate.keyUp(textbox, {key: "Enter"});
waitForAjax(1, function() {
assert.equal(addTermCalled, 1);
done();
React.addons.TestUtils.Simulate.keyUp(textbox, {key: "Enter"});
waitForAjax(1, function () {
assert.equal(addTermCalled, 1);
done();
});
});
});
});
Expand All @@ -293,6 +303,7 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
terms={vocabulary.terms}
reportMessage={reportMessage}
deleteVocabulary={deleteVocabulary}
renderConfirmationDialog={showConfirmationDialog}
addTerm={addTerm}
repoSlug="repo"
ref={afterMount}
Expand Down Expand Up @@ -718,12 +729,14 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
);
React.addons.TestUtils.Simulate.submit(formNode);
waitForAjax(1, function() {
// Error is caused by a 400 status code
assert.deepEqual(
component.state.message,
{error: "There was a problem adding the Vocabulary."}
);
done();
component.forceUpdate(function() {
// Error is caused by a 400 status code
assert.deepEqual(
component.state.message,
{error: "There was a problem adding the Vocabulary."}
);
done();
});
});
};
React.addons.TestUtils.
Expand Down Expand Up @@ -878,6 +891,7 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
<TaxonomyComponent
vocabularies={vocabularies}
repoSlug="repo"
renderConfirmationDialog={function() {}}
ref={afterMount}
/>
);
Expand Down Expand Up @@ -982,6 +996,7 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
<TaxonomyComponent
vocabularies={vocabularies}
repoSlug="repo"
renderConfirmationDialog={function() {}}
ref={afterMount}
/>
);
Expand All @@ -994,15 +1009,10 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
var done = assert.async();
var userSelectedConfirm = 0;
var showConfirmationDialog = function (options) {
options.confirmationSuccess(true, vocabulary);
options.confirmationHandler(true);
userSelectedConfirm += 1;
};

TestUtils.initMockjax({
url: "/api/v1/repositories/repo/vocabularies/" + vocabulary.slug,
type: "DELETE"
});

var afterMount = function(component) {
waitForAjax(2, function() {
assert.equal(
Expand Down Expand Up @@ -1046,12 +1056,12 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
var done = assert.async();
var userSelectedConfirm = 0;
var showConfirmationDialog = function (options) {
options.confirmationSuccess(true, vocabulary);
options.confirmationHandler(true);
userSelectedConfirm += 1;
};

TestUtils.initMockjax({
url: "/api/v1/repositories/repo/vocabularies/" + vocabulary.slug,
TestUtils.replaceMockjax({
url: "/api/v1/repositories/repo/vocabularies/" + vocabulary.slug + "/",
type: "DELETE",
status: 400
});
Expand All @@ -1069,19 +1079,13 @@ define(['QUnit', 'jquery', 'manage_taxonomies', 'react',
);
var deleteVocabularyButton = actionButtons[0];
React.addons.TestUtils.Simulate.click(deleteVocabularyButton);
component.forceUpdate(function() {
waitForAjax(1, function() {
waitForAjax(1, function() {
component.forceUpdate(function() {
assert.equal(userSelectedConfirm, 1);
assert.equal(
component.state.vocabularies.length,
1
);
var message = "Unable to delete vocabulary '" +
vocabulary.name + "'";
assert.deepEqual(
component.state.message,
{error: message}
);
done();
});
});
Expand Down
86 changes: 37 additions & 49 deletions ui/static/ui/js/manage_taxonomies.jsx
Expand Up @@ -71,7 +71,33 @@ define('manage_taxonomies', ['react', 'lodash', 'jquery', 'utils', 'bootstrap'],
</div>;
},
onDeleteHandler: function() {
this.props.deleteVocabulary(this.props.vocabulary, "confirm-delete");
var options = {
actionButtonName: "Delete",
actionButtonClass: "btn btn-danger btn-ok",
title: "Confirm Delete",
message: "Are you sure you want to delete vocabulary '" +
this.props.vocabulary.name + "'?",
confirmationHandler: this.confirmedDeleteResponse
};
this.props.renderConfirmationDialog(options);
},
confirmedDeleteResponse: function(success) {
var method = "DELETE";
var thiz = this;
if (success) {
var vocab = this.props.vocabulary;
var API_ROOT_VOCAB_URL = '/api/v1/repositories/' + this.props.repoSlug +
'/vocabularies/' + vocab.slug + '/';
$.ajax({
type: method,
url: API_ROOT_VOCAB_URL
}).fail(function () {
var message = "Unable to delete vocabulary '" + vocab.name + "'";
thiz.props.reportMessage({error: message});
}).then(function () {
thiz.props.deleteVocabulary(vocab.slug);
});
}
},
onKeyUp: function(e) {
if (e.key === "Enter") {
Expand Down Expand Up @@ -120,12 +146,13 @@ define('manage_taxonomies', ['react', 'lodash', 'jquery', 'utils', 'bootstrap'],
var items = _.map(this.props.vocabularies, function (obj) {
return <VocabularyComponent
vocabulary={obj.vocabulary}
deleteVocabulary={thiz.deleteVocabularyHandler}
deleteVocabulary={thiz.props.deleteVocabulary}
terms={obj.terms}
key={obj.vocabulary.slug}
repoSlug={repoSlug}
reportMessage={thiz.reportMessage}
addTerm={thiz.props.addTerm}
renderConfirmationDialog={thiz.props.renderConfirmationDialog}
/>;
});
return <div className="panel-group lore-panel-group">
Expand All @@ -136,9 +163,6 @@ define('manage_taxonomies', ['react', 'lodash', 'jquery', 'utils', 'bootstrap'],
</div>;

},
deleteVocabularyHandler: function(vocab, dialogId) {
this.props.deleteVocabulary(vocab, dialogId);
},
reportMessage: function(message) {
this.setState({message: message});
},
Expand Down Expand Up @@ -323,51 +347,9 @@ define('manage_taxonomies', ['react', 'lodash', 'jquery', 'utils', 'bootstrap'],
getInitialState: function() {
return {
vocabularies: [],
learningResourceTypes: [],
message: ''
learningResourceTypes: []
};
},
deleteVocabulary: function(vocab, dialogId) {
if (this.isMounted() && vocab && dialogId) {
var options = {
tag: vocab,
confirmationDialogId: dialogId,
confirmationDialogActionButtonName: "Delete",
actionButtonClass: "btn btn-danger btn-ok",
confirmationDialogTitle: "Confirm Delete",
confirmationDialogMessage:
"Are you sure you want to delete vocabulary" +
" '" + vocab.name + "'.",
confirmationSuccess: this.confirmationDeleteResponse
};
this.props.renderConfirmationDialog(options);
}
},
confirmationDeleteResponse: function(status, vocab) {
var method = "DELETE";
var thiz = this;
if (status && vocab) {
var API_ROOT_VOCAB_URL = '/api/v1/repositories/' + this.props.repoSlug +
'/vocabularies/' + vocab.slug;
$.ajax({
type: method,
url: API_ROOT_VOCAB_URL
}).fail(function() {
var message = "Unable to delete vocabulary '" + vocab.name + "'";
thiz.setState({message: {error: message}});
}).done(function() {
var editIndex = -1;
var vocabularies = thiz.state.vocabularies;
editIndex = _.findIndex(vocabularies, function(vocabularyObj) {
return vocabularyObj.vocabulary.id === vocab.id;
});
if (editIndex > -1) {
vocabularies.splice(editIndex, 1);
thiz.setState({vocabularies: vocabularies});
}
});
}
},
addVocabulary: function(vocab) {
// Wrap vocab in expected structure
var newVocab = {
Expand All @@ -389,14 +371,20 @@ define('manage_taxonomies', ['react', 'lodash', 'jquery', 'utils', 'bootstrap'],
});
this.setState({vocabularies: vocabularies});
},
deleteVocabulary: function(vocabSlug) {
var vocabularies = _.filter(this.state.vocabularies, function(tuple) {
return tuple.vocabulary.slug !== vocabSlug;
});
this.setState({vocabularies: vocabularies});
},
render: function() {
return (
<div className="tab-content drawer-tab-content">
<StatusBox message={this.state.message} />
<div className="tab-pane active" id="tab-taxonomies">
<AddTermsComponent
vocabularies={this.state.vocabularies}
repoSlug={this.props.repoSlug}
renderConfirmationDialog={this.props.renderConfirmationDialog}
deleteVocabulary={this.deleteVocabulary}
addTerm={this.addTerm} />
</div>
Expand Down

0 comments on commit 5116900

Please sign in to comment.