feat: manually mirror opencoze's code from bytedance
Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
.auth-empty-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: calc(100% - 112px);
|
||||
|
||||
.auth-empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.auth-empty-image {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
}
|
||||
|
||||
.auth-empty-description {
|
||||
margin-top: 16px;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
line-height: 22px;
|
||||
color: var(--coz-fg-primary);
|
||||
}
|
||||
|
||||
.auth-empty-second-desc {
|
||||
margin-top: 4px;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: var(--coz-fg-secondary);
|
||||
}
|
||||
|
||||
.auth-empty-button {
|
||||
margin-top: 21px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,69 @@
|
||||
/*
|
||||
* Copyright 2025 coze-dev Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import classNames from 'classnames';
|
||||
import { Button } from '@coze-arch/coze-design';
|
||||
|
||||
import style from './index.module.less';
|
||||
|
||||
export interface CommonEmptyAuthProps {
|
||||
illustrationIcon: JSX.Element;
|
||||
description: string;
|
||||
authUrl?: string;
|
||||
btnText?: string;
|
||||
className?: string;
|
||||
onClick?: () => void;
|
||||
secondDesc?: string;
|
||||
}
|
||||
export const AuthEmpty = (props: CommonEmptyAuthProps) => {
|
||||
const {
|
||||
description,
|
||||
authUrl,
|
||||
onClick,
|
||||
btnText,
|
||||
illustrationIcon,
|
||||
className,
|
||||
secondDesc,
|
||||
} = props;
|
||||
const handleClick = () => {
|
||||
if (authUrl) {
|
||||
window.open(authUrl, '_self');
|
||||
} else {
|
||||
onClick?.();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className={classNames(style['auth-empty-wrapper'], className)}>
|
||||
<div className={style['auth-empty']}>
|
||||
<div className={style['auth-empty-image']}>{illustrationIcon}</div>
|
||||
<div className={style['auth-empty-description']}>{description}</div>
|
||||
{secondDesc ? (
|
||||
<div className={style['auth-empty-second-desc']}>{secondDesc}</div>
|
||||
) : null}
|
||||
{btnText ? (
|
||||
<Button
|
||||
color="highlight"
|
||||
className={style['auth-empty-button']}
|
||||
onClick={handleClick}
|
||||
>
|
||||
{btnText}
|
||||
</Button>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@@ -0,0 +1,18 @@
|
||||
/*
|
||||
* Copyright 2025 coze-dev Authors
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
export { AuthEmpty } from './common-empty-auth';
|
||||
export type { CommonEmptyAuthProps } from './common-empty-auth';
|
||||
Reference in New Issue
Block a user