You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@devlake.apache.org by mi...@apache.org on 2023/05/08 02:51:24 UTC
[incubator-devlake] branch release-v0.17 updated: feat(config-ui): add tips for project incoming webhook (#5119)
This is an automated email from the ASF dual-hosted git repository.
mintsweet pushed a commit to branch release-v0.17
in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git
The following commit(s) were added to refs/heads/release-v0.17 by this push:
new e66c4ad02 feat(config-ui): add tips for project incoming webhook (#5119)
e66c4ad02 is described below
commit e66c4ad02a89e5c42ff1659d9ef4431f74746131
Author: 青湛 <0x...@gmail.com>
AuthorDate: Mon May 8 10:51:20 2023 +0800
feat(config-ui): add tips for project incoming webhook (#5119)
* feat(config-ui): add new component alert
* feat(config-ui): add tips for project incoming webhook
---
.../src/components/{index.ts => alert/index.tsx} | 32 +++++-----
config-ui/src/components/index.ts | 1 +
.../project/detail/panel/incoming-webhooks.tsx | 71 +++++++++++++---------
3 files changed, 61 insertions(+), 43 deletions(-)
diff --git a/config-ui/src/components/index.ts b/config-ui/src/components/alert/index.tsx
similarity index 66%
copy from config-ui/src/components/index.ts
copy to config-ui/src/components/alert/index.tsx
index a9948ea4c..87a74ed2a 100644
--- a/config-ui/src/components/index.ts
+++ b/config-ui/src/components/alert/index.tsx
@@ -16,17 +16,21 @@
*
*/
-export * from './action';
-export * from './card';
-export * from './dialog';
-export * from './divider';
-export * from './inspector';
-export * from './loading';
-export * from './logo';
-export * from './no-data';
-export * from './page-header';
-export * from './selector';
-export * from './table';
-export * from './toast';
-export * from './tooltip';
-export * from './workflow';
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+ padding: 24px;
+ background: #f0f4fe;
+ border: 1px solid #bdcefb;
+ border-radius: 4px;
+`;
+
+interface Props {
+ style?: React.CSSProperties;
+ content?: React.ReactNode;
+ children?: React.ReactNode;
+}
+
+export const Alert = ({ style, content, children }: Props) => {
+ return <Wrapper style={style}>{content ?? children}</Wrapper>;
+};
diff --git a/config-ui/src/components/index.ts b/config-ui/src/components/index.ts
index a9948ea4c..c511defde 100644
--- a/config-ui/src/components/index.ts
+++ b/config-ui/src/components/index.ts
@@ -17,6 +17,7 @@
*/
export * from './action';
+export * from './alert';
export * from './card';
export * from './dialog';
export * from './divider';
diff --git a/config-ui/src/pages/project/detail/panel/incoming-webhooks.tsx b/config-ui/src/pages/project/detail/panel/incoming-webhooks.tsx
index 45ad0432d..27fde2ede 100644
--- a/config-ui/src/pages/project/detail/panel/incoming-webhooks.tsx
+++ b/config-ui/src/pages/project/detail/panel/incoming-webhooks.tsx
@@ -16,10 +16,10 @@
*
*/
-import React, { useState, useMemo } from 'react';
+import { useState, useMemo } from 'react';
import { Button, Intent } from '@blueprintjs/core';
-import { NoData } from '@/components';
+import { Alert, NoData } from '@/components';
import type { WebhookItemType } from '@/plugins/register/webook';
import { WebhookCreateDialog, WebhookSelectorDialog, WebHookConnection } from '@/plugins/register/webook';
@@ -56,31 +56,44 @@ export const IncomingWebhooksPanel = ({
setType(undefined);
};
- if (!webhookIds.length) {
- return (
- <>
- <NoData
- text="Push `incidents` or `deployments` from your tools by incoming webhooks."
- action={
- <>
- <Button intent={Intent.PRIMARY} icon="plus" text="Add a Webhook" onClick={() => setType('create')} />
- <div style={{ margin: '8px 0' }}>or</div>
- <Button
- outlined
- intent={Intent.PRIMARY}
- text="Select Existing Webhooks"
- onClick={() => setType('selectExist')}
- />
- </>
- }
- />
- {type === 'create' && <WebhookCreateDialog isOpen onCancel={handleCancel} onSubmitAfter={onCreateWebhook} />}
- {type === 'selectExist' && (
- <WebhookSelectorDialog isOpen saving={saving} onCancel={handleCancel} onSubmit={onSelectWebhook} />
- )}
- </>
- );
- }
-
- return <WebHookConnection filterIds={webhookIds} onCreateAfter={onCreateWebhook} onDeleteAfter={onDeleteWebhook} />;
+ return (
+ <>
+ <Alert style={{ marginBottom: 24, color: '#3C5088' }}>
+ <div>
+ The data pushed by Webhooks will only be calculated for DORA in the next run of the Blueprint of this project
+ because DORA relies on the post-processing of "deployments," "incidents," and "pull requests" triggered by
+ running the blueprint.
+ </div>
+ <div style={{ marginTop: 16 }}>
+ To calculate DORA after receiving Webhook data immediately, you can visit the{' '}
+ <b style={{ textDecoration: 'underline' }}>Status tab</b> of the Blueprint page and click on Run Now.
+ </div>
+ </Alert>
+ {!webhookIds.length ? (
+ <>
+ <NoData
+ text="Push `incidents` or `deployments` from your tools by incoming webhooks."
+ action={
+ <>
+ <Button intent={Intent.PRIMARY} icon="plus" text="Add a Webhook" onClick={() => setType('create')} />
+ <div style={{ margin: '8px 0' }}>or</div>
+ <Button
+ outlined
+ intent={Intent.PRIMARY}
+ text="Select Existing Webhooks"
+ onClick={() => setType('selectExist')}
+ />
+ </>
+ }
+ />
+ {type === 'create' && <WebhookCreateDialog isOpen onCancel={handleCancel} onSubmitAfter={onCreateWebhook} />}
+ {type === 'selectExist' && (
+ <WebhookSelectorDialog isOpen saving={saving} onCancel={handleCancel} onSubmit={onSelectWebhook} />
+ )}
+ </>
+ ) : (
+ <WebHookConnection filterIds={webhookIds} onCreateAfter={onCreateWebhook} onDeleteAfter={onDeleteWebhook} />
+ )}
+ </>
+ );
};