chore: modified table customise columns, warning remove (#1477)

juspay · Sep 26, 2024 · 59b390a · 59b390a
1 parent 2999335
commit 59b390a
Show file tree

Hide file tree

Showing 8 changed files with 78 additions and 55 deletions.
diff --git a/public/hyperswitch/icons/solid.svg b/public/hyperswitch/icons/solid.svg
diff --git a/src/components/Filter.res b/src/components/Filter.res
@@ -363,13 +363,16 @@ let make = (
             {customLeftView}
             <RenderIf condition={allFilters->Array.length > 0}> {allFiltersUI} </RenderIf>
           </div>
-          <RenderIf condition={fixedFilters->Array.length > 0}>
-            <FormRenderer.FieldsRenderer
-              fields={fixedFilters->Array.map(item => item.field)}
-              labelClass="hidden"
-              fieldWrapperClass="p-0"
-            />
-          </RenderIf>
+          <div className="flex gap-2">
+            <RenderIf condition={fixedFilters->Array.length > 0}>
+              <FormRenderer.FieldsRenderer
+                fields={fixedFilters->Array.map(item => item.field)}
+                labelClass="hidden"
+                fieldWrapperClass="p-0"
+              />
+            </RenderIf>
+            <PortalCapture key={`${title}CustomizeColumn`} name={`${title}CustomizeColumn`} />
+          </div>
         </div>
         <div className={`flex gap-2 flex-wrap ${verticalGap}`}>
           <FormRenderer.FieldsRenderer

diff --git a/src/components/LoadedTable.res b/src/components/LoadedTable.res
@@ -828,7 +828,6 @@ let make = (
                 ?showborderColor
                 tableHeadingTextClass
                 nonFrozenTableParentClass
-                showCustomizeColumn={rightTitleElement != React.null}
               />
             switch tableLocalFilter {
             | true =>

diff --git a/src/components/LoadedTableWithCustomColumns.res b/src/components/LoadedTableWithCustomColumns.res
@@ -91,12 +91,12 @@ let make = (
     <RenderIf condition={!hideRightTitleElement}>
       <Portal to={`${title}CustomizeColumn`}>
         <Button
-          leftIcon=Button.CustomIcon(<Icon name="edit" size=16 />)
+          leftIcon=Button.CustomIcon(<Icon name="customise-columns" size=16 />)
           buttonType=SecondaryFilled
-          buttonSize={Small}
+          buttonSize=XSmall
           onClick={_ => setShowColumnSelector(_ => true)}
-          customButtonStyle="!rounded !bg-white !h-10 !text-black border-none"
-          customPaddingClass="px-4"
+          customButtonStyle="!rounded !bg-white !h-10 !text-black"
+          customPaddingClass="px-2"
         />
       </Portal>
     </RenderIf>

diff --git a/src/components/Table.res b/src/components/Table.res
@@ -82,7 +82,6 @@ module TableRow = {
     ~fixLastCol=false,
     ~alignCellContent="",
     ~customCellColor="",
-    ~showCustomizeColumn=false,
   ) => {
     open Window
     let (isCurrentRowExpanded, setIsCurrentRowExpanded) = React.useState(_ => false)
@@ -246,23 +245,6 @@ module TableRow = {
           </AddDataAttributes>
         })
         ->React.array}
-        <RenderIf condition={showCustomizeColumn}>
-          <div className="sticky right-0" onClick={e => e->ReactEvent.Mouse.stopPropagation}>
-            <tr>
-              <td colSpan=12 className="bg-white border-jp-gray-940 !border-l !p-0">
-                <div className="flex flex-row items-center">
-                  <TableCell
-                    cell=EllipsisText("", "w-14 h-14")
-                    clearFormatting
-                    isEllipsisTextRelative
-                    customMoneyStyle
-                    ellipseClass
-                  />
-                </div>
-              </td>
-            </tr>
-          </div>
-        </RenderIf>
       </tr>
       {if isCurrentRowExpanded {
         <tr className="dark:border-jp-gray-dark_disable_border_color">
@@ -541,7 +523,6 @@ module TableHeadingCell = {
 module TableHeadingRow = {
   @react.component
   let make = (
-    ~title="",
     ~headingArray,
     ~isHighchartLegend,
     ~frozenUpto,
@@ -565,7 +546,6 @@ module TableHeadingRow = {
     ~columnFilterRow,
     ~customizeColumnNewTheme=?,
     ~tableHeadingTextClass="",
-    ~showCustomizeColumn=false,
   ) => {
     if headingArray->Array.length !== 0 {
       <thead>
@@ -604,12 +584,6 @@ module TableHeadingRow = {
             />
           })
           ->React.array}
-          <RenderIf condition={showCustomizeColumn}>
-            <div
-              className="flex jusitfy-center items-center sticky right-0 w-14 bg-white border-jp-gray-940 border-l h-14">
-              <PortalCapture key={`${title}CustomizeColumn`} name={`${title}CustomizeColumn`} />
-            </div>
-          </RenderIf>
         </tr>
       </thead>
     } else {
@@ -682,7 +656,6 @@ let make = (
   ~showborderColor=true,
   ~tableHeadingTextClass="",
   ~nonFrozenTableParentClass="",
-  ~showCustomizeColumn=false,
 ) => {
   let isMobileView = MatchMedia.useMobileChecker()
   let rowInfo: array<array<cell>> = rows
@@ -763,7 +736,6 @@ let make = (
         fixLastCol
         ?alignCellContent
         ?customCellColor
-        showCustomizeColumn
       />
     })
     ->React.array
@@ -785,7 +757,6 @@ let make = (
 
     let customizeColumnNewTheme = isCustomiseColumn ? customizeColumnNewTheme : None
     <TableHeadingRow
-      title
       headingArray
       isHighchartLegend
       frozenUpto
@@ -809,7 +780,6 @@ let make = (
       columnFilterRow
       ?customizeColumnNewTheme
       tableHeadingTextClass
-      showCustomizeColumn
     />
   }
 

diff --git a/src/components/Table.resi b/src/components/Table.resi
@@ -170,7 +170,6 @@ module TableRow: {
     ~fixLastCol: bool=?,
     ~alignCellContent: string=?,
     ~customCellColor: string=?,
-    ~showCustomizeColumn: bool=?,
   ) => React.element
 }
 module SortAction: {
@@ -217,7 +216,6 @@ module TableHeadingCell: {
 module TableHeadingRow: {
   @react.component
   let make: (
-    ~title: string=?,
     ~headingArray: array<header>,
     ~isHighchartLegend: bool,
     ~frozenUpto: int,
@@ -241,7 +239,6 @@ module TableHeadingRow: {
     ~columnFilterRow: option<array<filterRow>>,
     ~customizeColumnNewTheme: customiseColumnConfig=?,
     ~tableHeadingTextClass: string=?,
-    ~showCustomizeColumn: bool=?,
   ) => React.element
 }
 @react.component
@@ -308,5 +305,4 @@ let make: (
   ~showborderColor: bool=?,
   ~tableHeadingTextClass: string=?,
   ~nonFrozenTableParentClass: string=?,
-  ~showCustomizeColumn: bool=?,
 ) => React.element
diff --git a/src/screens/HSwitchRemoteFilter.res b/src/screens/HSwitchRemoteFilter.res
@@ -258,6 +258,7 @@ module RemoteTableFilters = {
         defaultFilterKeys=[startTimeFilterKey, endTimeFilterKey]
         updateUrlWith={updateExistingKeys}
         clearFilters={() => reset()}
+        title
       />
     | _ =>
       <Filter
@@ -274,6 +275,7 @@ module RemoteTableFilters = {
         defaultFilterKeys=[startTimeFilterKey, endTimeFilterKey]
         updateUrlWith={updateExistingKeys}
         clearFilters={() => reset()}
+        title
       />
     }
   }

diff --git a/src/screens/Refunds/Refund.res b/src/screens/Refunds/Refund.res
@@ -89,6 +89,7 @@ let make = () => {
               searchVal=searchText
             />}
             entityName=REFUND_FILTERS
+            title="Refunds"
           />
         </div>
         <RenderIf condition={generateReport && refundData->Array.length > 0}>