chore: Update version

Bumps [socket.io-parser](https://github.com/Automattic/socket.io-parser) from 3.3.3 to 3.3.4.
- [Release notes](https://github.com/Automattic/socket.io-parser/releases)
- [Changelog](https://github.com/socketio/socket.io-parser/blob/3.3.4/CHANGELOG.md)
- [Commits](https://github.com/Automattic/socket.io-parser/compare/3.3.3...3.3.4)

---
updated-dependencies:
- dependency-name: socket.io-parser
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

.husky/pre-commit

@@ -1 +1,2 @@
+#!/bin/sh
 npx lint-staged

charts/planka/Chart.yaml

@@ -15,13 +15,13 @@ type: application
 # This is the chart version. This version number should be incremented each time you make changes
 # to the chart and its templates, including the app version.
 # Versions are expected to follow Semantic Versioning (https://semver.org/)
-version: 0.2.5
+version: 0.2.6
 
 # This is the version number of the application being deployed. This version number should be
 # incremented each time you make changes to the application. Versions are not expected to
 # follow Semantic Versioning. They should reflect the version the application is using.
 # It is recommended to use it with quotes.
-appVersion: "1.20.1"
+appVersion: "1.21.0"
 
 dependencies:
   - alias: postgresql

client/.env

@@ -1 +1 @@
-REACT_APP_VERSION=1.20.1
+REACT_APP_VERSION=1.21.0

client/package-lock.json

@@ -24943,9 +24943,9 @@
       "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A=="
     },
     "node_modules/socket.io-parser": {
-      "version": "3.3.3",
+      "version": "3.3.4",
-      "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.3.3.tgz",
+      "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.3.4.tgz",
-      "integrity": "sha512-qOg87q1PMWWTeO01768Yh9ogn7chB9zkKtQnya41Y355S0UmpXgpcrFwAgjYJxu9BdKug5r5e9YtVSeWhKBUZg==",
+      "integrity": "sha512-z/pFQB3x+EZldRRzORYW1vwVO8m/3ILkswtnpoeU6Ve3cbMWkmHEWDAVJn4QJtchiiFTo5j7UG2QvwxvaA9vow==",
       "dependencies": {
         "component-emitter": "~1.3.0",
         "debug": "~3.1.0",

client/public/index.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"

client/src/components/Background/Background.module.scss

@@ -1,6 +1,8 @@
 :global(#app) {
   .wrapper {
     height: 100%;
+    max-height: 100vh;
+    max-width: 100vw;
     position: fixed;
     width: 100%;
     z-index: -1;

client/src/components/Board/Board.module.scss

@@ -48,16 +48,6 @@
     min-width: 100%;
   }
 
-  .panel {
-    align-items: center;
-    display: flex;
-    margin-bottom: 20px;
-  }
-
-  .panelItem {
-    margin-right: 20px;
-  }
-
   .wrapper {
     margin: 0 20px;
   }

client/src/components/BoardActions/BoardActions.module.scss

@@ -3,12 +3,13 @@
     align-items: center;
     display: flex;
     flex: 0 0 auto;
-    margin-right: 20px;
   }
 
   .actions {
     align-items: center;
     display: flex;
+    gap: 20px;
+    justify-content: flex-start;
     margin: 20px 20px;
   }
 

client/src/components/BoardActions/Filters.module.scss

@@ -50,6 +50,10 @@
     transition: width 0.2s ease;
     width: 280px;
 
+    @media only screen and (max-width: 797px) {
+      width: 220px;
+    }
+
     input {
       font-size: 13px;
     }

client/src/components/Card/Card.jsx

@@ -24,6 +24,7 @@ const Card = React.memo(
     index,
     name,
     dueDate,
+    isDueDateCompleted,
     stopwatch,
     coverUrl,
     boardId,
@@ -120,7 +121,7 @@ const Card = React.memo(
               )}
               {dueDate && (
                 <span className={classNames(styles.attachment, styles.attachmentLeft)}>
-                  <DueDate value={dueDate} size="tiny" />
+                  <DueDate value={dueDate} isCompleted={isDueDateCompleted} size="tiny" />
                 </span>
               )}
               {stopwatch && (
@@ -221,6 +222,7 @@ Card.propTypes = {
   index: PropTypes.number.isRequired,
   name: PropTypes.string.isRequired,
   dueDate: PropTypes.instanceOf(Date),
+  isDueDateCompleted: PropTypes.bool,
   stopwatch: PropTypes.object, // eslint-disable-line react/forbid-prop-types
   coverUrl: PropTypes.string,
   boardId: PropTypes.string.isRequired,
@@ -255,6 +257,7 @@ Card.propTypes = {
 
 Card.defaultProps = {
   dueDate: undefined,
+  isDueDateCompleted: undefined,
   stopwatch: undefined,
   coverUrl: undefined,
 };

client/src/components/Card/Card.module.scss

@@ -21,6 +21,14 @@
       background: #ebeef0;
       color: #516b7a;
     }
+
+    @media only screen and (max-width: 797px) {
+      &:focus,
+      &:active {
+        background: #ebeef0;
+        color: #516b7a;
+      }
+    }
   }
 
   .attachment {
@@ -55,6 +63,12 @@
     box-shadow: 0 1px 0 #ccc;
     position: relative;
 
+    @media only screen and (max-width: 797px) {
+      .target {
+        opacity: 1;
+      }
+    }
+
     &:hover {
       background: #f5f6f7;
       border-bottom-color: rgba(9, 30, 66, 0.25);

client/src/components/CardModal/CardModal.jsx

@@ -2,7 +2,7 @@ import React, { useCallback, useRef, useState } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
-import { Button, Grid, Icon, Modal } from 'semantic-ui-react';
+import { Button, Checkbox, Grid, Icon, Modal } from 'semantic-ui-react';
 import { usePopup } from '../../lib/popup';
 import { Markdown } from '../../lib/custom-ui';
 
@@ -32,6 +32,7 @@ const CardModal = React.memo(
     name,
     description,
     dueDate,
+    isDueDateCompleted,
     stopwatch,
     isSubscribed,
     isActivitiesFetching,
@@ -118,6 +119,12 @@ const CardModal = React.memo(
       [onUpdate],
     );
 
+    const handleDueDateCompletionChange = useCallback(() => {
+      onUpdate({
+        isDueDateCompleted: !isDueDateCompleted,
+      });
+    }, [isDueDateCompleted, onUpdate]);
+
     const handleStopwatchUpdate = useCallback(
       (newStopwatch) => {
         onUpdate({
@@ -300,13 +307,24 @@ const CardModal = React.memo(
                         context: 'title',
                       })}
                     </div>
-                    <span className={styles.attachment}>
+                    <span className={classNames(styles.attachment, styles.attachmentDueDate)}>
                       {canEdit ? (
-                        <DueDateEditPopup defaultValue={dueDate} onUpdate={handleDueDateUpdate}>
+                        <>
-                          <DueDate value={dueDate} />
+                          <Checkbox
-                        </DueDateEditPopup>
+                            checked={isDueDateCompleted}
+                            disabled={!canEdit}
+                            onChange={handleDueDateCompletionChange}
+                          />
+                          <DueDateEditPopup defaultValue={dueDate} onUpdate={handleDueDateUpdate}>
+                            <DueDate
+                              withStatusIcon
+                              value={dueDate}
+                              isCompleted={isDueDateCompleted}
+                            />
+                          </DueDateEditPopup>
+                        </>
                       ) : (
-                        <DueDate value={dueDate} />
+                        <DueDate withStatusIcon value={dueDate} isCompleted={isDueDateCompleted} />
                       )}
                     </span>
                   </div>
@@ -515,14 +533,19 @@ const CardModal = React.memo(
                   <Icon name="copy outline" className={styles.actionIcon} />
                   {t('action.duplicate')}
                 </Button>
-                <Button fluid className={styles.actionButton} onClick={handleCopyLinkClick}>
+                {window.isSecureContext && (
-                  <Icon name={isLinkCopied ? 'linkify' : 'unlink'} className={styles.actionIcon} />
+                  <Button fluid className={styles.actionButton} onClick={handleCopyLinkClick}>
-                  {isLinkCopied
+                    <Icon
-                    ? t('common.linkIsCopied')
+                      name={isLinkCopied ? 'linkify' : 'unlink'}
-                    : t('action.copyLink', {
+                      className={styles.actionIcon}
-                        context: 'title',
+                    />
-                      })}
+                    {isLinkCopied
-                </Button>
+                      ? t('common.linkIsCopied')
+                      : t('action.copyLink', {
+                          context: 'title',
+                        })}
+                  </Button>
+                )}
                 <DeletePopup
                   title="common.deleteCard"
                   content="common.areYouSureYouWantToDeleteThisCard"
@@ -557,6 +580,7 @@ CardModal.propTypes = {
   name: PropTypes.string.isRequired,
   description: PropTypes.string,
   dueDate: PropTypes.instanceOf(Date),
+  isDueDateCompleted: PropTypes.bool,
   stopwatch: PropTypes.object, // eslint-disable-line react/forbid-prop-types
   isSubscribed: PropTypes.bool.isRequired,
   isActivitiesFetching: PropTypes.bool.isRequired,
@@ -611,6 +635,7 @@ CardModal.propTypes = {
 CardModal.defaultProps = {
   description: undefined,
   dueDate: undefined,
+  isDueDateCompleted: false,
   stopwatch: undefined,
 };
 

client/src/components/CardModal/CardModal.module.scss

@@ -25,6 +25,15 @@
 
   .actions {
     margin-bottom: 24px;
+
+    @media only screen and (max-width: 797px) {
+      flex: 1;
+    }
+
+    @media only screen and (max-width: 425px) {
+      padding: 0;
+      width: 100%;
+    }
   }
 
   .actionsTitle {
@@ -49,6 +58,12 @@
     max-width: 100%;
   }
 
+  .attachmentDueDate {
+    align-items: center;
+    display: flex;
+    gap: 4px;
+  }
+
   .attachments {
     display: inline-block;
     margin: 0 8px 8px 0;
@@ -62,6 +77,11 @@
 
   .contentPadding {
     padding: 8px 8px 0 16px;
+
+    @media only screen and (max-width: 797px) {
+      padding-right: 16px;
+      width: 100% !important;
+    }
   }
 
   .cursorPointer {
@@ -154,6 +174,11 @@
 
   .modalPadding {
     padding: 0px;
+
+    @media only screen and (max-width: 797px) {
+      display: flex;
+      flex-flow: column nowrap;
+    }
   }
 
   .moduleHeader {
@@ -184,6 +209,15 @@
 
   .sidebarPadding {
     padding: 8px 16px 0 8px;
+
+    @media only screen and (max-width: 797px) {
+      align-items: flex-start;
+      display: flex;
+      flex-flow: row wrap;
+      gap: 10px;
+      padding-left: 16px;
+      width: 100% !important;
+    }
   }
 
   .text {

client/src/components/Core/Core.module.scss

@@ -4,6 +4,7 @@
     border-radius: 4px;
     bottom: 20px;
     box-shadow: #b04632 0 1px 0;
+    max-width: calc(100% - 40px);
     padding: 12px 18px;
     position: fixed;
     right: 20px;

client/src/components/DueDate/DueDate.jsx

@@ -1,8 +1,10 @@
 import upperFirst from 'lodash/upperFirst';
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
+import { Icon } from 'semantic-ui-react';
+import { useForceUpdate } from '../../lib/hooks';
 
 import getDateFormat from '../../utils/get-date-format';
 
@@ -14,6 +16,12 @@ const SIZES = {
   MEDIUM: 'medium',
 };
 
+const STATUSES = {
+  DUE_SOON: 'dueSoon',
+  OVERDUE: 'overdue',
+  COMPLETED: 'completed',
+};
+
 const LONG_DATE_FORMAT_BY_SIZE = {
   tiny: 'longDate',
   small: 'longDate',
@@ -26,8 +34,47 @@ const FULL_DATE_FORMAT_BY_SIZE = {
   medium: 'fullDateTime',
 };
 
-const DueDate = React.memo(({ value, size, isDisabled, onClick }) => {
+const STATUS_ICON_PROPS_BY_STATUS = {
+  [STATUSES.DUE_SOON]: {
+    name: 'hourglass half',
+    color: 'orange',
+  },
+  [STATUSES.OVERDUE]: {
+    name: 'hourglass end',
+    color: 'red',
+  },
+  [STATUSES.COMPLETED]: {
+    name: 'checkmark',
+    color: 'green',
+  },
+};
+
+const getStatus = (dateTime, isCompleted) => {
+  if (isCompleted) {
+    return STATUSES.COMPLETED;
+  }
+
+  const secondsLeft = Math.floor((dateTime.getTime() - new Date().getTime()) / 1000);
+
+  if (secondsLeft <= 0) {
+    return STATUSES.OVERDUE;
+  }
+
+  if (secondsLeft <= 24 * 60 * 60) {
+    return STATUSES.DUE_SOON;
+  }
+
+  return null;
+};
+
+const DueDate = React.memo(({ value, size, isCompleted, isDisabled, withStatusIcon, onClick }) => {
   const [t] = useTranslation();
+  const forceUpdate = useForceUpdate();
+
+  const statusRef = useRef(null);
+  statusRef.current = getStatus(value, isCompleted);
+
+  const intervalRef = useRef(null);
 
   const dateFormat = getDateFormat(
     value,
@@ -35,11 +82,34 @@ const DueDate = React.memo(({ value, size, isDisabled, onClick }) => {
     FULL_DATE_FORMAT_BY_SIZE[size],
   );
 
+  useEffect(() => {
+    if ([null, STATUSES.DUE_SOON].includes(statusRef.current)) {
+      intervalRef.current = setInterval(() => {
+        const status = getStatus(value, isCompleted);
+
+        if (status !== statusRef.current) {
+          forceUpdate();
+        }
+
+        if (status === STATUSES.OVERDUE) {
+          clearInterval(intervalRef.current);
+        }
+      }, 1000);
+    }
+
+    return () => {
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+      }
+    };
+  }, [value, isCompleted, forceUpdate]);
+
   const contentNode = (
     <span
       className={classNames(
         styles.wrapper,
         styles[`wrapper${upperFirst(size)}`],
+        !withStatusIcon && statusRef.current && styles[`wrapper${upperFirst(statusRef.current)}`],
         onClick && styles.wrapperHoverable,
       )}
     >
@@ -47,6 +117,10 @@ const DueDate = React.memo(({ value, size, isDisabled, onClick }) => {
         value,
         postProcess: 'formatDate',
       })}
+      {withStatusIcon && statusRef.current && (
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        <Icon {...STATUS_ICON_PROPS_BY_STATUS[statusRef.current]} className={styles.statusIcon} />
+      )}
     </span>
   );
 
@@ -62,14 +136,19 @@ const DueDate = React.memo(({ value, size, isDisabled, onClick }) => {
 DueDate.propTypes = {
   value: PropTypes.instanceOf(Date).isRequired,
   size: PropTypes.oneOf(Object.values(SIZES)),
+  isCompleted: PropTypes.bool.isRequired,
   isDisabled: PropTypes.bool,
+  withStatusIcon: PropTypes.bool,
   onClick: PropTypes.func,
+  onCompletionToggle: PropTypes.func,
 };
 
 DueDate.defaultProps = {
   size: SIZES.MEDIUM,
   isDisabled: false,
+  withStatusIcon: false,
   onClick: undefined,
+  onCompletionToggle: undefined,
 };
 
 export default DueDate;

client/src/components/DueDate/DueDate.module.scss

@@ -8,16 +8,17 @@
     padding: 0;
   }
 
+  .statusIcon {
+    line-height: 1;
+    margin: 0 0 0 8px;
+  }
+
   .wrapper {
     background: #dce0e4;
-    border: none;
     border-radius: 3px;
     color: #6a808b;
     display: inline-block;
-    outline: none;
-    text-align: left;
     transition: background 0.3s ease;
-    vertical-align: top;
   }
 
   .wrapperHoverable:hover {
@@ -43,4 +44,21 @@
     line-height: 20px;
     padding: 6px 12px;
   }
+
+  /* Statuses */
+
+  .wrapperDueSoon {
+    background: #f2711c;
+    color: #fff;
+  }
+
+  .wrapperOverdue {
+    background: #db2828;
+    color: #fff;
+  }
+
+  .wrapperCompleted {
+    background: #21ba45;
+    color: #fff;
+  }
 }

client/src/components/Fixed/Fixed.module.scss

@@ -1,5 +1,6 @@
 :global(#app) {
   .wrapper {
+    max-width: 100vw;
     position: fixed;
     width: 100%;
     z-index: 1;

client/src/components/Header/Header.module.scss

@@ -87,7 +87,12 @@
   }
 
   .userName {
+    display: none;
     margin-right: 10px;
+
+    @media only screen and (min-width: 797px) {
+      display: block;
+    }
   }
 
   .wrapper {

client/src/components/Label/Label.jsx

@@ -17,7 +17,7 @@ const SIZES = {
 
 const Label = React.memo(({ name, color, size, isDisabled, onClick }) => {
   const contentNode = (
-    <div
+    <span
       title={name}
       className={classNames(
         styles.wrapper,
@@ -28,7 +28,7 @@ const Label = React.memo(({ name, color, size, isDisabled, onClick }) => {
       )}
     >
       {name || '\u00A0'}
-    </div>
+    </span>
   );
 
   return onClick ? (

client/src/components/Label/Label.module.scss

@@ -11,17 +11,17 @@
 
   .wrapper {
     border-radius: 3px;
-    box-sizing: border-box;
     color: #fff;
+    display: inline-block;
     font-weight: 400;
-    outline: none;
     overflow: hidden;
     text-overflow: ellipsis;
     text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
+    vertical-align: top;
     white-space: nowrap;
   }
 
-  .wrapperNameless{
+  .wrapperNameless {
     width: 40px;
   }
 

client/src/components/List/List.module.scss

@@ -80,6 +80,12 @@
     &:hover .target {
       opacity: 1;
     }
+
+    @media only screen and (max-width: 797px) {
+      .target {
+        opacity: 1;
+      }
+    }
   }
 
   .headerEditable {
@@ -103,6 +109,14 @@
       background: rgba(9, 30, 66, 0.13);
       color: #516b7a;
     }
+
+    @media only screen and (max-width: 797px) {
+      &:focus,
+      &:active {
+        background: rgba(9, 30, 66, 0.13);
+        color: #516b7a;
+      }
+    }
   }
 
   .headerName {

client/src/components/Memberships/Memberships.module.scss

@@ -11,6 +11,10 @@
     vertical-align: top;
     width: 36px;
 
+    @media only screen and (max-width: 797px) {
+      margin-left: 10px;
+    }
+
     &:hover {
       background: rgba(0, 0, 0, 0.32);
     }

client/src/components/Stopwatch/Stopwatch.module.scss

@@ -10,13 +10,10 @@
 
   .wrapper {
     background: #dce0e4;
-    border: none;
     border-radius: 3px;
     color: #6a808b;
     display: inline-block;
     font-variant-numeric: tabular-nums;
-    outline: none;
-    text-align: left;
     transition: background 0.3s ease;
     vertical-align: top;
   }

client/src/components/User/User.module.scss

@@ -14,12 +14,10 @@
   }
 
   .wrapper {
-    border: none;
     border-radius: 50%;
     color: #fff;
     display: inline-block;
     line-height: 1;
-    outline: none;
     text-align: center;
     vertical-align: top;
   }

client/src/containers/CardContainer.js

@@ -20,10 +20,8 @@ const makeMapStateToProps = () => {
     const allLabels = selectors.selectLabelsForCurrentBoard(state);
     const currentUserMembership = selectors.selectCurrentUserMembershipForCurrentBoard(state);
 
-    const { name, dueDate, stopwatch, coverUrl, boardId, listId, isPersisted } = selectCardById(
+    const { name, dueDate, isDueDateCompleted, stopwatch, coverUrl, boardId, listId, isPersisted } =
-      state,
+      selectCardById(state, id);
-      id,
-    );
 
     const users = selectUsersByCardId(state, id);
     const labels = selectLabelsByCardId(state, id);
@@ -38,6 +36,7 @@ const makeMapStateToProps = () => {
       index,
       name,
       dueDate,
+      isDueDateCompleted,
       stopwatch,
       coverUrl,
       boardId,

client/src/containers/CardModalContainer.js

@@ -21,6 +21,7 @@ const mapStateToProps = (state) => {
     name,
     description,
     dueDate,
+    isDueDateCompleted,
     stopwatch,
     isSubscribed,
     isActivitiesFetching,
@@ -49,6 +50,7 @@ const mapStateToProps = (state) => {
     name,
     description,
     dueDate,
+    isDueDateCompleted,
     stopwatch,
     isSubscribed,
     isActivitiesFetching,

client/src/locales/ru-RU/core.js

@@ -55,7 +55,7 @@ export default {
       cardNotFound: 'Карточка не найдена',
       cardOrActionAreDeleted: 'Карточка или действие удалены.',
       color: 'Цвет',
-      connectionRestored: 'Соединение восстановлено',
+      copy_inline: 'копировать',
       createBoard: 'Создание доски',
       createLabel: 'Создание метки',
       createNewOneOrSelectExistingOne: 'Создайте новую или выберите<br />уже существующую.',
@@ -65,6 +65,7 @@ export default {
       dangerZone_title: 'Опасная зона',
       date: 'Дата',
       dueDate: 'Срок',
+      dueDate_title: 'Срок исполнения',
       deleteAttachment: 'Удаление вложения',
       deleteBoard: 'Удаление доски',
       deleteCard: 'Удаление карточки',
@@ -80,9 +81,8 @@ export default {
       editor: 'Редактор',
       editAttachment: 'Изменение вложения',
       editAvatar: 'Изменение аватара',
-      editBoard: 'Изменение доски',
+      editBoard_title: 'Изменение доски',
-      editBackground: 'Изменение фона',
+      editDueDate_title: 'Изменить срок выполнения',
-      editDueDate: 'Изменение срока',
       editEmail: 'Изменение e-mail',
       editInformation: 'Изменение информации',
       editLabel: 'Изменение метки',
@@ -90,10 +90,10 @@ export default {
       editPermissions: 'Редактирование разрешений',
       editStopwatch: 'Изменение секундомера',
       editTitle: 'Изменение названия',
-      editUsername: 'Изменение имени пользователя',
+      editUsername_title: 'Изменение имени пользователя',
       email: 'E-mail',
       emailAlreadyInUse: 'E-mail уже занят',
-      enterCardTitle: 'Введите заголовок для этой карточки...',
+      enterCardTitle: 'Введите заголовок для этой карточки...  [Ctrl+Enter] для применения',
       enterDescription: 'Введите описание...',
       enterFilename: 'Введите название файла',
       enterListTitle: 'Введите заголовок списка...',
@@ -110,14 +110,18 @@ export default {
       labels: 'Метки',
       language: 'Язык',
       leaveBoard: 'Покинуть доску',
-      leaveProject: 'Покинуть проект',
+      leaveProject_title: 'Покинуть проект',
+      linkIsCopied: 'Ссылка скопирована',
       list: 'Список',
-      listActions: 'Действия со списком',
+      listActions_title: 'Действия со списком',
       managers: 'Менеджеры',
+      managerActions_title: 'Действия Менеджера',
       members: 'Участники',
+      memberActions_title: 'Действия участников',
       minutes: 'Минуты',
-      moveCard: 'Перемещение карточки',
+      moveCard_title: 'Перемещение карточки',
       name: 'Имя',
+      newestFirst: 'Новые первые',
       newEmail: 'Новый e-mail',
       newPassword: 'Новый пароль',
       newUsername: 'Новое имя пользователя',
@@ -127,7 +131,8 @@ export default {
       noProjects: 'Проектов нет',
       notifications: 'Уведомления',
       noUnreadNotifications: 'Уведомлений нет.',
-      openBoard: 'Откройте доску',
+      oldestFirst: 'Старые первые',
+      openBoard_title: 'Откройте доску',
       optional_inline: 'необязательно',
       organization: 'Организация',
       phone: 'Телефон',
@@ -135,10 +140,9 @@ export default {
       pressPasteShortcutToAddAttachmentFromClipboard:
         'Совет: нажмите Ctrl-V (Cmd-V на Mac), чтобы добавить вложение из буфера обмена.',
       project: 'Проект',
-      projectActions: 'Действия с проектом',
+      projectNotFound_title: 'Проект не найден',
-      projectNotFound: 'Проект не найден',
+      removeManager_title: 'Удалить менеджера',
-      removeManager: 'Удалить менеджера',
+      removeMember_title: 'Удаление участника',
-      removeMember: 'Удаление участника',
       searchLabels: 'Поиск меток...',
       searchMembers: 'Поиск участников...',
       searchUsers: 'Поиск пользователей...',
@@ -149,14 +153,15 @@ export default {
       selectPermissions: 'Выбор разрешений',
       selectProject: 'Выберите проект',
       settings: 'Настройки',
+      sortList_title: 'Сортировка списка',
       stopwatch: 'Секундомер',
       subscribeToMyOwnCardsByDefault: 'По умолчанию подписываться на мои собственные карточки',
-      taskActions: 'Действия с задачей',
+      taskActions_title: 'Действия по задаче',
       tasks: 'Задачи',
       thereIsNoPreviewAvailableForThisAttachment: 'Предпросмотр для этого вложения недоступен.',
       time: 'Время',
       title: 'Название',
-      userActions: 'Действия с пользователем',
+      userActions_title: 'Действия с пользователем',
       userAddedThisCardToList: '<0>{{user}}</0><1> добавил(а) эту карточку в {{list}}</1>',
       userLeftNewCommentToCard: '{{user}} оставил(а) комментарий «{{comment}}» к <2>{{card}}</2>',
       userMovedCardFromListToList:
@@ -175,7 +180,7 @@ export default {
       addAnotherCard: 'Добавить еще одну карточку',
       addAnotherList: 'Добавить еще один список',
       addAnotherTask: 'Добавить еще одну задачу',
-      addCard: 'Добавить карточку',
+      addCard_title: 'Добавить карточку',
       addComment: 'Добавить комментарий',
       addList: 'Добавить список',
       addMember: 'Добавить участника',
@@ -183,6 +188,7 @@ export default {
       addTask: 'Добавить задачу',
       addToCard: 'Добавить на карточку',
       addUser: 'Добавить пользователя',
+      copyLink_title: 'Копировать ссылку',
       createBoard: 'Создать доску',
       createFile: 'Создать файл',
       createLabel: 'Создать метку',
@@ -193,38 +199,41 @@ export default {
       deleteAvatar: 'Удалить аватар',
       deleteBoard: 'Удалить доску',
       deleteCard: 'Удалить карточку',
+      deleteCard_title: 'Удалить карточку',
       deleteComment: 'Удалить комментарий',
       deleteImage: 'Удалить изображение',
       deleteLabel: 'Удалить метку',
       deleteList: 'Удалить список',
+      deleteList_title: 'Удалить список',
       deleteProject: 'Удалить проект',
+      deleteProject_title: 'Удалить проект',
       deleteTask: 'Удалить задачу',
+      deleteTask_title: 'Удалить задачу',
       deleteUser: 'Удалить пользователя',
       duplicate: 'Дублировать',
       duplicateCard_title: 'Дублировать карточку',
       edit: 'Изменить',
       editBackground: 'Изменить фон',
-      editDueDate: 'Изменить срок',
+      editDueDate_title: 'Изменить срок',
-      editDescription: 'Изменить описание',
+      editDescription_title: 'Изменить описание',
-      editEmail: 'Изменить e-mail',
+      editEmail_title: 'Изменить e-mail',
-      editInformation: 'Изменить информацию',
+      editInformation_title: 'Изменить информацию',
-      editPassword: 'Изменить пароль',
+      editPassword_title: 'Изменить пароль',
       editPermissions: 'Изменить разрешения',
-      editStopwatch: 'Изменить секундомер',
+      editStopwatch_title: 'Изменить секундомер',
-      editTask: 'Изменить задачу',
+      editTitle_title: 'Изменить название',
-      editTitle: 'Изменить название',
+      editUsername_title: 'Изменить имя пользователя',
-      editUsername: 'Изменить имя пользователя',
       hideDetails: 'Скрыть подробности',
       import: 'Импорт',
       leaveBoard: 'Покинуть доску',
       leaveProject: 'Покинуть проект',
-      logOut: 'Выйти',
+      logOut_title: 'Выйти',
-      makeCover: 'Сделать обложкой',
+      makeCover_title: 'Сделать обложкой',
       move: 'Переместить',
-      moveCard: 'Переместить карточку',
+      moveCard_title: 'Переместить карточку',
       remove: 'Убрать',
       removeBackground: 'Убрать фон',
-      removeCover: 'Убрать обложку',
+      removeCover_title: 'Убрать обложку',
       removeFromBoard: 'Удалить из доски',
       removeFromProject: 'Удалить из проекта',
       removeManager: 'Удалить менеджера',

client/src/locales/ru-RU/login.js

@@ -6,15 +6,17 @@ export default {
       invalidPassword: 'Неверный пароль',
       logInToPlanka: 'Вход в Planka',
       noInternetConnection: 'Нет соединения',
-      pageNotFound: 'Страница не найдена',
+      pageNotFound_title: 'Страница не найдена',
       password: 'Пароль',
       projectManagement: 'Управление проектами',
       serverConnectionFailed: 'Не могу подключиться к серверу',
       unknownError: 'Что-то пошло не так, попробуйте позже',
+      useSingleSignOn: 'Используйте единый вход',
     },
 
     action: {
       logIn: 'Войти',
+      logInWithSSO: 'Войти с помощью единого входа',
     },
   },
 };

client/src/models/Card.js

@@ -20,6 +20,7 @@ export default class extends BaseModel {
       relatedName: 'ownCards',
     }),
     dueDate: attr(),
+    isDueDateCompleted: attr(),
     stopwatch: attr(),
     isSubscribed: attr({
       getDefault: () => false,
@@ -208,7 +209,16 @@ export default class extends BaseModel {
         if (payload.data.boardId && payload.data.boardId !== cardModel.boardId) {
           cardModel.deleteWithRelated();
         } else {
-          cardModel.update(payload.data);
+          cardModel.update({
+            ...payload.data,
+            ...(payload.data.dueDate === null && {
+              isDueDateCompleted: null,
+            }),
+            ...(payload.data.dueDate &&
+              !cardModel.dueDate && {
+                isDueDateCompleted: false,
+              }),
+          });
         }
 
         break;
@@ -248,6 +258,7 @@ export default class extends BaseModel {
             'name',
             'description',
             'dueDate',
+            'isDueDateCompleted',
             'stopwatch',
           ]),
           ...payload.card,

docker-compose-dev.yml

@@ -117,7 +117,7 @@ services:
       - "5432:5432"
     restart: unless-stopped
     healthcheck:
-      test: ["CMD-SHELL", "pg_isready -U postgres -d planka"]
+      test: ["CMD-SHELL", "pg_isready -U user -d planka_db"]
       interval: 10s
       timeout: 5s
       retries: 5

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "planka",
-  "version": "1.20.1",
+  "version": "1.21.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "planka",
-      "version": "1.20.1",
+      "version": "1.21.0",
       "hasInstallScript": true,
       "license": "AGPL-3.0",
       "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "planka",
-  "version": "1.20.1",
+  "version": "1.21.0",
   "private": true,
   "homepage": "https://plankanban.github.io/planka",
   "repository": {

server/api/controllers/cards/create.js

@@ -56,6 +56,11 @@ module.exports = {
     dueDate: {
       type: 'string',
       custom: dueDateValidator,
+      allowNull: true,
+    },
+    isDueDateCompleted: {
+      type: 'boolean',
+      allowNull: true,
     },
     stopwatch: {
       type: 'json',
@@ -95,7 +100,14 @@ module.exports = {
       throw Errors.NOT_ENOUGH_RIGHTS;
     }
 
-    const values = _.pick(inputs, ['position', 'name', 'description', 'dueDate', 'stopwatch']);
+    const values = _.pick(inputs, [
+      'position',
+      'name',
+      'description',
+      'dueDate',
+      'isDueDateCompleted',
+      'stopwatch',
+    ]);
 
     const card = await sails.helpers.cards.createOne
       .with({

server/api/controllers/cards/update.js

@@ -80,6 +80,10 @@ module.exports = {
       custom: dueDateValidator,
       allowNull: true,
     },
+    isDueDateCompleted: {
+      type: 'boolean',
+      allowNull: true,
+    },
     stopwatch: {
       type: 'json',
       custom: stopwatchValidator,
@@ -173,6 +177,7 @@ module.exports = {
       'name',
       'description',
       'dueDate',
+      'isDueDateCompleted',
       'stopwatch',
       'isSubscribed',
     ]);

server/api/helpers/cards/create-one.js

@@ -49,6 +49,14 @@ module.exports = {
       throw 'positionMustBeInValues';
     }
 
+    if (values.dueDate) {
+      if (_.isNil(values.isDueDateCompleted)) {
+        values.isDueDateCompleted = false;
+      }
+    } else {
+      delete values.isDueDateCompleted;
+    }
+
     const cards = await sails.helpers.lists.getCards(values.list.id);
 
     const { position, repositions } = sails.helpers.utils.insertToPositionables(

server/api/helpers/cards/duplicate-one.js

@@ -77,6 +77,7 @@ module.exports = {
         'name',
         'description',
         'dueDate',
+        'isDueDateCompleted',
         'stopwatch',
       ]),
       ...values,

server/api/helpers/cards/update-one.js

@@ -135,6 +135,20 @@ module.exports = {
       });
     }
 
+    const dueDate = _.isUndefined(values.dueDate) ? inputs.record.dueDate : values.dueDate;
+
+    if (dueDate) {
+      const isDueDateCompleted = _.isUndefined(values.isDueDateCompleted)
+        ? inputs.record.isDueDateCompleted
+        : values.isDueDateCompleted;
+
+      if (_.isNull(isDueDateCompleted)) {
+        values.isDueDateCompleted = false;
+      }
+    } else {
+      values.isDueDateCompleted = null;
+    }
+
     let card;
     if (_.isEmpty(values)) {
       card = inputs.record;

server/api/models/Card.js

@@ -28,6 +28,11 @@ module.exports = {
       type: 'ref',
       columnName: 'due_date',
     },
+    isDueDateCompleted: {
+      type: 'boolean',
+      allowNull: true,
+      columnName: 'is_due_date_completed',
+    },
     stopwatch: {
       type: 'json',
     },

server/db/migrations/20240812065305_make_due_date_toggleable.js

@@ -0,0 +1,18 @@
+module.exports.up = async (knex) => {
+  await knex.schema.table('card', (table) => {
+    /* Columns */
+
+    table.boolean('is_due_date_completed');
+  });
+
+  return knex('card')
+    .update({
+      isDueDateCompleted: false,
+    })
+    .whereNotNull('due_date');
+};
+
+module.exports.down = (knex) =>
+  knex.schema.table('card', (table) => {
+    table.dropColumn('is_due_date_completed');
+  });