@devtron-labs/devtron-fe-common-lib 0.0.10-beta-14 → 0.0.10-beta-16

package/dist/Common/ImageTags.d.ts

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

package/dist/Common/Types.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, CSSProperties } from 'react';
+import React, { ReactNode, CSSProperties } from 'react';
 import { Placement } from 'tippy.js';
 export interface ResponseType {
     code: number;
@@ -323,8 +323,11 @@ export interface ImageTaggingContainerType {
     artifactId?: number;
     imageComment?: ImageComment;
     imageReleaseTags?: ReleaseTag[];
+    matId?: number;
+    updateCurrentAppMaterial?: (matId: number, releaseTags?: ReleaseTag[], imageComment?: ImageComment) => void;
     appReleaseTagNames?: string[];
     tagsEditable?: boolean;
+    forceReInit?: boolean;
     setAppReleaseTagNames?: (appReleaseTags: string[]) => void;
     setTagsEditable?: (tagsEditable: boolean) => void;
     toggleCardMode?: (id: number) => void;
@@ -340,5 +343,6 @@ export interface ImageButtonType {
     softDeleteTags: any;
     isSuperAdmin: any;
     duplicateTag?: boolean;
+    hideHardDelete?: boolean;
 }
 export {};

package/dist/index.js

@@ -22696,7 +22696,7 @@ var SvgIcEnter = function SvgIcEnter(props) {
 };
 
 var ImageTagsContainer = function (_a) {
-    var ciPipelineId = _a.ciPipelineId, artifactId = _a.artifactId, imageComment = _a.imageComment, imageReleaseTags = _a.imageReleaseTags, appReleaseTagNames = _a.appReleaseTagNames, setAppReleaseTagNames = _a.setAppReleaseTagNames, tagsEditable = _a.tagsEditable, setTagsEditable = _a.setTagsEditable, toggleCardMode = _a.toggleCardMode; _a.hideHardDelete;
+    var ciPipelineId = _a.ciPipelineId, artifactId = _a.artifactId, imageComment = _a.imageComment, imageReleaseTags = _a.imageReleaseTags, matId = _a.matId, 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 _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];
@@ -22751,11 +22751,12 @@ var ImageTagsContainer = function (_a) {
         });
     }
     var reInitState = function () {
-        if (isEditing === false) {
+        if (forceReInit || !isEditing) {
             setInitialTags(imageReleaseTags ? imageReleaseTags : []);
             setInitialDescription(imageComment ? imageComment.comment : '');
             setNewDescription(imageComment ? imageComment.comment : '');
             setDisplayedTags(imageReleaseTags ? imageReleaseTags : []);
+            setIsEditing(false);
         }
     };
     var handleEditClick = function () {
@@ -22884,7 +22885,7 @@ var ImageTagsContainer = function (_a) {
             // set loading state true
             setImageTags(payload, ciPipelineId, artifactId)
                 .then(function (res) {
-                var _a, _b, _c, _d, _e, _f, _g, _h;
+                var _a, _b, _c, _d, _e, _f, _g, _h, _j;
                 var tags = (_b = (_a = res.result) === null || _a === void 0 ? void 0 : _a.imageReleaseTags) === null || _b === void 0 ? void 0 : _b.map(function (tag) { return ({
                     id: tag.id,
                     tagName: tag.tagName,
@@ -22908,6 +22909,8 @@ var ImageTagsContainer = function (_a) {
                 handleEditClick();
                 setShowTagsWarning(false);
                 setTagErrorMessage('');
+                if (updateCurrentAppMaterial)
+                    updateCurrentAppMaterial(matId, tags, (_j = res.result) === null || _j === void 0 ? void 0 : _j.imageComment);
             })
                 .catch(function (err) {
                 var _a, _b, _c, _d, _e, _f, _g;
@@ -22967,7 +22970,7 @@ var ImageTagsContainer = function (_a) {
                         }, onHardDeleteClick: function (e) {
                             stopPropagation(e);
                             handleTagHardDelete(index);
-                        }, tagId: tag.id, softDeleteTags: softDeleteTags, isSuperAdmin: isSuperAdmin, duplicateTag: tag === null || tag === void 0 ? void 0 : tag.duplicateTag }, tag.id)); }) })), showTagsWarning && (jsxRuntime.jsxs("div", __assign({ className: "cn-7 mb-8 flex left" }, { children: [jsxRuntime.jsx(SvgIcInfoFilled, { className: "form__icon--info icon-dim-16 mr-2" }), "Tags cannot be edited/removed later"] }))), jsxRuntime.jsx("div", __assign({ className: "cn-7 mt-12" }, { children: "Comment" })), jsxRuntime.jsx("div", __assign({ className: "flex left flex-wrap dc__gap-8 w-100 mt-6 mb-12", "data-testid": "add-image-comment-text-area" }, { children: jsxRuntime.jsx("textarea", { value: newDescription, onChange: handleDescriptionChange, className: "flex left flex-wrap dc__gap-8 dc__description-textarea", style: { height: '90px !important' } }) })), descriptionValidationMessage !== '' && (jsxRuntime.jsxs("div", __assign({ className: "flex left" }, { children: [jsxRuntime.jsx(SvgIcWarning, { className: "form__icon form__icon--error" }), jsxRuntime.jsx("div", __assign({ className: "form__error" }, { children: descriptionValidationMessage }))] }))), jsxRuntime.jsxs("div", __assign({ className: "w-100 flex right mt-12" }, { children: [jsxRuntime.jsx("button", __assign({ className: "cta flex cancel h-32 lh-32-imp", type: "button", onClick: function (e) {
+                        }, tagId: tag.id, softDeleteTags: softDeleteTags, isSuperAdmin: isSuperAdmin, duplicateTag: tag === null || tag === void 0 ? void 0 : tag.duplicateTag, hideHardDelete: hideHardDelete }, tag.id)); }) })), showTagsWarning && (jsxRuntime.jsxs("div", __assign({ className: "cn-7 mb-8 flex left" }, { children: [jsxRuntime.jsx(SvgIcInfoFilled, { className: "form__icon--info icon-dim-16 mr-2" }), "Tags cannot be edited/removed later"] }))), jsxRuntime.jsx("div", __assign({ className: "cn-7 mt-12" }, { children: "Comment" })), jsxRuntime.jsx("div", __assign({ className: "flex left flex-wrap dc__gap-8 w-100 mt-6 mb-12", "data-testid": "add-image-comment-text-area" }, { children: jsxRuntime.jsx("textarea", { value: newDescription, onChange: handleDescriptionChange, className: "flex left flex-wrap dc__gap-8 dc__description-textarea", style: { height: '90px !important' } }) })), descriptionValidationMessage !== '' && (jsxRuntime.jsxs("div", __assign({ className: "flex left" }, { children: [jsxRuntime.jsx(SvgIcWarning, { className: "form__icon form__icon--error" }), jsxRuntime.jsx("div", __assign({ className: "form__error" }, { children: descriptionValidationMessage }))] }))), jsxRuntime.jsxs("div", __assign({ className: "w-100 flex right mt-12" }, { children: [jsxRuntime.jsx("button", __assign({ className: "cta flex cancel h-32 lh-32-imp", type: "button", onClick: function (e) {
                                 stopPropagation(e);
                                 handleCancel();
                             } }, { children: "Cancel" })), jsxRuntime.jsx("button", __assign({ className: "cta flex h-32 lh-32-imp ml-12", "data-testid": "save-tags-button", type: "button", onClick: function (e) {
@@ -22979,16 +22982,16 @@ var ImageTagsContainer = function (_a) {
                                     }, onHardDeleteClick: function (e) {
                                         stopPropagation(e);
                                         handleTagHardDelete(index);
-                                    }, tagId: tag.id, softDeleteTags: softDeleteTags, isSuperAdmin: isSuperAdmin, duplicateTag: tag === null || tag === void 0 ? void 0 : tag.duplicateTag }, tag === null || tag === void 0 ? void 0 : tag.id)); }) }))] }) })), jsxRuntime.jsx("div", __assign({ className: "mt-8 mr-6 icon-dim-16" }, { children: tagsEditable && (jsxRuntime.jsx(SvgIcPencil, { className: "icon-dim-16 image-tags-container-edit__icon cursor", "data-testid": "edit-tags-icon", onClick: function (e) {
+                                    }, tagId: tag.id, softDeleteTags: softDeleteTags, isSuperAdmin: isSuperAdmin, duplicateTag: tag === null || tag === void 0 ? void 0 : tag.duplicateTag, hideHardDelete: hideHardDelete }, tag === null || tag === void 0 ? void 0 : tag.id)); }) }))] }) })), jsxRuntime.jsx("div", __assign({ className: "mt-8 mr-6 icon-dim-16" }, { children: tagsEditable && (jsxRuntime.jsx(SvgIcPencil, { className: "icon-dim-16 image-tags-container-edit__icon cursor", "data-testid": "edit-tags-icon", onClick: function (e) {
                             stopPropagation(e);
                             handleEditClick();
                         } })) }))] }))) })));
 };
 var ImageTagButton = function (_a) {
-    var text = _a.text, isSoftDeleted = _a.isSoftDeleted, isEditing = _a.isEditing, onSoftDeleteClick = _a.onSoftDeleteClick, onHardDeleteClick = _a.onHardDeleteClick, tagId = _a.tagId, softDeleteTags = _a.softDeleteTags, isSuperAdmin = _a.isSuperAdmin, duplicateTag = _a.duplicateTag;
+    var text = _a.text, isSoftDeleted = _a.isSoftDeleted, isEditing = _a.isEditing, onSoftDeleteClick = _a.onSoftDeleteClick, onHardDeleteClick = _a.onHardDeleteClick, tagId = _a.tagId, softDeleteTags = _a.softDeleteTags, isSuperAdmin = _a.isSuperAdmin, duplicateTag = _a.duplicateTag, hideHardDelete = _a.hideHardDelete;
     var IconComponent = isSoftDeleted ? SvgIcArrowCounterClockwise : SvgIcMinus;
     var isInSoftDeleteTags = isSoftDeleted && softDeleteTags.some(function (tag) { return tag.tagName === text; });
-    var canTagBeHardDelete = tagId === 0 || isSuperAdmin;
+    var canTagBeHardDelete = tagId === 0 || (isSuperAdmin && !hideHardDelete);
     var tabColor = function () {
         if (duplicateTag) {
             return 'cr-5 bcr-1 er-2';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.0.10-beta-14",
+    "version": "0.0.10-beta-16",
     "description": "Supporting common component library",
     "main": "dist/index.js",
     "scripts": {

package/src/Common/ImageTags.tsx

@@ -24,12 +24,15 @@ export const ImageTagsContainer = ({
     artifactId,
     imageComment,
     imageReleaseTags,
+    matId,
+    updateCurrentAppMaterial,
     appReleaseTagNames,
     setAppReleaseTagNames,
     tagsEditable,
     setTagsEditable,
     toggleCardMode,
     hideHardDelete,
+    forceReInit,
 }: ImageTaggingContainerType) => {
     const [initialTags, setInitialTags] = useState<ReleaseTag[]>(imageReleaseTags ? imageReleaseTags : [])
     const [initialDescription, setInitialDescription] = useState(imageComment ? imageComment.comment : '')
@@ -78,11 +81,12 @@ export const ImageTagsContainer = ({
     }
 
     const reInitState = () => {
-        if (isEditing === false) {
+        if (forceReInit || !isEditing) {
             setInitialTags(imageReleaseTags ? imageReleaseTags : [])
             setInitialDescription(imageComment ? imageComment.comment : '')
             setNewDescription(imageComment ? imageComment.comment : '')
             setDisplayedTags(imageReleaseTags ? imageReleaseTags : [])
+            setIsEditing(false)
         }
     }
 
@@ -247,6 +251,7 @@ export const ImageTagsContainer = ({
                 handleEditClick()
                 setShowTagsWarning(false)
                 setTagErrorMessage('')
+                if(updateCurrentAppMaterial)updateCurrentAppMaterial(matId,tags,res.result?.imageComment)
             })
             .catch((err) => {
                 // Fix toast message
@@ -328,6 +333,7 @@ export const ImageTagsContainer = ({
     }
 
     const setInputValue = (e) => {
+
         setTextInput(e.target.value)
     }
 
@@ -404,6 +410,7 @@ export const ImageTagsContainer = ({
                                 softDeleteTags={softDeleteTags}
                                 isSuperAdmin={isSuperAdmin}
                                 duplicateTag={tag?.duplicateTag}
+                                hideHardDelete={hideHardDelete}
                             />
                         ))}
                     </div>
@@ -482,6 +489,7 @@ export const ImageTagsContainer = ({
                                         softDeleteTags={softDeleteTags}
                                         isSuperAdmin={isSuperAdmin}
                                         duplicateTag={tag?.duplicateTag}
+                                        hideHardDelete={hideHardDelete}
                                     />
                                 ))}
                             </div>
@@ -515,10 +523,11 @@ export const ImageTagButton = ({
     softDeleteTags,
     isSuperAdmin,
     duplicateTag,
+    hideHardDelete,
 }: ImageButtonType) => {
     const IconComponent = isSoftDeleted ? Redo : Minus
     const isInSoftDeleteTags = isSoftDeleted && softDeleteTags.some((tag) => tag.tagName === text)
-    const canTagBeHardDelete = tagId === 0 || isSuperAdmin
+    const canTagBeHardDelete = tagId === 0 || (isSuperAdmin && !hideHardDelete)
 
     const tabColor = () => {
         if (duplicateTag) {

package/src/Common/Types.ts

@@ -1,4 +1,4 @@
-import { ReactNode, CSSProperties } from 'react'
+import React, { ReactNode, CSSProperties } from 'react'
 import { Placement } from 'tippy.js'
 export interface ResponseType {
     code: number
@@ -356,8 +356,11 @@ export interface ImageTaggingContainerType {
     artifactId?: number
     imageComment?: ImageComment
     imageReleaseTags?: ReleaseTag[]
+    matId?: number
+    updateCurrentAppMaterial? : (matId:number, releaseTags?:ReleaseTag[], imageComment?:ImageComment) => void
     appReleaseTagNames?: string[]
     tagsEditable?: boolean
+    forceReInit?: boolean
     setAppReleaseTagNames?: (appReleaseTags: string[]) => void
     setTagsEditable?: (tagsEditable: boolean) => void
     toggleCardMode?: (id: number) => void
@@ -374,6 +377,7 @@ export interface ImageButtonType {
     softDeleteTags: any
     isSuperAdmin: any
     duplicateTag?: boolean
+    hideHardDelete?: boolean
 }