Skip to content

Commit

Permalink
fix: remove the use of detail as this is a synthetic event value and …
Browse files Browse the repository at this point in the history
…will not be compatible with React 17 (microsoft#4515)

# Description

<!--- Describe your changes. -->
Removed the check using `detail` and resolve whether a click is a single or double click using only `setTimeout`.

## Motivation & context

<!--- What problem does this change solve? -->
<!--- Provide a link if you are addressing an open issue. -->
The use of the synthetic events `detail` would occasionally result in console logs being generated from React. Due to this also being removed in React 17 the double click detection is remediated to work solely from `setTimeout`.

## Issue type checklist

<!--- What type of change are you submitting? Put an x in the box that applies: -->

- [ ] **Chore**: A change that does not impact distributed packages.
- [x] **Bug fix**: A change that fixes an issue, link to the issue above.
- [ ] **New feature**: A change that adds functionality.

**Is this a breaking change?**
- [ ] This change causes current functionality to break.

<!--- If yes, describe the impact. -->

**Adding or modifying component(s) in `@microsoft/fast-components` checklist**

<!-- Do your changes add or modify components in the @microsoft/fast-components package? Put an x in the box that applies: -->

- [ ] I have added a new component
- [ ] I have modified an existing component
- [ ] I have updated the [definition file](https://github.com/Microsoft/fast/blob/master/packages/web-components/fast-components/CONTRIBUTING.md#definition)
- [ ] I have updated the [configuration file](https://github.com/Microsoft/fast/blob/master/packages/web-components/fast-components/CONTRIBUTING.md#configuration)

## Process & policy checklist

<!--- Review the list and check the boxes that apply. -->

- [ ] I have added tests for my changes.
- [x] I have tested my changes.
- [ ] I have updated the project documentation to reflect my changes.
- [x] I have read the [CONTRIBUTING](https://github.com/Microsoft/fast/blob/master/CONTRIBUTING.md) documentation and followed the [standards](https://www.fast.design/docs/community/code-of-conduct/#our-standards) for this project.

<!---
Formatting guidelines:

Accepted peer review title format:
<type>: <description>

Example titles:
    chore: add unit tests for all components
    feat: add a border radius to button
    fix: update design system to use 3px border radius

    <type> is required to be one of the following:

        - chore: A change that does not impact distributed packages.
        - fix: A change which fixes an issue.
        - feat: A that adds functionality.

    <description> is required for the CHANGELOG and speaks to what the user gets from this PR:

        - Be concise.
        - Use all lowercase characters. 
        - Use imperative, present tense (e.g. `add` not `adds`.)
        - Do not end your description with a period.
        - Avoid redundant words.

For additional information regarding working on FAST, check out our documentation site:
https://www.fast.design/docs/community/contributor-guide
-->
  • Loading branch information
janechu authored Mar 31, 2021
1 parent c71e32e commit 2e272a6
Showing 1 changed file with 20 additions and 18 deletions.
38 changes: 20 additions & 18 deletions packages/tooling/fast-tooling-react/src/navigation/navigation.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -596,21 +596,27 @@ class Navigation extends Foundation<
navigationConfigId: string
): ((event: React.MouseEvent<HTMLElement>) => void) => {
let timer;
let timesClicked = 0;

return (event: React.MouseEvent<HTMLElement>): void => {
clearTimeout(timer);
timesClicked += 1;

if (event.detail === 1) {
timer = setTimeout(
setTimeout(() => {
if (timesClicked === 1) {
this.handleNavigationItemSingleClick(
dictionaryId,
navigationConfigId
),
200
);
} else if (event.detail === 2) {
this.handleNavigationItemDoubleClick(dictionaryId, navigationConfigId)();
}
);
} else if (timesClicked === 2) {
this.handleNavigationItemDoubleClick(
dictionaryId,
navigationConfigId
);
}

timesClicked = 0;
}, 200);
};
};

Expand All @@ -620,10 +626,8 @@ class Navigation extends Foundation<
private handleNavigationItemSingleClick = (
dictionaryId: string,
navigationConfigId: string
): (() => void) => {
return (): void => {
this.triggerNavigationUpdate(dictionaryId, navigationConfigId);
};
): void => {
this.triggerNavigationUpdate(dictionaryId, navigationConfigId);
};

/**
Expand All @@ -632,12 +636,10 @@ class Navigation extends Foundation<
private handleNavigationItemDoubleClick = (
dictionaryId: string,
navigationConfigId: string
): (() => void) => {
return (): void => {
if (this.isEditable(dictionaryId, navigationConfigId)) {
this.triggerNavigationEdit();
}
};
): void => {
if (this.isEditable(dictionaryId, navigationConfigId)) {
this.triggerNavigationEdit();
}
};

/**
Expand Down

0 comments on commit 2e272a6

Please sign in to comment.