Docker/planka
Docker/planka
1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-29 18:19:46 +02:00
Code Issues Releases Activity

Add visibility toggle of password input. Closes #2

Browse source
This commit is contained in:
Maksim Eltyshev 2019-11-15 03:45:59 +05:00
parent 7a3805e64c
commit 390d96cc19
25 changed files with 111 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

5
client/src/components/AddUserPopup/AddUserPopup.jsx
View file

@ -5,10 +5,11 @@ import React, {
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Form, Message } from 'semantic-ui-react';
import { usePrevious } from '../../lib/hooks';
import { withPopup } from '../../lib/popup';
import { Input, Popup } from '../../lib/custom-ui';
import { useForm, usePrevious } from '../../hooks';
import { useForm } from '../../hooks';
import styles from './AddUserPopup.module.css';
@ -120,7 +121,7 @@ const AddUserPopup = React.memo(
onChange={handleFieldChange}
/>
<div className={styles.text}>{t('common.password')}</div>
<Input
<Input.Password
fluid
ref={passwordField}
name="password"

5
client/src/components/Board/AddList.jsx
View file

@ -4,10 +4,9 @@ import React, {
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Form, Input } from 'semantic-ui-react';
import { useDidUpdate, useToggle } from '../../lib/hooks';
import {
useClosableForm, useDidUpdate, useForm, useToggle,
} from '../../hooks';
import { useClosableForm, useForm } from '../../hooks';
import styles from './AddList.module.css';

3
client/src/components/Card/Tasks.jsx
View file

@ -2,8 +2,7 @@ import React, { useCallback } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { Progress } from 'semantic-ui-react';
import { useToggle } from '../../hooks';
import { useToggle } from '../../lib/hooks';
import styles from './Tasks.module.css';

3
client/src/components/CardModal/NameField.jsx
View file

@ -2,8 +2,9 @@ import React, { useCallback, useRef } from 'react';
import PropTypes from 'prop-types';
import TextareaAutosize from 'react-textarea-autosize';
import { TextArea } from 'semantic-ui-react';
import { useDidUpdate, usePrevious } from '../../lib/hooks';
import { useDidUpdate, useField, usePrevious } from '../../hooks';
import { useField } from '../../hooks';
import styles from './NameField.module.css';

5
client/src/components/CardModal/Tasks/Add.jsx
View file

@ -5,10 +5,9 @@ import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import TextareaAutosize from 'react-textarea-autosize';
import { Button, Form, TextArea } from 'semantic-ui-react';
import { useDidUpdate, useToggle } from '../../../lib/hooks';
import {
useClosableForm, useDidUpdate, useForm, useToggle,
} from '../../../hooks';
import { useClosableForm, useForm } from '../../../hooks';
import styles from './Add.module.css';

3
client/src/components/EditDueDateStep/EditDueDateStep.jsx
View file

@ -5,9 +5,10 @@ import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import DatePicker from 'react-datepicker';
import { Button, Form } from 'semantic-ui-react';
import { useDidUpdate, useToggle } from '../../lib/hooks';
import { Input, Popup } from '../../lib/custom-ui';
import { useDidUpdate, useForm, useToggle } from '../../hooks';
import { useForm } from '../../hooks';
import styles from './EditDueDateStep.module.css';

9
client/src/components/EditTimerStep/EditTimerStep.jsx
View file

@ -3,9 +3,10 @@ import React, { useCallback, useEffect, useRef } from 'react';
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Form } from 'semantic-ui-react';
import { useToggle } from '../../lib/hooks';
import { Input, Popup } from '../../lib/custom-ui';
import { useForm, useToggle } from '../../hooks';
import { useForm } from '../../hooks';
import {
createTimer, getTimerParts, startTimer, stopTimer, updateTimer,
} from '../../utils/timer';
@ -114,7 +115,7 @@ const EditTimerStep = React.memo(({
<div className={styles.fieldWrapper}>
<div className={styles.fieldBox}>
<div className={styles.text}>{t('common.hours')}</div>
<Input
<Input.Mask
ref={hoursField}
name="hours"
value={data.hours}
@ -126,7 +127,7 @@ const EditTimerStep = React.memo(({
</div>
<div className={styles.fieldBox}>
<div className={styles.text}>{t('common.minutes')}</div>
<Input
<Input.Mask
ref={minutesField}
name="minutes"
value={data.minutes}
@ -138,7 +139,7 @@ const EditTimerStep = React.memo(({
</div>
<div className={styles.fieldBox}>
<div className={styles.text}>{t('common.seconds')}</div>
<Input
<Input.Mask
ref={secondsField}
name="seconds"
value={data.seconds}

5
client/src/components/List/AddCard.jsx
View file

@ -5,10 +5,9 @@ import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import TextareaAutosize from 'react-textarea-autosize';
import { Button, Form, TextArea } from 'semantic-ui-react';
import { useDidUpdate, useToggle } from '../../lib/hooks';
import {
useClosableForm, useDidUpdate, useForm, useToggle,
} from '../../hooks';
import { useClosableForm, useForm } from '../../hooks';
import styles from './AddCard.module.css';

8
client/src/components/Login/Login.jsx
View file

@ -8,11 +8,10 @@ import isEmail from 'validator/lib/isEmail';
import {
Form, Grid, Header, Message,
} from 'semantic-ui-react';
import { useDidUpdate, usePrevious, useToggle } from '../../lib/hooks';
import { Input } from '../../lib/custom-ui';
import {
useDidUpdate, useForm, usePrevious, useToggle,
} from '../../hooks';
import { useForm } from '../../hooks';
import styles from './Login.module.css';
@ -156,10 +155,9 @@ const Login = React.memo(
</div>
<div className={styles.inputWrapper}>
<div className={styles.inputLabel}>{t('common.password')}</div>
<Input
<Input.Password
fluid
ref={passwordField}
type="password"
name="password"
value={data.password}
readOnly={isSubmitting}

2
client/src/components/Timer/Timer.jsx
View file

@ -1,8 +1,8 @@
import React, { useCallback, useEffect, useRef } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { useForceUpdate, usePrevious } from '../../lib/hooks';
import { useForceUpdate, usePrevious } from '../../hooks';
import { formatTimer } from '../../utils/timer';
import styles from './Timer.module.css';

8
client/src/components/UserPopup/EditEmailStep.jsx
View file

@ -5,11 +5,10 @@ import React, {
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Form, Message } from 'semantic-ui-react';
import { useDidUpdate, usePrevious, useToggle } from '../../lib/hooks';
import { Input, Popup } from '../../lib/custom-ui';
import {
useDidUpdate, useForm, usePrevious, useToggle,
} from '../../hooks';
import { useForm } from '../../hooks';
import styles from './EditNameStep.module.css';
@ -145,10 +144,9 @@ const EditEmailStep = React.memo(
{data.email.trim() !== email && (
<>
<div className={styles.text}>{t('common.currentPassword')}</div>
<Input
<Input.Password
fluid
ref={currentPasswordField}
type="password"
name="currentPassword"
value={data.currentPassword}
className={styles.field}

10
client/src/components/UserPopup/EditPasswordStep.jsx
View file

@ -4,11 +4,10 @@ import React, {
import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next';
import { Button, Form, Message } from 'semantic-ui-react';
import { useDidUpdate, usePrevious, useToggle } from '../../lib/hooks';
import { Input, Popup } from '../../lib/custom-ui';
import {
useDidUpdate, useForm, usePrevious, useToggle,
} from '../../hooks';
import { useForm } from '../../hooks';
import styles from './EditNameStep.module.css';
@ -107,7 +106,7 @@ const EditPasswordStep = React.memo(
)}
<Form onSubmit={handleSubmit}>
<div className={styles.text}>{t('common.newPassword')}</div>
<Input
<Input.Password
fluid
ref={passwordField}
name="password"
@ -116,10 +115,9 @@ const EditPasswordStep = React.memo(
onChange={handleFieldChange}
/>
<div className={styles.text}>{t('common.currentPassword')}</div>
<Input
<Input.Password
fluid
ref={currentPasswordField}
type="password"
name="currentPassword"
value={data.currentPassword}
className={styles.field}