Skip to content
This repository has been archived by the owner on Feb 27, 2019. It is now read-only.

Commit

Permalink
Update ember-validated-form to v2 alpha version and use its uikit theme
Browse files Browse the repository at this point in the history
  • Loading branch information
Jonas Metzener committed Sep 11, 2018
1 parent 6408845 commit d020847
Show file tree
Hide file tree
Showing 12 changed files with 77 additions and 103 deletions.
4 changes: 3 additions & 1 deletion addon/components/cfb-form-editor/general.js
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,9 @@ export default Component.extend(ComponentQueryManager, {
}).drop(),

actions: {
inputName(changeset, value) {
inputName(value, changeset) {
changeset.set("name", value);

if (!this.get("slug")) {
changeset.set("slug", slugify(value, { lower: true }).substr(0, 50));
}
Expand Down
11 changes: 9 additions & 2 deletions addon/components/cfb-form-editor/question.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,22 +4,29 @@ import layout from "../../templates/components/cfb-form-editor/question";
import { task } from "ember-concurrency";
import { ComponentQueryManager } from "ember-apollo-client";
import validations, {
POSSIBLE_TYPES as possibleTypes
POSSIBLE_TYPES
} from "ember-caluma-form-builder/validations/question";
import v4 from "uuid/v4";
import { optional } from "ember-composable-helpers/helpers/optional";
import { computed } from "@ember/object";

import formEditorQuestionQuery from "ember-caluma-form-builder/gql/queries/form-editor-question";
import saveQuestionMutation from "ember-caluma-form-builder/gql/mutations/save-question";

export default Component.extend(ComponentQueryManager, {
layout,
validations,
possibleTypes,

notification: service(),
intl: service(),

possibleTypes: computed(function() {
return POSSIBLE_TYPES.map(value => ({
value,
label: this.intl.t(`caluma.form-builder.question.types.${value}`)
}));
}),

didReceiveAttrs() {
this._super(...arguments);

Expand Down
60 changes: 23 additions & 37 deletions addon/templates/components/cfb-form-editor/general.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -8,42 +8,27 @@
model=(changeset model validations)
on-submit=(perform submit)
as |f|}}
{{#f.input name='name' as |i|}}
<label class="uk-form-label uk-text-bold">{{t 'caluma.form-builder.form.name'}}</label>
<input
name={{i.name}}
class="uk-input {{i.class}}"
value={{i.value}}
onblur={{i.setDirty}}
oninput={{action (queue i.update (action 'inputName' f.model)) value='target.value'}}
>
{{/f.input}}

{{#f.input name='slug' as |i|}}
<label class="uk-form-label uk-text-bold">{{t 'caluma.form-builder.form.slug'}}</label>
<input
type="text"
name={{i.name}}
class="uk-input {{i.class}}"
maxlength="50"
disabled={{f.model.id}}
value={{i.value}}
onblur={{i.setDirty}}
oninput={{action i.update value='target.value'}}
>
{{/f.input}}
{{f.input
type='text'
label=(t 'caluma.form-builder.form.name')
name='name'
on-update=(action 'inputName')
}}

{{#f.input name='description' as |i|}}
<label class="uk-form-label uk-text-bold">{{t 'caluma.form-builder.form.description'}}</label>
<textarea
name={{i.name}}
class="uk-textarea {{i.class}}"
rows="5"
value={{i.value}}
onblur={{i.setDirty}}
oninput={{action i.update value='target.value'}}
></textarea>
{{/f.input}}
{{f.input
type='text'
label=(t 'caluma.form-builder.form.slug')
name='slug'
disabled=f.model.id
}}

{{f.input
type='textarea'
label=(t 'caluma.form-builder.form.description')
name='description'
rows=4
}}

<div class="uk-text-right">
{{#if f.model.id}}
Expand All @@ -56,9 +41,10 @@
}}
{{/if}}

{{#f.submit data-test-submit disabled=(or f.loading f.model.isInvalid)}}
{{#if f.loading}}{{uk-spinner}}{{else}}{{t 'caluma.form-builder.global.save'}}{{/if}}
{{/f.submit}}
{{f.submit
disabled=(or f.loading f.model.isInvalid)
label=(t 'caluma.form-builder.global.save')
}}
</div>
{{/validated-form}}
{{/with}}
Expand Down
63 changes: 23 additions & 40 deletions addon/templates/components/cfb-form-editor/question.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -21,50 +21,33 @@
</div>
</div>

{{#f.input name='label' as |i|}}
<label class="uk-form-label uk-text-bold">{{t 'caluma.form-builder.question.label'}}</label>
<input
name={{i.name}}
class="uk-input {{i.class}}"
value={{i.value}}
onblur={{i.setDirty}}
oninput={{action i.update value='target.value'}}
>
{{/f.input}}
{{f.input
type='text'
label=(t 'caluma.form-builder.question.label')
name='label'
}}

{{#f.input name='slug' as |i|}}
<label class="uk-form-label uk-text-bold">{{t 'caluma.form-builder.question.slug'}}</label>
<input
type="text"
name={{i.name}}
class="uk-input {{i.class}}"
maxlength="50"
disabled={{f.model.id}}
value={{i.value}}
onblur={{i.setDirty}}
oninput={{action i.update value='target.value'}}
>
{{/f.input}}
{{f.input
type='text'
label=(t 'caluma.form-builder.question.slug')
name='slug'
disabled=f.model.id
}}

{{#f.input name='type' as |i|}}
<label class="uk-form-label uk-text-bold">{{t 'caluma.form-builder.question.type'}}</label>
<select
name={{i.name}}
class="uk-select"
onblur={{i.setDirty}}
onchange={{action i.update value='target.value'}}
>
<option disabled></option>
{{#each possibleTypes as |type|}}
<option value={{type}} selected={{eq type i.value}}>{{t (concat 'caluma.form-builder.question.types.' type)}}</option>
{{/each}}
</select>
{{/f.input}}
{{f.input
type='select'
options=possibleTypes
optionLabelPath='label'
optionTargetPath='value'
label=(t 'caluma.form-builder.question.type')
name='type'
}}

<div class="uk-text-right">
{{#f.submit data-test-submit disabled=(or f.loading f.model.isInvalid)}}
{{#if f.loading}}{{uk-spinner}}{{else}}{{t 'caluma.form-builder.global.save'}}{{/if}}
{{/f.submit}}
{{f.submit
disabled=(or f.loading f.model.isInvalid)
label=(t 'caluma.form-builder.global.save')
}}
</div>
{{/validated-form}}
{{/with}}
Expand Down
8 changes: 1 addition & 7 deletions config/environment.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,7 @@ module.exports = function(environment) {
environment,

"ember-validated-form": {
css: {
submit: "uk-button uk-button-primary",
group: "uk-margin",
help: "uk-text-danger uk-text-small",
error: "uk-form-danger",
valid: "uk-form-success"
}
theme: "uikit"
}
};

Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@
"ember-intl": "3.2.4",
"ember-test-selectors": "1.0.0",
"ember-uikit": "0.7.1",
"ember-validated-form": "1.4.2",
"ember-validated-form": "2.0.0-alpha.1",
"sass": "1.13.2",
"slugify": "1.3.1",
"uuid": "3.3.2"
Expand Down
2 changes: 1 addition & 1 deletion tests/acceptance/form-edit-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ module("Acceptance | form edit", function(hooks) {
"Some Random Description"
);

await click("[data-test-demo-content] [data-test-submit]");
await click("[data-test-demo-content] button[type=submit]");

assert.equal(currentURL(), "/demo/form-builder/test-form");
});
Expand Down
2 changes: 1 addition & 1 deletion tests/acceptance/form-new-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ module("Acceptance | form new", function(hooks) {
"Some Random Description"
);

await click("[data-test-demo-content] [data-test-submit]");
await click("[data-test-demo-content] button[type=submit]");

assert.equal(currentURL(), "/demo/form-builder/testy-test-test");
});
Expand Down
2 changes: 1 addition & 1 deletion tests/acceptance/question-edit-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ module("Acceptance | question edit", function(hooks) {
await fillIn("[data-test-demo-content] [name=label]", "Test Question 1?");
await fillIn("[data-test-demo-content] [name=type]", "NUMBER");

await click("[data-test-demo-content] [data-test-submit]");
await click("[data-test-demo-content] button[type=submit]");

assert.equal(currentURL(), "/demo/form-builder/test-form");
});
Expand Down
8 changes: 4 additions & 4 deletions tests/integration/components/cfb-form-editor/general-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ module("Integration | Component | cfb-form-editor/general", function(hooks) {

await fillIn("input[name=slug]", "form-slug");

await click("[data-test-submit]");
await click("button[type=submit]");

assert.verifySteps(["after-submit"]);
});
Expand All @@ -93,7 +93,7 @@ module("Integration | Component | cfb-form-editor/general", function(hooks) {
await fillIn("input[name=name]", "Test Name 1");
await fillIn("textarea[name=description]", "Test Description 1");

await click("[data-test-submit]");
await click("button[type=submit]");

assert.verifySteps(["after-submit"]);
});
Expand Down Expand Up @@ -138,14 +138,14 @@ module("Integration | Component | cfb-form-editor/general", function(hooks) {

this.server.post("/graphql", () => graphqlError("saveForm"), 200);
await click("[data-test-archive]");
await click("[data-test-submit]");
await click("button[type=submit]");

// new form
await render(
hbs`{{cfb-form-editor/general slug=null on-after-submit=(action afterSubmit)}}`
);
await fillIn("input[name=name]", "Test");
await click("[data-test-submit]");
await click("button[type=submit]");

assert.verifySteps([]);
});
Expand Down
6 changes: 3 additions & 3 deletions tests/integration/components/cfb-form-editor/question-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ module("Integration | Component | cfb-form-editor/question", function(hooks) {
await fillIn("[name=label]", "");
await blur("[name=label]");

assert.dom("[data-test-submit]").isDisabled();
assert.dom("button[type=submit]").isDisabled();
assert.dom("[name=label] + span").hasText("Label can't be blank");
});

Expand All @@ -67,7 +67,7 @@ module("Integration | Component | cfb-form-editor/question", function(hooks) {
await fillIn("[name=label]", "Test Label 1");
await fillIn("[name=type]", "NUMBER");

await click("[data-test-submit]");
await click("button[type=submit]");

assert.verifySteps(["after-submit"]);
});
Expand All @@ -88,7 +88,7 @@ module("Integration | Component | cfb-form-editor/question", function(hooks) {
);

this.server.post("/graphql", () => graphqlError("saveQuestion"), 200);
await click("[data-test-submit]");
await click("button[type=submit]");

assert.verifySteps([]);
});
Expand Down
12 changes: 7 additions & 5 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -5170,14 +5170,16 @@ [email protected]:
ember-toggle "^5.3.0"
uikit "^3.0.0-beta.38"

ember-validated-form@1.4.2:
version "1.4.2"
resolved "https://registry.yarnpkg.com/ember-validated-form/-/ember-validated-form-1.4.2.tgz#27847a2c19511990637da18469435a42ac67d393"
ember-validated-form@2.0.0-alpha.1:
version "2.0.0-alpha.1"
resolved "https://registry.yarnpkg.com/ember-validated-form/-/ember-validated-form-2.0.0-alpha.1.tgz#dfde93ab0f4d903a4c90c220ffc065b30b65315b"
dependencies:
ember-cli-babel "^6.6.0"
ember-cli-htmlbars "^2.0.1"
ember-auto-import "^1.2.13"
ember-cli-babel "^7.1.0"
ember-cli-htmlbars "^3.0.0"
ember-one-way-select "^4.0.0"
ember-truth-helpers "^2.0.0"
uuid "^3.3.2"

ember-validators@^1.0.0:
version "1.2.0"
Expand Down

0 comments on commit d020847

Please sign in to comment.