@rh-support/cases 2.6.227 → 2.6.229

package/lib/esm/components/case-list/case-list-table/CaseListTable.js

@@ -1,9 +1,9 @@
-import { Bullseye, Button, EmptyState, EmptyStateBody, EmptyStateFooter, EmptyStateVariant, PaginationVariant, Spinner, } from '@patternfly/react-core';
+import { Alert, AlertVariant, Bullseye, Button, EmptyState, EmptyStateBody, EmptyStateFooter, EmptyStateVariant, Spinner, } from '@patternfly/react-core';
 import SearchIcon from '@patternfly/react-icons/dist/js/icons/search-icon';
 import { Table, TableVariant, Tbody, Td, Th, Thead, Tr, Visibility } from '@patternfly/react-table';
-import { TableComponent, TablePagination } from '@rh-support/components';
+import { TableComponent } from '@rh-support/components';
 import { GlobalMetadataDispatchContext, updateUserPreferences, useGlobalStateContext, UserPreferencesKeys, } from '@rh-support/react-context';
-import { dtmTrackEventCaseStepEncountered, formatDate, scrollIntoView, toNewCaseTypeSwitcher } from '@rh-support/utils';
+import { formatDate, mapSfdcStatusToPortalStatus, toNewCaseTypeSwitcher } from '@rh-support/utils';
 import find from 'lodash/find';
 import flatMap from 'lodash/flatMap';
 import includes from 'lodash/includes';
@@ -12,11 +12,11 @@ import isEqual from 'lodash/isEqual';
 import isUndefined from 'lodash/isUndefined';
 import React, { useContext, useEffect, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
-import { Link } from 'react-router-dom';
 import { CaseListColumnIds } from '../../../enums/case';
 import { CaseListFilterDispatchContext, CaseListFilterStateContext } from '../CaseListFilterContext';
-import { clearFilters, resetFilterToDefaultState, updatePagination, updateSort, } from '../CaseListFilterReducer';
-import SeverityLabel from './SeverityLabel';
+import { clearFilters, updateSort } from '../CaseListFilterReducer';
+import { CaseListTableRow } from './CaseListTableRow';
+import { CaseListTableSkeletonRow } from './CaseListTableSkeletonRow';
 import { TableColumnSelector } from './table-column-selector/TableColumnSelector';
 import { TableActionsDropdown } from './TableActionsDropdown';
 // initially selected columns
@@ -27,6 +27,7 @@ const initialSelectedColumns = [
     CaseListColumnIds.owner,
     CaseListColumnIds.modified,
     CaseListColumnIds.status,
+    CaseListColumnIds.caseLabel,
 ];
 const EMPTY_STATE_FILTER_APPLIED = 'Try removing filters or modifying your search query to broaden the results.';
 const EMPTY_STATE_NO_FILTERS = 'The table will be populated after creating your first support case.';
@@ -36,7 +37,7 @@ const EMPTY_STATE_NO_FILTERS_ERROR = (React.createElement(React.Fragment, null,
     React.createElement("a", { href: "https://status.redhat.com/", target: "_blank", rel: "noopener noreferrer" }, "status page"),
     "to see if there are any known issues"));
 export function CaseListTable(props) {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b;
     const [selectedColumns, setSelectedColumns] = useState([]);
     const { t } = useTranslation();
     const [selectedCases, setSelectedCases] = useState([]);
@@ -49,10 +50,10 @@ export function CaseListTable(props) {
     const [activeSortIndex, setActiveSortIndex] = useState();
     const [activeSortDirection, setActiveSortDirection] = useState();
     const [sortedCaseListData, setSortedCaseListData] = useState(caseListData);
-    const { globalMetadataState: { navBarRef, hydraUserPreferences, loggedInUserRights }, } = useGlobalStateContext();
+    const { globalMetadataState: { hydraUserPreferences, loggedInUserRights }, } = useGlobalStateContext();
     const dispatch = useContext(CaseListFilterDispatchContext);
     const dispatchToGlobalMetadataReducer = useContext(GlobalMetadataDispatchContext);
-    const { filterInfo, filterQueryInfo } = useContext(CaseListFilterStateContext);
+    const { filterInfo, filterQueryInfo, paginationInfo } = useContext(CaseListFilterStateContext);
     const currentFilterLength = flatMap(filterInfo).length;
     const showingFilter = currentFilterLength > 0;
     const hasSearchQuery = !((filterQueryInfo === null || filterQueryInfo === void 0 ? void 0 : filterQueryInfo.queryString) === '');
@@ -135,6 +136,11 @@ export function CaseListTable(props) {
             sortable: true,
             show: isColumnVisible(CaseListColumnIds.group),
         },
+        {
+            id: CaseListColumnIds.caseLabel,
+            title: t('Case labels'),
+            show: isColumnVisible(CaseListColumnIds.caseLabel),
+        },
     ];
     const visibleCaseListColumns = columns.filter((column) => visibleColumns.includes(column.id));
     const allRows = caseListData.map((row, index) => row.case_number);
@@ -155,12 +161,6 @@ export function CaseListTable(props) {
             console.error('Could not save selected columns in cache');
         }
     };
-    const onPerPageSelect = (paginationInfo) => {
-        updatePagination(dispatch, paginationInfo);
-    };
-    const onSetPage = (paginationInfo) => {
-        updatePagination(dispatch, paginationInfo);
-    };
     const onRowClick = (ev, row) => {
         // we dont want to call onRowClick if user changes the checkbox value
         if (ev.target.tagName === 'INPUT') {
@@ -212,22 +212,18 @@ export function CaseListTable(props) {
                 React.createElement(EmptyState, { variant: EmptyStateVariant.sm },
                     React.createElement(Spinner, { size: "xl" }))))));
     const onCasesCloseSuccess = () => {
-        resetFilterToDefaultState(dispatch);
+        props.onCasesCloseSuccess && props.onCasesCloseSuccess();
     };
     const getItemCount = () => {
         var _a, _b;
         if (props.isCaseListPageLoading)
             return 0;
         let paginationCount = (_b = (_a = props.caseList) === null || _a === void 0 ? void 0 : _a.numFound) !== null && _b !== void 0 ? _b : 0;
-        // solr return 400 if we fetch the elements after 10000 limit
-        // so we need to restrict the user from FE too
-        paginationCount = paginationCount > 10000 ? 10000 : paginationCount;
+        // Salesforce has a limit of 4000 cases per page
+        // So we need to limit the number of cases returned to 4000
+        paginationCount = paginationCount > 4000 ? 4000 : paginationCount;
         return paginationCount;
     };
-    const onBottomPaginationSetPage = (paginationInfo) => {
-        onSetPage(paginationInfo);
-        scrollIntoView(tableToolbarRef, { navBarRef, timeout: 0, onlyIfNotInViewport: true, offset: 30 });
-    };
     const getSortableRowValues = (row) => {
         const { case_number, case_summary, case_contactName, case_lastModifiedDate, case_severity, case_status, case_createdDate, case_accountNumber, case_alternate_id, case_type, case_closedDate, case_folderName, case_lastModifiedByName, case_createdByName, case_version, id, case_customer_escalation, case_product, } = row;
         return [
@@ -270,28 +266,32 @@ export function CaseListTable(props) {
         return (group === null || group === void 0 ? void 0 : group.name) || '';
     };
     const localRows = [
-        ...caseListData === null || caseListData === void 0 ? void 0 : caseListData.map((row, index) => ({
-            case_number: row.case_number,
-            case_summary: row.case_summary,
-            case_createdByName: row.case_createdByName,
-            case_lastModifiedDate: formatDate(row.case_last_public_update_date)
-                ? formatDate(row.case_last_public_update_date)
-                : '',
-            case_severity: row.case_severity ? row.case_severity : '',
-            case_status: row.case_status,
-            case_createdDate: formatDate(row.case_createdDate),
-            case_accountNumber: row.case_accountNumber,
-            case_alternate_id: row.case_alternate_id ? row.case_alternate_id : '',
-            case_type: toNewCaseTypeSwitcher(row.case_type),
-            case_closedDate: formatDate(row.case_closedDate) ? formatDate(row.case_closedDate) : '',
-            case_folderName: row.case_folderName || getCaseGroupName(row.case_folderNumber) || '',
-            case_contactName: row.case_contactName,
-            case_lastModifiedByName: row.case_last_public_update_by ? row.case_last_public_update_by : '',
-            case_version: row.case_version,
-            id: row.id,
-            case_product: row.case_product,
-            case_customer_escalation: row.case_customer_escalation,
-        })),
+        ...caseListData === null || caseListData === void 0 ? void 0 : caseListData.map((row, index) => {
+            var _a;
+            return ({
+                case_number: row.case_number,
+                case_summary: row.case_summary,
+                case_createdByName: row.case_createdByName,
+                case_lastModifiedDate: formatDate(row.case_last_public_update_date)
+                    ? formatDate(row.case_last_public_update_date)
+                    : '',
+                case_severity: row.case_severity ? row.case_severity : '',
+                case_status: mapSfdcStatusToPortalStatus(row.case_status),
+                case_createdDate: formatDate(row.case_createdDate),
+                case_accountNumber: row.case_accountNumber,
+                case_alternate_id: row.case_alternate_id ? row.case_alternate_id : '',
+                case_type: toNewCaseTypeSwitcher(row.case_type),
+                case_closedDate: formatDate(row.case_closedDate) ? formatDate(row.case_closedDate) : '',
+                case_folderName: row.case_folderName || getCaseGroupName(row.case_folderNumber) || '',
+                case_contactName: row.case_contactName,
+                case_lastModifiedByName: row.case_last_public_update_by ? row.case_last_public_update_by : '',
+                case_version: row.case_version,
+                id: row.id,
+                case_product: row.case_product,
+                case_customer_escalation: row.case_customer_escalation,
+                case_label: (_a = row.case_label) !== null && _a !== void 0 ? _a : [],
+            });
+        }),
     ];
     useEffect(() => {
         var _a;
@@ -343,14 +343,35 @@ export function CaseListTable(props) {
         setSortedCaseListData(sortedRows);
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [activeSortDirection, activeSortIndex]);
+    const showSkeletonLoaderRow = props.hasNextPage || props.isLoadingMore || props.loadMoreError;
+    const hasNoCaseListData = (caseListData || []).length < 1;
+    const renderCaseListRows = () => (React.createElement(React.Fragment, null, sortedCaseListData === null || sortedCaseListData === void 0 ? void 0 :
+        sortedCaseListData.map((row, rowIndex) => (React.createElement(CaseListTableRow, { key: row.case_number, row: row, rowIndex: rowIndex, isColumnVisible: isColumnVisible, isSelected: selectedCases.includes(row.case_number), onRowClick: onRowClick, onRowSelect: onRowSelect }))),
+        showSkeletonLoaderRow && (React.createElement(CaseListTableSkeletonRow, { visibleCaseListColumns: visibleCaseListColumns, sentinelRef: props.sentinelRef }))));
+    const renderTableBodyContent = () => {
+        if (!props.isCaseListPageLoading && hasNoCaseListData) {
+            return noResultFoundRow;
+        }
+        if (props.isCaseListPageLoading) {
+            return loadingRowDefault;
+        }
+        return renderCaseListRows();
+    };
     return (React.createElement(React.Fragment, null,
         React.createElement(TableComponent, { columns: columns, data: caseListData, selectedColumns: selectedColumns },
             React.createElement("div", { className: "case-list-table-toolbar pf-v6-l-flex", ref: tableToolbarRef },
                 React.createElement("div", { className: "toolbar-actions pf-v6-l-flex" },
                     React.createElement(TableColumnSelector, { onColumnSelectorChange: onColumnSelectorChange, cachedColumns: selectedColumns }),
                     React.createElement(TableActionsDropdown, { caseList: caseListData, selectedCases: selectedCases, onCasesCloseSuccess: onCasesCloseSuccess, currentFilteredCaseList: props.caseList })),
-                React.createElement("span", { className: "toolbar-pagination" },
-                    React.createElement(TablePagination, { perPage: (_c = props.paginationInfo) === null || _c === void 0 ? void 0 : _c.pageSize, currentPage: (_d = props.paginationInfo) === null || _d === void 0 ? void 0 : _d.currentPage, onPerPageSelect: onPerPageSelect, onSetPage: onSetPage, variant: PaginationVariant.top, itemCount: getItemCount() }))),
+                !props.isCaseListPageLoading && caseListData.length > 0 && (React.createElement("span", { className: "case-count-indicator" },
+                    React.createElement("strong", null, caseListData.length),
+                    " ",
+                    React.createElement(Trans, null, "of"),
+                    ' ',
+                    React.createElement("strong", null,
+                        getItemCount(),
+                        " ",
+                        React.createElement(Trans, null, "loaded"))))),
             React.createElement("div", { className: "pf-v6-c-scroll-inner-wrapper" },
                 React.createElement(Table, { variant: TableVariant.compact, "aria-label": "case-list", className: "case-list-table" },
                     React.createElement(Thead, null,
@@ -367,41 +388,23 @@ export function CaseListTable(props) {
                                         ? '0px'
                                         : undefined,
                                 }, id: column.id, sort: column.sortable ? onSort(index) : undefined, key: column.id }, column.title))))),
-                    React.createElement(Tbody, null, !props.isCaseListPageLoading && (caseListData || []).length < 1
-                        ? noResultFoundRow
-                        : props.isCaseListPageLoading
-                            ? loadingRowDefault
-                            : sortedCaseListData === null || sortedCaseListData === void 0 ? void 0 : sortedCaseListData.map((row, index) => (React.createElement(Tr, { onRowClick: (event) => (onRowClick ? onRowClick(event, row) : ''), key: row === null || row === void 0 ? void 0 : row.case_number },
-                                React.createElement(Td, { className: "pf-v6-u-pl-md", select: {
-                                        rowIndex: index,
-                                        onSelect: (_event, index) => onRowSelect(_event, row === null || row === void 0 ? void 0 : row.case_number),
-                                        isSelected: selectedCases.includes(row === null || row === void 0 ? void 0 : row.case_number),
-                                    } }),
-                                React.createElement(Td, { dataLabel: "Case ID", id: row.case_number, scope: "row" },
-                                    React.createElement("div", { className: "case-number-section" },
-                                        React.createElement(Link, { to: `/case/${row.case_number}`, onClick: () => dtmTrackEventCaseStepEncountered('review', row.case_number, row.case_product, row.case_version) },
-                                            React.createElement("span", { className: "case-number" }, row.case_number)),
-                                        row.case_customer_escalation ? (React.createElement("div", { className: "escalation-label" },
-                                            React.createElement(Trans, null, "Escalated"))) : (''))),
-                                React.createElement(Td, { dataLabel: "Title" }, row.case_summary),
-                                React.createElement(Td, { className: !isColumnVisible('contactName') ? Visibility.hidden : '', dataLabel: "Owner" }, row.case_contactName),
-                                React.createElement(Td, { className: !isColumnVisible('lastModifiedDate') ? Visibility.hidden : '', dataLabel: "Modified by" },
-                                    React.createElement("span", { className: "modified-name" }, row.case_lastModifiedByName),
-                                    row.case_lastModifiedDate ? formatDate(row.case_lastModifiedDate) : ''),
-                                React.createElement(Td, { className: !isColumnVisible('severity') ? Visibility.hidden : '', dataLabel: "Severity" },
-                                    React.createElement(SeverityLabel, { sevValue: row.case_severity })),
-                                React.createElement(Td, { className: !isColumnVisible('status') ? Visibility.hidden : '', dataLabel: "Status" }, row.case_status),
-                                React.createElement(Td, { className: !isColumnVisible('createdDate') ? Visibility.hidden : '', dataLabel: "Created by" },
-                                    React.createElement("span", { className: "created-name" }, row.case_createdByName),
-                                    row.case_createdDate ? formatDate(row.case_createdDate) : ''),
-                                React.createElement(Td, { className: !isColumnVisible('product') ? Visibility.hidden : '', dataLabel: "Product and Version" },
-                                    row.case_product,
-                                    React.createElement("span", { style: { display: 'block' } }, row.case_version)),
-                                React.createElement(Td, { className: !isColumnVisible('accountNumber') ? Visibility.hidden : '', dataLabel: "Account number" }, row.case_accountNumber),
-                                React.createElement(Td, { className: !isColumnVisible('alternateCaseId') ? Visibility.hidden : '', "data-label": "Personal reference number" }, row.case_alternate_id ? row.case_alternate_id : ''),
-                                React.createElement(Td, { className: !isColumnVisible('type') ? Visibility.hidden : '', "data-label": "Support type" }, row.case_type),
-                                React.createElement(Td, { className: !isColumnVisible('closedDate') ? Visibility.hidden : '', "data-label": "Closed date" }, row.case_closedDate ? formatDate(row.case_closedDate) : ''),
-                                React.createElement(Td, { className: !isColumnVisible('folderName') ? Visibility.hidden : '', "data-label": "Group" }, row.case_folderName ? row.case_folderName : ''))))))),
-            React.createElement("footer", { className: "toolbar-pagination", "data-tracking-id": "case-list-table-pagination" },
-                React.createElement(TablePagination, { perPage: (_e = props === null || props === void 0 ? void 0 : props.paginationInfo) === null || _e === void 0 ? void 0 : _e.pageSize, currentPage: (_f = props === null || props === void 0 ? void 0 : props.paginationInfo) === null || _f === void 0 ? void 0 : _f.currentPage, onPerPageSelect: onPerPageSelect, onSetPage: onBottomPaginationSetPage, variant: PaginationVariant.bottom, itemCount: getItemCount() })))));
+                    React.createElement(Tbody, null, renderTableBodyContent()))),
+            props.loadMoreError && props.loadMoreRetryCount <= 1 && (React.createElement("div", { className: "infinite-scroll-footer-message" },
+                React.createElement(Button, { className: "infinite-scroll-retry-btn", variant: "secondary", onClick: props.onRetryLoadMore, icon: React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round" },
+                        React.createElement("polyline", { points: "23 4 23 10 17 10" }),
+                        React.createElement("path", { d: "M20.49 15a9 9 0 1 1-2.12-9.36L23 10" })) },
+                    React.createElement(Trans, null, "try loading again")))),
+            props.loadMoreError && props.loadMoreRetryCount > 1 && (React.createElement("div", { className: "infinite-scroll-footer-message" },
+                React.createElement(Alert, { className: "infinite-scroll-alert pf-v6-u-font-weight-bold", variant: AlertVariant.danger, isInline: true, isPlain: true, title: React.createElement("span", null,
+                        React.createElement(Trans, null, "We're having trouble loading your cases. Please refresh or"),
+                        ' ',
+                        React.createElement(Button, { variant: "link", isInline: true, onClick: props.onRetryLoadMore },
+                            React.createElement(Trans, null, "try again")),
+                        ".") }))),
+            !props.hasNextPage &&
+                !props.isLoadingMore &&
+                !props.loadMoreError &&
+                caseListData.length > 0 &&
+                getItemCount() > ((paginationInfo === null || paginationInfo === void 0 ? void 0 : paginationInfo.pageSize) || 10) && (React.createElement("div", { className: "infinite-scroll-footer-message infinite-scroll-footer-text pf-v6-u-font-weight-bold pf-v6-u-color-200" },
+                React.createElement(Trans, null, "No more cases to load"))))));
 }

package/lib/esm/components/case-list/case-list-table/CaseListTableRow.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+export interface ICaseListTableRow {
+    id: string;
+    case_summary: string;
+    case_number: string;
+    case_customer_escalation: boolean;
+    case_createdByName: string;
+    case_lastModifiedByName: string;
+    case_lastModifiedDate: string;
+    case_severity: string;
+    case_product: string[];
+    case_version: string;
+    case_type: string;
+    case_status: string;
+    case_createdDate: string;
+    case_accountNumber: string;
+    case_closedDate: string;
+    case_alternate_id: string;
+    case_folderName: string;
+    case_contactName: string;
+    case_label: string[];
+}
+interface IProps {
+    row: ICaseListTableRow;
+    rowIndex: number;
+    isColumnVisible: (columnId: string) => boolean;
+    isSelected: boolean;
+    onRowClick: (event: React.MouseEvent, row: ICaseListTableRow) => void;
+    onRowSelect: (event: React.FormEvent<HTMLInputElement>, caseNumber: string) => void;
+}
+export declare function CaseListTableRow({ row, rowIndex, isColumnVisible, isSelected, onRowClick, onRowSelect }: IProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=CaseListTableRow.d.ts.map

package/lib/esm/components/case-list/case-list-table/CaseListTableRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseListTableRow.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-table/CaseListTableRow.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,WAAW,iBAAiB;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,wBAAwB,EAAE,OAAO,CAAC;IAClC,kBAAkB,EAAE,MAAM,CAAC;IAC3B,uBAAuB,EAAE,MAAM,CAAC;IAChC,qBAAqB,EAAE,MAAM,CAAC;IAC9B,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,EAAE,CAAC;CACxB;AAED,UAAU,MAAM;IACZ,GAAG,EAAE,iBAAiB,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC;IAC/C,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,GAAG,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACtE,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CACvF;AAMD,wBAAgB,gBAAgB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,eAAe,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,EAAE,MAAM,qBA+E/G"}

package/lib/esm/components/case-list/case-list-table/CaseListTableRow.js

@@ -0,0 +1,51 @@
+import { Td, Tr, Visibility } from '@patternfly/react-table';
+import { dtmTrackEventCaseStepEncountered, formatDate } from '@rh-support/utils';
+import React from 'react';
+import { Trans } from 'react-i18next';
+import { Link } from 'react-router-dom';
+import { CaseListColumnIds } from '../../../enums/case';
+import ArchivedCaseLabel from './ArchivedCaseLabel';
+import CaseListLabelGroup from './CaseListLabelGroup';
+import SeverityLabel from './SeverityLabel';
+function getColumnCellClass(columnId, isColumnVisible) {
+    return isColumnVisible(columnId) ? '' : Visibility.hidden || '';
+}
+export function CaseListTableRow({ row, rowIndex, isColumnVisible, isSelected, onRowClick, onRowSelect }) {
+    var _a;
+    return (React.createElement(Tr, { onRowClick: (event) => event && onRowClick(event, row) },
+        React.createElement(Td, { className: "pf-v6-u-pl-md", select: {
+                rowIndex,
+                onSelect: (event) => onRowSelect(event, row.case_number),
+                isSelected,
+            } }),
+        React.createElement(Td, { dataLabel: "Case ID", id: row.case_number, scope: "row" },
+            React.createElement("div", { className: "case-number-section" },
+                React.createElement(Link, { to: `/case/${row.case_number}`, onClick: () => {
+                        var _a;
+                        return dtmTrackEventCaseStepEncountered('review', row.case_number, (_a = row.case_product) === null || _a === void 0 ? void 0 : _a[0], row.case_version);
+                    } },
+                    React.createElement("span", { className: "case-number" }, row.case_number)),
+                row.case_customer_escalation ? (React.createElement("div", { className: "escalation-label" },
+                    React.createElement(Trans, null, "Escalated"))) : null,
+                row.case_status === 'Archived' ? React.createElement(ArchivedCaseLabel, null) : null)),
+        React.createElement(Td, { dataLabel: "Title" }, row.case_summary),
+        React.createElement(Td, { className: getColumnCellClass('contactName', isColumnVisible), dataLabel: "Owner" }, row.case_contactName),
+        React.createElement(Td, { className: getColumnCellClass('lastModifiedDate', isColumnVisible), dataLabel: "Modified by" },
+            React.createElement("span", { className: "modified-name" }, row.case_lastModifiedByName),
+            row.case_lastModifiedDate ? formatDate(row.case_lastModifiedDate) : ''),
+        React.createElement(Td, { className: getColumnCellClass('severity', isColumnVisible), dataLabel: "Severity" },
+            React.createElement(SeverityLabel, { sevValue: row.case_severity })),
+        React.createElement(Td, { className: getColumnCellClass('status', isColumnVisible), dataLabel: "Status" }, row.case_status),
+        React.createElement(Td, { className: getColumnCellClass('createdDate', isColumnVisible), dataLabel: "Created by" },
+            React.createElement("span", { className: "created-name" }, row.case_createdByName),
+            row.case_createdDate ? formatDate(row.case_createdDate) : ''),
+        React.createElement(Td, { className: getColumnCellClass('product', isColumnVisible), dataLabel: "Product and Version" },
+            row.case_product,
+            React.createElement("span", { className: "pf-v6-u-display-block" }, row.case_version)),
+        React.createElement(Td, { className: getColumnCellClass('accountNumber', isColumnVisible), dataLabel: "Account number" }, row.case_accountNumber),
+        React.createElement(Td, { className: getColumnCellClass('alternateCaseId', isColumnVisible), "data-label": "Personal reference number" }, row.case_alternate_id || ''),
+        React.createElement(Td, { className: getColumnCellClass('type', isColumnVisible), "data-label": "Support type" }, row.case_type),
+        React.createElement(Td, { className: getColumnCellClass('closedDate', isColumnVisible), "data-label": "Closed date" }, row.case_closedDate ? formatDate(row.case_closedDate) : ''),
+        React.createElement(Td, { className: getColumnCellClass('folderName', isColumnVisible), "data-label": "Group" }, row.case_folderName || ''),
+        React.createElement(Td, { className: getColumnCellClass(CaseListColumnIds.caseLabel, isColumnVisible), dataLabel: "Case labels" }, ((_a = row.case_label) === null || _a === void 0 ? void 0 : _a.length) ? React.createElement(CaseListLabelGroup, { labels: row.case_label }) : null)));
+}

package/lib/esm/components/case-list/case-list-table/CaseListTableSkeletonRow.d.ts

@@ -0,0 +1,9 @@
+import { IColumn } from '@rh-support/components';
+import React from 'react';
+interface IProps {
+    visibleCaseListColumns: IColumn[];
+    sentinelRef?: (node?: Element | null) => void;
+}
+export declare function CaseListTableSkeletonRow({ visibleCaseListColumns, sentinelRef }: IProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=CaseListTableSkeletonRow.d.ts.map

package/lib/esm/components/case-list/case-list-table/CaseListTableSkeletonRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseListTableSkeletonRow.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-table/CaseListTableSkeletonRow.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,MAAM;IACZ,sBAAsB,EAAE,OAAO,EAAE,CAAC;IAClC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAC;CACjD;AAED,wBAAgB,wBAAwB,CAAC,EAAE,sBAAsB,EAAE,WAAW,EAAE,EAAE,MAAM,qBAevF"}

package/lib/esm/components/case-list/case-list-table/CaseListTableSkeletonRow.js

@@ -0,0 +1,10 @@
+import { Td, Tr } from '@patternfly/react-table';
+import React from 'react';
+export function CaseListTableSkeletonRow({ visibleCaseListColumns, sentinelRef }) {
+    return (React.createElement(Tr, { key: "skeleton-loader-row", className: "skeleton-loader-row" },
+        React.createElement(Td, { className: "pf-v6-u-pl-md" },
+            React.createElement("div", { ref: sentinelRef, className: "skeleton-sentinel" },
+                React.createElement("span", { className: "skeleton-bar skeleton-bar--checkbox" }))),
+        visibleCaseListColumns.map((col) => (React.createElement(Td, { key: `skeleton-${col.id}` },
+            React.createElement("span", { className: "skeleton-bar" }))))));
+}

package/lib/esm/components/case-list/case-list-table/DownloadCSVFileModal.d.ts

@@ -1,15 +1,10 @@
 import './DownloadCSVFileModal.scss';
-import { IAccount } from '@cee-eng/hydrajs/@types/models/account';
-import { IApiResponseDetails } from '@rh-support/types/shared';
-import { UserAuth } from '@rh-support/user-permissions';
 import React from 'react';
 import { ICaseListFilterState } from '../CaseListFilterReducer';
 interface IProps {
     isDisabled?: boolean;
     onModalshow: boolean;
     onClose: () => void;
-    loggedInUserRights: IApiResponseDetails<UserAuth>;
-    loggedInUsersAccount: IApiResponseDetails<Partial<IAccount>>;
     filterState: ICaseListFilterState;
     selectedCases: string[];
     filteredCaseCount: number;

package/lib/esm/components/case-list/case-list-table/DownloadCSVFileModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DownloadCSVFileModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-table/DownloadCSVFileModal.tsx"],"names":[],"mappings":"AAAA,OAAO,6BAA6B,CAAC;AAGrC,OAAO,EAAE,QAAQ,EAAE,MAAM,wCAAwC,CAAC;AAqBlE,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AAGxD,OAAO,KAAuC,MAAM,OAAO,CAAC;AAM5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEhE,UAAU,MAAM;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,kBAAkB,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IAClD,oBAAoB,EAAE,mBAAmB,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC;IAC7D,WAAW,EAAE,oBAAoB,CAAC;IAClC,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;CAC7B;AAoBD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,KAAK,EAAE,MAAM,qBA4ZzD"}
+{"version":3,"file":"DownloadCSVFileModal.d.ts","sourceRoot":"","sources":["../../../../../src/components/case-list/case-list-table/DownloadCSVFileModal.tsx"],"names":[],"mappings":"AAAA,OAAO,6BAA6B,CAAC;AAgCrC,OAAO,KAAmD,MAAM,OAAO,CAAC;AAKxE,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEhE,UAAU,MAAM;IACZ,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,EAAE,oBAAoB,CAAC;IAClC,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;CAC7B;AAWD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,KAAK,EAAE,MAAM,qBA4XzD"}