Skip to content

Commit

Permalink
Improve auto-focusing new participant inputs for direct transaction
Browse files Browse the repository at this point in the history 
#181
  • Loading branch information
@xMartin
xMartin committed Nov 19, 2020
1 parent 6148f23 commit ea96be6
Show file tree
Hide file tree
Showing 4 changed files with 32 additions and 182 deletions.
76 changes: 0 additions & 76 deletions src/components/__snapshots__/directtransactioninput.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,25 +29,6 @@ exports[`renders empty 1`] = `
</select>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
<div
className="direct-transaction-amount"
>
Expand Down Expand Up @@ -92,25 +73,6 @@ exports[`renders empty 1`] = `
</select>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
</div>
`;

Expand Down Expand Up @@ -143,25 +105,6 @@ exports[`renders prefilled 1`] = `
</select>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
<div
className="direct-transaction-amount"
>
Expand Down Expand Up @@ -206,24 +149,5 @@ exports[`renders prefilled 1`] = `
</select>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
</div>
`;
40 changes: 2 additions & 38 deletions src/components/__snapshots__/editentry.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -153,6 +153,7 @@ exports[`renders empty form 1`] = `
className="form-row-input"
>
<input
autoFocus={true}
onChange={[Function]}
placeholder="Name …"
type="text"
Expand Down Expand Up @@ -210,6 +211,7 @@ exports[`renders empty form 1`] = `
className="form-row-input"
>
<input
autoFocus={true}
onChange={[Function]}
placeholder="Name …"
type="text"
Expand Down Expand Up @@ -552,25 +554,6 @@ exports[`renders prefilled form 1`] = `
/>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
<div
className="direct-transaction-amount"
>
Expand Down Expand Up @@ -608,25 +591,6 @@ exports[`renders prefilled form 1`] = `
/>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
</div>
</div>
<div
Expand Down
40 changes: 2 additions & 38 deletions src/components/__snapshots__/form.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,7 @@ exports[`renders empty form 1`] = `
className="form-row-input"
>
<input
autoFocus={true}
onChange={[Function]}
placeholder="Name …"
type="text"
Expand Down Expand Up @@ -172,6 +173,7 @@ exports[`renders empty form 1`] = `
className="form-row-input"
>
<input
autoFocus={true}
onChange={[Function]}
placeholder="Name …"
type="text"
Expand Down Expand Up @@ -400,25 +402,6 @@ exports[`renders prefilled form 1`] = `
</select>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
<div
className="direct-transaction-amount"
>
Expand Down Expand Up @@ -463,25 +446,6 @@ exports[`renders prefilled form 1`] = `
</select>
</div>
</div>
<div
className="form-row"
style={
Object {
"display": "none",
}
}
>
<div
className="form-row-input"
>
<input
onChange={[Function]}
placeholder="Name …"
type="text"
value=""
/>
</div>
</div>
</div>
</div>
<div
Expand Down
58 changes: 28 additions & 30 deletions src/components/directtransactioninput.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,23 +59,21 @@ const DirectTransactionInput: FunctionComponent<Props> = ({
</select>
</div>
</div>
<div
className="form-row"
style={
from === NEW_PARTICIPANT_OPTION ? undefined : { display: "none" }
}
>
<div className="form-row-input">
<input
type="text"
placeholder="Name …"
value={control(fromNew)}
onChange={(event: SyntheticEvent<HTMLInputElement>) =>
onChange("fromNew", event.currentTarget.value)
}
/>
{from === NEW_PARTICIPANT_OPTION && (
<div className="form-row">
<div className="form-row-input">
<input
type="text"
placeholder="Name …"
value={control(fromNew)}
onChange={(event: SyntheticEvent<HTMLInputElement>) =>
onChange("fromNew", event.currentTarget.value)
}
autoFocus={true}
/>
</div>
</div>
</div>
)}
<div className="direct-transaction-amount">
<svg height="16" width="16">
<path d="m15.511 8.5129c0-0.8974-1.0909-1.3404-1.7168-0.6973l-4.7832 4.7837v-11.573c0.019125-1.3523-2.0191-1.3523-2 0v11.572l-4.7832-4.7832c-0.94251-0.98163-2.3957 0.47155-1.4141 1.4141l6.49 6.4911c0.3878 0.387 1.0228 0.391 1.414 0l6.4903-6.4906c0.1935-0.1883 0.30268-0.4468 0.3027-0.7168z" />
Expand Down Expand Up @@ -109,21 +107,21 @@ const DirectTransactionInput: FunctionComponent<Props> = ({
</select>
</div>
</div>
<div
className="form-row"
style={to === NEW_PARTICIPANT_OPTION ? undefined : { display: "none" }}
>
<div className="form-row-input">
<input
type="text"
placeholder="Name …"
value={control(toNew)}
onChange={(event: SyntheticEvent<HTMLInputElement>) =>
onChange("toNew", event.currentTarget.value)
}
/>
{to === NEW_PARTICIPANT_OPTION && (
<div className="form-row">
<div className="form-row-input">
<input
type="text"
placeholder="Name …"
value={control(toNew)}
onChange={(event: SyntheticEvent<HTMLInputElement>) =>
onChange("toNew", event.currentTarget.value)
}
autoFocus={true}
/>
</div>
</div>
</div>
)}
</div>
);
};
Expand Down

0 comments on commit ea96be6

Please sign in to comment.