1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-19 05:09:43 +02:00

ref: Little refactoring

This commit is contained in:
Maksim Eltyshev 2022-08-23 21:06:50 +02:00
parent c40709a509
commit ac64b28b69
8 changed files with 45 additions and 33 deletions

View file

@ -12,18 +12,18 @@ import styles from './BoardMembershipsStep.module.scss';
const BoardMembershipsStep = React.memo( const BoardMembershipsStep = React.memo(
({ items, currentUserIds, title, onUserSelect, onUserDeselect, onBack }) => { ({ items, currentUserIds, title, onUserSelect, onUserDeselect, onBack }) => {
const [t] = useTranslation(); const [t] = useTranslation();
const [searchValue, handleSearchFieldChange] = useField(''); const [search, handleSearchChange] = useField('');
const search = useMemo(() => searchValue.trim().toLowerCase(), [searchValue]); const cleanSearch = useMemo(() => search.trim().toLowerCase(), [search]);
const filteredItems = useMemo( const filteredItems = useMemo(
() => () =>
items.filter( items.filter(
({ user }) => ({ user }) =>
user.email.includes(search) || user.email.includes(cleanSearch) ||
user.name.toLowerCase().includes(search) || user.name.toLowerCase().includes(cleanSearch) ||
(user.username && user.username.includes(search)), (user.username && user.username.includes(cleanSearch)),
), ),
[items, search], [items, cleanSearch],
); );
const searchField = useRef(null); const searchField = useRef(null);
@ -48,15 +48,19 @@ const BoardMembershipsStep = React.memo(
return ( return (
<> <>
<Popup.Header onBack={onBack}>{t(title)}</Popup.Header> <Popup.Header onBack={onBack}>
{t(title, {
context: 'title',
})}
</Popup.Header>
<Popup.Content> <Popup.Content>
<Input <Input
fluid fluid
ref={searchField} ref={searchField}
value={searchValue} value={search}
placeholder={t('common.searchMembers')} placeholder={t('common.searchMembers')}
icon="search" icon="search"
onChange={handleSearchFieldChange} onChange={handleSearchChange}
/> />
{filteredItems.length > 0 && ( {filteredItems.length > 0 && (
<Menu secondary vertical className={styles.menu}> <Menu secondary vertical className={styles.menu}>

View file

@ -36,7 +36,7 @@ const CardMoveStep = React.memo(
[selectedBoard, path.listId], [selectedBoard, path.listId],
); );
const handleBoardIdFieldChange = useCallback( const handleBoardIdChange = useCallback(
(event, data) => { (event, data) => {
if (selectedProject.boards.find((board) => board.id === data.value).isFetching === null) { if (selectedProject.boards.find((board) => board.id === data.value).isFetching === null) {
onBoardFetch(data.value); onBoardFetch(data.value);
@ -102,7 +102,7 @@ const CardMoveStep = React.memo(
} }
disabled={selectedProject.boards.length === 0} disabled={selectedProject.boards.length === 0}
className={styles.field} className={styles.field}
onChange={handleBoardIdFieldChange} onChange={handleBoardIdChange}
/> />
</> </>
)} )}

View file

@ -74,7 +74,11 @@ const NotificationsStep = React.memo(({ items, onDelete, onClose }) => {
return ( return (
<> <>
<Popup.Header>{t('common.notifications')}</Popup.Header> <Popup.Header>
{t('common.notifications', {
context: 'title',
})}
</Popup.Header>
<Popup.Content> <Popup.Content>
{items.length > 0 {items.length > 0
? items.map((item) => ( ? items.map((item) => (

View file

@ -21,17 +21,17 @@ const LabelsStep = React.memo(
({ items, currentIds, title, onSelect, onDeselect, onCreate, onUpdate, onDelete, onBack }) => { ({ items, currentIds, title, onSelect, onDeselect, onCreate, onUpdate, onDelete, onBack }) => {
const [t] = useTranslation(); const [t] = useTranslation();
const [step, openStep, handleBack] = useSteps(); const [step, openStep, handleBack] = useSteps();
const [searchValue, handleSearchFieldChange] = useField(''); const [search, handleSearchChange] = useField('');
const search = useMemo(() => searchValue.trim().toLowerCase(), [searchValue]); const cleanSearch = useMemo(() => search.trim().toLowerCase(), [search]);
const filteredItems = useMemo( const filteredItems = useMemo(
() => () =>
items.filter( items.filter(
(label) => (label) =>
(label.name && label.name.toLowerCase().includes(search)) || (label.name && label.name.toLowerCase().includes(cleanSearch)) ||
label.color.includes(search), label.color.includes(cleanSearch),
), ),
[items, search], [items, cleanSearch],
); );
const searchField = useRef(null); const searchField = useRef(null);
@ -109,15 +109,19 @@ const LabelsStep = React.memo(
return ( return (
<> <>
<Popup.Header onBack={onBack}>{t(title)}</Popup.Header> <Popup.Header onBack={onBack}>
{t(title, {
context: 'title',
})}
</Popup.Header>
<Popup.Content> <Popup.Content>
<Input <Input
fluid fluid
ref={searchField} ref={searchField}
value={searchValue} value={search}
placeholder={t('common.searchLabels')} placeholder={t('common.searchLabels')}
icon="search" icon="search"
onChange={handleSearchFieldChange} onChange={handleSearchChange}
/> />
{filteredItems.length > 0 && ( {filteredItems.length > 0 && (
<div className={styles.items}> <div className={styles.items}>

View file

@ -17,18 +17,18 @@ const AddStep = React.memo(
({ users, currentUserIds, permissionsSelectStep, title, onCreate, onClose }) => { ({ users, currentUserIds, permissionsSelectStep, title, onCreate, onClose }) => {
const [t] = useTranslation(); const [t] = useTranslation();
const [step, openStep, handleBack] = useSteps(); const [step, openStep, handleBack] = useSteps();
const [searchValue, handleSearchFieldChange] = useField(''); const [search, handleSearchChange] = useField('');
const search = useMemo(() => searchValue.trim().toLowerCase(), [searchValue]); const cleanSearch = useMemo(() => search.trim().toLowerCase(), [search]);
const filteredUsers = useMemo( const filteredUsers = useMemo(
() => () =>
users.filter( users.filter(
(user) => (user) =>
user.email.includes(search) || user.email.includes(cleanSearch) ||
user.name.toLowerCase().includes(search) || user.name.toLowerCase().includes(cleanSearch) ||
(user.username && user.username.includes(search)), (user.username && user.username.includes(cleanSearch)),
), ),
[users, search], [users, cleanSearch],
); );
const searchField = useRef(null); const searchField = useRef(null);
@ -102,10 +102,10 @@ const AddStep = React.memo(
<Input <Input
fluid fluid
ref={searchField} ref={searchField}
value={searchValue} value={search}
placeholder={t('common.searchUsers')} placeholder={t('common.searchUsers')}
icon="search" icon="search"
onChange={handleSearchFieldChange} onChange={handleSearchChange}
/> />
{filteredUsers.length > 0 && ( {filteredUsers.length > 0 && (
<div className={styles.users}> <div className={styles.users}>

View file

@ -137,7 +137,7 @@ export default {
time: 'Время', time: 'Время',
timer: 'Таймер', timer: 'Таймер',
title: 'Название', title: 'Название',
userActions_title: 'Действия с пользователем', userActions: 'Действия с пользователем',
userAddedThisCardToList: '<0>{{user}}</0><1> добавил(а) эту карточку в {{list}}</1>', userAddedThisCardToList: '<0>{{user}}</0><1> добавил(а) эту карточку в {{list}}</1>',
userLeftNewCommentToCard: '{{user}} оставил(а) комментарий «{{comment}}» к <2>{{card}}</2>', userLeftNewCommentToCard: '{{user}} оставил(а) комментарий «{{comment}}» к <2>{{card}}</2>',
userMovedCardFromListToList: userMovedCardFromListToList:

View file

@ -1,11 +1,11 @@
module.exports.up = async (knex) => module.exports.up = (knex) =>
knex.schema.table('user_account', (table) => { knex.schema.table('user_account', (table) => {
/* Columns */ /* Columns */
table.text('language'); table.text('language');
}); });
module.exports.down = async (knex) => module.exports.down = (knex) =>
knex.schema.table('user_account', (table) => { knex.schema.table('user_account', (table) => {
table.dropColumn('language'); table.dropColumn('language');
}); });

View file

@ -1,11 +1,11 @@
module.exports.up = async (knex) => module.exports.up = (knex) =>
knex.schema.table('user_account', (table) => { knex.schema.table('user_account', (table) => {
/* Columns */ /* Columns */
table.timestamp('password_changed_at', true); table.timestamp('password_changed_at', true);
}); });
module.exports.down = async (knex) => module.exports.down = (knex) =>
knex.schema.table('user_account', (table) => { knex.schema.table('user_account', (table) => {
table.dropColumn('password_changed_at'); table.dropColumn('password_changed_at');
}); });