refactor: remove useDataTableScrollHeight and introducing an auto-height prop and CSS class.

src/views/Feed/Feed.vue

@@ -1,9 +1,9 @@
 <template>
-    <div class="x-container feed" ref="feedRef">
+    <div class="x-container feed x-container--auto-height" ref="feedRef">
         <DataTableLayout
             :table="table"
             :loading="feedTable.loading"
-            :table-style="tableHeightStyle"
+            auto-height
             :page-sizes="pageSizes"
             :total-items="totalItems"
             :on-page-size-change="handlePageSizeChange">
@@ -86,7 +86,7 @@
 </template>
 
 <script setup>
-    import { computed, ref, watch } from 'vue';
+    import { computed, ref } from 'vue';
     import { ListFilter, Star } from 'lucide-vue-next';
     import { getLocalTimeZone, today } from '@internationalized/date';
     import { storeToRefs } from 'pinia';
@@ -104,7 +104,6 @@
     import { RangeCalendar } from '../../components/ui/range-calendar';
     import { Toggle } from '../../components/ui/toggle';
     import { columns as baseColumns } from './columns.jsx';
-    import { useDataTableScrollHeight } from '../../composables/useDataTableScrollHeight';
     import { useVrcxVueTable } from '../../lib/table/useVrcxVueTable';
 
     const { feedTable, feedTableData } = storeToRefs(useFeedStore());
@@ -154,13 +153,6 @@
 
     const feedRef = ref(null);
 
-    // TODO: simplify
-    const { tableStyle: tableHeightStyle } = useDataTableScrollHeight(feedRef, {
-        offset: 30,
-        toolbarHeight: 54,
-        paginationHeight: 52
-    });
-
     const pageSizes = computed(() => appearanceSettingsStore.tablePageSizes);
 
     /**