@devtron-labs/devtron-fe-common-lib 0.0.7-beta-50 → 0.0.7-beta-51

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/Common/CustomTagSelector/ValidationRules.d.ts +1 -1
  2. package/dist/Common/Dialogs/Types.d.ts +1 -0
  3. package/dist/index.js +32 -24
  4. package/package.json +1 -1
  5. package/src/Common/CustomTagSelector/TagDetails.tsx +2 -2
  6. package/src/Common/CustomTagSelector/TagLabelSelect.tsx +5 -1
  7. package/src/Common/CustomTagSelector/TagLabelValueSelector.tsx +2 -2
  8. package/src/Common/CustomTagSelector/ValidationRules.ts +21 -17
  9. package/src/Common/Dialogs/DeleteDialog.tsx +45 -27
  10. package/src/Common/Dialogs/Types.ts +1 -0
  11. /package/src/Assets/Img/{warning-medium.svg → delete-medium.svg} +0 -0
package/dist/Common/CustomTagSelector/ValidationRules.d.ts CHANGED
@@ -3,7 +3,7 @@ export declare class ValidationRules {
3
3
  isValid: boolean;
4
4
  messages: string[];
5
5
  };
6
- propagateTagValue: (value: string) => {
6
+ propagateTagValue: (value: string, key: string) => {
7
7
  isValid: boolean;
8
8
  messages: string[];
9
9
  };
package/dist/Common/Dialogs/Types.d.ts CHANGED
@@ -8,6 +8,7 @@ export interface DeleteDialogProps {
8
8
  deletePostfix?: string;
9
9
  apiCallInProgress?: boolean;
10
10
  dataTestId?: string;
11
+ buttonPrimaryText?: string;
11
12
  }
12
13
  export interface ForceDeleteDialogType {
13
14
  onClickDelete: () => void;
package/dist/index.js CHANGED
@@ -8706,35 +8706,39 @@ var ValidationRules = /** @class */ (function () {
8706
8706
  errorList.push('Key is required');
8707
8707
  }
8708
8708
  else {
8709
- var re = new RegExp('/', 'g');
8710
- var noOfSlashInKey = (_a = key.match(re)) === null || _a === void 0 ? void 0 : _a.length;
8711
- if (noOfSlashInKey > 1) {
8712
- errorList.push('Key: Max 1 ( / ) allowed');
8713
- }
8714
- else if (noOfSlashInKey === 1) {
8715
- var _b = __read(key.split('/'), 2), prefix = _b[0], name_1 = _b[1];
8716
- errorList.push.apply(errorList, __spreadArray([], __read(validateTagValue(name_1).map(function (error) { return "Name: ".concat(error); })), false));
8717
- if (prefix.length > 253) {
8718
- errorList.push('Prefix: Can be max 253 characters');
8709
+ if (!key.startsWith("devtron.ai/")) {
8710
+ var re = new RegExp('/', 'g');
8711
+ var noOfSlashInKey = (_a = key.match(re)) === null || _a === void 0 ? void 0 : _a.length;
8712
+ if (noOfSlashInKey > 1) {
8713
+ errorList.push('Key: Max 1 ( / ) allowed');
8719
8714
  }
8720
- var validPrefix = PATTERNS.KUBERNETES_KEY_PREFIX.test(prefix);
8721
- if (!validPrefix) {
8722
- errorList.push('Prefix: Must be a DNS subdomain (a series of DNS labels separated by dots (.)');
8715
+ else if (noOfSlashInKey === 1) {
8716
+ var _b = __read(key.split('/'), 2), prefix = _b[0], name_1 = _b[1];
8717
+ errorList.push.apply(errorList, __spreadArray([], __read(validateTagValue(name_1).map(function (error) { return "Name: ".concat(error); })), false));
8718
+ if (prefix.length > 253) {
8719
+ errorList.push('Prefix: Can be max 253 characters');
8720
+ }
8721
+ var validPrefix = PATTERNS.KUBERNETES_KEY_PREFIX.test(prefix);
8722
+ if (!validPrefix) {
8723
+ errorList.push('Prefix: Must be a DNS subdomain (a series of DNS labels separated by dots (.)');
8724
+ }
8725
+ }
8726
+ else {
8727
+ errorList.push.apply(errorList, __spreadArray([], __read(validateTagValue(key).map(function (error) { return "Name: ".concat(error); })), false));
8723
8728
  }
8724
- }
8725
- else {
8726
- errorList.push.apply(errorList, __spreadArray([], __read(validateTagValue(key).map(function (error) { return "Name: ".concat(error); })), false));
8727
8729
  }
8728
8730
  }
8729
8731
  return { isValid: errorList.length === 0, messages: errorList };
8730
8732
  };
8731
- this.propagateTagValue = function (value) {
8733
+ this.propagateTagValue = function (value, key) {
8732
8734
  var errorList = [];
8733
8735
  if (!value) {
8734
8736
  errorList.push('Value is required');
8735
8737
  }
8736
8738
  else {
8737
- errorList.push.apply(errorList, __spreadArray([], __read(validateTagValue(value)), false));
8739
+ if (!key.startsWith("devtron.ai/")) {
8740
+ errorList.push.apply(errorList, __spreadArray([], __read(validateTagValue(value)), false));
8741
+ }
8738
8742
  }
8739
8743
  return { isValid: errorList.length === 0, messages: errorList };
8740
8744
  };
@@ -8769,7 +8773,7 @@ var TagLabelValueSelector = function (_a) {
8769
8773
  : _tagData.value !== '';
8770
8774
  }
8771
8775
  else if (selectedValue || isRequired || _tagData.propagate) {
8772
- _tagData.isInvalidValue = !validationRules.propagateTagValue(selectedValue).isValid;
8776
+ _tagData.isInvalidValue = !validationRules.propagateTagValue(selectedValue, _tagData.key).isValid;
8773
8777
  _tagData.isInvalidKey = !_tagData.key || _tagData.isInvalidKey;
8774
8778
  }
8775
8779
  else {
@@ -8798,7 +8802,7 @@ var TagLabelValueSelector = function (_a) {
8798
8802
  }
8799
8803
  }
8800
8804
  else if (isRequired || selectedValue || tagData.propagate) {
8801
- field = validationRules.propagateTagValue(selectedValue);
8805
+ field = validationRules.propagateTagValue(selectedValue, tagData.key);
8802
8806
  }
8803
8807
  if (!field.isValid) {
8804
8808
  return (jsxRuntime.jsxs("div", __assign({ className: "p-4", onClick: stopPropagation, "data-testid": "tag-label-cross-stop-propagation" }, { children: [field.messages.map(function (error) { return (jsxRuntime.jsxs("div", __assign({ className: "flexbox pr-4 pl-4" }, { children: [jsxRuntime.jsx("span", { children: jsxRuntime.jsx(SvgIcCross, { className: "icon-dim-14 scr-5 mt-3 mr-4" }) }), jsxRuntime.jsx("span", { children: error })] }), error)); }), tagInputType === exports.KEY_VALUE.KEY && (jsxRuntime.jsxs("div", __assign({ className: "flexbox pr-4 pl-4" }, { children: [jsxRuntime.jsx("span", { children: jsxRuntime.jsx(SvgIcInfoOutlined, { className: "icon-dim-14 mt-3 mr-4" }) }), jsxRuntime.jsx("span", __assign({ className: "dc__italic-font-style" }, { children: "Key format: prefix/name or name" }))] })))] })));
@@ -8850,12 +8854,12 @@ var TagDetails = function (_a) {
8850
8854
  _tagData.isInvalidKey =
8851
8855
  _tagData.key || _tagData.value ? !validationRules.propagateTagKey(_tagData.key).isValid : false;
8852
8856
  _tagData.isInvalidValue = _tagData.value
8853
- ? !validationRules.propagateTagValue(_tagData.value).isValid
8857
+ ? !validationRules.propagateTagValue(_tagData.value, _tagData.key).isValid
8854
8858
  : false;
8855
8859
  }
8856
8860
  setTagData(index, _tagData);
8857
8861
  };
8858
- return (jsxRuntime.jsxs("div", __assign({ className: "flexbox mb-8" }, { children: [jsxRuntime.jsx("div", __assign({ className: "dc__border h-30 pl-4 pr-4 br-4 mr-8 pointer ".concat(tagData.propagate ? 'bcn-7' : ''), onClick: propagateTagToResource, "data-testid": "propagate-tag-".concat(index) }, { children: jsxRuntime.jsx(SvgInjectTag, { className: "icon-dim-20 mt-4 ".concat(tagData.propagate ? 'scn-0' : '') }) })), jsxRuntime.jsx(TagLabelValueSelector, { selectedTagIndex: index, tagData: tagData, setTagData: setTagData, tagInputType: exports.KEY_VALUE.KEY, placeholder: "Enter key", tabIndex: tabIndex - 1, refVar: keyRef, dependentRef: valueRef, tagOptions: suggestedTagsOptions }), jsxRuntime.jsx(TagLabelValueSelector, { selectedTagIndex: index, tagData: tagData, setTagData: setTagData, tagInputType: exports.KEY_VALUE.VALUE, placeholder: "Enter value", tabIndex: tabIndex, refVar: valueRef, dependentRef: keyRef }), jsxRuntime.jsx("div", __assign({ className: "dc__border pl-4 pr-4 dc__right-radius-4 pointer flex top", onClick: deleteTag, "data-testid": "delete-tag-".concat(index) }, { children: jsxRuntime.jsx(SvgIcCross, { className: "icon-dim-20 mt-4" }) }))] })));
8862
+ return (jsxRuntime.jsxs("div", __assign({ className: "flexbox mb-8" }, { children: [jsxRuntime.jsx("div", __assign({ className: "dc__border h-30 pl-4 pr-4 br-4 mr-8 pointer ".concat(tagData.propagate ? 'bcn-7' : '', " ").concat(tagData.key.startsWith("devtron.ai/") ? 'cursor-not-allowed bcn-1' : ''), onClick: propagateTagToResource, "data-testid": "propagate-tag-".concat(index) }, { children: jsxRuntime.jsx(SvgInjectTag, { className: "icon-dim-20 mt-4 ".concat(tagData.propagate ? 'scn-0' : '') }) })), jsxRuntime.jsx(TagLabelValueSelector, { selectedTagIndex: index, tagData: tagData, setTagData: setTagData, tagInputType: exports.KEY_VALUE.KEY, placeholder: "Enter key", tabIndex: tabIndex - 1, refVar: keyRef, dependentRef: valueRef, tagOptions: suggestedTagsOptions }), jsxRuntime.jsx(TagLabelValueSelector, { selectedTagIndex: index, tagData: tagData, setTagData: setTagData, tagInputType: exports.KEY_VALUE.VALUE, placeholder: "Enter value", tabIndex: tabIndex, refVar: valueRef, dependentRef: keyRef }), jsxRuntime.jsx("div", __assign({ className: "dc__border pl-4 pr-4 dc__right-radius-4 pointer flex top", onClick: deleteTag, "data-testid": "delete-tag-".concat(index) }, { children: jsxRuntime.jsx(SvgIcCross, { className: "icon-dim-20 mt-4" }) }))] })));
8859
8863
  };
8860
8864
 
8861
8865
  var _path$1;
@@ -8877,7 +8881,11 @@ var TagLabelSelect = function (_a) {
8877
8881
  var isCreateApp = _a.isCreateApp, labelTags = _a.labelTags, setLabelTags = _a.setLabelTags, _b = _a.tabIndex, tabIndex = _b === void 0 ? 0 : _b;
8878
8882
  var setTagData = function (index, tagValue) {
8879
8883
  var _tags = __spreadArray([], __read(labelTags), false);
8880
- _tags[index] = tagValue;
8884
+ var _tagValue = tagValue;
8885
+ if (_tagValue.key.startsWith("devtron.ai/")) {
8886
+ _tagValue.propagate = false;
8887
+ }
8888
+ _tags[index] = _tagValue;
8881
8889
  setLabelTags(_tags);
8882
8890
  };
8883
8891
  var addNewTag = function () {
@@ -8916,7 +8924,7 @@ ConfirmationDialog.ButtonGroup = ButtonGroup;
8916
8924
  var warn = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%3E%20%20%20%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M0%200h48v48H0z%22%2F%3E%20%20%20%20%20%20%20%20%3Cg%20fill%3D%22%23FFEBEB%22%20stroke%3D%22%23F33E3E%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M7%2024h24v17a4%204%200%200%201-4%204H11a4%204%200%200%201-4-4V24z%22%2F%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20stroke-linecap%3D%22round%22%20d%3D%22M19%2029.5v10M24%2029.5v10M14%2029.5v10%22%2F%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%20%20%20%20%3Cpath%20stroke%3D%22%23F33E3E%22%20stroke-dasharray%3D%2217%2C3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20d%3D%22M42%2010a3%203%200%200%201%200%206H31M38%2023a3%203%200%200%200-3-3h-8%22%2F%3E%20%20%20%20%20%20%20%20%3Cg%20stroke%3D%22%23F33E3E%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%20transform%3D%22rotate%28-10%2036.29%20-8.86%29%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Crect%20width%3D%2230%22%20height%3D%225%22%20y%3D%226%22%20fill%3D%22%23FFEBEB%22%20rx%3D%221%22%2F%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M11%200h8a2%202%200%200%201%202%202v4H9V2a2%202%200%200%201%202-2z%22%2F%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
8917
8925
 
8918
8926
  var DeleteDialog = function (props) {
8919
- return jsxRuntime.jsxs(ConfirmationDialog, __assign({ className: "confirmation-dialog__body--w-400" }, { children: [jsxRuntime.jsx(ConfirmationDialog.Icon, { src: warn }), jsxRuntime.jsx(ConfirmationDialog.Body, __assign({ title: props.title }, { children: jsxRuntime.jsxs("div", __assign({ className: "fs-13 cn-7 lh-1-54 w-100" }, { children: [props.description ? props.description : null, props.children] })) })), jsxRuntime.jsx(ConfirmationDialog.ButtonGroup, { children: jsxRuntime.jsxs("div", __assign({ className: "flex right" }, { children: [jsxRuntime.jsx("button", __assign({ type: "button", className: "cta cancel cta-cd-delete-modal ml-16", onClick: props.closeDelete, disabled: props.apiCallInProgress, "data-testid": "dialog-cancel" }, { children: "Cancel" })), jsxRuntime.jsx("button", __assign({ type: "button", className: "cta delete cta-cd-delete-modal ml-16", onClick: function () { return props.delete(); }, disabled: props.apiCallInProgress, "data-testid": "dialog-delete" }, { children: props.apiCallInProgress ? jsxRuntime.jsx(Progressing, {}) : "".concat(props.deletePrefix || '', "Delete").concat(props.deletePostfix || '') }))] })) })] }));
8927
+ return (jsxRuntime.jsxs(ConfirmationDialog, __assign({ className: "confirmation-dialog__body--w-400" }, { children: [jsxRuntime.jsx(ConfirmationDialog.Icon, { src: warn }), jsxRuntime.jsx(ConfirmationDialog.Body, __assign({ title: props.title }, { children: jsxRuntime.jsxs("div", __assign({ className: "fs-13 cn-7 lh-1-54 w-100" }, { children: [props.description ? props.description : null, props.children] })) })), jsxRuntime.jsx(ConfirmationDialog.ButtonGroup, { children: jsxRuntime.jsxs("div", __assign({ className: "flex right" }, { children: [jsxRuntime.jsx("button", __assign({ type: "button", className: "cta cancel cta-cd-delete-modal ml-16", onClick: props.closeDelete, disabled: props.apiCallInProgress, "data-testid": "dialog-cancel" }, { children: "Cancel" })), jsxRuntime.jsx("button", __assign({ type: "button", className: "cta delete cta-cd-delete-modal ml-16", onClick: function () { return props.delete(); }, disabled: props.apiCallInProgress, "data-testid": "dialog-delete" }, { children: props.apiCallInProgress ? (jsxRuntime.jsx(Progressing, {})) : ("".concat(props.deletePrefix || '').concat(props.buttonPrimaryText ? props.buttonPrimaryText : 'Delete').concat(props.deletePostfix || '')) }))] })) })] })));
8920
8928
  };
8921
8929
  function DeleteDialogDescription(props) {
8922
8930
  return jsxRuntime.jsx(jsxRuntime.Fragment, { children: props.children });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@devtron-labs/devtron-fe-common-lib",
3
- "version": "0.0.7-beta-50",
3
+ "version": "0.0.7-beta-51",
4
4
  "description": "Supporting common component library",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {
package/src/Common/CustomTagSelector/TagDetails.tsx CHANGED
@@ -33,7 +33,7 @@ export const TagDetails = ({
33
33
  _tagData.isInvalidKey =
34
34
  _tagData.key || _tagData.value ? !validationRules.propagateTagKey(_tagData.key).isValid : false
35
35
  _tagData.isInvalidValue = _tagData.value
36
- ? !validationRules.propagateTagValue(_tagData.value).isValid
36
+ ? !validationRules.propagateTagValue(_tagData.value, _tagData.key).isValid
37
37
  : false
38
38
  }
39
39
  setTagData(index, _tagData)
@@ -41,7 +41,7 @@ export const TagDetails = ({
41
41
  return (
42
42
  <div className="flexbox mb-8">
43
43
  <div
44
- className={`dc__border h-30 pl-4 pr-4 br-4 mr-8 pointer ${tagData.propagate ? 'bcn-7' : ''}`}
44
+ className={`dc__border h-30 pl-4 pr-4 br-4 mr-8 pointer ${tagData.propagate ? 'bcn-7' : ''} ${tagData.key.startsWith("devtron.ai/") ? 'cursor-not-allowed bcn-1' : ''}`}
45
45
  onClick={propagateTagToResource}
46
46
  data-testid={`propagate-tag-${index}`}
47
47
  >
package/src/Common/CustomTagSelector/TagLabelSelect.tsx CHANGED
@@ -13,7 +13,11 @@ export const TagLabelSelect = ({
13
13
  }: TagLabelSelectType) => {
14
14
  const setTagData = (index, tagValue): void => {
15
15
  const _tags = [...labelTags]
16
- _tags[index] = tagValue
16
+ const _tagValue = tagValue
17
+ if(_tagValue.key.startsWith("devtron.ai/")){
18
+ _tagValue.propagate = false
19
+ }
20
+ _tags[index] = _tagValue
17
21
  setLabelTags(_tags)
18
22
  }
19
23
 
package/src/Common/CustomTagSelector/TagLabelValueSelector.tsx CHANGED
@@ -50,7 +50,7 @@ export const TagLabelValueSelector = ({
50
50
  ? !validationRules.propagateTagKey(selectedValue).isValid
51
51
  : _tagData.value !== ''
52
52
  } else if (selectedValue || isRequired || _tagData.propagate) {
53
- _tagData.isInvalidValue = !validationRules.propagateTagValue(selectedValue).isValid
53
+ _tagData.isInvalidValue = !validationRules.propagateTagValue(selectedValue, _tagData.key).isValid
54
54
  _tagData.isInvalidKey = !_tagData.key || _tagData.isInvalidKey
55
55
  } else {
56
56
  _tagData.isInvalidValue = false
@@ -80,7 +80,7 @@ export const TagLabelValueSelector = ({
80
80
  field = validationRules.propagateTagKey(selectedValue)
81
81
  }
82
82
  } else if (isRequired || selectedValue || tagData.propagate) {
83
- field = validationRules.propagateTagValue(selectedValue)
83
+ field = validationRules.propagateTagValue(selectedValue, tagData.key)
84
84
  }
85
85
  if (!field.isValid) {
86
86
  return (
package/src/Common/CustomTagSelector/ValidationRules.ts CHANGED
@@ -21,33 +21,37 @@ export class ValidationRules {
21
21
  if (!key) {
22
22
  errorList.push('Key is required')
23
23
  } else {
24
- const re = new RegExp('/', 'g')
25
- const noOfSlashInKey = key.match(re)?.length
26
- if (noOfSlashInKey > 1) {
27
- errorList.push('Key: Max 1 ( / ) allowed')
28
- } else if (noOfSlashInKey === 1) {
29
- const [prefix, name] = key.split('/')
30
- errorList.push(...validateTagValue(name).map((error) => `Name: ${error}`))
31
- if (prefix.length > 253) {
32
- errorList.push('Prefix: Can be max 253 characters')
24
+ if(!key.startsWith("devtron.ai/")){
25
+ const re = new RegExp('/', 'g')
26
+ const noOfSlashInKey = key.match(re)?.length
27
+ if (noOfSlashInKey > 1) {
28
+ errorList.push('Key: Max 1 ( / ) allowed')
29
+ } else if (noOfSlashInKey === 1) {
30
+ const [prefix, name] = key.split('/')
31
+ errorList.push(...validateTagValue(name).map((error) => `Name: ${error}`))
32
+ if (prefix.length > 253) {
33
+ errorList.push('Prefix: Can be max 253 characters')
34
+ }
35
+ const validPrefix = PATTERNS.KUBERNETES_KEY_PREFIX.test(prefix)
36
+ if (!validPrefix) {
37
+ errorList.push('Prefix: Must be a DNS subdomain (a series of DNS labels separated by dots (.)')
38
+ }
39
+ } else {
40
+ errorList.push(...validateTagValue(key).map((error) => `Name: ${error}`))
33
41
  }
34
- const validPrefix = PATTERNS.KUBERNETES_KEY_PREFIX.test(prefix)
35
- if (!validPrefix) {
36
- errorList.push('Prefix: Must be a DNS subdomain (a series of DNS labels separated by dots (.)')
37
- }
38
- } else {
39
- errorList.push(...validateTagValue(key).map((error) => `Name: ${error}`))
40
42
  }
41
43
  }
42
44
  return { isValid: errorList.length === 0, messages: errorList }
43
45
  }
44
46
 
45
- propagateTagValue = (value: string): { isValid: boolean; messages: string[] } => {
47
+ propagateTagValue = (value: string, key: string): { isValid: boolean; messages: string[] } => {
46
48
  const errorList = []
47
49
  if (!value) {
48
50
  errorList.push('Value is required')
49
51
  } else {
50
- errorList.push(...validateTagValue(value))
52
+ if(!key.startsWith("devtron.ai/")){
53
+ errorList.push(...validateTagValue(value))
54
+ }
51
55
  }
52
56
  return { isValid: errorList.length === 0, messages: errorList }
53
57
  }
package/src/Common/Dialogs/DeleteDialog.tsx CHANGED
@@ -1,35 +1,53 @@
1
- import React from 'react';
2
- import warn from '../../Assets/Img/warning-medium.svg';
1
+ import React from 'react'
2
+ import warn from '../../Assets/Img/delete-medium.svg'
3
3
  import { Progressing } from '../Progressing'
4
- import ConfirmationDialog from './ConfirmationDialog';
5
- import { DeleteDialogProps } from './Types';
4
+ import ConfirmationDialog from './ConfirmationDialog'
5
+ import { DeleteDialogProps } from './Types'
6
6
 
7
7
  export const DeleteDialog: React.FC<DeleteDialogProps> & { Description?: React.FC<any> } = function (props) {
8
-
9
- return <ConfirmationDialog className="confirmation-dialog__body--w-400">
10
- <ConfirmationDialog.Icon src={warn} />
11
- <ConfirmationDialog.Body title={props.title}>
12
- <div className="fs-13 cn-7 lh-1-54 w-100">
13
- {props.description ? props.description : null}
14
- {props.children}
15
- </div>
16
- </ConfirmationDialog.Body>
17
- <ConfirmationDialog.ButtonGroup>
18
- <div className="flex right">
19
- <button type="button" className="cta cancel cta-cd-delete-modal ml-16" onClick={props.closeDelete} disabled={props.apiCallInProgress} data-testid="dialog-cancel">Cancel</button>
20
- <button type="button" className="cta delete cta-cd-delete-modal ml-16" onClick={() => props.delete()} disabled={props.apiCallInProgress} data-testid="dialog-delete">
21
- {props.apiCallInProgress ? <Progressing /> : `${props.deletePrefix || ''}Delete${props.deletePostfix || ''}`}
22
- </button>
23
- </div>
24
- </ConfirmationDialog.ButtonGroup>
25
- </ConfirmationDialog >
8
+ return (
9
+ <ConfirmationDialog className="confirmation-dialog__body--w-400">
10
+ <ConfirmationDialog.Icon src={warn} />
11
+ <ConfirmationDialog.Body title={props.title}>
12
+ <div className="fs-13 cn-7 lh-1-54 w-100">
13
+ {props.description ? props.description : null}
14
+ {props.children}
15
+ </div>
16
+ </ConfirmationDialog.Body>
17
+ <ConfirmationDialog.ButtonGroup>
18
+ <div className="flex right">
19
+ <button
20
+ type="button"
21
+ className="cta cancel cta-cd-delete-modal ml-16"
22
+ onClick={props.closeDelete}
23
+ disabled={props.apiCallInProgress}
24
+ data-testid="dialog-cancel"
25
+ >
26
+ Cancel
27
+ </button>
28
+ <button
29
+ type="button"
30
+ className="cta delete cta-cd-delete-modal ml-16"
31
+ onClick={() => props.delete()}
32
+ disabled={props.apiCallInProgress}
33
+ data-testid="dialog-delete"
34
+ >
35
+ {props.apiCallInProgress ? (
36
+ <Progressing />
37
+ ) : (
38
+ `${props.deletePrefix || ''}${
39
+ props.buttonPrimaryText ? props.buttonPrimaryText : 'Delete'
40
+ }${props.deletePostfix || ''}`
41
+ )}
42
+ </button>
43
+ </div>
44
+ </ConfirmationDialog.ButtonGroup>
45
+ </ConfirmationDialog>
46
+ )
26
47
  }
27
48
 
28
49
  function DeleteDialogDescription(props) {
29
-
30
- return <>
31
- {props.children}
32
- </>
50
+ return <>{props.children}</>
33
51
  }
34
52
 
35
- DeleteDialog.Description = DeleteDialogDescription;
53
+ DeleteDialog.Description = DeleteDialogDescription
package/src/Common/Dialogs/Types.ts CHANGED
@@ -9,6 +9,7 @@ export interface DeleteDialogProps {
9
9
  deletePostfix?: string
10
10
  apiCallInProgress?: boolean
11
11
  dataTestId?: string
12
+ buttonPrimaryText?: string
12
13
  }
13
14
 
14
15
  export interface ForceDeleteDialogType {