Cosmetic refactoring on context menu (#1209)

* Cosmetic refactoring on context menu

* Fix lint

* Fix lint

* Fix lint

* Fix lint

* Fix lint

* Fix lint
This commit is contained in:
Charles Bochet
2023-08-15 02:34:23 +02:00
committed by GitHub
parent 444d9a9ca1
commit e3dc3b3e4a
30 changed files with 196 additions and 210 deletions

View File

@ -2,12 +2,14 @@ import React, { useRef } from 'react';
import styled from '@emotion/styled';
import { useRecoilValue, useSetRecoilState } from 'recoil';
import { actionBarOpenState } from '@/ui/action-bar/states/ActionBarIsOpenState';
import { contextMenuPositionState } from '@/ui/context-menu/states/ContextMenuPositionState';
import { actionBarOpenState } from '@/ui/action-bar/states/actionBarIsOpenState';
import { contextMenuPositionState } from '@/ui/context-menu/states/contextMenuPositionState';
import { DropdownMenu } from '@/ui/dropdown/components/DropdownMenu';
import { DropdownMenuItemsContainer } from '@/ui/dropdown/components/DropdownMenuItemsContainer';
import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside';
import { contextMenuEntriesState } from '../states/ContextMenuEntriesState';
import { contextMenuOpenState } from '../states/ContextMenuIsOpenState';
import { contextMenuEntriesState } from '../states/contextMenuEntriesState';
import { contextMenuIsOpenState } from '../states/contextMenuIsOpenState';
import { PositionType } from '../types/PositionType';
type OwnProps = {
@ -39,9 +41,9 @@ const StyledContainerContextMenu = styled.div<StyledContainerProps>`
export function ContextMenu({ selectedIds }: OwnProps) {
const position = useRecoilValue(contextMenuPositionState);
const contextMenuOpen = useRecoilValue(contextMenuOpenState);
const contextMenuOpen = useRecoilValue(contextMenuIsOpenState);
const contextMenuEntries = useRecoilValue(contextMenuEntriesState);
const setContextMenuOpenState = useSetRecoilState(contextMenuOpenState);
const setContextMenuOpenState = useSetRecoilState(contextMenuIsOpenState);
const setActionBarOpenState = useSetRecoilState(actionBarOpenState);
const wrapperRef = useRef(null);
@ -58,7 +60,11 @@ export function ContextMenu({ selectedIds }: OwnProps) {
}
return (
<StyledContainerContextMenu ref={wrapperRef} position={position}>
{contextMenuEntries}
<DropdownMenu>
<DropdownMenuItemsContainer>
{contextMenuEntries}
</DropdownMenuItemsContainer>
</DropdownMenu>
</StyledContainerContextMenu>
);
}