fix: Fix width of linear charts in lists and placement of action buttons (#3891)

* fix: columns widths

* fix job test

Author: OliwiaGowor

src/shared/components/GenericList/GenericList.scss

@@ -19,6 +19,10 @@
     border-bottom: var(--sapList_BorderWidth) solid
       var(--sapList_SelectionBorderColor);
   }
+
+  ui5-table-cell {
+    width: 100%;
+  }
 }
 
 .cursor-pointer {

src/shared/components/GenericList/components.js

@@ -150,7 +150,7 @@ const DefaultRowRenderer = ({
     }
   });
   const actionsCell = (
-    <TableCell>
+    <TableCell horizontalAlign="Right">
       <ListActions actions={actions} entry={entry} />
     </TableCell>
   );

src/shared/components/ProgressIndicatorWithPercentage/ProgressIndicatorWithPercentage.js

@@ -32,8 +32,10 @@ export const ProgressIndicatorWithPercentage = ({
     }
   };
 
+  const tooltipProps = { ...tooltip, style: { width: '100%' } };
+
   return (
-    <TooltipWrapper tooltipProps={tooltip}>
+    <TooltipWrapper tooltipProps={tooltipProps}>
       <div className="progress-indicator-percentage">
         {rightTitle && (
           <p className="progress-indicator-percentage__percents">

src/shared/components/ProgressIndicatorWithPercentage/ProgressIndicatorWithPercentage.scss

@@ -1,4 +1,7 @@
 .progress-indicator-percentage {
+  width: 100%;
+  min-width: 6rem;
+
   &__percents {
     text-align: end;
     position: relative;

src/shared/components/Tooltip/Tooltip.js

@@ -12,6 +12,7 @@ export const Tooltip = ({
   trigger = 'mouseenter',
   tippyProps,
   delay = [200, 0],
+  style,
 }) => {
   return (
     <TippyTooltip
@@ -20,6 +21,7 @@ export const Tooltip = ({
       trigger={trigger}
       distance={0}
       delay={delay}
+      style={style}
       {...tippyProps}
     >
       {children}

tests/integration/tests/namespace/test-jobs.spec.js

@@ -168,6 +168,7 @@ context('Test Jobs', () => {
       .find('input')
       .filterWithNoValue()
       .first()
+      .click()
       .type('b', { force: true });
 
     cy.saveChanges('Edit');