Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
Nicolas Frandeboeuf
kresus
Commits
d773ed8b
Commit
d773ed8b
authored
Jun 21, 2017
by
ZeHiro
Browse files
Migrate bank creation form to the foldable-panel component
parent
76ceaed9
Changes
1
Hide whitespace changes
Inline
Side-by-side
client/components/settings/bank-accesses/form.js
View file @
d773ed8b
...
...
@@ -6,6 +6,7 @@ import { get, actions } from '../../../store';
import
{
assert
,
translate
as
$t
}
from
'
../../../helpers
'
;
import
PasswordInput
from
'
../../ui/password-input
'
;
import
FoldablePanel
from
'
../../ui/foldable-panel
'
;
import
CustomBankField
from
'
./custom-bank-field
'
;
...
...
@@ -15,12 +16,10 @@ class NewBankForm extends React.Component {
this
.
state
=
{
selectedBankIndex
:
0
,
expanded
:
this
.
props
.
expanded
};
this
.
handleChangeBank
=
this
.
handleChangeBank
.
bind
(
this
);
this
.
handleSubmit
=
this
.
handleSubmit
.
bind
(
this
);
this
.
handleToggleExpand
=
this
.
handleToggleExpand
.
bind
(
this
);
this
.
handleReset
=
this
.
handleReset
.
bind
(
this
);
this
.
bankSelector
=
null
;
...
...
@@ -40,13 +39,6 @@ class NewBankForm extends React.Component {
event
.
target
.
reset
();
}
handleToggleExpand
()
{
this
.
setState
({
selectedBankIndex
:
0
,
expanded
:
!
this
.
state
.
expanded
});
}
handleChangeBank
(
event
)
{
let
uuid
=
event
.
target
.
value
;
let
selectedBankIndex
=
this
.
props
.
banks
.
findIndex
(
bank
=>
bank
.
uuid
===
uuid
);
...
...
@@ -81,38 +73,7 @@ class NewBankForm extends React.Component {
this
.
props
.
createAccess
(
uuid
,
login
,
password
,
customFields
);
}
renderHeader
(
body
)
{
let
expanded
=
this
.
state
.
expanded
;
return
(
<
div
className
=
"
top-panel panel panel-default
"
>
<
div
className
=
"
panel-heading clickable
"
onClick
=
{
this
.
handleToggleExpand
}
>
<
h3
className
=
"
title panel-title
"
>
{
$t
(
'
client.settings.new_bank_form_title
'
)
}
<
/h3
>
<
div
className
=
"
panel-options
"
>
<
span
className
=
{
`option-legend fa fa-
${
expanded
?
'
minus
'
:
'
plus
'
}
-square`
}
aria
-
label
=
"
add
"
title
=
{
$t
(
'
client.settings.add_bank_button
'
)
}
/
>
<
/div
>
<
/div
>
{
body
}
<
/div
>
);
}
render
()
{
let
expanded
=
this
.
state
.
expanded
;
if
(
!
expanded
)
{
return
this
.
renderHeader
(
<
div
className
=
"
transition-expand
"
/>
);
}
let
options
=
this
.
props
.
banks
.
map
(
bank
=>
(
<
option
...
...
@@ -153,8 +114,12 @@ class NewBankForm extends React.Component {
this
.
passwordInput
=
element
;
};
let
form
=
(
<
div
className
=
"
panel-body transition-expand
"
>
return
(
<
FoldablePanel
initiallyExpanded
=
{
this
.
props
.
expanded
}
title
=
{
$t
(
'
client.settings.new_bank_form_title
'
)
}
iconTitle
=
{
$t
(
'
client.settings.add_bank_button
'
)
}
top
=
{
true
}
>
<
form
onReset
=
{
this
.
handleReset
}
onSubmit
=
{
this
.
handleSubmit
}
>
...
...
@@ -214,10 +179,8 @@ class NewBankForm extends React.Component {
/
>
<
/div
>
<
/form
>
<
/
div
>
<
/
FoldablePanel
>
);
return
this
.
renderHeader
(
form
);
}
}
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment