mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge signalapp/Signal-Desktop#6822

Browse source
This commit is contained in:
Scott Nonnenberg 2024-07-30 16:49:19 -07:00
commit 63d38ac55d
10 changed files with 49 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
stylesheets/components/NavSidebar.scss
View file

@ -195,6 +195,15 @@
}
}
&:active {
@include light-theme {
background: $color-gray-20;
}
@include dark-theme {
background: $color-gray-62;
}
}
&:focus {
outline: none;
@include keyboard-mode {

5
ts/components/CallsTab.tsx
View file

@ -244,10 +244,11 @@ export function CallsTab({
}}
portalToRoot
>
{({ openMenu, onKeyDown }) => {
{({ onClick, onKeyDown, ref }) => {
return (
<NavSidebarActionButton
onClick={openMenu}
ref={ref}
onClick={onClick}
onKeyDown={onKeyDown}
icon={<span className="CallsTab__MoreActionsIcon" />}
label={i18n('icu:CallsTab__MoreActionsLabel')}

17
ts/components/ContextMenu.tsx
View file

@ -25,7 +25,7 @@ export type ContextMenuOptionType<T> = Readonly<{
}>;
type RenderButtonProps = Readonly<{
openMenu: (ev: React.MouseEvent) => void;
onClick: (ev: React.MouseEvent) => void;
onKeyDown: (ev: KeyboardEvent) => void;
isMenuShowing: boolean;
ref: React.Ref<HTMLButtonElement> | null;
@ -207,10 +207,15 @@ export function ContextMenu<T>({
};
const handleClick = (ev: React.MouseEvent) => {
closeCurrentOpenContextMenu?.();
closeCurrentOpenContextMenu = () => setIsMenuShowing(false);
virtualElement.current = generateVirtualElement(ev.clientX, ev.clientY);
setIsMenuShowing(true);
if (isMenuShowing && ev.type !== 'contextmenu') {
setIsMenuShowing(false);
closeCurrentOpenContextMenu = undefined;
} else {
closeCurrentOpenContextMenu?.();
closeCurrentOpenContextMenu = () => setIsMenuShowing(false);
virtualElement.current = generateVirtualElement(ev.clientX, ev.clientY);
setIsMenuShowing(true);
}
ev.stopPropagation();
ev.preventDefault();
};
@ -316,7 +321,7 @@ export function ContextMenu<T>({
buttonNode = (
<>
{(children as (props: RenderButtonProps) => JSX.Element)({
openMenu: onClick || handleClick,
onClick: onClick || handleClick,
onKeyDown: handleKeyDown,
isMenuShowing,
ref: setReferenceElement,

5
ts/components/LeftPane.tsx
View file

@ -671,10 +671,11 @@ export function LeftPane({
}}
portalToRoot
>
{({ openMenu, onKeyDown }) => {
{({ onClick, onKeyDown, ref }) => {
return (
<NavSidebarActionButton
onClick={openMenu}
ref={ref}
onClick={onClick}
onKeyDown={onKeyDown}
icon={<span className="module-left-pane__moreActionsIcon" />}
label="More Actions"

20
ts/components/NavSidebar.tsx
View file

@ -16,19 +16,23 @@ import {
import { WidthBreakpoint, getNavSidebarWidthBreakpoint } from './_util';
import type { UnreadStats } from '../util/countUnreadStats';
export function NavSidebarActionButton({
icon,
label,
onClick,
onKeyDown,
}: {
type NavSidebarActionButtonProps = {
icon: ReactNode;
label: ReactNode;
onClick: MouseEventHandler<HTMLButtonElement>;
onKeyDown?: KeyboardEventHandler<HTMLButtonElement>;
}): JSX.Element {
};
export const NavSidebarActionButton = React.forwardRef<
HTMLButtonElement,
NavSidebarActionButtonProps
>(function NavSidebarActionButtonInner(
{ icon, label, onClick, onKeyDown },
ref
): JSX.Element {
return (
<button
ref={ref}
type="button"
className="NavSidebar__ActionButton"
onClick={onClick}
@ -38,7 +42,7 @@ export function NavSidebarActionButton({
<span className="NavSidebar__ActionButtonLabel">{label}</span>
</button>
);
}
});
export type NavSidebarProps = Readonly<{
actions?: ReactNode;

4
ts/components/NavTabs.tsx
View file

@ -307,7 +307,7 @@ export function NavTabs({
}}
portalToRoot
>
{({ openMenu, onKeyDown, ref }) => {
{({ onClick, onKeyDown, ref }) => {
return (
<button
type="button"
@ -319,7 +319,7 @@ export function NavTabs({
}}
onClick={event => {
if (hasPendingUpdate) {
openMenu(event);
onClick(event);
} else {
onShowSettings();
}

4
ts/components/SendStoryModal.tsx
View file

@ -919,14 +919,14 @@ export function SendStoryModal({
}}
theme={theme === ThemeType.dark ? Theme.Dark : Theme.Light}
>
{({ openMenu, onKeyDown, ref, menuNode }) => (
{({ onClick, onKeyDown, ref, menuNode }) => (
<div>
<Button
ref={ref}
className="SendStoryModal__new-story__button"
variant={ButtonVariant.Secondary}
size={ButtonSize.Small}
onClick={openMenu}
onClick={onClick}
onKeyDown={onKeyDown}
>
{i18n('icu:SendStoryModal__new')}

5
ts/components/StoriesTab.tsx
View file

@ -174,10 +174,11 @@ export function StoriesTab({
}}
portalToRoot
>
{({ openMenu, onKeyDown }) => {
{({ onClick, onKeyDown, ref }) => {
return (
<NavSidebarActionButton
onClick={openMenu}
ref={ref}
onClick={onClick}
onKeyDown={onKeyDown}
icon={<span className="StoriesTab__MoreActionsIcon" />}
label={i18n('icu:StoriesTab__MoreActionsLabel')}

4
ts/components/StoryViewsNRepliesModal.tsx
View file

@ -649,9 +649,9 @@ function ReplyOrReactionMessage({
return reply.author.isMe && !reply.deletedForEveryone ? (
<ContextMenu i18n={i18n} key={reply.id} menuOptions={menuOptions}>
{({ openMenu, menuNode }) => (
{({ onClick, menuNode }) => (
<>
{renderContent(openMenu)}
{renderContent(onClick)}
{menuNode}
</>
)}

4
ts/components/conversation/conversation-details/ConversationDetails.tsx
View file

@ -539,12 +539,12 @@ export function ConversationDetails({
},
]}
>
{({ openMenu }) => {
{({ onClick }) => {
return (
<button
type="button"
className="ConversationDetails--nickname-actions"
onClick={openMenu}
onClick={onClick}
>
<span className="ConversationDetails--nickname-actions-label">
{i18n('icu:ConversationDetails--nickname-actions')}