feat: give type to getInvalidTippyContent

Author: Elessar1802

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.2.5-beta-6",
+    "version": "1.2.5-beta-7",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -3,27 +3,32 @@ import { DEFAULT_INVALID_YAML_ERROR } from './constants'
 import { InvalidYAMLTippyWrapperProps } from './types'
 
 export const getInvalidTippyContent = ({
+    type = 'yaml',
     parsingError,
     restoreLastSavedYAML,
-}: Pick<InvalidYAMLTippyWrapperProps, 'parsingError' | 'restoreLastSavedYAML'>) => (
-    <div className="flexbox-col dc__gap-8 py-6">
-        <div className="flexbox-col dc__gap-4">
-            <h6 className="m-0 fs-12 fw-6 lh-18">Invalid YAML</h6>
-            <p className="m-0 cn-50 fs-12 fw-4 lh-18 dc__truncate--clamp-3">
-                {parsingError || DEFAULT_INVALID_YAML_ERROR}
-            </p>
-        </div>
+}: Pick<InvalidYAMLTippyWrapperProps, 'parsingError' | 'restoreLastSavedYAML'> & { type?: 'yaml' | 'json' }) => {
+    const text = type.toUpperCase()
+
+    return (
+        <div className="flexbox-col dc__gap-8 py-6">
+            <div className="flexbox-col dc__gap-4">
+                <h6 className="m-0 fs-12 fw-6 lh-18">Invalid {text}</h6>
+                <p className="m-0 cn-50 fs-12 fw-4 lh-18 dc__truncate--clamp-3">
+                    {parsingError || DEFAULT_INVALID_YAML_ERROR}
+                </p>
+            </div>
 
-        {restoreLastSavedYAML && (
-            <button
-                type="button"
-                data-testid="restore-last-saved-yaml"
-                className="flexbox dc__gap-6 dc__transparent cn-0 fs-12 fw-6 lh-20 p-0 dc__align-items-center"
-                onClick={restoreLastSavedYAML}
-            >
-                <ICArrowCounterClockwise className="dc__no-shrink icon-dim-16 scn-0" />
-                Restore last saved YAML
-            </button>
-        )}
-    </div>
-)
+            {restoreLastSavedYAML && (
+                <button
+                    type="button"
+                    data-testid="restore-last-saved-yaml"
+                    className="flexbox dc__gap-6 dc__transparent cn-0 fs-12 fw-6 lh-20 p-0 dc__align-items-center"
+                    onClick={restoreLastSavedYAML}
+                >
+                    <ICArrowCounterClockwise className="dc__no-shrink icon-dim-16 scn-0" />
+                    Restore last saved {text}
+                </button>
+            )}
+        </div>
+    )
+}