fix: fix default props & links in tables

kyma-project · Nov 7, 2024 · 5618570 · 5618570
1 parent a6c5967
commit 5618570
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 23 deletions.
diff --git a/src/shared/components/DynamicPageComponent/DynamicPageComponent.scss b/src/shared/components/DynamicPageComponent/DynamicPageComponent.scss
@@ -39,6 +39,10 @@
       border-radius: 5px;
     }
   }
+
+  &::part(fit-content) {
+    padding: 0;
+  }
 }
 
 .header-wrapper {

diff --git a/src/shared/components/GenericList/GenericList.js b/src/shared/components/GenericList/GenericList.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useRecoilState, useRecoilValue } from 'recoil';
-import { Table, TableCell, TableRow } from '@ui5/webcomponents-react';
+import { Table } from '@ui5/webcomponents-react';
 import { useNavigate } from 'react-router-dom';
 import {
   BodyFallback,
@@ -45,19 +45,19 @@ const defaultSearch = {
 };
 
 export const GenericList = ({
-  entries,
-  actions,
+  entries = [],
+  actions = [],
   extraHeaderContent,
   title,
   headerRenderer,
   rowRenderer,
   testid,
-  serverDataError,
-  serverDataLoading,
+  serverDataError = null,
+  serverDataLoading = false,
   pagination,
   sortBy,
-  notFoundMessage,
-  searchSettings,
+  notFoundMessage = 'components.generic-list.messages.not-found',
+  searchSettings = defaultSearch,
   disableMargin,
   emptyListProps = null,
   columnLayout = null,
@@ -394,7 +394,7 @@ export const GenericList = ({
       headerActions={!headerActionsEmpty && headerActions}
       data-testid={testid}
       disableMargin
-      className={className}
+      className={`${className} ${disableMargin ? {} : 'sap-margin-small'}`}
     >
       <Table
         className={`ui5-generic-list ${
@@ -411,7 +411,7 @@ export const GenericList = ({
             () => handleRowClick(e),
           );
         }}
-        columns={
+        headerRow={
           <HeaderRenderer
             actions={actions}
             headerRenderer={headerRenderer}
@@ -482,12 +482,3 @@ GenericList.propTypes = {
   noHideFields: PropTypes.arrayOf(PropTypes.string),
   customRowClick: PropTypes.func,
 };
-
-GenericList.defaultProps = {
-  entries: [],
-  actions: [],
-  serverDataError: null,
-  serverDataLoading: false,
-  notFoundMessage: 'components.generic-list.messages.not-found',
-  searchSettings: defaultSearch,
-};
diff --git a/src/shared/components/GenericList/GenericList.scss b/src/shared/components/GenericList/GenericList.scss
@@ -13,6 +13,10 @@
   ui5-table-row:last-of-type {
     border-bottom: none;
   }
+
+  p {
+    margin: 0;
+  }
 }
 
 .cursor-pointer {

diff --git a/src/shared/components/GenericList/components.js b/src/shared/components/GenericList/components.js
@@ -5,14 +5,12 @@ import {
   Icon,
   Text,
   TableCell,
-  TableColumn,
   TableRow,
   TableHeaderRow,
+  TableHeaderCell,
 } from '@ui5/webcomponents-react';
 import ListActions from 'shared/components/ListActions/ListActions';
 
-import ListActions from 'shared/components/ListActions/ListActions';
-
 export const BodyFallback = ({ children }) => (
   <TableRow>
     <TableCell style={{ gridColumn: '1 / -1' }}>

diff --git a/src/shared/components/Link/Link.tsx b/src/shared/components/Link/Link.tsx
@@ -26,7 +26,8 @@ export const Link = ({
   const setLayout = useSetRecoilState(columnLayoutState);
   const navigate = useNavigate();
 
-  function handleOnlick(resetLayout: any, url: any) {
+  function handleOnlick(resetLayout: any, url: any, e: any) {
+    e.stopPropagation();
     if (resetLayout)
       setLayout({
         midColumn: null,
@@ -42,7 +43,7 @@ export const Link = ({
       design={design}
       className={className}
       data-testid={dataTestId}
-      onClick={() => (onClick ? onClick() : handleOnlick(resetLayout, url))}
+      onClick={e => (onClick ? onClick() : handleOnlick(resetLayout, url, e))}
     >
       {children}
     </UI5Link>