This is an automated email from the ASF dual-hosted git repository.
likyh pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git
The following commit(s) were added to refs/heads/main by this push:
new 9f64ddf95 fix(config-ui): some bugs (#4076)
9f64ddf95 is described below
commit 9f64ddf9581c72cffb30c1fcb0b1819e98348d9c
Author: 青湛 <[email protected]>
AuthorDate: Fri Dec 30 16:06:22 2022 +0800
fix(config-ui): some bugs (#4076)
* fix(config-ui): miss inspector in historical pipelines
* fix(config-ui): optimize error message for create project
* fix(config-ui): the jenkins config
* fix(config-ui): the connection form set value error
---
config-ui/src/components/index.ts | 1 +
.../create => }/components/inspector/index.tsx | 19 +++++++-----
.../create => }/components/inspector/styled.ts | 0
.../src/pages/blueprint/create/components/index.ts | 1 -
config-ui/src/pages/blueprint/create/index.tsx | 13 ++++++---
.../detail/components/pipeline-list/index.tsx | 34 +++++++++++++++++-----
config-ui/src/pages/connection/form/index.tsx | 10 ++++---
config-ui/src/pages/project/home/use-project.ts | 1 +
config-ui/src/plugins/jenkins/config.ts | 6 ++--
9 files changed, 58 insertions(+), 27 deletions(-)
diff --git a/config-ui/src/components/index.ts
b/config-ui/src/components/index.ts
index 247d2bd0f..154c84a64 100644
--- a/config-ui/src/components/index.ts
+++ b/config-ui/src/components/index.ts
@@ -25,3 +25,4 @@ export * from './table';
export * from './toast';
export * from './logo';
export * from './card';
+export * from './inspector';
diff --git
a/config-ui/src/pages/blueprint/create/components/inspector/index.tsx
b/config-ui/src/components/inspector/index.tsx
similarity index 82%
rename from config-ui/src/pages/blueprint/create/components/inspector/index.tsx
rename to config-ui/src/components/inspector/index.tsx
index 102da0b02..d3b396dda 100644
--- a/config-ui/src/pages/blueprint/create/components/inspector/index.tsx
+++ b/config-ui/src/components/inspector/index.tsx
@@ -19,13 +19,16 @@
import React from 'react';
import { Drawer, DrawerSize, Classes, IconName } from '@blueprintjs/core';
-import { useCreateBP } from '../../bp-context';
-
import * as S from './styled';
-export const Inspector = () => {
- const { name, payload, showInspector, onChangeShowInspector } =
useCreateBP();
+interface Props {
+ isOpen: boolean;
+ data: any;
+ title?: string;
+ onClose?: () => void;
+}
+export const Inspector = ({ isOpen, data, title, onClose }: Props) => {
const props = {
icon: 'code' as IconName,
size: DrawerSize.SMALL,
@@ -35,9 +38,9 @@ export const Inspector = () => {
enforceFocus: true,
hasBackdrop: false,
usePortal: true,
- isOpen: showInspector,
- title: name,
- onClose: () => onChangeShowInspector(false),
+ isOpen,
+ title,
+ onClose,
};
return (
@@ -49,7 +52,7 @@ export const Inspector = () => {
</div>
<div className="content">
<code>
- <pre>{JSON.stringify(payload, null, ' ')}</pre>
+ <pre>{JSON.stringify(data, null, ' ')}</pre>
</code>
</div>
</S.Container>
diff --git
a/config-ui/src/pages/blueprint/create/components/inspector/styled.ts
b/config-ui/src/components/inspector/styled.ts
similarity index 100%
rename from config-ui/src/pages/blueprint/create/components/inspector/styled.ts
rename to config-ui/src/components/inspector/styled.ts
diff --git a/config-ui/src/pages/blueprint/create/components/index.ts
b/config-ui/src/pages/blueprint/create/components/index.ts
index c8f0986e8..b85355f10 100644
--- a/config-ui/src/pages/blueprint/create/components/index.ts
+++ b/config-ui/src/pages/blueprint/create/components/index.ts
@@ -18,4 +18,3 @@
export * from './workflow';
export * from './action';
-export * from './inspector';
diff --git a/config-ui/src/pages/blueprint/create/index.tsx
b/config-ui/src/pages/blueprint/create/index.tsx
index c09db257d..ccf58f3f3 100644
--- a/config-ui/src/pages/blueprint/create/index.tsx
+++ b/config-ui/src/pages/blueprint/create/index.tsx
@@ -19,13 +19,13 @@
import React, { useMemo } from 'react';
import { useParams } from 'react-router-dom';
-import { PageHeader } from '@/components';
+import { PageHeader, Inspector } from '@/components';
import { ConnectionContextProvider } from '@/store';
import { ModeEnum, FromEnum } from '../types';
import { BPContext, BPContextProvider } from './bp-context';
-import { WorkFlow, Action, Inspector } from './components';
+import { WorkFlow, Action } from './components';
import { StepOne } from './step-one';
import { StepTwo } from './step-two';
import { StepThree } from './step-three';
@@ -61,7 +61,7 @@ export const BlueprintCreatePage = ({ from }: Props) => {
<ConnectionContextProvider>
<BPContextProvider from={from} projectName={pname}>
<BPContext.Consumer>
- {({ step, mode }) => (
+ {({ step, mode, name, payload, showInspector, onChangeShowInspector
}) => (
<PageHeader breadcrumbs={breadcrumbs}>
<S.Container>
<WorkFlow />
@@ -74,7 +74,12 @@ export const BlueprintCreatePage = ({ from }: Props) => {
)}
</S.Content>
<Action />
- <Inspector />
+ <Inspector
+ isOpen={showInspector}
+ title={name}
+ data={payload}
+ onClose={() => onChangeShowInspector(false)}
+ />
</S.Container>
</PageHeader>
)}
diff --git
a/config-ui/src/pages/blueprint/detail/components/pipeline-list/index.tsx
b/config-ui/src/pages/blueprint/detail/components/pipeline-list/index.tsx
index 7f6607475..15637060f 100644
--- a/config-ui/src/pages/blueprint/detail/components/pipeline-list/index.tsx
+++ b/config-ui/src/pages/blueprint/detail/components/pipeline-list/index.tsx
@@ -16,13 +16,15 @@
*
*/
-import React, { useMemo } from 'react';
-import { ButtonGroup, Button, Icon, Intent, Colors, IconName } from
'@blueprintjs/core';
+import React, { useState, useMemo } from 'react';
+import { ButtonGroup, Button, Icon, Intent, Colors, Position, IconName } from
'@blueprintjs/core';
+import { Tooltip2 } from '@blueprintjs/popover2';
+import { pick } from 'lodash';
import { saveAs } from 'file-saver';
import styled from 'styled-components';
import { DEVLAKE_ENDPOINT } from '@/config';
-import { Card, Table, ColumnType, Loading } from '@/components';
+import { Card, Table, ColumnType, Loading, Inspector } from '@/components';
import { PipelineType, StatusEnum, STATUS_ICON, STATUS_LABEL, STATUS_CLS }
from '@/pages';
import { formatTime, duration } from '@/utils';
@@ -59,6 +61,9 @@ interface Props {
}
export const PipelineList = ({ pipelines }: Props) => {
+ const [isOpen, setIsOpen] = useState(false);
+ const [json, setJson] = useState<any>({});
+
const handleDownloadLog = async (id: ID) => {
const res = await API.getPipelineLog(id);
if (res) {
@@ -106,10 +111,22 @@ export const PipelineList = ({ pipelines }: Props) => {
title: '',
dataIndex: 'id',
key: 'action',
- render: (id: ID) => (
+ render: (id: ID, row) => (
<ButtonGroup>
- {/* <Button minimal intent={Intent.PRIMARY} icon='code' /> */}
- <Button minimal intent={Intent.PRIMARY} icon="document"
onClick={() => handleDownloadLog(id)} />
+ <Tooltip2 position={Position.TOP} intent={Intent.PRIMARY}
content="View JSON">
+ <Button
+ minimal
+ intent={Intent.PRIMARY}
+ icon="code"
+ onClick={() => {
+ setIsOpen(true);
+ setJson(pick(row, ['id', 'name', 'plan', 'skipOnFail']));
+ }}
+ />
+ </Tooltip2>
+ <Tooltip2 position={Position.TOP} intent={Intent.PRIMARY}
content="Download Log">
+ <Button minimal intent={Intent.PRIMARY} icon="document"
onClick={() => handleDownloadLog(id)} />
+ </Tooltip2>
{/* <Button minimal intent={Intent.PRIMARY} icon='chevron-right'
/> */}
</ButtonGroup>
),
@@ -121,6 +138,9 @@ export const PipelineList = ({ pipelines }: Props) => {
return !pipelines.length ? (
<Card>There are no historical runs associated with this blueprint.</Card>
) : (
- <Table columns={columns} dataSource={pipelines} />
+ <div>
+ <Table columns={columns} dataSource={pipelines} />
+ <Inspector isOpen={isOpen} title={`Pipeline ${json?.id}`} data={json}
onClose={() => setIsOpen(false)} />
+ </div>
);
};
diff --git a/config-ui/src/pages/connection/form/index.tsx
b/config-ui/src/pages/connection/form/index.tsx
index 51efc4e6d..66c243c2a 100644
--- a/config-ui/src/pages/connection/form/index.tsx
+++ b/config-ui/src/pages/connection/form/index.tsx
@@ -71,10 +71,12 @@ export const ConnectionFormPage = () => {
}, [initialValues, connection]);
useEffect(() => {
- setForm({
- ...form,
- token: Object.values(githubTokens).filter(Boolean).join(','),
- });
+ if (plugin === Plugins.GitHub) {
+ setForm({
+ ...form,
+ token: Object.values(githubTokens).filter(Boolean).join(','),
+ });
+ }
}, [githubTokens]);
const error = useMemo(
diff --git a/config-ui/src/pages/project/home/use-project.ts
b/config-ui/src/pages/project/home/use-project.ts
index 14c837b61..f54f15095 100644
--- a/config-ui/src/pages/project/home/use-project.ts
+++ b/config-ui/src/pages/project/home/use-project.ts
@@ -66,6 +66,7 @@ export const useProject = <T>({ name, enableDora,
onHideDialog }: Props) => {
const [success] = await operator(() => API.createProject(payload), {
setOperating,
+ formatReason: () => 'This project name is been used. Please use a new
one.',
});
if (success) {
diff --git a/config-ui/src/plugins/jenkins/config.ts
b/config-ui/src/plugins/jenkins/config.ts
index d900b60cf..6069d09f8 100644
--- a/config-ui/src/plugins/jenkins/config.ts
+++ b/config-ui/src/plugins/jenkins/config.ts
@@ -33,14 +33,14 @@ export const JenkinsConfig: PluginConfigType = {
label: 'Connection Name',
type: 'text',
required: true,
- placeholder: 'eg. GitLab',
+ placeholder: 'eg. Jenkins',
},
{
key: 'endpoint',
label: 'Endpoint URL',
type: 'text',
required: true,
- placeholder: 'eg. https://gitlab.com/api/v4/',
+ placeholder: 'eg. https://api.jenkins.io/',
},
{
key: 'username',
@@ -54,7 +54,7 @@ export const JenkinsConfig: PluginConfigType = {
label: 'Password',
type: 'password',
required: true,
- placeholder: 'eg. ************",',
+ placeholder: 'eg. ************',
},
{
key: 'proxy',
