From 79bc45984f9f49c251bcc4fc2a8a720a298c7463 Mon Sep 17 00:00:00 2001 From: Michael Date: Fri, 10 Aug 2018 14:02:19 +0200 Subject: [PATCH 01/10] moved the input of the team name into a form that validates the entered name --- .../admin/team/create_team_modal_view.js | 55 ++++++++++--------- 1 file changed, 28 insertions(+), 27 deletions(-) diff --git a/app/assets/javascripts/admin/team/create_team_modal_view.js b/app/assets/javascripts/admin/team/create_team_modal_view.js index aac2fafa507..e4348cca24b 100644 --- a/app/assets/javascripts/admin/team/create_team_modal_view.js +++ b/app/assets/javascripts/admin/team/create_team_modal_view.js @@ -1,27 +1,28 @@ // @flow import * as React from "react"; -import { Modal, Input, Button } from "antd"; +import { Modal, Input, Form } from "antd"; import { createTeam } from "admin/admin_rest_api"; +const FormItem = Form.Item; + type Props = { onOk: Function, onCancel: Function, isVisible: boolean, }; -type State = { - newTeamName: string, -}; - -class CreateTeamModalView extends React.PureComponent { +class CreateTeamModalForm extends React.PureComponent { state = { newTeamName: "", }; onOk = async () => { - if (this.state.newTeamName !== "") { + this.props.form.validateFields(async (err, values) => { + if (err) { + return; + } const newTeam = { - name: this.state.newTeamName, + name: values["Team Name"], roles: [{ name: "admin" }, { name: "user" }], }; @@ -31,7 +32,7 @@ class CreateTeamModalView extends React.PureComponent { }); this.props.onOk(team); - } + }); }; isInputValid(): boolean { @@ -39,31 +40,31 @@ class CreateTeamModalView extends React.PureComponent { } render() { + const { getFieldDecorator } = this.props.form; return ( - - - - } + onOk={this.onOk} > - ) => - this.setState({ newTeamName: event.target.value }) - } - icon="tag-o" - placeholder="Team Name" - autoFocus - /> +
+ + {getFieldDecorator("Team Name", { + rules: [ + { + required: true, + pattern: "^[A-Za-z0-9\\-_\\. ß]+$", + message: "Please enter a valide team name.", + }, + ], + })()} + +
); } } +const CreateTeamModalView = Form.create()(CreateTeamModalForm); export default CreateTeamModalView; From 0eab688bbfac6b65897ffca85845cce7e9147951 Mon Sep 17 00:00:00 2001 From: Michael Date: Fri, 10 Aug 2018 15:14:32 +0200 Subject: [PATCH 02/10] fixed flow errors --- .../admin/team/create_team_modal_view.js | 14 ++------------ 1 file changed, 2 insertions(+), 12 deletions(-) diff --git a/app/assets/javascripts/admin/team/create_team_modal_view.js b/app/assets/javascripts/admin/team/create_team_modal_view.js index e4348cca24b..2b65d387591 100644 --- a/app/assets/javascripts/admin/team/create_team_modal_view.js +++ b/app/assets/javascripts/admin/team/create_team_modal_view.js @@ -9,13 +9,10 @@ type Props = { onOk: Function, onCancel: Function, isVisible: boolean, + form: Object, }; -class CreateTeamModalForm extends React.PureComponent { - state = { - newTeamName: "", - }; - +class CreateTeamModalForm extends React.PureComponent { onOk = async () => { this.props.form.validateFields(async (err, values) => { if (err) { @@ -27,18 +24,11 @@ class CreateTeamModalForm extends React.PureComponent { }; const team = await createTeam(newTeam); - this.setState({ - newTeamName: "", - }); this.props.onOk(team); }); }; - isInputValid(): boolean { - return this.state.newTeamName !== ""; - } - render() { const { getFieldDecorator } = this.props.form; return ( From aa046ae78e49350a6cb9bdf2c37df30167592046 Mon Sep 17 00:00:00 2001 From: Michael Date: Fri, 10 Aug 2018 15:54:03 +0200 Subject: [PATCH 03/10] added changelog entry --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 22fee94cb74..6128d7e913a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,6 +23,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.md). - Added the possibility to copy volume tracings to own account - During the import of multiple NML files, the user can select an option to automatically create a group per file so that the imported trees are organized in a hierarchy. [#2908](https://github.com/scalableminds/webknossos/pull/2908) - Added functions to the front-end API to activate a tree and to change the color of a tree. [#2997](https://github.com/scalableminds/webknossos/pull/2997) +- When a new team is created invalid names will be directly marked in red [#2591](https://github.com/scalableminds/webknossos/issues/2591) - Comments can now contain references to nodes (`#`) or positions (`#()`). Clicking on such a reference activates the respective node or position and centers it. [#2950](https://github.com/scalableminds/webknossos/pull/2950) ### Changed From 2162f039d4018eed5b3134492843f2808c80c908 Mon Sep 17 00:00:00 2001 From: Michael Date: Mon, 13 Aug 2018 10:29:58 +0200 Subject: [PATCH 04/10] added regex matching to the check in the backend to the project name --- .../javascripts/admin/project/project_create_view.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/app/assets/javascripts/admin/project/project_create_view.js b/app/assets/javascripts/admin/project/project_create_view.js index 7a7b1a3dc25..df134521f7e 100644 --- a/app/assets/javascripts/admin/project/project_create_view.js +++ b/app/assets/javascripts/admin/project/project_create_view.js @@ -99,8 +99,14 @@ class ProjectCreateView extends React.PureComponent { rules: [ { required: true, + pattern: "^[a-zA-Z0-9_-]*$", + message: "invalide project name, there are no whitespaces allowed", + }, + { + min: 3, + required: true, + message: "project name must be at least 3 characters long", }, - { min: 3 }, ], })()} From aaccd7dd57323f9aee9586faa1d34685a7c897b0 Mon Sep 17 00:00:00 2001 From: Michael Date: Mon, 13 Aug 2018 10:54:15 +0200 Subject: [PATCH 05/10] updated changelog entry --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 6128d7e913a..afee94d47b2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,7 +23,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.md). - Added the possibility to copy volume tracings to own account - During the import of multiple NML files, the user can select an option to automatically create a group per file so that the imported trees are organized in a hierarchy. [#2908](https://github.com/scalableminds/webknossos/pull/2908) - Added functions to the front-end API to activate a tree and to change the color of a tree. [#2997](https://github.com/scalableminds/webknossos/pull/2997) -- When a new team is created invalid names will be directly marked in red [#2591](https://github.com/scalableminds/webknossos/issues/2591) +- When a new team or project is created invalid names will be directly marked in red. [#3034](https://github.com/scalableminds/webknossos/pull/3034) - Comments can now contain references to nodes (`#`) or positions (`#()`). Clicking on such a reference activates the respective node or position and centers it. [#2950](https://github.com/scalableminds/webknossos/pull/2950) ### Changed From ac4777572839ae4db0975248d38e3da6cf00d2ed Mon Sep 17 00:00:00 2001 From: Michael Date: Mon, 13 Aug 2018 11:03:44 +0200 Subject: [PATCH 06/10] changed messages displayed when the entered project name is invalid --- app/assets/javascripts/admin/project/project_create_view.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/admin/project/project_create_view.js b/app/assets/javascripts/admin/project/project_create_view.js index df134521f7e..211635052ea 100644 --- a/app/assets/javascripts/admin/project/project_create_view.js +++ b/app/assets/javascripts/admin/project/project_create_view.js @@ -100,12 +100,12 @@ class ProjectCreateView extends React.PureComponent { { required: true, pattern: "^[a-zA-Z0-9_-]*$", - message: "invalide project name, there are no whitespaces allowed", + message: "The project name must not contain whitespace.", }, { min: 3, required: true, - message: "project name must be at least 3 characters long", + message: "The project name must be at least 3 characters long.", }, ], })()} From 56614f42038c1a5d73dc0ae36284b695706a06ec Mon Sep 17 00:00:00 2001 From: Michael Date: Mon, 13 Aug 2018 11:09:52 +0200 Subject: [PATCH 07/10] changed naming of variables --- app/assets/javascripts/admin/team/create_team_modal_view.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/admin/team/create_team_modal_view.js b/app/assets/javascripts/admin/team/create_team_modal_view.js index 2b65d387591..9649c6f281a 100644 --- a/app/assets/javascripts/admin/team/create_team_modal_view.js +++ b/app/assets/javascripts/admin/team/create_team_modal_view.js @@ -19,7 +19,7 @@ class CreateTeamModalForm extends React.PureComponent { return; } const newTeam = { - name: values["Team Name"], + name: values.teamName, roles: [{ name: "admin" }, { name: "user" }], }; @@ -41,7 +41,7 @@ class CreateTeamModalForm extends React.PureComponent { >
- {getFieldDecorator("Team Name", { + {getFieldDecorator("teamName", { rules: [ { required: true, From 9331c6eda273347a3d876315adc904e482990916 Mon Sep 17 00:00:00 2001 From: Michael Date: Mon, 13 Aug 2018 13:35:14 +0200 Subject: [PATCH 08/10] corrected spelling mistake --- app/assets/javascripts/admin/team/create_team_modal_view.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/admin/team/create_team_modal_view.js b/app/assets/javascripts/admin/team/create_team_modal_view.js index 9649c6f281a..306af81ee1a 100644 --- a/app/assets/javascripts/admin/team/create_team_modal_view.js +++ b/app/assets/javascripts/admin/team/create_team_modal_view.js @@ -46,7 +46,7 @@ class CreateTeamModalForm extends React.PureComponent { { required: true, pattern: "^[A-Za-z0-9\\-_\\. ß]+$", - message: "Please enter a valide team name.", + message: "Please enter a valid team name.", }, ], })()} From 6d217573cf54e80aff0ebdc35b130a81e695ade8 Mon Sep 17 00:00:00 2001 From: Philipp Otto Date: Mon, 13 Aug 2018 14:41:50 +0200 Subject: [PATCH 09/10] update changelog --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index afee94d47b2..8a474bca732 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,7 +23,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.md). - Added the possibility to copy volume tracings to own account - During the import of multiple NML files, the user can select an option to automatically create a group per file so that the imported trees are organized in a hierarchy. [#2908](https://github.com/scalableminds/webknossos/pull/2908) - Added functions to the front-end API to activate a tree and to change the color of a tree. [#2997](https://github.com/scalableminds/webknossos/pull/2997) -- When a new team or project is created invalid names will be directly marked in red. [#3034](https://github.com/scalableminds/webknossos/pull/3034) +- When a new team or project is created, invalid names will be directly marked in red. [#3034](https://github.com/scalableminds/webknossos/pull/3034) - Comments can now contain references to nodes (`#`) or positions (`#()`). Clicking on such a reference activates the respective node or position and centers it. [#2950](https://github.com/scalableminds/webknossos/pull/2950) ### Changed From ee4403d60cc5a68f5fe17d87d352e8aee13a4bdc Mon Sep 17 00:00:00 2001 From: Philipp Otto Date: Mon, 13 Aug 2018 14:51:29 +0200 Subject: [PATCH 10/10] fine-tune validation messages in team/project creation forms --- app/assets/javascripts/admin/project/project_create_view.js | 2 +- app/assets/javascripts/admin/team/create_team_modal_view.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/admin/project/project_create_view.js b/app/assets/javascripts/admin/project/project_create_view.js index 211635052ea..9be4d404e95 100644 --- a/app/assets/javascripts/admin/project/project_create_view.js +++ b/app/assets/javascripts/admin/project/project_create_view.js @@ -100,7 +100,7 @@ class ProjectCreateView extends React.PureComponent { { required: true, pattern: "^[a-zA-Z0-9_-]*$", - message: "The project name must not contain whitespace.", + message: "The project name must not contain whitespace or special characters.", }, { min: 3, diff --git a/app/assets/javascripts/admin/team/create_team_modal_view.js b/app/assets/javascripts/admin/team/create_team_modal_view.js index 306af81ee1a..a9418fe037f 100644 --- a/app/assets/javascripts/admin/team/create_team_modal_view.js +++ b/app/assets/javascripts/admin/team/create_team_modal_view.js @@ -46,7 +46,7 @@ class CreateTeamModalForm extends React.PureComponent { { required: true, pattern: "^[A-Za-z0-9\\-_\\. ß]+$", - message: "Please enter a valid team name.", + message: "The team name must not contain any special characters.", }, ], })()}