cover.jpg changed for finalblast CI

Closes #884

.husky/pre-commit

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

README.md

@@ -1,7 +1,7 @@
 # Planka
 #### Elegant open source project tracking.
 
-![David (path)](https://img.shields.io/github/package-json/v/plankanban/planka) ![Docker Pulls](https://img.shields.io/docker/pulls/meltyshev/planka) ![GitHub](https://img.shields.io/github/license/plankanban/planka)
+![David (path)](https://img.shields.io/github/package-json/v/plankanban/planka) ![Docker Pulls](https://img.shields.io/badge/docker_pulls-4M%2B-%23066da5) ![GitHub](https://img.shields.io/github/license/plankanban/planka)
 
 ![](https://raw.githubusercontent.com/plankanban/planka/master/demo.gif)
 

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.1.35
+version: 0.2.8
 
 # 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.18.1"
+appVersion: "1.22.0"
 
 dependencies:
   - alias: postgresql

charts/planka/templates/deployment.yaml

@@ -11,6 +11,10 @@ spec:
   selector:
     matchLabels:
       {{- include "planka.selectorLabels" . | nindent 6 }}
+  {{- if .Values.persistence.enabled }}
+  strategy:
+    type: Recreate
+  {{- end }}
   template:
     metadata:
       {{- with .Values.podAnnotations }}
@@ -90,17 +94,37 @@ spec:
               value: http://localhost:3000
               {{- end }}
             - name: SECRET_KEY
+              {{- if .Values.existingSecretkeySecret }}
+              valueFrom:
+                secretKeyRef:
+                  name: {{ .Values.existingSecretkeySecret }}
+                  key: key
+              {{- else }}
               value: {{ required "A secret key needs to be generated using 'openssl rand -hex 64' and assigned to secretkey." .Values.secretkey }}
+              {{- end }}
             - name: TRUST_PROXY
               value: "0"
             - name: DEFAULT_ADMIN_EMAIL
               value: {{ .Values.admin_email }}
-            - name: DEFAULT_ADMIN_PASSWORD
-              value: {{ .Values.admin_password }}
             - name: DEFAULT_ADMIN_NAME
               value: {{ .Values.admin_name }}
+            {{- if .Values.existingAdminCredsSecret }}
+            - name: DEFAULT_ADMIN_USERNAME
+              valueFrom:
+                secretKeyRef:
+                  name: {{ .Values.existingAdminCredsSecret }}
+                  key: username
+            - name: DEFAULT_ADMIN_PASSWORD
+              valueFrom:
+                secretKeyRef:
+                  name: {{ .Values.existingAdminCredsSecret }}
+                  key: password
+            {{- else }}
             - name: DEFAULT_ADMIN_USERNAME
               value: {{ .Values.admin_username }}
+            - name: DEFAULT_ADMIN_PASSWORD
+              value: {{ .Values.admin_password }}
+            {{- end }}
           {{ range $k, $v := .Values.env }}
             - name: {{ $k | quote }}
               value: {{ $v | quote }}

charts/planka/values.yaml

@@ -17,6 +17,16 @@ fullnameOverride: ""
 # Generate a secret using openssl rand -base64 45
 secretkey: ""
 
+## @param existingSecretkeySecret Name of an existing secret containing the session key string
+## NOTE: Must contain key `key`
+## NOTE: When it's set, the secretkey parameter is ignored
+existingSecretkeySecret: ""
+
+## @param existingAdminCredsSecret Name of an existing secret containing the admin username and password
+## NOTE: Must contain keys `username` and `password`
+## NOTE: When it's set, the `admin_username` and `admin_password` parameters are ignored
+existingAdminCredsSecret: ""
+
 # Base url for Planka. Will override `ingress.hosts[0].host`
 # Defaults to `http://localhost:3000` if ingress is disabled.
 baseUrl: ""

client/.env

@@ -1 +0,0 @@
-REACT_APP_VERSION=1.18.1

client/package.json

@@ -65,7 +65,7 @@
     "dequal": "^2.0.3",
     "easymde": "^2.18.0",
     "history": "^5.3.0",
-    "i18next": "^23.11.5",
+    "i18next": "^23.15.1",
     "i18next-browser-languagedetector": "^8.0.0",
     "initials": "^3.1.2",
     "js-cookie": "^3.0.5",
@@ -77,18 +77,18 @@
     "node-sass": "^9.0.0",
     "photoswipe": "^5.4.4",
     "prop-types": "^15.8.1",
-    "react": "^18.2.0",
+    "react": "18.2.0",
     "react-app-rewired": "^2.2.1",
     "react-beautiful-dnd": "^13.1.1",
     "react-datepicker": "^4.25.0",
-    "react-dom": "^18.2.0",
+    "react-dom": "18.2.0",
     "react-dropzone": "^14.2.3",
-    "react-i18next": "^14.1.2",
+    "react-i18next": "^15.0.2",
     "react-input-mask": "^2.0.4",
     "react-markdown": "^8.0.7",
     "react-photoswipe-gallery": "^2.2.7",
     "react-redux": "^8.1.3",
-    "react-router-dom": "^6.23.1",
+    "react-router-dom": "^6.26.2",
     "react-scripts": "5.0.1",
     "react-simplemde-editor": "^5.2.0",
     "react-textarea-autosize": "^8.5.3",
@@ -107,17 +107,18 @@
     "zxcvbn": "^4.4.2"
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^6.4.5",
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@testing-library/jest-dom": "^6.5.0",
     "@testing-library/react": "^15.0.7",
     "@testing-library/user-event": "^14.5.2",
     "babel-preset-airbnb": "^5.0.0",
-    "chai": "^4.4.1",
+    "chai": "^4.5.0",
     "eslint": "^8.57.0",
     "eslint-config-airbnb": "^19.0.4",
-    "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-jsx-a11y": "^6.8.0",
-    "eslint-plugin-react": "^7.34.2",
+    "eslint-plugin-import": "^2.30.0",
+    "eslint-plugin-jsx-a11y": "^6.10.0",
+    "eslint-plugin-react": "^7.36.1",
     "eslint-plugin-react-hooks": "^4.6.2",
-    "react-test-renderer": "^18.2.0"
+    "react-test-renderer": "18.2.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/actions/cards.js

@@ -57,10 +57,15 @@ updateCard.failure = (id, error) => ({
   },
 });
 
-const handleCardUpdate = (card) => ({
+const handleCardUpdate = (card, isFetched, cardMemberships, cardLabels, tasks, attachments) => ({
   type: ActionTypes.CARD_UPDATE_HANDLE,
   payload: {
     card,
+    isFetched,
+    cardMemberships,
+    cardLabels,
+    tasks,
+    attachments,
   },
 });
 

client/src/api/access-tokens.js

@@ -1,15 +1,14 @@
 import http from './http';
-import socket from './socket';
 
 /* Actions */
 
-const createAccessToken = (data, headers) => http.post('/access-tokens', data, headers);
+const createAccessToken = (data, headers) =>
+  http.post('/access-tokens?withHttpOnlyToken=true', data, headers);
 
 const exchangeForAccessTokenUsingOidc = (data, headers) =>
-  http.post('/access-tokens/exchange-using-oidc', data, headers);
+  http.post('/access-tokens/exchange-using-oidc?withHttpOnlyToken=true', data, headers);
 
-const deleteCurrentAccessToken = (headers) =>
-  socket.delete('/access-tokens/me', undefined, headers);
+const deleteCurrentAccessToken = (headers) => http.delete('/access-tokens/me', undefined, headers);
 
 export default {
   createAccessToken,

client/src/api/http.js

@@ -5,7 +5,7 @@ import Config from '../constants/Config';
 const http = {};
 
 // TODO: add all methods
-['GET', 'POST'].forEach((method) => {
+['GET', 'POST', 'DELETE'].forEach((method) => {
   http[method.toLowerCase()] = (url, data, headers) => {
     const formData =
       data &&
@@ -19,6 +19,7 @@ const http = {};
       method,
       headers,
       body: formData,
+      credentials: 'include',
     })
       .then((response) =>
         response.json().then((body) => ({

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/AttachmentAddZone/AttachmentAddZone.module.scss

@@ -2,7 +2,7 @@
   .dropzone {
     background: white;
     font-size: 20px;
-    font-weight: 700;
+    font-weight: bold;
     height: 100%;
     line-height: 30px;
     opacity: 0.7;

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

@@ -16,7 +16,7 @@
   .contentError {
     color: #fff;
     font-size: 20px;
-    font-weight: 700;
+    font-weight: bold;
     height: 20px;
     width: 470px;
   }

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

@@ -35,7 +35,7 @@
     color: #5e6c84;
     display: block;
     font-size: 18px;
-    font-weight: 700;
+    font-weight: bold;
     height: 100%;
     line-height: 80px;
     overflow: hidden;
@@ -50,7 +50,7 @@
   .name {
     color: #17394d;
     font-size: 14px;
-    font-weight: 700;
+    font-weight: bold;
     line-height: 20px;
     word-wrap: break-word;
   }

client/src/components/CardModal/CardModal.jsx

@@ -1,8 +1,8 @@
-import React, { useCallback, useRef } from 'react';
+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,
@@ -81,6 +82,7 @@ const CardModal = React.memo(
     onClose,
   }) => {
     const [t] = useTranslation();
+    const [isLinkCopied, setIsLinkCopied] = useState(false);
 
     const isGalleryOpened = useRef(false);
 
@@ -117,6 +119,12 @@ const CardModal = React.memo(
       [onUpdate],
     );
 
+    const handleDueDateCompletionChange = useCallback(() => {
+      onUpdate({
+        isDueDateCompleted: !isDueDateCompleted,
+      });
+    }, [isDueDateCompleted, onUpdate]);
+
     const handleStopwatchUpdate = useCallback(
       (newStopwatch) => {
         onUpdate({
@@ -146,6 +154,14 @@ const CardModal = React.memo(
       onClose();
     }, [onDuplicate, onClose]);
 
+    const handleCopyLinkClick = useCallback(() => {
+      navigator.clipboard.writeText(window.location.href);
+      setIsLinkCopied(true);
+      setTimeout(() => {
+        setIsLinkCopied(false);
+      }, 5000);
+    }, []);
+
     const handleGalleryOpen = useCallback(() => {
       isGalleryOpened.current = true;
     }, []);
@@ -291,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} />
-                        </DueDateEditPopup>
+                        <>
+                          <Checkbox
+                            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>
@@ -506,6 +533,19 @@ const CardModal = React.memo(
                   <Icon name="copy outline" className={styles.actionIcon} />
                   {t('action.duplicate')}
                 </Button>
+                {window.isSecureContext && (
+                  <Button fluid className={styles.actionButton} onClick={handleCopyLinkClick}>
+                    <Icon
+                      name={isLinkCopied ? 'linkify' : 'unlink'}
+                      className={styles.actionIcon}
+                    />
+                    {isLinkCopied
+                      ? t('common.linkIsCopied')
+                      : t('action.copyLink', {
+                          context: 'title',
+                        })}
+                  </Button>
+                )}
                 <DeletePopup
                   title="common.deleteCard"
                   content="common.areYouSureYouWantToDeleteThisCard"
@@ -540,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,
@@ -594,6 +635,7 @@ CardModal.propTypes = {
 CardModal.defaultProps = {
   description: undefined,
   dueDate: undefined,
+  isDueDateCompleted: false,
   stopwatch: undefined,
 };
 

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

@@ -20,18 +20,26 @@
 
   .actionIcon {
     color: #17394d;
-    display: inline;
     margin-right: 8px;
   }
 
   .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 {
     color: #8c8c8c;
     font-size: 12px;
-    font-weight: 500;
+    font-weight: normal;
     letter-spacing: 0.04em;
     margin-top: 16px;
     text-transform: uppercase;
@@ -50,6 +58,12 @@
     max-width: 100%;
   }
 
+  .attachmentDueDate {
+    align-items: center;
+    display: flex;
+    gap: 4px;
+  }
+
   .attachments {
     display: inline-block;
     margin: 0 8px 8px 0;
@@ -63,6 +77,11 @@
 
   .contentPadding {
     padding: 8px 8px 0 16px;
+
+    @media only screen and (max-width: 797px) {
+      padding-right: 16px;
+      width: 100% !important;
+    }
   }
 
   .cursorPointer {
@@ -139,7 +158,7 @@
   .headerTitle {
     color: #17394d;
     font-size: 20px;
-    font-weight: 700;
+    font-weight: bold;
     line-height: 24px;
   }
 
@@ -155,6 +174,11 @@
 
   .modalPadding {
     padding: 0px;
+
+    @media only screen and (max-width: 797px) {
+      display: flex;
+      flex-flow: column nowrap;
+    }
   }
 
   .moduleHeader {
@@ -185,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/CardModal/NameField.module.scss

@@ -6,7 +6,7 @@
     box-shadow: none;
     color: #17394d;
     font-size: 20px;
-    font-weight: 700;
+    font-weight: bold;
     line-height: 24px;
     margin: -5px;
     overflow: hidden;

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;
-    font-weight: 400;
-    outline: none;
+    display: inline-block;
+    font-weight: normal;
     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,15 @@
       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/Login/Login.jsx

@@ -18,6 +18,11 @@ const createMessage = (error) => {
   }
 
   switch (error.message) {
+    case 'Invalid credentials':
+      return {
+        type: 'error',
+        content: 'common.invalidCredentials',
+      };
     case 'Invalid email or username':
       return {
         type: 'error',
@@ -116,6 +121,7 @@ const Login = React.memo(
     useEffect(() => {
       if (wasSubmitting && !isSubmitting && error) {
         switch (error.message) {
+          case 'Invalid credentials':
           case 'Invalid email or username':
             emailOrUsernameField.current.select();
 

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;
   }
@@ -32,7 +30,6 @@
 
   .wrapperTiny {
     font-size: 10px;
-    font-weight: 400;
     height: 24px;
     line-height: 20px;
     padding: 2px 0;
@@ -41,7 +38,6 @@
 
   .wrapperSmall {
     font-size: 12px;
-    font-weight: 400;
     height: 28px;
     padding: 8px 0;
     width: 28px;
@@ -49,7 +45,6 @@
 
   .wrapperMedium {
     font-size: 14px;
-    font-weight: 500;
     height: 32px;
     padding: 10px 0;
     width: 32px;
@@ -57,7 +52,6 @@
 
   .wrapperLarge {
     font-size: 14px;
-    font-weight: 500;
     height: 36px;
     padding: 12px 0 10px;
     width: 36px;
@@ -65,7 +59,6 @@
 
   .wrapperMassive {
     font-size: 36px;
-    font-weight: 500;
     height: 100px;
     padding: 32px 0 10px;
     width: 100px;

client/src/components/UserSettingsModal/AboutPane.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { Image, Tab } from 'semantic-ui-react';
 
-import Config from '../../constants/Config';
+import version from '../../version';
 
 import logo from '../../assets/images/logo.png';
 
@@ -15,7 +15,7 @@ const AboutPane = React.memo(() => {
     <Tab.Pane attached={false} className={styles.wrapper}>
       <Image centered src={logo} size="large" />
       <div className={styles.version}>
-        {t('common.version')} {Config.VERSION}
+        {t('common.version')} {version}
       </div>
     </Tab.Pane>
   );

client/src/constants/ActionTypes.js

@@ -195,9 +195,6 @@ export default {
   CARD_UPDATE__SUCCESS: 'CARD_UPDATE__SUCCESS',
   CARD_UPDATE__FAILURE: 'CARD_UPDATE__FAILURE',
   CARD_UPDATE_HANDLE: 'CARD_UPDATE_HANDLE',
-  CARD_TRANSFER: 'CARD_TRANSFER',
-  CARD_TRANSFER__SUCCESS: 'CARD_TRANSFER__SUCCESS',
-  CARD_TRANSFER__FAILURE: 'CARD_TRANSFER__FAILURE',
   CARD_DUPLICATE: 'CARD_DUPLICATE',
   CARD_DUPLICATE__SUCCESS: 'CARD_DUPLICATE__SUCCESS',
   CARD_DUPLICATE__FAILURE: 'CARD_DUPLICATE__FAILURE',

client/src/constants/Config.js

@@ -1,13 +1,12 @@
-const VERSION = process.env.REACT_APP_VERSION;
-
 const { BASE_URL } = window;
+
 const BASE_PATH = BASE_URL.replace(/^.*\/\/[^/]*(.*)[^?#]*.*$/, '$1');
 
 const SERVER_BASE_URL =
   process.env.REACT_APP_SERVER_BASE_URL ||
   (process.env.NODE_ENV === 'production' ? BASE_URL : 'http://localhost:1337');
-const SERVER_BASE_PATH = SERVER_BASE_URL.replace(/^.*\/\/[^/]*(.*)[^?#]*.*$/, '$1');
 
+const SERVER_BASE_PATH = SERVER_BASE_URL.replace(/^.*\/\/[^/]*(.*)[^?#]*.*$/, '$1');
 const SERVER_HOST_NAME = SERVER_BASE_URL.replace(/^(.*\/\/[^/?#]*).*$/, '$1');
 
 const ACCESS_TOKEN_KEY = 'accessToken';
@@ -18,7 +17,6 @@ const POSITION_GAP = 65535;
 const ACTIVITIES_LIMIT = 50;
 
 export default {
-  VERSION,
   BASE_PATH,
   SERVER_BASE_URL,
   SERVER_BASE_PATH,

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(
-      state,
-      id,
-    );
+    const { name, dueDate, isDueDateCompleted, stopwatch, coverUrl, boardId, listId, isPersisted } =
+      selectCardById(state, 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/containers/ProjectsContainer.js

@@ -6,12 +6,13 @@ import entryActions from '../entry-actions';
 import Projects from '../components/Projects';
 
 const mapStateToProps = (state) => {
+  const { allowAllToCreateProjects } = selectors.selectConfig(state);
   const { isAdmin } = selectors.selectCurrentUser(state);
   const projects = selectors.selectProjectsForCurrentUser(state);
 
   return {
     items: projects,
-    canAdd: isAdmin,
+    canAdd: allowAllToCreateProjects || isAdmin,
   };
 };
 

client/src/i18n.js

@@ -58,9 +58,9 @@ i18n
   .use(initReactI18next)
   .init({
     resources: embeddedLocales,
-    fallbackLng: 'en',
+    fallbackLng: 'en-US',
     supportedLngs: languages,
-    load: 'languageOnly',
+    load: 'currentOnly',
     interpolation: {
       escapeValue: false,
       format(value, format, language) {
@@ -80,7 +80,7 @@ i18n
   });
 
 i18n.loadCoreLocale = async (language = i18n.resolvedLanguage) => {
-  if (language === 'en') {
+  if (language === i18n.options.fallbackLng[0]) {
     return;
   }
 

client/src/lib/custom-ui/components/Markdown/Markdown.module.scss

@@ -64,7 +64,7 @@
 
   .markdown-body b,
   .markdown-body strong {
-    font-weight: 600;
+    font-weight: bold; // 600
   }
 
   .markdown-body dfn {
@@ -73,7 +73,7 @@
 
   .markdown-body h1 {
     margin: .67em 0;
-    font-weight: 600;
+    font-weight: bold; // 600
     padding-bottom: .3em;
     font-size: 2em;
     border-bottom: 1px solid hsla(210, 18%, 87%, 1);
@@ -253,34 +253,34 @@
   .markdown-body h6 {
     margin-top: 24px;
     margin-bottom: 16px;
-    font-weight: 600;
+    font-weight: bold; // 600
     line-height: 1.25;
   }
 
   .markdown-body h2 {
-    font-weight: 600;
+    font-weight: bold; // 600
     padding-bottom: .3em;
     font-size: 1.5em;
     border-bottom: 1px solid hsla(210, 18%, 87%, 1);
   }
 
   .markdown-body h3 {
-    font-weight: 600;
+    font-weight: bold; // 600
     font-size: 1.25em;
   }
 
   .markdown-body h4 {
-    font-weight: 600;
+    font-weight: bold; // 600
     font-size: 1em;
   }
 
   .markdown-body h5 {
-    font-weight: 600;
+    font-weight: bold; // 600
     font-size: .875em;
   }
 
   .markdown-body h6 {
-    font-weight: 600;
+    font-weight: bold; // 600
     font-size: .85em;
     color: #57606a;
   }
@@ -481,7 +481,7 @@
     font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
     font-size: 1em;
     font-style: normal !important;
-    font-weight: 400;
+    font-weight: normal; // 400
     line-height: 1;
     vertical-align: -0.075em;
   }
@@ -650,7 +650,7 @@
     margin-top: 16px;
     font-size: 1em;
     font-style: italic;
-    font-weight: 600;
+    font-weight: bold; // 600
   }
 
   .markdown-body dl dd {
@@ -659,7 +659,7 @@
   }
 
   .markdown-body table th {
-    font-weight: 600;
+    font-weight: bold; // 600
   }
 
   .markdown-body table th,
@@ -868,7 +868,7 @@
   }
 
   .markdown-body .csv-data th {
-    font-weight: 600;
+    font-weight: bold; // 600
     background: #f6f8fa;
     border-top: 0;
   }
@@ -912,7 +912,7 @@
   }
 
   .markdown-body .task-list-item label {
-    font-weight: 400;
+    font-weight: normal;
   }
 
   .markdown-body .task-list-item.enabled label {

client/src/locales/ar-YE/core.js

@@ -0,0 +1,252 @@
+import dateFns from 'date-fns/locale/ar';
+
+export default {
+  dateFns,
+
+  format: {
+    date: 'M/d/yyyy',
+    time: 'p',
+    dateTime: '$t(format:date) $t(format:time)',
+    longDate: 'MMM d',
+    longDateTime: "MMMM d 'at' p",
+    fullDate: 'MMM d, y',
+    fullDateTime: "MMMM d, y 'at' p",
+  },
+
+  translation: {
+    common: {
+      aboutPlanka: 'حول Planka',
+      account: 'الحساب',
+      actions: 'إجراءات',
+      addAttachment_title: 'إضافة مرفق',
+      addComment: 'إضافة تعليق',
+      addManager_title: 'إضافة مدير',
+      addMember_title: 'إضافة عضو',
+      addUser_title: 'إضافة مستخدم',
+      administrator: 'المدير',
+      all: 'الكل',
+      allChangesWillBeAutomaticallySavedAfterConnectionRestored:
+        'سيتم حفظ جميع التغييرات تلقائياً<br />بعد استعادة الإتصال.',
+      areYouSureYouWantToDeleteThisAttachment: 'هل أنت متأكد أنك تريد حذف هذا المرفق؟',
+      areYouSureYouWantToDeleteThisBoard: 'هل أنت متأكد أنك تريد حذف هذه اللوحة؟',
+      areYouSureYouWantToDeleteThisCard: 'هل أنت متأكد أنك تريد حذف هذه البطاقة؟',
+      areYouSureYouWantToDeleteThisComment: 'هل أنت متأكد أنك تريد حذف هذا التعليق؟',
+      areYouSureYouWantToDeleteThisLabel: 'هل أنت متأكد أنك تريد حذف هذا الملصق؟',
+      areYouSureYouWantToDeleteThisList: 'هل أنت متأكد أنك تريد حذف هذه القائمة؟',
+      areYouSureYouWantToDeleteThisProject: 'هل أنت متأكد أنك تريد حذف هذا المشروع؟',
+      areYouSureYouWantToDeleteThisTask: 'هل أنت متأكد أنك تريد حذف هذه المهمة؟',
+      areYouSureYouWantToDeleteThisUser: 'هل أنت متأكد أنك تريد حذف هذا المستخدم؟',
+      areYouSureYouWantToLeaveBoard: 'هل أنت متأكد أنك تريد مغادرة اللوحة؟',
+      areYouSureYouWantToLeaveProject: 'هل أنت متأكد أنك تريد مغادرة المشروع؟',
+      areYouSureYouWantToRemoveThisManagerFromProject:
+        'هل أنت متأكد أنك تريد إزالة هذا المدير من المشروع؟',
+      areYouSureYouWantToRemoveThisMemberFromBoard:
+        'هل أنت متأكد أنك تريد إزالة هذا العضو من اللوحة؟',
+      attachment: 'مرفق',
+      attachments: 'مرفقات',
+      authentication: 'المصادقة',
+      background: 'الخلفية',
+      board: 'لوحة',
+      boardNotFound_title: 'لم يتم العثور على اللوحة',
+      canComment: 'يمكن التعليق',
+      canEditContentOfBoard: 'يمكن تعديل محتوى اللوحة.',
+      canOnlyViewBoard: 'يمكن فقط عرض اللوحة.',
+      cardActions_title: 'إجراءات البطاقة',
+      cardNotFound_title: 'لم يتم العثور على البطاقة',
+      cardOrActionAreDeleted: 'تم حذف البطاقة أو الإجراء.',
+      color: 'اللون',
+      copy_inline: 'نسخ',
+      createBoard_title: 'إنشاء لوحة',
+      createLabel_title: 'إنشاء ملصق',
+      createNewOneOrSelectExistingOne: 'أنشئ واحدة جديدة أو اختر<br />واحدة موجودة.',
+      createProject_title: 'إنشاء مشروع',
+      createTextFile_title: 'إنشاء ملف نصي',
+      currentPassword: 'كلمة المرور الحالية',
+      dangerZone_title: 'منطقة الخطر',
+      date: 'تاريخ',
+      dueDate: 'تاريخ الاستحقاق',
+      dueDate_title: 'تاريخ الاستحقاق',
+      deleteAttachment_title: 'حذف المرفق',
+      deleteBoard_title: 'حذف اللوحة',
+      deleteCard_title: 'حذف البطاقة',
+      deleteComment_title: 'حذف التعليق',
+      deleteLabel_title: 'حذف الملصق',
+      deleteList_title: 'حذف القائمة',
+      deleteProject_title: 'حذف المشروع',
+      deleteTask_title: 'حذف المهمة',
+      deleteUser_title: 'حذف المستخدم',
+      description: 'الوصف',
+      detectAutomatically: 'الكشف تلقائياً',
+      dropFileToUpload: 'أفلت الملف لرفعه',
+      editor: 'محرر',
+      editAttachment_title: 'تعديل المرفق',
+      editAvatar_title: 'تحرير الصورة الرمزية',
+      editBoard_title: 'تعديل اللوحة',
+      editDueDate_title: 'تعديل تاريخ الاستحقاق',
+      editEmail_title: 'تعديل البريد الإلكتروني',
+      editInformation_title: 'تعديل المعلومات',
+      editLabel_title: 'تعديل الملصق',
+      editPassword_title: 'تعديل كلمة المرور',
+      editPermissions_title: 'تعديل الأذونات',
+      editStopwatch_title: 'تعديل المؤقت',
+      editUsername_title: 'تعديل اسم المستخدم',
+      email: 'البريد الإلكتروني',
+      emailAlreadyInUse: 'البريد الإلكتروني مستخدم بالفعل',
+      enterCardTitle: 'أدخل عنوان البطاقة... [Ctrl+Enter] لفتحها تلقائيًا.',
+      enterDescription: 'أدخل الوصف...',
+      enterFilename: 'أدخل اسم الملف',
+      enterListTitle: 'أدخل عنوان القائمة...',
+      enterProjectTitle: 'أدخل عنوان المشروع',
+      enterTaskDescription: 'أدخل وصف المهمة...',
+      filterByLabels_title: 'تصفية حسب الملصقات',
+      filterByMembers_title: 'تصفية حسب الأعضاء',
+      fromComputer_title: 'من الكمبيوتر',
+      fromTrello: 'من Trello',
+      general: 'عام',
+      hours: 'ساعات',
+      importBoard_title: 'استيراد اللوحة',
+      invalidCurrentPassword: 'كلمة المرور الحالية غير صالحة',
+      labels: 'الملصقات',
+      language: 'اللغة',
+      leaveBoard_title: 'غادر اللوحة',
+      leaveProject_title: 'غادر المشروع',
+      linkIsCopied: 'تم نسخ الرابط',
+      list: 'القائمة',
+      listActions_title: 'قائمة الإجراءات',
+      managers: 'المديرون',
+      managerActions_title: 'إجراءات المدير',
+      members: 'الأعضاء',
+      memberActions_title: 'إجراءات العضو',
+      minutes: 'الدقائق',
+      moveCard_title: 'نقل البطاقة',
+      name: 'الاسم',
+      newestFirst: 'الأحدث أولاً',
+      newEmail: 'بريد إلكتروني جديد',
+      newPassword: 'كلمة سر جديدة',
+      newUsername: 'مستخدم جديد',
+      noConnectionToServer: 'لا يوجد اتصال بالخادم',
+      noBoards: 'لا توجد لوحات',
+      noLists: 'لاتوجد قوائم',
+      noProjects: 'لاتوجد مشاريع',
+      notifications: 'الإشعارات',
+      noUnreadNotifications: 'لاتوجد إشعارات غير مقروءة',
+      oldestFirst: 'الأقدم أولاً',
+      openBoard_title: 'فتح اللوحة',
+      optional_inline: 'اختياري',
+      organization: 'المنظمة',
+      phone: 'الهاتف',
+      preferences: 'التفضيلات',
+      pressPasteShortcutToAddAttachmentFromClipboard:
+        'نصيحة: اضغط على Ctrl-V (Cmd-V على Mac) لإضافة مرفق من الحافظة.',
+      project: 'مشروع',
+      projectNotFound_title: 'المشروع غير موجود',
+      removeManager_title: 'إزالة المدير',
+      removeMember_title: 'إزالة العضو',
+      searchLabels: 'البحث عن التصنيفات...',
+      searchMembers: 'البحث عن الأعضاء...',
+      searchUsers: 'البحث عن المستخدمين...',
+      searchCards: 'البحث عن البطاقات...',
+      seconds: 'ثواني',
+      selectBoard: 'اختر لوحة',
+      selectList: 'اختر قائمة',
+      selectPermissions_title: 'حدد الأذونات',
+      selectProject: 'حدد المشروع',
+      settings: 'الإعدادات',
+      sortList_title: 'فرز القائمة',
+      stopwatch: 'المؤقت',
+      subscribeToMyOwnCardsByDefault: 'الاشتراك في بطاقاتي الخاصة إفتراضياً',
+      taskActions_title: 'إجراءات المهمة',
+      tasks: 'المهام',
+      thereIsNoPreviewAvailableForThisAttachment: 'لا يوجد معاينة متاحة لهذا المرفق.',
+      time: 'الوقت',
+      title: 'العنوان',
+      userActions_title: 'إجراءات المستخدم',
+      userAddedThisCardToList: '<0>{{user}}</0><1> تمت إضافة هذه البطاقة إلى {{list}}</1>',
+      userLeftNewCommentToCard: '{{user}} ترك تعليق جديد «{{comment}}» إلى <2>{{card}}</2>',
+      userMovedCardFromListToList: '{{user}} انتقل <2>{{card}}</2> من {{fromList}} إلى {{toList}}',
+      userMovedThisCardFromListToList:
+        '<0>{{user}}</0><1> نُقلت هذه البطاقة من {{fromList}} إلى {{toList}}</1>',
+      username: 'اسم المستخدم',
+      usernameAlreadyInUse: 'اسم المستخدم تم استخدامه بالفعل',
+      users: 'المستخدمين',
+      version: 'الإصدار',
+      viewer: 'مشاهد',
+      writeComment: 'اكتب تعليقاً...',
+    },
+
+    action: {
+      addAnotherCard: 'إضافة بطاقة أخرى',
+      addAnotherList: 'إضافة قائمة أخرى',
+      addAnotherTask: 'إضافة مهمة أخرى',
+      addCard: 'إضافة بطاقة',
+      addCard_title: 'إضافة بطاقة',
+      addComment: 'إضافة تعليق',
+      addList: 'إضافة قائمة',
+      addMember: 'إضافة عضو',
+      addMoreDetailedDescription: 'إضافة وصف أكثر تفصيلاً',
+      addTask: 'إضافة مهمة',
+      addToCard: 'إضافة إلى البطاقة',
+      addUser: 'إضافة مستخدم',
+      copyLink_title: 'نسخ الرابط',
+      createBoard: 'إنشاء لوحة',
+      createFile: 'إنشاء ملف',
+      createLabel: 'إنشاء ملصق',
+      createNewLabel: 'إنشاء ملصق جديد',
+      createProject: 'إنشاء مشروع',
+      delete: 'حذف',
+      deleteAttachment: 'حذف المرفق',
+      deleteAvatar: 'حذف الصورة الرمزية',
+      deleteBoard: 'حذف اللوحة',
+      deleteCard: 'حذف البطاقة',
+      deleteCard_title: 'حذف البطاقة',
+      deleteComment: 'حذف التعليق',
+      deleteImage: 'حذف الصورة',
+      deleteLabel: 'حذف الملصق',
+      deleteList: 'حذف القائمة',
+      deleteList_title: 'حذف القائمة',
+      deleteProject: 'حذف المشروع',
+      deleteProject_title: 'حذف المشروع',
+      deleteTask: 'حذف المهمة',
+      deleteTask_title: 'حذف المهمة',
+      deleteUser: 'حذف المستخدم',
+      duplicate: 'تكرار',
+      duplicateCard_title: 'تكرار البطاقة',
+      edit: 'تعديل',
+      editDueDate_title: 'تعديل تاريخ الاستحقاق',
+      editDescription_title: 'تعديل الوصف',
+      editEmail_title: 'تعديل البريد الإلكتروني',
+      editInformation_title: 'تعديل المعلومات',
+      editPassword_title: 'تعديل كلمة المرور',
+      editPermissions: 'تعديل الأذونات',
+      editStopwatch_title: 'تعديل المؤقت',
+      editTitle_title: 'تعديل العنوان',
+      editUsername_title: 'تعديل اسم المستخدم',
+      hideDetails: 'إخفاء التفاصيل',
+      import: 'استيراد',
+      leaveBoard: 'غادر اللوحة',
+      leaveProject: 'غادر المشروع',
+      logOut_title: 'تسجيل الخروج',
+      makeCover_title: 'إصنع غلافاً',
+      move: 'نقل',
+      moveCard_title: 'نقل البطاقة',
+      remove: 'حذف',
+      removeBackground: 'إزالة الخلفية',
+      removeCover_title: 'إزالة الغلاف',
+      removeFromBoard: 'إزالة اللوحة',
+      removeFromProject: 'إزالة المشروع',
+      removeManager: 'إزالة المدير',
+      removeMember: 'إزالة العضو',
+      save: 'حفظ',
+      showAllAttachments: 'إظهار جميع المرفقات ({{hidden}} hidden)',
+      showDetails: 'إظهار التفاصيل',
+      showFewerAttachments: 'عرض مرفقات أقل',
+      sortList_title: 'فرز القائمة',
+      start: 'ابدأ',
+      stop: 'توقف',
+      subscribe: 'اشترك',
+      unsubscribe: 'إلغاء الاشتراك',
+      uploadNewAvatar: 'رفع صورة رمزية جديدة',
+      uploadNewImage: 'رفع صورة جديدة',
+    },
+  },
+};

client/src/locales/ar-YE/index.js

@@ -0,0 +1,8 @@
+import login from './login';
+
+export default {
+  language: 'ar-YE',
+  country: 'ye',
+  name: 'العربية',
+  embeddedLocale: login,
+};

client/src/locales/ar-YE/login.js

@@ -0,0 +1,23 @@
+export default {
+  translation: {
+    common: {
+      emailOrUsername: 'البريد الإلكتروني أو اسم المستخدم',
+      invalidEmailOrUsername: 'البريد الإلكتروني أو اسم المستخدم غير صالح',
+      invalidCredentials: 'بيانات الاعتماد غير صالحة',
+      invalidPassword: 'كلمة المرور غير صالحة',
+      logInToPlanka: 'تسجيل الدخول إلى Planka',
+      noInternetConnection: 'لا يوجد اتصال بالإنترنت',
+      pageNotFound_title: 'الصفحة غير موجودة',
+      password: 'كلمة المرور',
+      projectManagement: 'إدارة المشروع',
+      serverConnectionFailed: 'فشل الاتصال بالخادم',
+      unknownError: 'خطأ غير معروف، يرجى المحاولة لاحقاً',
+      useSingleSignOn: 'استخدم تسجيل الدخول الموحد',
+    },
+
+    action: {
+      logIn: 'تسجيل الدخول',
+      logInWithSSO: 'تسجيل الدخول باستخدام SSO',
+    },
+  },
+};

client/src/locales/bg-BG/index.js

@@ -1,7 +1,7 @@
 import login from './login';
 
 export default {
-  language: 'bg',
+  language: 'bg-BG',
   country: 'bg',
   name: 'Български',
   embeddedLocale: login,

client/src/locales/cs-CZ/index.js

@@ -1,7 +1,7 @@
 import login from './login';
 
 export default {
-  language: 'cs',
+  language: 'cs-CZ',
   country: 'cz',
   name: 'Čeština',
   embeddedLocale: login,

client/src/locales/da-DK/index.js

@@ -1,7 +1,7 @@
 import login from './login';
 
 export default {
-  language: 'da',
+  language: 'da-DK',
   country: 'dk',
   name: 'Dansk',
   embeddedLocale: login,

client/src/locales/de-DE/core.js

@@ -104,6 +104,7 @@ export default {
       language: 'Sprache',
       leaveBoard_title: 'Board verlassen',
       leaveProject_title: 'Projekt verlassen',
+      linkIsCopied: 'Link kopiert',
       list: 'Listen',
       listActions_title: 'Aufgaben auflisten',
       managers: 'Manager',
@@ -169,6 +170,7 @@ export default {
       addTask: 'Aufgabe hinzufügen',
       addToCard: 'Zu Karte hinzufügen',
       addUser: 'Benutzer hinzufügen',
+      copyLink_title: 'Link kopieren',
       createBoard: 'Board erstellen',
       createFile: 'Datei erstellen',
       createLabel: 'Label erstellen',
@@ -190,6 +192,8 @@ export default {
       deleteTask: 'Aufgabe löschen',
       deleteTask_title: 'Aufgabe löschen',
       deleteUser: 'Benutzer löschen',
+      duplicate: 'Kopieren',
+      duplicateCard_title: 'Karte kopieren',
       edit: 'Bearbeiten',
       editDueDate_title: 'Fälligkeitsdatum bearbeiten',
       editDescription_title: 'Beschreibung ändern',

client/src/locales/de-DE/index.js

@@ -1,7 +1,7 @@
 import login from './login';
 
 export default {
-  language: 'de',
+  language: 'de-DE',
   country: 'de',
   name: 'Deutsch',
   embeddedLocale: login,

client/src/locales/en-US/core.js

@@ -106,6 +106,7 @@ export default {
       language: 'Language',
       leaveBoard_title: 'Leave Board',
       leaveProject_title: 'Leave Project',
+      linkIsCopied: 'Link is copied',
       list: 'List',
       listActions_title: 'List Actions',
       managers: 'Managers',
@@ -183,6 +184,7 @@ export default {
       addTask: 'Add task',
       addToCard: 'Add to card',
       addUser: 'Add user',
+      copyLink_title: 'Copy Link',
       createBoard: 'Create board',
       createFile: 'Create file',
       createLabel: 'Create label',

client/src/locales/en-US/index.js

@@ -4,8 +4,8 @@ import login from './login';
 import core from './core';
 
 export default {
-  language: 'en',
-  country: 'gb',
+  language: 'en-US',
+  country: 'us',
   name: 'English',
   embeddedLocale: merge(login, core),
 };

client/src/locales/en-US/login.js

@@ -3,6 +3,7 @@ export default {
     common: {
       emailOrUsername: 'E-mail or username',
       invalidEmailOrUsername: 'Invalid e-mail or username',
+      invalidCredentials: 'Invalid credentials',
       invalidPassword: 'Invalid password',
       logInToPlanka: 'Log in to Planka',
       noInternetConnection: 'No internet connection',