Change user size on card, save card description on click outside, prevent list deletion if any filter is active

client/src/components/Board/Filter.jsx

@@ -61,7 +61,7 @@ const Filter = React.memo(
               <User
                 name={user.name}
                 avatarUrl={user.avatarUrl}
-                size="small"
+                size="tiny"
                 onClick={() => handleUserRemoveClick(user.id)}
               />
             </span>

client/src/components/Boards/Boards.module.css

@@ -73,7 +73,7 @@
 
 .tab {
   border-radius: 3px 3px 0 0;
-  min-width: 160px;
+  min-width: 100px;
   position: relative;
   transition: all 0.1s ease;
 }

client/src/components/Card/Card.jsx

@@ -112,7 +112,7 @@ const Card = React.memo(
                   key={user.id}
                   className={classNames(styles.attachment, styles.attachmentRight)}
                 >
-                  <User name={user.name} avatarUrl={user.avatarUrl} size="tiny" />
+                  <User name={user.name} avatarUrl={user.avatarUrl} size="small" />
                 </span>
               ))}
             </span>

client/src/components/CardModal/EditDescription.jsx

@@ -21,19 +21,15 @@ const EditDescription = React.forwardRef(({ children, defaultValue, onUpdate },
   }, [defaultValue, setValue]);
 
   const close = useCallback(() => {
-    setIsOpened(false);
-    setValue(null);
-  }, [setValue]);
-
-  const submit = useCallback(() => {
     const cleanValue = value.trim() || null;
 
     if (cleanValue !== defaultValue) {
       onUpdate(cleanValue);
     }
 
-    close();
-  }, [defaultValue, onUpdate, value, close]);
+    setIsOpened(false);
+    setValue(null);
+  }, [defaultValue, onUpdate, value, setValue]);
 
   useImperativeHandle(
     ref,
@@ -53,10 +49,10 @@ const EditDescription = React.forwardRef(({ children, defaultValue, onUpdate },
   const handleFieldKeyDown = useCallback(
     (event) => {
       if (event.ctrlKey && event.key === 'Enter') {
-        submit();
+        close();
       }
     },
-    [submit],
+    [close],
   );
 
   const [handleFieldBlur, handleControlMouseOver, handleControlMouseOut] = useClosableForm(
@@ -65,8 +61,8 @@ const EditDescription = React.forwardRef(({ children, defaultValue, onUpdate },
   );
 
   const handleSubmit = useCallback(() => {
-    submit();
-  }, [submit]);
+    close();
+  }, [close]);
 
   useEffect(() => {
     if (isOpened) {

client/src/components/List/ActionsPopup.jsx

@@ -65,11 +65,13 @@ const ActionsStep = React.memo(({ onNameEdit, onCardAdd, onDelete, onClose }) =>
               context: 'title',
             })}
           </Menu.Item>
-          <Menu.Item className={styles.menuItem} onClick={handleDeleteClick}>
-            {t('action.deleteList', {
-              context: 'title',
-            })}
-          </Menu.Item>
+          {onDelete && (
+            <Menu.Item className={styles.menuItem} onClick={handleDeleteClick}>
+              {t('action.deleteList', {
+                context: 'title',
+              })}
+            </Menu.Item>
+          )}
         </Menu>
       </Popup.Content>
     </>
@@ -79,8 +81,12 @@ const ActionsStep = React.memo(({ onNameEdit, onCardAdd, onDelete, onClose }) =>
 ActionsStep.propTypes = {
   onNameEdit: PropTypes.func.isRequired,
   onCardAdd: PropTypes.func.isRequired,
-  onDelete: PropTypes.func.isRequired,
+  onDelete: PropTypes.func,
   onClose: PropTypes.func.isRequired,
 };
 
+ActionsStep.defaultProps = {
+  onDelete: undefined,
+};
+
 export default withPopup(ActionsStep);

client/src/components/List/List.jsx

@@ -114,8 +114,12 @@ List.propTypes = {
   isPersisted: PropTypes.bool.isRequired,
   cardIds: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types
   onUpdate: PropTypes.func.isRequired,
-  onDelete: PropTypes.func.isRequired,
+  onDelete: PropTypes.func,
   onCardCreate: PropTypes.func.isRequired,
 };
 
+List.defaultProps = {
+  onDelete: undefined,
+};
+
 export default List;

client/src/components/User/User.jsx

@@ -16,20 +16,20 @@ const SIZES = {
 // TODO: move to styles
 const STYLES = {
   tiny: {
-    fontSize: '10px',
-    fontWeight: '400',
-    height: '20px',
-    padding: '5.5px 0px 4.5px',
-    width: '20px',
-  },
-  small: {
     fontSize: '12px',
     fontWeight: '400',
     height: '24px',
     lineHeight: '20px',
-    padding: '2px 0px',
+    padding: '2px 0',
     width: '24px',
   },
+  small: {
+    fontSize: '12px',
+    fontWeight: '400',
+    height: '28px',
+    padding: '8px 0',
+    width: '28px',
+  },
   medium: {
     fontSize: '14px',
     fontWeight: '500',