Added splitter to filter sidebar.

src/components/Dashboard/common/FilterSidebar.jsx

@@ -136,7 +136,7 @@ const FilterSidebar = ({
   }
 
   return (
-    <Card style={{ width: '25%', flexShrink: 0, height: '100%' }}>
+    <Card style={{ flexShrink: 0, height: '100%' }}>
       <Flex vertical gap='middle'>
         <Flex justify='space-between'>
           <Dropdown menu={menuItems} trigger={['hover']} placement='bottomLeft'>
@@ -158,14 +158,14 @@ const FilterSidebar = ({
                 value={row.field || undefined}
                 onChange={(v) => changeField(row.field, v)}
                 options={availableOptions(row.field)}
-                style={{ minWidth: 80, flex: 1 }}
+                style={{ minWidth: 80 }}
                 allowClear={false}
               />
               <Input
                 placeholder='Value'
                 value={row.value}
                 onChange={(e) => changeValue(row.field, e.target.value)}
-                style={{ width: 160 }}
+                style={{ flex: 1 }}
               />
               <Button
                 icon={<CloseOutlined />}

src/components/Dashboard/common/ObjectTable.jsx

@@ -19,7 +19,8 @@ import {
   Input,
   Space,
   Tooltip,
-  Form
+  Form,
+  Splitter
 } from 'antd'
 import { LoadingOutlined } from '@ant-design/icons'
 import PropTypes from 'prop-types'
@@ -940,6 +941,8 @@ const ObjectTable = forwardRef(
 
     const tableContent = (
       <Flex gap={'middle'} vertical style={{ flex: 1, minWidth: 0 }}>
+        <Splitter className={'farmcontrol-splitter'}>
+          <Splitter.Panel>
             {cards ? (
               <Spin indicator={<LoadingOutlined />} spinning={loading}>
                 {renderCards()}
@@ -953,7 +956,10 @@ const ObjectTable = forwardRef(
                 pagination={false}
                 scroll={{ y: adjustedScrollHeight }}
                 rowKey='_id'
-            loading={{ spinning: loading, indicator: <LoadingOutlined spin /> }}
+                loading={{
+                  spinning: loading,
+                  indicator: <LoadingOutlined spin />
+                }}
                 onScroll={handleScroll}
                 onChange={handleTableChange}
                 showSorterTooltip={false}
@@ -963,26 +969,20 @@ const ObjectTable = forwardRef(
                 onRow={onRow}
               />
             )}
-      </Flex>
-    )
-
-    if (showFilterSidebar) {
-      return (
-        <Flex
-          gap='middle'
-          align='flex-start'
-          style={{ width: '100%', height: '100%' }}
-        >
-          {tableContent}
+          </Splitter.Panel>
+          {showFilterSidebar && (
+            <Splitter.Panel>
               <FilterSidebar
                 type={type}
                 filter={sidebarFilter}
                 onFilterChange={handleSidebarFilterChange}
                 masterFilter={masterFilter}
               />
+            </Splitter.Panel>
+          )}
+        </Splitter>
       </Flex>
     )
-    }
 
     return tableContent
   }