Docker/planka
Docker/planka
1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-08-09 07:25:24 +02:00
Code Issues Releases Activity

Revert "Add context menu when clicking on card"

Browse source 
This reverts commit a8873e3407.
This commit is contained in:
Rafly Maulana 2022-11-21 01:07:43 +07:00
parent fefb54b715
commit eb436d38b5
No known key found for this signature in database
GPG key ID: 9AADAF05ED276842
1 changed files with 7 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

45
client/src/components/Card/Card.jsx
View file

@ -1,11 +1,10 @@
import React, { useCallback, useRef, useState } from 'react'; import React, { useCallback, useRef } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classNames from 'classnames'; import classNames from 'classnames';
import { Button, Icon } from 'semantic-ui-react'; import { Button, Icon } from 'semantic-ui-react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { Draggable } from 'react-beautiful-dnd'; import { Draggable } from 'react-beautiful-dnd';
import { ControlledMenu, MenuItem, useMenuState } from '@szhsin/react-menu';
import { startTimer, stopTimer } from '../../utils/timer'; import { startTimer, stopTimer } from '../../utils/timer';
import Paths from '../../constants/Paths'; import Paths from '../../constants/Paths';
import Tasks from './Tasks'; import Tasks from './Tasks';
@ -18,8 +17,6 @@ import Timer from '../Timer';
import styles from './Card.module.scss'; import styles from './Card.module.scss';
import '@szhsin/react-menu/dist/index.css';
const Card = React.memo( const Card = React.memo(
({ ({
id, id,
@ -55,22 +52,11 @@ const Card = React.memo(
}) => { }) => {
const nameEdit = useRef(null); const nameEdit = useRef(null);
const [menuProps, toggleMenu] = useMenuState(); const handleClick = useCallback(() => {
const [anchorPoint, setAnchorPoint] = useState({ x: 0, y: 0 });
const handleClick = useCallback(
(e) => {
if (menuProps.state === 'open') {
e.preventDefault();
e.stopPropagation();
}
if (document.activeElement) { if (document.activeElement) {
document.activeElement.blur(); document.activeElement.blur();
} }
}, }, []);
[menuProps.state],
);
const handleToggleTimerClick = useCallback( const handleToggleTimerClick = useCallback(
(event) => { (event) => {
@ -99,15 +85,7 @@ const Card = React.memo(
const contentNode = ( const contentNode = (
<> <>
{coverUrl && <img src={coverUrl} alt="" className={styles.cover} />} {coverUrl && <img src={coverUrl} alt="" className={styles.cover} />}
<div className={styles.details}>
<div
className={styles.details}
onContextMenu={(e) => {
e.preventDefault();
setAnchorPoint({ x: e.clientX, y: e.clientY });
toggleMenu(true);
}}
>
{labels.length > 0 && ( {labels.length > 0 && (
<span className={styles.labels}> <span className={styles.labels}>
{labels.map((label) => ( {labels.map((label) => (
@ -120,11 +98,8 @@ const Card = React.memo(
))} ))}
</span> </span>
)} )}
<div className={styles.name}>{name}</div> <div className={styles.name}>{name}</div>
{tasks.length > 0 && <Tasks items={tasks} />} {tasks.length > 0 && <Tasks items={tasks} />}
{(dueDate || timer || notificationsTotal > 0) && ( {(dueDate || timer || notificationsTotal > 0) && (
<span className={styles.attachments}> <span className={styles.attachments}>
{notificationsTotal > 0 && ( {notificationsTotal > 0 && (
@ -156,7 +131,6 @@ const Card = React.memo(
)} )}
</span> </span>
)} )}
{users.length > 0 && ( {users.length > 0 && (
<span className={classNames(styles.attachments, styles.attachmentsRight)}> <span className={classNames(styles.attachments, styles.attachmentsRight)}>
{users.map((user) => ( {users.map((user) => (
@ -169,16 +143,6 @@ const Card = React.memo(
))} ))}
</span> </span>
)} )}
<ControlledMenu
// eslint-disable-next-line react/jsx-props-no-spreading
{...menuProps}
anchorPoint={anchorPoint}
direction="right"
onClose={() => toggleMenu(false)}
>
<MenuItem onClick={onDelete}>Delete Card</MenuItem>
</ControlledMenu>
</div> </div>
</> </>
); );
@ -199,7 +163,6 @@ const Card = React.memo(
> >
{contentNode} {contentNode}
</Link> </Link>
{canEdit && ( {canEdit && (
<ActionsPopup <ActionsPopup
card={{ card={{