This is an automated email from the ASF dual-hosted git repository. abeizn pushed a commit to branch release-v1.0 in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git
commit e37d64b5063e23d642952d4d17575fd89d8c2710 Author: 青湛 <[email protected]> AuthorDate: Fri Mar 29 14:33:56 2024 +1300 feat: add confirm modal for onboard close (#7245) --- config-ui/src/routes/onboard/index.tsx | 23 +++++++++++++++++------ 1 file changed, 17 insertions(+), 6 deletions(-) diff --git a/config-ui/src/routes/onboard/index.tsx b/config-ui/src/routes/onboard/index.tsx index 203d89a3f..fceb49ebf 100644 --- a/config-ui/src/routes/onboard/index.tsx +++ b/config-ui/src/routes/onboard/index.tsx @@ -18,8 +18,8 @@ import { useState, useEffect } from 'react'; import { useNavigate } from 'react-router-dom'; -import { CloseOutlined } from '@ant-design/icons'; -import { theme, Layout } from 'antd'; +import { CloseOutlined, ExclamationCircleOutlined } from '@ant-design/icons'; +import { theme, Layout, Modal } from 'antd'; import API from '@/api'; import { PageLoading } from '@/components'; @@ -61,6 +61,8 @@ export const Onboard = () => { token: { colorPrimary }, } = theme.useToken(); + const [modal, contextHolder] = Modal.useModal(); + const { ready, data } = useRefreshData(() => API.store.get('onboard')); useEffect(() => { @@ -72,6 +74,17 @@ export const Onboard = () => { } }, [ready, data]); + const handleClose = () => { + modal.confirm({ + width: 820, + title: 'Are you sure to exit the onboard session?', + content: 'You can get back to this session via the card on top of the Projects page.', + icon: <ExclamationCircleOutlined />, + okText: 'Confirm', + onOk: () => navigate('/'), + }); + }; + if (!ready) { return <PageLoading />; } @@ -98,10 +111,7 @@ export const Onboard = () => { <> <S.Header> <h1>Connect to your first repository</h1> - <CloseOutlined - style={{ fontSize: 18, color: '#70727F', cursor: 'pointer' }} - onClick={() => navigate('/')} - /> + <CloseOutlined style={{ fontSize: 18, color: '#70727F', cursor: 'pointer' }} onClick={handleClose} /> </S.Header> <S.Content> {[1, 2, 3].includes(step) && ( @@ -122,6 +132,7 @@ export const Onboard = () => { </> )} </S.Inner> + {contextHolder} </Layout> </Context.Provider> );
