Merge pull request #717 from toeverything/chore/update-searchArrowButton-style

chore: remove hover tips of searchArrowButton
This commit is contained in:
DarkSky
2023-01-12 17:21:57 +08:00
committed by GitHub
2 changed files with 19 additions and 18 deletions

View File

@@ -1,11 +1,17 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { StyledSwitchWrapper, StyledTitle, StyledTitleWrapper } from './styles'; import {
StyledSearchArrowWrapper,
StyledSwitchWrapper,
StyledTitle,
StyledTitleWrapper,
} from './styles';
import { Content } from '@/ui/layout'; import { Content } from '@/ui/layout';
import { useAppState } from '@/providers/app-state-provider/context'; import { useAppState } from '@/providers/app-state-provider/context';
import EditorModeSwitch from '@/components/editor-mode-switch'; import EditorModeSwitch from '@/components/editor-mode-switch';
import Header from './Header'; import Header from './Header';
import usePropsUpdated from '@/hooks/use-props-updated'; import usePropsUpdated from '@/hooks/use-props-updated';
import useCurrentPageMeta from '@/hooks/use-current-page-meta'; import useCurrentPageMeta from '@/hooks/use-current-page-meta';
import QuickSearchButton from './QuickSearchButton';
export const EditorHeader = () => { export const EditorHeader = () => {
const [title, setTitle] = useState(''); const [title, setTitle] = useState('');
@@ -58,9 +64,9 @@ export const EditorHeader = () => {
/> />
</StyledSwitchWrapper> </StyledSwitchWrapper>
<Content ellipsis={true}>{title}</Content> <Content ellipsis={true}>{title}</Content>
{/* <StyledSearchArrowWrapper> <StyledSearchArrowWrapper>
<QuickSearchButton /> <QuickSearchButton />
</StyledSearchArrowWrapper> */} </StyledSearchArrowWrapper>
</StyledTitleWrapper> </StyledTitleWrapper>
</StyledTitle> </StyledTitle>
)} )}

View File

@@ -1,28 +1,23 @@
import React from 'react'; import React from 'react';
import { IconButton, IconButtonProps } from '@/ui/button'; import { IconButton, IconButtonProps } from '@/ui/button';
import { Tooltip } from '@/ui/tooltip';
import { ArrowDownIcon } from '@blocksuite/icons'; import { ArrowDownIcon } from '@blocksuite/icons';
import { useModal } from '@/providers/GlobalModalProvider'; import { useModal } from '@/providers/GlobalModalProvider';
import { useTranslation } from '@affine/i18n';
export const QuickSearchButton = ({ export const QuickSearchButton = ({
onClick, onClick,
...props ...props
}: Omit<IconButtonProps, 'children'>) => { }: Omit<IconButtonProps, 'children'>) => {
const { triggerQuickSearchModal } = useModal(); const { triggerQuickSearchModal } = useModal();
const { t } = useTranslation();
return ( return (
<Tooltip content={t('Jump to')} placement="bottom"> <IconButton
<IconButton data-testid="header-quickSearchButton"
data-testid="header-quickSearchButton" {...props}
{...props} onClick={e => {
onClick={e => { onClick?.(e);
onClick?.(e); triggerQuickSearchModal();
triggerQuickSearchModal(); }}
}} >
> <ArrowDownIcon />
<ArrowDownIcon /> </IconButton>
</IconButton>
</Tooltip>
); );
}; };