@devtron-labs/devtron-fe-common-lib 0.0.31 → 0.0.32-beta1

package/dist/Common/CustomTagSelector/ResizableTagTextArea.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { ResizableTagTextAreaProps } from './Types';
-export declare function ResizableTagTextArea({ className, minHeight, maxHeight, value, onChange, onBlur, onFocus, placeholder, tabIndex, refVar, dependentRef, dataTestId, }: ResizableTagTextAreaProps): JSX.Element;
+export declare function ResizableTagTextArea({ className, minHeight, maxHeight, value, onChange, onBlur, onFocus, placeholder, tabIndex, refVar, dependentRef, dataTestId, handleKeyDown, }: ResizableTagTextAreaProps): JSX.Element;

package/dist/Common/CustomTagSelector/Types.d.ts

@@ -64,4 +64,5 @@ export interface ResizableTagTextAreaProps {
     refVar?: React.MutableRefObject<HTMLTextAreaElement>;
     dependentRef?: React.MutableRefObject<HTMLTextAreaElement>;
     dataTestId?: string;
+    handleKeyDown?: any;
 }

package/dist/Common/ImageTags.Types.d.ts

@@ -24,6 +24,7 @@ export interface ImageTaggingContainerType {
     setTagsEditable?: (tagsEditable: boolean) => void;
     toggleCardMode?: (id: number) => void;
     hideHardDelete?: boolean;
+    isSuperAdmin?: boolean;
 }
 export interface ImageButtonType {
     text: string;

package/dist/Common/ImageTags.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { ImageButtonType, ImageTaggingContainerType } from './ImageTags.Types';
-export declare const ImageTagsContainer: ({ ciPipelineId, artifactId, imageComment, imageReleaseTags, updateCurrentAppMaterial, appReleaseTagNames, setAppReleaseTagNames, tagsEditable, setTagsEditable, toggleCardMode, hideHardDelete, forceReInit, }: ImageTaggingContainerType) => JSX.Element;
+export declare const ImageTagsContainer: ({ ciPipelineId, artifactId, imageComment, imageReleaseTags, updateCurrentAppMaterial, appReleaseTagNames, setAppReleaseTagNames, tagsEditable, setTagsEditable, toggleCardMode, hideHardDelete, forceReInit, isSuperAdmin }: ImageTaggingContainerType) => JSX.Element;
 export declare const ImageTagButton: ({ text, isSoftDeleted, isEditing, onSoftDeleteClick, onHardDeleteClick, tagId, softDeleteTags, isSuperAdmin, duplicateTag, hideHardDelete, }: ImageButtonType) => JSX.Element;

package/dist/index.js

@@ -10071,7 +10071,7 @@ function CustomInput(_a) {
     return (jsxRuntime.jsxs("div", __assign({ className: "flex column left top" }, { children: [jsxRuntime.jsx("label", __assign({ className: "form__label ".concat(labelClassName) }, { children: label })), jsxRuntime.jsx("input", { "data-testid": dataTestid, type: type, name: name, autoComplete: "off", className: "form__input", onChange: function (e) {
                     e.persist();
                     onChange(e);
-                }, onBlur: onBlur, onFocus: onFocus, placeholder: placeholder, value: value, disabled: disabled, tabIndex: tabIndex }), handleError(error).map(function (err) { return (jsxRuntime.jsxs("div", __assign({ className: "form__error" }, { children: [jsxRuntime.jsx(SvgIcWarning, { className: "form__icon form__icon--error" }), err] }))); })] })));
+                }, onBlur: onBlur, onFocus: onFocus, placeholder: placeholder, value: value, disabled: disabled, tabIndex: tabIndex }), handleError(error).map(function (err) { return (jsxRuntime.jsxs("div", __assign({ className: "form__error" }, { children: [jsxRuntime.jsx(SvgIcWarning, { className: "form__icon form__icon--error" }), err] }), err)); })] })));
 }
 function handleUTCTime(ts, isRelativeTime) {
     if (isRelativeTime === void 0) { isRelativeTime = false; }
@@ -14777,7 +14777,7 @@ var SvgIcInfoOutlined = function SvgIcInfoOutlined(props) {
 };
 
 function ResizableTagTextArea(_a) {
-    var className = _a.className, minHeight = _a.minHeight, maxHeight = _a.maxHeight, value = _a.value, onChange = _a.onChange, onBlur = _a.onBlur, onFocus = _a.onFocus, placeholder = _a.placeholder, tabIndex = _a.tabIndex, refVar = _a.refVar, dependentRef = _a.dependentRef, dataTestId = _a.dataTestId;
+    var className = _a.className, minHeight = _a.minHeight, maxHeight = _a.maxHeight, value = _a.value, onChange = _a.onChange, onBlur = _a.onBlur, onFocus = _a.onFocus, placeholder = _a.placeholder, tabIndex = _a.tabIndex, refVar = _a.refVar, dependentRef = _a.dependentRef, dataTestId = _a.dataTestId, handleKeyDown = _a.handleKeyDown;
     var _b = __read(React.useState(''), 2), text = _b[0], setText = _b[1];
     React.useEffect(function () {
         setText(value);
@@ -14790,9 +14790,11 @@ function ResizableTagTextArea(_a) {
         if (document.activeElement !== refVar.current)
             return;
         refVar.current.style.height = minHeight + 'px';
-        dependentRef.current.style.height = minHeight + 'px';
+        if (dependentRef) {
+            dependentRef.current.style.height = minHeight + 'px';
+        }
         var nextHeight = refVar.current.scrollHeight;
-        if (nextHeight < dependentRef.current.scrollHeight) {
+        if (dependentRef && nextHeight < dependentRef.current.scrollHeight) {
             nextHeight = dependentRef.current.scrollHeight;
         }
         if (minHeight && nextHeight < minHeight) {
@@ -14802,19 +14804,23 @@ function ResizableTagTextArea(_a) {
             nextHeight = maxHeight;
         }
         refVar.current.style.height = nextHeight + 'px';
-        dependentRef.current.style.height = nextHeight + 'px';
+        if (dependentRef) {
+            dependentRef.current.style.height = nextHeight + 'px';
+        }
     };
     useThrottledEffect(reInitHeight, 500, [text]);
     var handleOnBlur = function (event) {
         refVar.current.style.height = minHeight + 'px';
-        dependentRef.current.style.height = minHeight + 'px';
+        if (dependentRef) {
+            dependentRef.current.style.height = minHeight + 'px';
+        }
         onBlur && onBlur(event);
     };
     var handleOnFocus = function (event) {
         reInitHeight();
         onFocus && onFocus(event);
     };
-    return (jsxRuntime.jsx("textarea", { rows: 1, ref: refVar, value: text, placeholder: placeholder, className: "".concat(className || '', " lh-20"), style: { resize: 'none' }, onChange: handleChange, onBlur: handleOnBlur, onFocus: handleOnFocus, tabIndex: tabIndex, "data-testid": dataTestId }));
+    return (jsxRuntime.jsx("textarea", { rows: 1, ref: refVar, value: text, placeholder: placeholder, className: "".concat(className || '', " lh-20"), style: { resize: 'none' }, onChange: handleChange, onBlur: handleOnBlur, onFocus: handleOnFocus, tabIndex: tabIndex, "data-testid": dataTestId, onKeyDown: handleKeyDown }));
 }
 
 var validateTagValue = function (value) {
@@ -23114,7 +23120,7 @@ var SvgIcEnter = function SvgIcEnter(props) {
 };
 
 var ImageTagsContainer = function (_a) {
-    var ciPipelineId = _a.ciPipelineId, artifactId = _a.artifactId, imageComment = _a.imageComment, imageReleaseTags = _a.imageReleaseTags, updateCurrentAppMaterial = _a.updateCurrentAppMaterial, appReleaseTagNames = _a.appReleaseTagNames, setAppReleaseTagNames = _a.setAppReleaseTagNames, tagsEditable = _a.tagsEditable, setTagsEditable = _a.setTagsEditable, toggleCardMode = _a.toggleCardMode, hideHardDelete = _a.hideHardDelete, forceReInit = _a.forceReInit;
+    var ciPipelineId = _a.ciPipelineId, artifactId = _a.artifactId, imageComment = _a.imageComment, imageReleaseTags = _a.imageReleaseTags, updateCurrentAppMaterial = _a.updateCurrentAppMaterial, appReleaseTagNames = _a.appReleaseTagNames, setAppReleaseTagNames = _a.setAppReleaseTagNames, tagsEditable = _a.tagsEditable, setTagsEditable = _a.setTagsEditable, toggleCardMode = _a.toggleCardMode, hideHardDelete = _a.hideHardDelete, forceReInit = _a.forceReInit, isSuperAdmin = _a.isSuperAdmin;
     var _b = __read(React.useState(imageReleaseTags ? imageReleaseTags : []), 2), initialTags = _b[0], setInitialTags = _b[1];
     var _c = __read(React.useState(imageComment ? imageComment.comment : ''), 2), initialDescription = _c[0], setInitialDescription = _c[1];
     var _d = __read(React.useState(appReleaseTagNames ? appReleaseTagNames : []), 2), existingTags = _d[0], setExistingTags = _d[1];
@@ -23126,41 +23132,14 @@ var ImageTagsContainer = function (_a) {
     var _k = __read(React.useState([]), 2), createTags = _k[0], setCreateTags = _k[1];
     var _l = __read(React.useState([]), 2), softDeleteTags = _l[0], setSoftDeleteTags = _l[1];
     var _m = __read(React.useState([]), 2), hardDeleteTags = _m[0], setHardDeleteTags = _m[1];
-    var _o = __read(React.useState(false), 2), isSuperAdmin = _o[0], setSuperAdmin = _o[1];
-    var _p = __read(React.useState(''), 2), descriptionValidationMessage = _p[0], setDescriptionValidationMessage = _p[1];
-    var _q = __read(React.useState(''), 2), textInput = _q[0], setTextInput = _q[1];
-    React.useEffect(function () {
-        initialise();
-    }, []);
+    var _o = __read(React.useState(''), 2), descriptionValidationMessage = _o[0], setDescriptionValidationMessage = _o[1];
+    var _p = __read(React.useState(''), 2), textInput = _p[0], setTextInput = _p[1];
     React.useEffect(function () {
         reInitState();
     }, [imageReleaseTags, imageComment, tagsEditable]);
     React.useEffect(function () {
         setExistingTags(appReleaseTagNames ? appReleaseTagNames : []);
     }, [appReleaseTagNames]);
-    function initialise() {
-        var _a, _b;
-        return __awaiter(this, void 0, void 0, function () {
-            var userRole, superAdmin, err_1;
-            return __generator(this, function (_c) {
-                switch (_c.label) {
-                    case 0:
-                        _c.trys.push([0, 2, , 3]);
-                        return [4 /*yield*/, getUserRole()];
-                    case 1:
-                        userRole = _c.sent();
-                        superAdmin = (_b = (_a = userRole === null || userRole === void 0 ? void 0 : userRole.result) === null || _a === void 0 ? void 0 : _a.roles) === null || _b === void 0 ? void 0 : _b.includes('role:super-admin___');
-                        setSuperAdmin(superAdmin);
-                        return [3 /*break*/, 3];
-                    case 2:
-                        err_1 = _c.sent();
-                        showError(err_1);
-                        return [3 /*break*/, 3];
-                    case 3: return [2 /*return*/];
-                }
-            });
-        });
-    }
     var reInitState = function () {
         if (forceReInit || !isEditing) {
             setInitialTags(imageReleaseTags ? imageReleaseTags : []);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.0.31",
+    "version": "0.0.32-beta1",
     "description": "Supporting common component library",
     "main": "dist/index.js",
     "scripts": {

package/src/Common/CustomTagSelector/ResizableTagTextArea.tsx

@@ -15,6 +15,7 @@ export function ResizableTagTextArea({
     refVar,
     dependentRef,
     dataTestId,
+    handleKeyDown,
 }: ResizableTagTextAreaProps) {
     const [text, setText] = useState('')
 
@@ -29,10 +30,12 @@ export function ResizableTagTextArea({
 
     const reInitHeight = () => {
         if (document.activeElement !== refVar.current) return
-        refVar.current.style.height = minHeight+ 'px'
-        dependentRef.current.style.height = minHeight+ 'px'
+        refVar.current.style.height = minHeight + 'px'
+        if (dependentRef) {
+            dependentRef.current.style.height = minHeight + 'px'
+        }
         let nextHeight = refVar.current.scrollHeight
-        if (nextHeight < dependentRef.current.scrollHeight) {
+        if (dependentRef && nextHeight < dependentRef.current.scrollHeight) {
             nextHeight = dependentRef.current.scrollHeight
         }
         if (minHeight && nextHeight < minHeight) {
@@ -42,14 +45,18 @@ export function ResizableTagTextArea({
             nextHeight = maxHeight
         }
         refVar.current.style.height = nextHeight + 'px'
-        dependentRef.current.style.height = nextHeight + 'px'
+        if (dependentRef) {
+            dependentRef.current.style.height = nextHeight + 'px'
+        }
     }
 
     useThrottledEffect(reInitHeight, 500, [text])
 
     const handleOnBlur = (event) => {
-        refVar.current.style.height = minHeight+ 'px'
-        dependentRef.current.style.height = minHeight+ 'px'
+        refVar.current.style.height = minHeight + 'px'
+        if (dependentRef) {
+            dependentRef.current.style.height = minHeight + 'px'
+        }
         onBlur && onBlur(event)
     }
 
@@ -71,6 +78,7 @@ export function ResizableTagTextArea({
             onFocus={handleOnFocus}
             tabIndex={tabIndex}
             data-testid={dataTestId}
+            onKeyDown={handleKeyDown}
         />
     )
 }

package/src/Common/CustomTagSelector/Types.ts

@@ -68,4 +68,5 @@ export interface ResizableTagTextAreaProps {
     refVar?: React.MutableRefObject<HTMLTextAreaElement>
     dependentRef?: React.MutableRefObject<HTMLTextAreaElement>
     dataTestId?: string
+    handleKeyDown?: any   
 }

package/src/Common/Helper.tsx

@@ -326,7 +326,7 @@ export function CustomInput({
                 tabIndex={tabIndex}
             />
             {handleError(error).map((err) => (
-                <div className="form__error">
+                <div className="form__error" key={err}>
                     <FormError className="form__icon form__icon--error" />
                     {err}
                 </div>

package/src/Common/ImageTags.Types.ts

@@ -27,6 +27,7 @@ export interface ImageTaggingContainerType {
     setTagsEditable?: (tagsEditable: boolean) => void
     toggleCardMode?: (id: number) => void
     hideHardDelete?: boolean
+    isSuperAdmin?: boolean
 }
 
 export interface ImageButtonType {

package/src/Common/ImageTags.tsx

@@ -32,6 +32,7 @@ export const ImageTagsContainer = ({
     toggleCardMode,
     hideHardDelete,
     forceReInit,
+    isSuperAdmin
 }: ImageTaggingContainerType) => {
     const [initialTags, setInitialTags] = useState<ReleaseTag[]>(imageReleaseTags ? imageReleaseTags : [])
     const [initialDescription, setInitialDescription] = useState(imageComment ? imageComment.comment : '')
@@ -44,13 +45,9 @@ export const ImageTagsContainer = ({
     const [createTags, setCreateTags] = useState<ReleaseTag[]>([])
     const [softDeleteTags, setSoftDeleteTags] = useState<ReleaseTag[]>([])
     const [hardDeleteTags, setHardDeleteTags] = useState<ReleaseTag[]>([])
-    const [isSuperAdmin, setSuperAdmin] = useState<boolean>(false)
     const [descriptionValidationMessage, setDescriptionValidationMessage] = useState<string>('')
     const [textInput, setTextInput] = useState<string>('')
 
-    useEffect(() => {
-        initialise()
-    }, [])
 
     useEffect(() => {
         reInitState()
@@ -60,16 +57,6 @@ export const ImageTagsContainer = ({
         setExistingTags(appReleaseTagNames ? appReleaseTagNames : [])
     }, [appReleaseTagNames])
 
-    async function initialise() {
-        try {
-            const userRole = await getUserRole()
-
-            const superAdmin = userRole?.result?.roles?.includes('role:super-admin___')
-            setSuperAdmin(superAdmin)
-        } catch (err) {
-            showError(err)
-        }
-    }
 
     const reInitState = () => {
         if (forceReInit || !isEditing) {