feat: replace button from @toeverything/components (#3608)

This commit is contained in:
Qi
2023-08-08 12:38:02 +08:00
committed by GitHub
parent 7826ecfa58
commit 6efe29f7ef
60 changed files with 112 additions and 500 deletions
@@ -1,5 +1,4 @@
import {
Button,
Input,
Modal,
ModalCloseButton,
@@ -10,6 +9,7 @@ import {
import { DebugLogger } from '@affine/debug';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { HelpIcon } from '@blocksuite/icons';
import { Button } from '@toeverything/components/button';
import { useSetAtom } from 'jotai';
import type { KeyboardEvent } from 'react';
import { useEffect } from 'react';
@@ -1,9 +1,10 @@
import { IconButton, Modal, ModalWrapper } from '@affine/component';
import { Modal, ModalWrapper, Wrapper } from '@affine/component';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { CloseIcon } from '@blocksuite/icons';
import { Button, IconButton } from '@toeverything/components/button';
import type React from 'react';
import { Content, ContentTitle, Header, StyleButton, StyleTips } from './style';
import { Content, ContentTitle, Header, StyleTips } from './style';
interface EnableAffineCloudModalProps {
open: boolean;
@@ -30,19 +31,22 @@ export const EnableAffineCloudModal: React.FC<EnableAffineCloudModalProps> = ({
<ContentTitle>{t['Enable AFFiNE Cloud']()}?</ContentTitle>
<StyleTips>{t['Enable AFFiNE Cloud Description']()}</StyleTips>
{/* <StyleTips>{t('Retain cached cloud data')}</StyleTips> */}
<div>
<StyleButton
<Wrapper width={284} margin="auto">
<Button
data-testid="confirm-enable-affine-cloud-button"
shape="round"
type="primary"
block
onClick={onConfirm}
style={{
marginBottom: '16px',
}}
>
{t['Sign in and Enable']()}
</StyleButton>
<StyleButton shape="round" onClick={onClose}>
</Button>
<Button onClick={onClose} block>
{t['Not now']()}
</StyleButton>
</div>
</Button>
</Wrapper>
</Content>
</ModalWrapper>
</Modal>
@@ -1,4 +1,4 @@
import { Button, styled } from '@affine/component';
import { styled } from '@affine/component';
export const Header = styled('div')({
height: '44px',
@@ -29,12 +29,3 @@ export const StyleTips = styled('div')(() => {
marginTop: '12px',
};
});
export const StyleButton = styled(Button)(() => {
return {
width: '284px',
display: 'block',
margin: 'auto',
marginTop: '16px',
};
});
@@ -1,15 +1,9 @@
import {
type ButtonProps,
Menu,
MenuItem,
MenuTrigger,
styled,
} from '@affine/component';
import { Menu, MenuItem, MenuTrigger, styled } from '@affine/component';
import { LOCALES } from '@affine/i18n';
import { useI18N } from '@affine/i18n';
import type { ButtonProps } from '@toeverything/components/button';
import type { FC, ReactElement } from 'react';
import { useCallback } from 'react';
export const StyledListItem = styled(MenuItem)(() => ({
width: '132px',
height: '38px',
@@ -1,7 +1,8 @@
import { Button, Input, Modal, ModalCloseButton } from '@affine/component';
import { Input, Modal, ModalCloseButton } from '@affine/component';
import { WorkspaceFlavour } from '@affine/env/workspace';
import { Trans } from '@affine/i18n';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { Button } from '@toeverything/components/button';
import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
import { useCallback, useState } from 'react';
@@ -1,7 +1,7 @@
import { Modal } from '@affine/component';
import { ModalCloseButton } from '@affine/component';
import { Button } from '@affine/component';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { Button } from '@toeverything/components/button';
import {
StyledButtonContent,
@@ -38,7 +38,6 @@ export const WorkspaceLeave = ({ open, onClose }: WorkspaceDeleteProps) => {
<Button
onClick={handleLeave}
type="error"
shape="circle"
style={{ marginLeft: '24px' }}
>
{t['Leave']()}
@@ -1,7 +1,8 @@
import { Button, toast } from '@affine/component';
import { toast } from '@affine/component';
import { SettingRow } from '@affine/component/setting-components';
import { isDesktop } from '@affine/env/constant';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { Button } from '@toeverything/components/button';
import { type FC, useCallback } from 'react';
import type { AffineOfficialWorkspace } from '../../../shared';
@@ -1,7 +1,8 @@
import { IconButton, Input, toast } from '@affine/component';
import { Input, toast } from '@affine/component';
import { WorkspaceAvatar } from '@affine/component/workspace-avatar';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { DoneIcon } from '@blocksuite/icons';
import { IconButton } from '@toeverything/components/button';
import { useBlockSuiteWorkspaceAvatarUrl } from '@toeverything/hooks/use-block-suite-workspace-avatar-url';
import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
import { type FC, useCallback, useState } from 'react';
@@ -1,4 +1,4 @@
import { Button, FlexWrapper, Switch, Tooltip } from '@affine/component';
import { FlexWrapper, Switch, Tooltip } from '@affine/component';
import { SettingRow } from '@affine/component/setting-components';
import { Unreachable } from '@affine/env/constant';
import type {
@@ -7,6 +7,7 @@ import type {
} from '@affine/env/workspace';
import { WorkspaceFlavour } from '@affine/env/workspace';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { Button } from '@toeverything/components/button';
import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name';
import type { FC } from 'react';
import { useCallback, useEffect, useState } from 'react';
@@ -1,6 +1,7 @@
import { Button, FlexWrapper, toast, Tooltip } from '@affine/component';
import { FlexWrapper, toast, Tooltip } from '@affine/component';
import { SettingRow } from '@affine/component/setting-components';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { Button } from '@toeverything/components/button';
import { useMemo } from 'react';
import { type FC, useCallback, useEffect, useState } from 'react';
@@ -1,7 +1,8 @@
import { Empty, IconButton, Modal, ModalWrapper } from '@affine/component';
import { Empty, Modal, ModalWrapper } from '@affine/component';
import { Trans } from '@affine/i18n';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { CloseIcon } from '@blocksuite/icons';
import { IconButton } from '@toeverything/components/button';
import type React from 'react';
import {
@@ -66,7 +67,7 @@ export const TmpDisableAffineCloudModal: React.FC<
/>
</StyleImage>
<StyleButtonContainer>
<StyleButton shape="round" type="primary" onClick={onClose}>
<StyleButton type="primary" onClick={onClose}>
{t['Got it']()}
</StyleButton>
</StyleButtonContainer>
@@ -1,4 +1,5 @@
import { Button, displayFlex, styled } from '@affine/component';
import { displayFlex, styled } from '@affine/component';
import { Button } from '@toeverything/components/button';
export const Header = styled('div')({
height: '44px',
@@ -1,6 +1,7 @@
import { IconButton, Modal, ModalWrapper } from '@affine/component';
import { Modal, ModalWrapper } from '@affine/component';
import { useAFFiNEI18N } from '@affine/i18n/hooks';
import { CloseIcon } from '@blocksuite/icons';
import { IconButton } from '@toeverything/components/button';
import type React from 'react';
import { Content, ContentTitle, Header, StyleButton, StyleTips } from './style';
@@ -35,7 +36,6 @@ export const TransformWorkspaceToAffineModal: React.FC<
<div>
<StyleButton
data-testid="confirm-enable-cloud-button"
shape="round"
type="primary"
onClick={onConform}
>
@@ -1,4 +1,5 @@
import { Button, styled } from '@affine/component';
import { styled } from '@affine/component';
import { Button } from '@toeverything/components/button';
export const Header = styled('div')({
height: '44px',