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 3749e510c refactor(config-ui): adjust the transformation (#5062)
3749e510c is described below
commit 3749e510c344f14af687e45a9bedc0065ad4ae21
Author: 青湛 <[email protected]>
AuthorDate: Fri Apr 28 20:02:35 2023 +0800
refactor(config-ui): adjust the transformation (#5062)
* refactor(config-ui): adjust the transformation for bitbucket
* refactor(config-ui): adjust the transformation for additional settings
* refactor(config-ui): adjust the transformation for cicd
* feat(config-ui): turn on showSelectAll on jenkins miller columns
---
.../fields/additional-settings.tsx | 97 +++++++++++
.../transformation-form/fields/index.ts} | 22 +--
.../transformation-form/fields/styled.ts} | 48 ++++--
.../components/transformation-form/index.tsx | 14 +-
config-ui/src/plugins/register/azure/styled.ts | 32 ----
.../src/plugins/register/azure/transformation.tsx | 79 +--------
config-ui/src/plugins/register/bitbucket/styled.ts | 42 +----
.../plugins/register/bitbucket/transformation.tsx | 190 ++++++---------------
config-ui/src/plugins/register/github/styled.ts | 32 ----
.../src/plugins/register/github/transformation.tsx | 80 +--------
.../src/plugins/register/gitlab/transformation.tsx | 17 +-
.../jenkins/components/miller-columns/index.tsx | 1 +
.../src/plugins/register/jenkins/data-scope.tsx | 2 -
.../plugins/register/jenkins/transformation.tsx | 17 +-
14 files changed, 235 insertions(+), 438 deletions(-)
diff --git
a/config-ui/src/plugins/components/transformation-form/fields/additional-settings.tsx
b/config-ui/src/plugins/components/transformation-form/fields/additional-settings.tsx
new file mode 100644
index 000000000..dba4315d6
--- /dev/null
+++
b/config-ui/src/plugins/components/transformation-form/fields/additional-settings.tsx
@@ -0,0 +1,97 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You 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 { useState } from 'react';
+import { Switch, InputGroup } from '@blueprintjs/core';
+
+import { ExternalLink, HelpTooltip } from '@/components';
+
+import * as S from './styled';
+
+interface Props {
+ transformation: any;
+ setTransformation: React.Dispatch<React.SetStateAction<any>>;
+}
+
+export const AdditionalSettings = ({ transformation, setTransformation }:
Props) => {
+ const [enable, setEnable] = useState(true);
+
+ const handleChange = (e: React.FormEvent<HTMLInputElement>) => {
+ const checked = (e.target as HTMLInputElement).checked;
+
+ if (!checked) {
+ setTransformation({
+ ...transformation,
+ refdiff: null,
+ });
+ }
+
+ setEnable(checked);
+ };
+
+ return (
+ <S.AdditionalSettings>
+ <h2>
+ <span>Additional Settings</span>
+ <Switch alignIndicator="right" inline checked={enable}
onChange={handleChange} />
+ </h2>
+ {enable && (
+ <>
+ <p>
+ Enable the <ExternalLink
link="https://devlake.apache.org/docs/Plugins/refdiff";>RefDiff</ExternalLink>{'
'}
+ plugin to pre-calculate version-based metrics
+ <HelpTooltip content="Calculate the commits diff between two
consecutive tags that match the following RegEx. Issues closed by PRs which
contain these commits will also be calculated. The result will be shown in
table.refs_commits_diffs and table.refs_issues_diffs." />
+ </p>
+ <div className="refdiff">
+ Compare the last
+ <InputGroup
+ style={{ width: 60 }}
+ placeholder="10"
+ value={transformation.refdiff?.tagsLimit ?? ''}
+ onChange={(e) =>
+ setTransformation({
+ ...transformation,
+ refdiff: {
+ ...transformation?.refdiff,
+ tagsLimit: e.target.value,
+ },
+ })
+ }
+ />
+ tags that match the
+ <InputGroup
+ style={{ width: 200 }}
+ placeholder="(regex)$"
+ value={transformation.refdiff?.tagsPattern ?? ''}
+ onChange={(e) =>
+ setTransformation({
+ ...transformation,
+ refdiff: {
+ ...transformation?.refdiff,
+ tagsPattern: e.target.value,
+ },
+ })
+ }
+ />
+ for calculation
+ </div>
+ </>
+ )}
+ </S.AdditionalSettings>
+ );
+};
diff --git a/config-ui/src/plugins/register/jenkins/data-scope.tsx
b/config-ui/src/plugins/components/transformation-form/fields/index.ts
similarity index 58%
copy from config-ui/src/plugins/register/jenkins/data-scope.tsx
copy to config-ui/src/plugins/components/transformation-form/fields/index.ts
index ff64d6d08..f4a5a16e6 100644
--- a/config-ui/src/plugins/register/jenkins/data-scope.tsx
+++ b/config-ui/src/plugins/components/transformation-form/fields/index.ts
@@ -16,24 +16,4 @@
*
*/
-import React from 'react';
-
-import type { ScopeItemType } from './types';
-
-import { MillerColumns } from './components';
-
-interface Props {
- connectionId: ID;
- selectedItems: ScopeItemType[];
- onChangeItems: (selectedItems: ScopeItemType[]) => void;
-}
-
-export const JenkinsDataScope = ({ connectionId, selectedItems, onChangeItems
}: Props) => {
- return (
- <>
- <h3>Jobs *</h3>
- <p>Select the jobs you would like to sync.</p>
- <MillerColumns connectionId={connectionId} selectedItems={selectedItems}
onChangeItems={onChangeItems} />
- </>
- );
-};
+export * from './additional-settings';
diff --git a/config-ui/src/plugins/register/jenkins/data-scope.tsx
b/config-ui/src/plugins/components/transformation-form/fields/styled.ts
similarity index 58%
copy from config-ui/src/plugins/register/jenkins/data-scope.tsx
copy to config-ui/src/plugins/components/transformation-form/fields/styled.ts
index ff64d6d08..67b74fac5 100644
--- a/config-ui/src/plugins/register/jenkins/data-scope.tsx
+++ b/config-ui/src/plugins/components/transformation-form/fields/styled.ts
@@ -15,25 +15,39 @@
* limitations under the License.
*
*/
+import styled from 'styled-components';
-import React from 'react';
+export const AdditionalSettings = styled.div`
+ h2 {
+ display: flex;
+ align-items: center;
-import type { ScopeItemType } from './types';
+ .bp4-switch {
+ margin: 0;
+ }
+ }
-import { MillerColumns } from './components';
+ .radio {
+ display: flex;
+ align-items: center;
+ margin: 8px 0 16px;
-interface Props {
- connectionId: ID;
- selectedItems: ScopeItemType[];
- onChangeItems: (selectedItems: ScopeItemType[]) => void;
-}
+ p {
+ margin: 0;
+ }
-export const JenkinsDataScope = ({ connectionId, selectedItems, onChangeItems
}: Props) => {
- return (
- <>
- <h3>Jobs *</h3>
- <p>Select the jobs you would like to sync.</p>
- <MillerColumns connectionId={connectionId} selectedItems={selectedItems}
onChangeItems={onChangeItems} />
- </>
- );
-};
+ .bp4-control {
+ margin: 0;
+ }
+ }
+
+ .refdiff {
+ display: flex;
+ align-items: center;
+ padding-left: 20px;
+
+ .bp4-input-group {
+ margin: 0 8px;
+ }
+ }
+`;
diff --git a/config-ui/src/plugins/components/transformation-form/index.tsx
b/config-ui/src/plugins/components/transformation-form/index.tsx
index 6a970af19..4b20f9394 100644
--- a/config-ui/src/plugins/components/transformation-form/index.tsx
+++ b/config-ui/src/plugins/components/transformation-form/index.tsx
@@ -19,7 +19,7 @@
import { useEffect, useMemo, useState } from 'react';
import { Button, InputGroup, Intent } from '@blueprintjs/core';
-import { Card, ExternalLink, PageLoading } from '@/components';
+import { Card, ExternalLink, PageLoading, Divider } from '@/components';
import { useRefreshData } from '@/hooks';
import { operator } from '@/utils';
import { getPluginConfig } from '@/plugins';
@@ -29,11 +29,12 @@ import { GitLabTransformation } from
'@/plugins/register/gitlab';
import { JenkinsTransformation } from '@/plugins/register/jenkins';
import { BitbucketTransformation } from '@/plugins/register/bitbucket';
import { AzureTransformation } from '@/plugins/register/azure';
+import { TapdTransformation } from '@/plugins/register/tapd';
import { TIPS_MAP } from './misc';
+import { AdditionalSettings } from './fields';
import * as API from './api';
import * as S from './styled';
-import { TapdTransformation } from '@/plugins/register/tapd';
interface Props {
plugin: string;
@@ -47,6 +48,7 @@ export const TransformationForm = ({ plugin, connectionId,
scopeId, id, onCancel
const [saving, setSaving] = useState(false);
const [name, setName] = useState('');
const [transformation, setTransformation] = useState({});
+ const [hasRefDiff, setHasRefDiff] = useState(false);
const config = useMemo(() => getPluginConfig(plugin), []);
@@ -57,6 +59,7 @@ export const TransformationForm = ({ plugin, connectionId,
scopeId, id, onCancel
useEffect(() => {
setTransformation(data ?? config.transformation);
+ setHasRefDiff(!!config.transformation.refdiff);
setName(data?.name ?? '');
}, [data, config.transformation]);
@@ -133,6 +136,13 @@ export const TransformationForm = ({ plugin, connectionId,
scopeId, id, onCancel
setTransformation={setTransformation}
/>
)}
+
+ {hasRefDiff && (
+ <>
+ <Divider />
+ <AdditionalSettings transformation={transformation}
setTransformation={setTransformation} />
+ </>
+ )}
</Card>
<S.Btns>
diff --git a/config-ui/src/plugins/register/azure/styled.ts
b/config-ui/src/plugins/register/azure/styled.ts
index 323e34a07..d8292a869 100644
--- a/config-ui/src/plugins/register/azure/styled.ts
+++ b/config-ui/src/plugins/register/azure/styled.ts
@@ -19,38 +19,6 @@
import styled from 'styled-components';
export const Transfromation = styled.div`
- .additional-settings {
- h2 {
- display: flex;
- align-items: center;
- cursor: pointer;
- }
-
- .radio {
- display: flex;
- align-items: center;
- margin: 8px 0 16px;
-
- p {
- margin: 0;
- }
-
- .bp4-control {
- margin: 0;
- }
- }
-
- .refdiff {
- display: flex;
- align-items: center;
- padding-left: 20px;
-
- .bp4-input-group {
- margin: 0 8px;
- }
- }
- }
-
.bp4-form-group {
display: flex;
align-items: center;
diff --git a/config-ui/src/plugins/register/azure/transformation.tsx
b/config-ui/src/plugins/register/azure/transformation.tsx
index 35a21e346..47205e82e 100644
--- a/config-ui/src/plugins/register/azure/transformation.tsx
+++ b/config-ui/src/plugins/register/azure/transformation.tsx
@@ -17,9 +17,9 @@
*/
import React, { useState, useEffect } from 'react';
-import { Tag, Switch, Radio, InputGroup, Icon, Collapse, Intent } from
'@blueprintjs/core';
+import { Tag, Switch, InputGroup, Intent } from '@blueprintjs/core';
-import { Divider, ExternalLink, HelpTooltip } from '@/components';
+import { ExternalLink, HelpTooltip } from '@/components';
import * as S from './styled';
@@ -30,41 +30,25 @@ interface Props {
export const AzureTransformation = ({ transformation, setTransformation }:
Props) => {
const [enableCICD, setEnableCICD] = useState(true);
- const [openAdditionalSettings, setOpenAdditionalSettings] = useState(false);
useEffect(() => {
- if (transformation.refdiff) {
- setOpenAdditionalSettings(true);
+ if (!transformation.deploymentPattern) {
+ setEnableCICD(false);
}
}, [transformation]);
const handleChangeCICDEnable = (e: React.FormEvent<HTMLInputElement>) => {
const checked = (e.target as HTMLInputElement).checked;
- if (checked) {
- setTransformation({
- ...transformation,
- deploymentPattern: '(deploy|push-image)',
- productionPattern: 'production',
- });
- } else {
+ if (!checked) {
setTransformation({
...transformation,
deploymentPattern: undefined,
productionPattern: undefined,
});
}
- setEnableCICD(checked);
- };
- const handleChangeAdditionalSettingsOpen = () => {
- setOpenAdditionalSettings(!openAdditionalSettings);
- if (!openAdditionalSettings) {
- setTransformation({
- ...transformation,
- refdiff: null,
- });
- }
+ setEnableCICD(checked);
};
return (
@@ -129,57 +113,6 @@ export const AzureTransformation = ({ transformation,
setTransformation }: Props
</>
)}
</S.CICD>
- <Divider />
- {/* Additional Settings */}
- <div className="additional-settings">
- <h2 onClick={handleChangeAdditionalSettingsOpen}>
- <Icon icon={!openAdditionalSettings ? 'chevron-up' : 'chevron-down'}
size={18} />
- <span>Additional Settings</span>
- </h2>
- <Collapse isOpen={openAdditionalSettings}>
- <div className="radio">
- <Radio defaultChecked />
- <p>
- Enable the <ExternalLink
link="https://devlake.apache.org/docs/Plugins/refdiff";>RefDiff</ExternalLink>{'
'}
- plugin to pre-calculate version-based metrics
- <HelpTooltip content="Calculate the commits diff between two
consecutive tags that match the following RegEx. Issues closed by PRs which
contain these commits will also be calculated. The result will be shown in
table.refs_commits_diffs and table.refs_issues_diffs." />
- </p>
- </div>
- <div className="refdiff">
- Compare the last
- <InputGroup
- style={{ width: 60 }}
- placeholder="10"
- value={transformation.refdiff?.tagsLimit}
- onChange={(e) =>
- setTransformation({
- ...transformation,
- refdiff: {
- ...transformation?.refdiff,
- tagsLimit: e.target.value,
- },
- })
- }
- />
- tags that match the
- <InputGroup
- style={{ width: 200 }}
- placeholder="v\d+\.\d+(\.\d+(-rc)*\d*)*$"
- value={transformation.refdiff?.tagsPattern}
- onChange={(e) =>
- setTransformation({
- ...transformation,
- refdiff: {
- ...transformation?.refdiff,
- tagsPattern: e.target.value,
- },
- })
- }
- />
- for calculation
- </div>
- </Collapse>
- </div>
</S.Transfromation>
);
};
diff --git a/config-ui/src/plugins/register/bitbucket/styled.ts
b/config-ui/src/plugins/register/bitbucket/styled.ts
index c17e78cc6..402967310 100644
--- a/config-ui/src/plugins/register/bitbucket/styled.ts
+++ b/config-ui/src/plugins/register/bitbucket/styled.ts
@@ -31,38 +31,6 @@ export const Transformation = styled.div`
}
}
- .additional-settings {
- h2 {
- display: flex;
- align-items: center;
- cursor: pointer;
- }
-
- .radio {
- display: flex;
- align-items: center;
- margin: 8px 0 16px;
-
- p {
- margin: 0;
- }
-
- .bp4-control {
- margin: 0;
- }
- }
-
- .refdiff {
- display: flex;
- align-items: center;
- padding-left: 20px;
-
- .bp4-input-group {
- margin: 0 8px;
- }
- }
- }
-
.bp4-form-group {
display: flex;
align-items: center;
@@ -94,12 +62,14 @@ export const CICD = styled.div`
}
}
- .text {
+ .text,
+ .sub-text {
display: flex;
align-items: baseline;
+ margin-bottom: 8px;
+ }
- .bp4-radio {
- margin-right: 0;
- }
+ .sub-text {
+ padding-left: 28px;
}
`;
diff --git a/config-ui/src/plugins/register/bitbucket/transformation.tsx
b/config-ui/src/plugins/register/bitbucket/transformation.tsx
index c8668c19f..2a13cb554 100644
--- a/config-ui/src/plugins/register/bitbucket/transformation.tsx
+++ b/config-ui/src/plugins/register/bitbucket/transformation.tsx
@@ -17,7 +17,7 @@
*/
import React, { useMemo, useState, useEffect } from 'react';
-import { FormGroup, InputGroup, Tag, Radio, Icon, Collapse, Intent, Switch }
from '@blueprintjs/core';
+import { FormGroup, InputGroup, Tag, Intent, Checkbox } from
'@blueprintjs/core';
import { ExternalLink, HelpTooltip, Divider, MultiSelector } from
'@/components';
@@ -32,15 +32,10 @@ interface Props {
const ALL_STATES = ['new', 'open', 'resolved', 'closed', 'on hold', 'wontfix',
'duplicate', 'invalid'];
export const BitbucketTransformation = ({ transformation, setTransformation }:
Props) => {
- const [enableCICD, setEnableCICD] = useState(true);
const [useCustom, setUseCustom] = useState(false);
- const [openAdditionalSettings, setOpenAdditionalSettings] = useState(false);
useEffect(() => {
- if (transformation.refdiff) {
- setOpenAdditionalSettings(true);
- }
- if (transformation.deploymentPattern) {
+ if (transformation.deploymentPattern || transformation.productionPattern) {
setUseCustom(true);
} else {
setUseCustom(false);
@@ -57,52 +52,18 @@ export const BitbucketTransformation = ({ transformation,
setTransformation }: P
[transformation],
);
- const handleChangeUseCustom = (uc: boolean) => {
- if (!uc) {
- setTransformation({
- ...transformation,
- deploymentPattern: '',
- productionPattern: '',
- });
- } else {
- setTransformation({
- ...transformation,
- deploymentPattern: '(deploy|push-image)',
- productionPattern: '',
- });
- }
-
- setUseCustom(uc);
- };
-
- const handleChangeCICDEnable = (e: React.FormEvent<HTMLInputElement>) => {
+ const handleChangeUseCustom = (e: React.FormEvent<HTMLInputElement>) => {
const checked = (e.target as HTMLInputElement).checked;
- if (checked) {
- setUseCustom(false);
+ if (!checked) {
setTransformation({
...transformation,
deploymentPattern: '',
productionPattern: '',
});
- } else {
- setTransformation({
- ...transformation,
- deploymentPattern: undefined,
- productionPattern: undefined,
- });
}
- setEnableCICD(checked);
- };
- const handleChangeAdditionalSettingsOpen = () => {
- setOpenAdditionalSettings(!openAdditionalSettings);
- if (!openAdditionalSettings) {
- setTransformation({
- ...transformation,
- refdiff: null,
- });
- }
+ setUseCustom(checked);
};
return (
@@ -182,98 +143,59 @@ export const BitbucketTransformation = ({ transformation,
setTransformation }: P
<Tag minimal intent={Intent.PRIMARY} style={{ marginLeft: 8 }}>
DORA
</Tag>
- <div className="switch">
- <span>Enable</span>
- <Switch alignIndicator="right" inline checked={enableCICD}
onChange={handleChangeCICDEnable} />
- </div>
</h3>
- {enableCICD && (
- <>
- <p>
- Use Regular Expression to define Deployments in DevLake in order
to measure DORA metrics.{' '}
- <ExternalLink
link="https://devlake.apache.org/docs/Configuration/GitHub#step-3---adding-transformation-rules-optional";>
- Learn more
- </ExternalLink>
- </p>
- <div style={{ margin: '16px 0' }}>Convert a BitBucket Pipeline as
a DevLake Deployment when: </div>
- <div className="text">
- <Radio checked={!useCustom} onChange={() =>
handleChangeUseCustom(false)} />
- <span>It has one or more BitBucket deployments. See the
example.</span>
- <HelpTooltip content={<img src={ExampleJpg} alt="" width={400}
/>} />
- </div>
- <div className="text">
- <Radio checked={useCustom} onChange={() =>
handleChangeUseCustom(true)} />
- <div style={{ display: 'flex', alignItems: 'center' }}>
- <span>Its branch/tag name or one of its pipeline steps’ names
matches</span>
- <InputGroup
- style={{ width: 200, margin: '0 8px' }}
- placeholder="(deploy|push-image)"
- value={transformation.deploymentPattern ?? ''}
- onChange={(e) =>
- setTransformation({
- ...transformation,
- deploymentPattern: e.target.value,
- productionPattern: !e.target.value ? '' :
transformation.productionPattern,
- })
- }
- />
- <HelpTooltip content="If you leave this field empty, all
DevLake Deployments will be tagged as in the Production environment. " />
- </div>
- </div>
- </>
- )}
+ <p style={{ marginBottom: 16 }}>
+ Use Regular Expression to define Deployments in DevLake in order to
measure DORA metrics.{' '}
+ <ExternalLink
link="https://devlake.apache.org/docs/Configuration/GitHub#step-3---adding-transformation-rules-optional";>
+ Learn more
+ </ExternalLink>
+ </p>
+ <div className="text">
+ <Checkbox disabled checked />
+ <span>Convert a BitBucket Deployment to a DevLake Deployment </span>
+ <HelpTooltip content={<img src={ExampleJpg} alt="" width={400} />} />
+ </div>
+ <div className="text">
+ <Checkbox checked={useCustom} onChange={handleChangeUseCustom} />
+ <span>
+ Convert a BitBucket Pipeline to a DevLake Deployment when its
branch/tag name or one of its pipeline steps’
+ names
+ </span>
+ </div>
+ <div className="sub-text">
+ <span>matches</span>
+ <InputGroup
+ style={{ width: 200, margin: '0 8px' }}
+ placeholder="(deploy|push-image)"
+ value={transformation.deploymentPattern ?? ''}
+ onChange={(e) =>
+ setTransformation({
+ ...transformation,
+ deploymentPattern: e.target.value,
+ productionPattern: !e.target.value ? '' :
transformation.productionPattern,
+ })
+ }
+ />
+ <span>.</span>
+ <HelpTooltip content="View your BitBucket Pipelines:
https://support.atlassian.com/bitbucket-cloud/docs/view-your-pipeline/"; />
+ </div>
+ <div className="sub-text">
+ <span>If the name also matches</span>
+ <InputGroup
+ style={{ width: 200, margin: '0 8px' }}
+ placeholder="prod(.*)"
+ value={transformation.productionPattern ?? ''}
+ onChange={(e) =>
+ setTransformation({
+ ...transformation,
+ productionPattern: e.target.value,
+ })
+ }
+ />
+ <span>, this Deployment is a ‘Production Deployment’</span>
+ <HelpTooltip content="If you leave this field empty, all Deployments
will be tagged as in the Production environment. " />
+ </div>
</S.CICD>
- <Divider />
- {/* Additional Settings */}
- <div className="additional-settings">
- <h2 onClick={handleChangeAdditionalSettingsOpen}>
- <Icon icon={!openAdditionalSettings ? 'chevron-up' : 'chevron-down'}
size={18} />
- <span>Additional Settings</span>
- </h2>
- <Collapse isOpen={openAdditionalSettings}>
- <div className="radio">
- <Radio defaultChecked />
- <p>
- Enable the <ExternalLink
link="https://devlake.apache.org/docs/Plugins/refdiff";>RefDiff</ExternalLink>{'
'}
- plugin to pre-calculate version-based metrics
- <HelpTooltip content="Calculate the commits diff between two
consecutive tags that match the following RegEx. Issues closed by PRs which
contain these commits will also be calculated. The result will be shown in
table.refs_commits_diffs and table.refs_issues_diffs." />
- </p>
- </div>
- <div className="refdiff">
- Compare the last
- <InputGroup
- style={{ width: 60 }}
- placeholder="10"
- value={transformation.refdiff?.tagsLimit}
- onChange={(e) =>
- setTransformation({
- ...transformation,
- refdiff: {
- ...transformation?.refdiff,
- tagsLimit: e.target.value,
- },
- })
- }
- />
- tags that match the
- <InputGroup
- style={{ width: 200 }}
- placeholder="v\d+\.\d+(\.\d+(-rc)*\d*)*$"
- value={transformation.refdiff?.tagsPattern}
- onChange={(e) =>
- setTransformation({
- ...transformation,
- refdiff: {
- ...transformation?.refdiff,
- tagsPattern: e.target.value,
- },
- })
- }
- />
- for calculation
- </div>
- </Collapse>
- </div>
</S.Transformation>
);
};
diff --git a/config-ui/src/plugins/register/github/styled.ts
b/config-ui/src/plugins/register/github/styled.ts
index 08cc93834..5c7dddadf 100644
--- a/config-ui/src/plugins/register/github/styled.ts
+++ b/config-ui/src/plugins/register/github/styled.ts
@@ -37,38 +37,6 @@ export const Transformation = styled.div`
}
}
- .additional-settings {
- h2 {
- display: flex;
- align-items: center;
- cursor: pointer;
- }
-
- .radio {
- display: flex;
- align-items: center;
- margin: 8px 0 16px;
-
- p {
- margin: 0;
- }
-
- .bp4-control {
- margin: 0;
- }
- }
-
- .refdiff {
- display: flex;
- align-items: center;
- padding-left: 20px;
-
- .bp4-input-group {
- margin: 0 8px;
- }
- }
- }
-
.bp4-form-group {
display: flex;
align-items: center;
diff --git a/config-ui/src/plugins/register/github/transformation.tsx
b/config-ui/src/plugins/register/github/transformation.tsx
index 088216312..e8762e588 100644
--- a/config-ui/src/plugins/register/github/transformation.tsx
+++ b/config-ui/src/plugins/register/github/transformation.tsx
@@ -17,7 +17,7 @@
*/
import React, { useState, useEffect } from 'react';
-import { FormGroup, InputGroup, TextArea, Tag, Switch, Radio, Icon, Collapse,
Intent, Colors } from '@blueprintjs/core';
+import { FormGroup, InputGroup, TextArea, Tag, Switch, Icon, Intent, Colors }
from '@blueprintjs/core';
import { ExternalLink, HelpTooltip, Divider } from '@/components';
@@ -30,41 +30,25 @@ interface Props {
export const GitHubTransformation = ({ transformation, setTransformation }:
Props) => {
const [enableCICD, setEnableCICD] = useState(true);
- const [openAdditionalSettings, setOpenAdditionalSettings] = useState(false);
useEffect(() => {
- if (transformation.refdiff) {
- setOpenAdditionalSettings(true);
+ if (!transformation.deploymentPattern) {
+ setEnableCICD(false);
}
}, [transformation]);
- const handleChangeCICDEnable = (e: React.FormEvent<HTMLInputElement>) => {
+ const handleChangeEnableCICD = (e: React.FormEvent<HTMLInputElement>) => {
const checked = (e.target as HTMLInputElement).checked;
- if (checked) {
- setTransformation({
- ...transformation,
- deploymentPattern: '(deploy|push-image)',
- productionPattern: 'production',
- });
- } else {
+ if (!checked) {
setTransformation({
...transformation,
deploymentPattern: undefined,
productionPattern: undefined,
});
}
- setEnableCICD(checked);
- };
- const handleChangeAdditionalSettingsOpen = () => {
- setOpenAdditionalSettings(!openAdditionalSettings);
- if (!openAdditionalSettings) {
- setTransformation({
- ...transformation,
- refdiff: null,
- });
- }
+ setEnableCICD(checked);
};
return (
@@ -206,7 +190,7 @@ export const GitHubTransformation = ({ transformation,
setTransformation }: Prop
</Tag>
<div className="switch">
<span>Enable</span>
- <Switch alignIndicator="right" inline checked={enableCICD}
onChange={handleChangeCICDEnable} />
+ <Switch alignIndicator="right" inline checked={enableCICD}
onChange={handleChangeEnableCICD} />
</div>
</h3>
{enableCICD && (
@@ -353,56 +337,6 @@ export const GitHubTransformation = ({ transformation,
setTransformation }: Prop
/>
</FormGroup>
</div>
- <Divider />
- {/* Additional Settings */}
- <div className="additional-settings">
- <h2 onClick={handleChangeAdditionalSettingsOpen}>
- <Icon icon={!openAdditionalSettings ? 'chevron-up' : 'chevron-down'}
size={18} />
- <span>Additional Settings</span>
- </h2>
- <Collapse isOpen={openAdditionalSettings}>
- <div className="radio">
- <Radio defaultChecked />
- <p>
- Enable the <ExternalLink
link="https://devlake.apache.org/docs/Plugins/refdiff";>RefDiff</ExternalLink>{'
'}
- plugin to pre-calculate version-based metrics
- <HelpTooltip content="Calculate the commits diff between two
consecutive tags that match the following RegEx. Issues closed by PRs which
contain these commits will also be calculated. The result will be shown in
table.refs_commits_diffs and table.refs_issues_diffs." />
- </p>
- </div>
- <div className="refdiff">
- Compare the last
- <InputGroup
- style={{ width: 60 }}
- value={transformation.refdiff?.tagsLimit ?? ''}
- onChange={(e) =>
- setTransformation({
- ...transformation,
- refdiff: {
- ...transformation?.refdiff,
- tagsLimit: e.target.value,
- },
- })
- }
- />
- tags that match the
- <InputGroup
- style={{ width: 200 }}
- placeholder="(regex)$"
- value={transformation.refdiff?.tagsPattern ?? ''}
- onChange={(e) =>
- setTransformation({
- ...transformation,
- refdiff: {
- ...transformation?.refdiff,
- tagsPattern: e.target.value,
- },
- })
- }
- />
- for calculation
- </div>
- </Collapse>
- </div>
</S.Transformation>
);
};
diff --git a/config-ui/src/plugins/register/gitlab/transformation.tsx
b/config-ui/src/plugins/register/gitlab/transformation.tsx
index 6c6dbdac1..78a1ecd31 100644
--- a/config-ui/src/plugins/register/gitlab/transformation.tsx
+++ b/config-ui/src/plugins/register/gitlab/transformation.tsx
@@ -16,7 +16,7 @@
*
*/
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
import { Tag, Intent, Switch, InputGroup } from '@blueprintjs/core';
import { ExternalLink, HelpTooltip } from '@/components';
@@ -31,22 +31,23 @@ interface Props {
export const GitLabTransformation = ({ transformation, setTransformation }:
Props) => {
const [enableCICD, setEnableCICD] = useState(true);
+ useEffect(() => {
+ if (!transformation.deploymentPattern) {
+ setEnableCICD(false);
+ }
+ }, [transformation]);
+
const handleChangeCICDEnable = (e: React.FormEvent<HTMLInputElement>) => {
const checked = (e.target as HTMLInputElement).checked;
- if (checked) {
- setTransformation({
- ...transformation,
- deploymentPattern: '(deploy|push-image)',
- productionPattern: 'production',
- });
- } else {
+ if (!checked) {
setTransformation({
...transformation,
deploymentPattern: undefined,
productionPattern: undefined,
});
}
+
setEnableCICD(checked);
};
diff --git
a/config-ui/src/plugins/register/jenkins/components/miller-columns/index.tsx
b/config-ui/src/plugins/register/jenkins/components/miller-columns/index.tsx
index 5851f6d94..ca3827e05 100644
--- a/config-ui/src/plugins/register/jenkins/components/miller-columns/index.tsx
+++ b/config-ui/src/plugins/register/jenkins/components/miller-columns/index.tsx
@@ -67,6 +67,7 @@ export const MillerColumns = ({ connectionId, selectedItems,
onChangeItems }: Pr
return (
<MillerColumnsSelect
+ showSelectAll
items={items}
getCanExpand={(it) => it.type === 'folder'}
onExpand={onExpand}
diff --git a/config-ui/src/plugins/register/jenkins/data-scope.tsx
b/config-ui/src/plugins/register/jenkins/data-scope.tsx
index ff64d6d08..615447ebf 100644
--- a/config-ui/src/plugins/register/jenkins/data-scope.tsx
+++ b/config-ui/src/plugins/register/jenkins/data-scope.tsx
@@ -16,8 +16,6 @@
*
*/
-import React from 'react';
-
import type { ScopeItemType } from './types';
import { MillerColumns } from './components';
diff --git a/config-ui/src/plugins/register/jenkins/transformation.tsx
b/config-ui/src/plugins/register/jenkins/transformation.tsx
index f2d8dc586..627ae6f23 100644
--- a/config-ui/src/plugins/register/jenkins/transformation.tsx
+++ b/config-ui/src/plugins/register/jenkins/transformation.tsx
@@ -16,7 +16,7 @@
*
*/
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
import { Tag, Intent, Switch, InputGroup } from '@blueprintjs/core';
import * as S from './styled';
@@ -30,22 +30,23 @@ interface Props {
export const JenkinsTransformation = ({ transformation, setTransformation }:
Props) => {
const [enableCICD, setEnableCICD] = useState(true);
+ useEffect(() => {
+ if (!transformation.deploymentPattern) {
+ setEnableCICD(false);
+ }
+ }, [transformation]);
+
const handleChangeCICDEnable = (e: React.FormEvent<HTMLInputElement>) => {
const checked = (e.target as HTMLInputElement).checked;
- if (checked) {
- setTransformation({
- ...transformation,
- deploymentPattern: '(deploy|push-image)',
- productionPattern: 'production',
- });
- } else {
+ if (!checked) {
setTransformation({
...transformation,
deploymentPattern: undefined,
productionPattern: undefined,
});
}
+
setEnableCICD(checked);
};
