chore: update common lib version to 0.1.13-beta-7

Author: AbhishekA1509

package-lock.json

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

package.json

@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import Tippy from '@tippyjs/react'
 import { ReactComponent as SortIcon } from '../../Assets/Icon/ic-arrow-up-down.svg'
 import { ReactComponent as SortArrowDown } from '../../Assets/Icon/ic-sort-arrow-down.svg'
 import { SortingOrder } from '../Constants'
@@ -41,6 +42,7 @@ const SortableTableHeaderCell = ({
     title,
     disabled,
     isSortable = true,
+    showTippy = false,
 }: SortableTableHeaderCellProps) => {
     const renderSortIcon = () => {
         if (!isSortable) {
@@ -50,22 +52,30 @@ const SortableTableHeaderCell = ({
         if (isSorted) {
             return (
                 <SortArrowDown
-                    className={`icon-dim-12 mw-12 scn-7 dc__transition--transform ${sortOrder === SortingOrder.DESC ? 'dc__flip-180' : ''}`}
+                    className={`icon-dim-12 mw-12 scn-7 dc__no-shrink dc__transition--transform ${sortOrder === SortingOrder.DESC ? 'dc__flip-180' : ''}`}
                 />
             )
         }
 
-        return <SortIcon className="icon-dim-12 mw-12 scn-7" />
+        return <SortIcon className="icon-dim-12 mw-12 scn-7 dc__no-shrink" />
     }
 
+    const renderTitle = () => <span className="dc__uppercase dc__truncate">{title}</span>
+
     return (
         <button
             type="button"
             className="dc__transparent p-0 bcn-0 cn-7 flex dc__content-start dc__gap-4 dc__select-text"
             onClick={isSortable ? triggerSorting : noop}
             disabled={disabled}
         >
-            <span className="dc__uppercase dc__truncate">{title}</span>
+            {showTippy ? (
+                <Tippy arrow={false} content={title} className="default-tt dc__mxw-200 dc__word-break">
+                    {renderTitle()}
+                </Tippy>
+            ) : (
+                renderTitle()
+            )}
             {renderSortIcon()}
         </button>
     )

src/Common/SortableTableHeaderCell/SortableTableHeaderCell.tsx

@@ -44,4 +44,8 @@ export interface SortableTableHeaderCellProps {
      * @default true
      */
     isSortable?: boolean
+    /**
+     * @default - false
+     */
+    showTippy?: boolean
 }