diff --git a/apps/web/app/(use-page-wrapper)/settings/(admin-layout)/admin/playground/date-range-filter/page.tsx b/apps/web/app/(use-page-wrapper)/settings/(admin-layout)/admin/playground/date-range-filter/page.tsx index cd28a25f293f39..e85a4e1dfd526c 100644 --- a/apps/web/app/(use-page-wrapper)/settings/(admin-layout)/admin/playground/date-range-filter/page.tsx +++ b/apps/web/app/(use-page-wrapper)/settings/(admin-layout)/admin/playground/date-range-filter/page.tsx @@ -3,7 +3,8 @@ import { useReactTable, getCoreRowModel, createColumnHelper } from "@tanstack/react-table"; import { useMemo } from "react"; -import { ColumnFilterType, DataTableProvider } from "@calcom/features/data-table"; +import { ColumnFilterType } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import type { DateRangeFilterOptions } from "@calcom/features/data-table/lib/types"; import { DateRangeFilter } from "~/data-table/components/filters/DateRangeFilter"; diff --git a/apps/web/modules/bookings/components/BookingListContainer.tsx b/apps/web/modules/bookings/components/BookingListContainer.tsx index 38c77c1d79eb2a..edbe1b0e802bec 100644 --- a/apps/web/modules/bookings/components/BookingListContainer.tsx +++ b/apps/web/modules/bookings/components/BookingListContainer.tsx @@ -1,7 +1,8 @@ "use client"; import dayjs from "@calcom/dayjs"; -import { useDataTable, useDisplayedFilterCount } from "@calcom/features/data-table"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; +import { useDisplayedFilterCount } from "~/data-table/hooks/useDisplayedFilterCount"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc/react"; import useMeQuery from "@calcom/trpc/react/hooks/useMeQuery"; diff --git a/apps/web/modules/bookings/hooks/useActiveFiltersValidator.ts b/apps/web/modules/bookings/hooks/useActiveFiltersValidator.ts index 76c6abbc9de0ee..9bb7972a2d6d84 100644 --- a/apps/web/modules/bookings/hooks/useActiveFiltersValidator.ts +++ b/apps/web/modules/bookings/hooks/useActiveFiltersValidator.ts @@ -1,5 +1,6 @@ -import type { ActiveFilter, ActiveFilters, ActiveFiltersValidator } from "@calcom/features/data-table"; +import type { ActiveFilter, ActiveFilters } from "@calcom/features/data-table"; import { ColumnFilterType } from "@calcom/features/data-table"; +import type { ActiveFiltersValidator } from "~/data-table/DataTableProvider"; import { trpc } from "@calcom/trpc/react"; import useMeQuery from "@calcom/trpc/react/hooks/useMeQuery"; import { useCallback, useMemo } from "react"; diff --git a/apps/web/modules/bookings/hooks/useBookingFilters.ts b/apps/web/modules/bookings/hooks/useBookingFilters.ts index 00478bcf4e40ad..422f6d4a1e9e2d 100644 --- a/apps/web/modules/bookings/hooks/useBookingFilters.ts +++ b/apps/web/modules/bookings/hooks/useBookingFilters.ts @@ -1,9 +1,5 @@ -import { - useFilterValue, - ZMultiSelectFilterValue, - ZDateRangeFilterValue, - ZTextFilterValue, -} from "@calcom/features/data-table"; +import { ZMultiSelectFilterValue, ZDateRangeFilterValue, ZTextFilterValue } from "@calcom/features/data-table"; +import { useFilterValue } from "~/data-table/hooks/useFilterValue"; export function useBookingFilters() { const eventTypeIds = useFilterValue("eventTypeId", ZMultiSelectFilterValue)?.data as number[] | undefined; diff --git a/apps/web/modules/bookings/hooks/useCalendarAllowedFilters.ts b/apps/web/modules/bookings/hooks/useCalendarAllowedFilters.ts index 91aac7c4a569ca..b5c9f5e7618d91 100644 --- a/apps/web/modules/bookings/hooks/useCalendarAllowedFilters.ts +++ b/apps/web/modules/bookings/hooks/useCalendarAllowedFilters.ts @@ -1,6 +1,7 @@ import { useMemo, useEffect, useRef } from "react"; -import { ColumnFilterType, useDataTable } from "@calcom/features/data-table"; +import { ColumnFilterType } from "@calcom/features/data-table"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import useMeQuery from "@calcom/trpc/react/hooks/useMeQuery"; /** diff --git a/apps/web/modules/bookings/views/bookings-view.tsx b/apps/web/modules/bookings/views/bookings-view.tsx index f2102c9417274d..86d8613fe7cf2a 100644 --- a/apps/web/modules/bookings/views/bookings-view.tsx +++ b/apps/web/modules/bookings/views/bookings-view.tsx @@ -1,6 +1,7 @@ "use client"; -import { ColumnFilterType, DataTableProvider, type SystemFilterSegment } from "@calcom/features/data-table"; +import { ColumnFilterType, type SystemFilterSegment } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import { useSegments } from "~/data-table/hooks/useSegments"; import FeatureOptInBannerWrapper from "~/feature-opt-in/components/FeatureOptInBannerWrapper"; import { useLocale } from "@calcom/lib/hooks/useLocale"; diff --git a/packages/features/data-table/DataTableProvider.tsx b/apps/web/modules/data-table/DataTableProvider.tsx similarity index 99% rename from packages/features/data-table/DataTableProvider.tsx rename to apps/web/modules/data-table/DataTableProvider.tsx index 027bea5b79280f..f6ed6ebed293a5 100644 --- a/packages/features/data-table/DataTableProvider.tsx +++ b/apps/web/modules/data-table/DataTableProvider.tsx @@ -20,7 +20,7 @@ import type { SegmentIdentifier, ActiveFilters, UseSegments, -} from "./lib/types"; +} from "@calcom/features/data-table/lib/types"; export type { ActiveFiltersValidatorState }; export type { ActiveFiltersValidator } from "./contexts"; diff --git a/apps/web/modules/data-table/components/DataTable.tsx b/apps/web/modules/data-table/components/DataTable.tsx index 7d56e956a4f506..ebba66e1eec565 100644 --- a/apps/web/modules/data-table/components/DataTable.tsx +++ b/apps/web/modules/data-table/components/DataTable.tsx @@ -21,8 +21,8 @@ import { TableRow, } from "@calcom/ui/components/table"; -import { useColumnSizingVars } from "@calcom/features/data-table/hooks"; -import { useColumnResizing } from "@calcom/features/data-table/hooks/useColumnResizing"; +import { useColumnSizingVars } from "~/data-table/hooks/useColumnSizingVars"; +import { useColumnResizing } from "~/data-table/hooks/useColumnResizing"; import type { SeparatorRow } from "@calcom/features/data-table/lib/separator"; import { isSeparatorRow } from "@calcom/features/data-table/lib/separator"; diff --git a/apps/web/modules/data-table/components/DataTablePagination.tsx b/apps/web/modules/data-table/components/DataTablePagination.tsx index ff7218a4752664..a8589adbe3f0b6 100644 --- a/apps/web/modules/data-table/components/DataTablePagination.tsx +++ b/apps/web/modules/data-table/components/DataTablePagination.tsx @@ -4,7 +4,7 @@ import { type Table } from "@tanstack/react-table"; import { Pagination } from "@calcom/ui/components/pagination"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; interface DataTablePaginationProps { table: Table; diff --git a/apps/web/modules/data-table/components/DataTableToolbar.tsx b/apps/web/modules/data-table/components/DataTableToolbar.tsx index 7788b98846bdf7..49861d2b55f9d6 100644 --- a/apps/web/modules/data-table/components/DataTableToolbar.tsx +++ b/apps/web/modules/data-table/components/DataTableToolbar.tsx @@ -10,7 +10,7 @@ import classNames from "@calcom/ui/classNames"; import { Button, type ButtonProps } from "@calcom/ui/components/button"; import { FilterSearchField } from "@calcom/ui/components/form"; -import { useColumnFilters, useDataTable } from "@calcom/features/data-table/hooks"; +import { useColumnFilters, useDataTable } from "~/data-table/hooks"; interface DataTableToolbarProps extends ComponentPropsWithoutRef<"div"> { children: React.ReactNode; diff --git a/apps/web/modules/data-table/components/DataTableWrapper.tsx b/apps/web/modules/data-table/components/DataTableWrapper.tsx index dad2c14ab8b846..d6a8d7c778505e 100644 --- a/apps/web/modules/data-table/components/DataTableWrapper.tsx +++ b/apps/web/modules/data-table/components/DataTableWrapper.tsx @@ -4,9 +4,9 @@ import type { Row, VisibilityState } from "@tanstack/react-table"; import { noop } from "lodash"; import { useEffect, useRef } from "react"; -import { useColumnFilters } from "@calcom/features/data-table/hooks/useColumnFilters"; -import { useDataTable } from "@calcom/features/data-table/hooks/useDataTable"; -import { useFetchMoreOnBottomReached } from "@calcom/features/data-table/hooks/useFetchMoreOnBottomReached"; +import { useColumnFilters } from "~/data-table/hooks/useColumnFilters"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; +import { useFetchMoreOnBottomReached } from "~/data-table/hooks/useFetchMoreOnBottomReached"; import type { DataTablePropsFromWrapper } from "./DataTable"; import { DataTable } from "./DataTable"; import { DataTablePagination } from "./DataTablePagination"; diff --git a/apps/web/modules/data-table/components/filters/ActiveFilters.tsx b/apps/web/modules/data-table/components/filters/ActiveFilters.tsx index 20207cb734d917..a8cfdc091b9315 100644 --- a/apps/web/modules/data-table/components/filters/ActiveFilters.tsx +++ b/apps/web/modules/data-table/components/filters/ActiveFilters.tsx @@ -2,7 +2,7 @@ import { type Table } from "@tanstack/react-table"; -import { useDataTable, useFilterableColumns } from "@calcom/features/data-table/hooks"; +import { useDataTable, useFilterableColumns } from "~/data-table/hooks"; import { ColumnFilterType } from "@calcom/features/data-table/lib/types"; import { DateRangeFilter } from "./DateRangeFilter"; import { FilterPopover } from "./FilterPopover"; diff --git a/apps/web/modules/data-table/components/filters/AddFilterButton.tsx b/apps/web/modules/data-table/components/filters/AddFilterButton.tsx index 11767ba1b78cd8..63ece5e4a1f247 100644 --- a/apps/web/modules/data-table/components/filters/AddFilterButton.tsx +++ b/apps/web/modules/data-table/components/filters/AddFilterButton.tsx @@ -11,7 +11,7 @@ import { Icon } from "@calcom/ui/components/icon"; import { Popover, PopoverTrigger, PopoverContent } from "@calcom/ui/components/popover"; import { Tooltip } from "@calcom/ui/components/tooltip"; -import { useDataTable, useFilterableColumns } from "@calcom/features/data-table/hooks"; +import { useDataTable, useFilterableColumns } from "~/data-table/hooks"; export interface AddFilterButtonProps { table: Table; diff --git a/apps/web/modules/data-table/components/filters/BaseSelectFilterOptions.tsx b/apps/web/modules/data-table/components/filters/BaseSelectFilterOptions.tsx index cbdc2cfc18b918..1934b2d47c32c5 100644 --- a/apps/web/modules/data-table/components/filters/BaseSelectFilterOptions.tsx +++ b/apps/web/modules/data-table/components/filters/BaseSelectFilterOptions.tsx @@ -16,7 +16,7 @@ import { } from "@calcom/ui/components/command"; import { Icon } from "@calcom/ui/components/icon"; -import { useDataTable, useFilterValue } from "@calcom/features/data-table/hooks"; +import { useDataTable, useFilterValue } from "~/data-table/hooks"; import type { FacetedValue, FilterableColumn as _FilterableColumn, diff --git a/apps/web/modules/data-table/components/filters/ClearFiltersButton.tsx b/apps/web/modules/data-table/components/filters/ClearFiltersButton.tsx index d04c46c89e483a..14e51533ce0968 100644 --- a/apps/web/modules/data-table/components/filters/ClearFiltersButton.tsx +++ b/apps/web/modules/data-table/components/filters/ClearFiltersButton.tsx @@ -2,7 +2,7 @@ import { useLocale } from "@calcom/lib/hooks/useLocale"; import { Button } from "@calcom/ui/components/button"; import { Tooltip } from "@calcom/ui/components/tooltip"; -import { useDataTable } from "@calcom/features/data-table/hooks/useDataTable"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; export const ClearFiltersButton = ({ exclude }: { exclude?: string[] }) => { const { t } = useLocale(); diff --git a/apps/web/modules/data-table/components/filters/DateRangeFilter.tsx b/apps/web/modules/data-table/components/filters/DateRangeFilter.tsx index 6816213cced88b..15fb570607185e 100644 --- a/apps/web/modules/data-table/components/filters/DateRangeFilter.tsx +++ b/apps/web/modules/data-table/components/filters/DateRangeFilter.tsx @@ -19,7 +19,7 @@ import { DateRangePicker } from "@calcom/ui/components/form"; import { Icon } from "@calcom/ui/components/icon"; import { Popover, PopoverContent, PopoverTrigger } from "@calcom/ui/components/popover"; -import { useDataTable, useFilterValue } from "@calcom/features/data-table/hooks"; +import { useDataTable, useFilterValue } from "~/data-table/hooks"; import { CUSTOM_PRESET, CUSTOM_PRESET_VALUE, diff --git a/apps/web/modules/data-table/components/filters/FilterBar.tsx b/apps/web/modules/data-table/components/filters/FilterBar.tsx index 3cc08dbc84fe95..76c7ce8b340849 100644 --- a/apps/web/modules/data-table/components/filters/FilterBar.tsx +++ b/apps/web/modules/data-table/components/filters/FilterBar.tsx @@ -2,7 +2,7 @@ import { type Table } from "@tanstack/react-table"; -import { useDisplayedFilterCount } from "@calcom/features/data-table/hooks"; +import { useDisplayedFilterCount } from "~/data-table/hooks"; import { ActiveFilters } from "./ActiveFilters"; import { AddFilterButton } from "./AddFilterButton"; diff --git a/apps/web/modules/data-table/components/filters/FilterPopover.tsx b/apps/web/modules/data-table/components/filters/FilterPopover.tsx index c9535c332c11bf..bca353afd7f295 100644 --- a/apps/web/modules/data-table/components/filters/FilterPopover.tsx +++ b/apps/web/modules/data-table/components/filters/FilterPopover.tsx @@ -6,7 +6,7 @@ import { Button } from "@calcom/ui/components/button"; import type { IconName } from "@calcom/ui/components/icon"; import { Popover, PopoverContent, PopoverTrigger } from "@calcom/ui/components/popover"; -import { useFilterValue } from "@calcom/features/data-table/hooks"; +import { useFilterValue } from "~/data-table/hooks"; import { type FilterableColumn, type FilterValue, diff --git a/apps/web/modules/data-table/components/filters/MultiSelectFilterOptions.tsx b/apps/web/modules/data-table/components/filters/MultiSelectFilterOptions.tsx index 5e21428c821976..e888d8d896efae 100644 --- a/apps/web/modules/data-table/components/filters/MultiSelectFilterOptions.tsx +++ b/apps/web/modules/data-table/components/filters/MultiSelectFilterOptions.tsx @@ -1,6 +1,6 @@ "use client"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; import type { FilterableColumn } from "@calcom/features/data-table/lib/types"; import { ZMultiSelectFilterValue, ColumnFilterType } from "@calcom/features/data-table/lib/types"; import type { FilterType } from "@calcom/types/data-table"; diff --git a/apps/web/modules/data-table/components/filters/NumberFilterOptions.tsx b/apps/web/modules/data-table/components/filters/NumberFilterOptions.tsx index f4f1dcf1ca0ec1..3e26a957f65ace 100644 --- a/apps/web/modules/data-table/components/filters/NumberFilterOptions.tsx +++ b/apps/web/modules/data-table/components/filters/NumberFilterOptions.tsx @@ -6,7 +6,7 @@ import { useLocale } from "@calcom/lib/hooks/useLocale"; import { Button } from "@calcom/ui/components/button"; import { Form, Select, NumberInput } from "@calcom/ui/components/form"; -import { useFilterValue, useDataTable } from "@calcom/features/data-table/hooks"; +import { useFilterValue, useDataTable } from "~/data-table/hooks"; import type { FilterableColumn } from "@calcom/features/data-table/lib/types"; import { ZNumberFilterValue, ColumnFilterType } from "@calcom/features/data-table/lib/types"; import type { FilterType } from "@calcom/types/data-table"; diff --git a/apps/web/modules/data-table/components/filters/SingleSelectFilterOptions.tsx b/apps/web/modules/data-table/components/filters/SingleSelectFilterOptions.tsx index c3672831e9a960..d0a3b0c8926601 100644 --- a/apps/web/modules/data-table/components/filters/SingleSelectFilterOptions.tsx +++ b/apps/web/modules/data-table/components/filters/SingleSelectFilterOptions.tsx @@ -2,7 +2,7 @@ import type { FilterType } from "@calcom/types/data-table"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; import type { FilterableColumn } from "@calcom/features/data-table/lib/types"; import { ZSingleSelectFilterValue, ColumnFilterType } from "@calcom/features/data-table/lib/types"; import { BaseSelectFilterOptions } from "./BaseSelectFilterOptions"; diff --git a/apps/web/modules/data-table/components/filters/TextFilterOptions.tsx b/apps/web/modules/data-table/components/filters/TextFilterOptions.tsx index 5dc273e3fa2e22..67a463f3ad6433 100644 --- a/apps/web/modules/data-table/components/filters/TextFilterOptions.tsx +++ b/apps/web/modules/data-table/components/filters/TextFilterOptions.tsx @@ -6,7 +6,7 @@ import { useLocale } from "@calcom/lib/hooks/useLocale"; import { Button } from "@calcom/ui/components/button"; import { Form, Select, Input } from "@calcom/ui/components/form"; -import { useFilterValue, useDataTable } from "@calcom/features/data-table/hooks"; +import { useFilterValue, useDataTable } from "~/data-table/hooks"; import type { FilterableColumn } from "@calcom/features/data-table/lib/types"; import { ZTextFilterValue, ColumnFilterType } from "@calcom/features/data-table/lib/types"; import type { FilterType } from "@calcom/types/data-table"; diff --git a/apps/web/modules/data-table/components/filters/useFilterPopoverOpen.ts b/apps/web/modules/data-table/components/filters/useFilterPopoverOpen.ts index 9931b20e4201ca..4bcd71abd27ce7 100644 --- a/apps/web/modules/data-table/components/filters/useFilterPopoverOpen.ts +++ b/apps/web/modules/data-table/components/filters/useFilterPopoverOpen.ts @@ -1,6 +1,6 @@ import { useState, useEffect, useCallback } from "react"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; export function useFilterPopoverOpen(columnId: string) { const { filterToOpen } = useDataTable(); diff --git a/apps/web/modules/data-table/components/segment/DeleteSegmentDialog.tsx b/apps/web/modules/data-table/components/segment/DeleteSegmentDialog.tsx index 4517a71c3a30a9..7a0b480feb3d20 100644 --- a/apps/web/modules/data-table/components/segment/DeleteSegmentDialog.tsx +++ b/apps/web/modules/data-table/components/segment/DeleteSegmentDialog.tsx @@ -3,7 +3,7 @@ import { trpc } from "@calcom/trpc/react"; import { Dialog, ConfirmationDialogContent } from "@calcom/ui/components/dialog"; import { showToast } from "@calcom/ui/components/toast"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; import type { FilterSegmentOutput } from "@calcom/features/data-table/lib/types"; export function DeleteSegmentDialog({ diff --git a/apps/web/modules/data-table/components/segment/DuplicateSegmentDialog.tsx b/apps/web/modules/data-table/components/segment/DuplicateSegmentDialog.tsx index 2e97f3df67822e..0a2ec38d0b3022 100644 --- a/apps/web/modules/data-table/components/segment/DuplicateSegmentDialog.tsx +++ b/apps/web/modules/data-table/components/segment/DuplicateSegmentDialog.tsx @@ -9,7 +9,7 @@ import { Dialog, DialogContent, DialogFooter, DialogHeader } from "@calcom/ui/co import { Form, TextField } from "@calcom/ui/components/form"; import { showToast } from "@calcom/ui/components/toast"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; import type { CombinedFilterSegment } from "@calcom/features/data-table/lib/types"; type FormValues = { diff --git a/apps/web/modules/data-table/components/segment/FilterSegmentSelect.tsx b/apps/web/modules/data-table/components/segment/FilterSegmentSelect.tsx index 7d7f3edb6b5e81..f2d6fe150580ad 100644 --- a/apps/web/modules/data-table/components/segment/FilterSegmentSelect.tsx +++ b/apps/web/modules/data-table/components/segment/FilterSegmentSelect.tsx @@ -1,5 +1,5 @@ import { checkAdminOrOwner } from "@calcom/features/auth/lib/checkAdminOrOwner"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; import type { CombinedFilterSegment, FilterSegmentOutput, diff --git a/apps/web/modules/data-table/components/segment/SaveFilterSegmentButton.tsx b/apps/web/modules/data-table/components/segment/SaveFilterSegmentButton.tsx index db2e10592da6ff..a92c9a5817a931 100644 --- a/apps/web/modules/data-table/components/segment/SaveFilterSegmentButton.tsx +++ b/apps/web/modules/data-table/components/segment/SaveFilterSegmentButton.tsx @@ -19,7 +19,7 @@ import { Form, Input, Label, Select, Switch } from "@calcom/ui/components/form"; import { RadioGroup, RadioField } from "@calcom/ui/components/radio"; import { showToast } from "@calcom/ui/components/toast"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks"; interface FormValues { name: string; diff --git a/packages/features/data-table/contexts/DataTableFiltersContext.tsx b/apps/web/modules/data-table/contexts/DataTableFiltersContext.tsx similarity index 98% rename from packages/features/data-table/contexts/DataTableFiltersContext.tsx rename to apps/web/modules/data-table/contexts/DataTableFiltersContext.tsx index 5695bd4717a96b..2d76edf40ca824 100644 --- a/packages/features/data-table/contexts/DataTableFiltersContext.tsx +++ b/apps/web/modules/data-table/contexts/DataTableFiltersContext.tsx @@ -3,7 +3,7 @@ import debounce from "lodash/debounce"; import { createContext, useContext, useCallback, useMemo, useEffect } from "react"; -import type { FilterValue, ActiveFilters } from "../lib/types"; +import type { FilterValue, ActiveFilters } from "@calcom/features/data-table/lib/types"; import { useDataTableSegment } from "./DataTableSegmentContext"; import { useDataTableState } from "./DataTableStateContext"; diff --git a/packages/features/data-table/contexts/DataTableSegmentContext.tsx b/apps/web/modules/data-table/contexts/DataTableSegmentContext.tsx similarity index 98% rename from packages/features/data-table/contexts/DataTableSegmentContext.tsx rename to apps/web/modules/data-table/contexts/DataTableSegmentContext.tsx index b11e77f13d5b7e..1034eae29060fd 100644 --- a/packages/features/data-table/contexts/DataTableSegmentContext.tsx +++ b/apps/web/modules/data-table/contexts/DataTableSegmentContext.tsx @@ -9,8 +9,8 @@ import type { CombinedFilterSegment, SegmentIdentifier, UseSegments, -} from "../lib/types"; -import { SYSTEM_SEGMENT_PREFIX } from "../lib/types"; +} from "@calcom/features/data-table/lib/types"; +import { SYSTEM_SEGMENT_PREFIX } from "@calcom/features/data-table/lib/types"; import { useDataTableState } from "./DataTableStateContext"; export type DataTableSegmentContextType = { diff --git a/packages/features/data-table/contexts/DataTableStateContext.tsx b/apps/web/modules/data-table/contexts/DataTableStateContext.tsx similarity index 95% rename from packages/features/data-table/contexts/DataTableStateContext.tsx rename to apps/web/modules/data-table/contexts/DataTableStateContext.tsx index e441298b470fc0..411a0da220f4b9 100644 --- a/packages/features/data-table/contexts/DataTableStateContext.tsx +++ b/apps/web/modules/data-table/contexts/DataTableStateContext.tsx @@ -16,9 +16,9 @@ import { pageSizeParser, searchTermParser, DEFAULT_PAGE_SIZE, -} from "../lib/parsers"; -import type { ActiveFilters, SegmentIdentifier } from "../lib/types"; -import { CTA_CONTAINER_CLASS_NAME } from "../lib/utils"; +} from "@calcom/features/data-table/lib/parsers"; +import type { ActiveFilters, SegmentIdentifier } from "@calcom/features/data-table/lib/types"; +import { CTA_CONTAINER_CLASS_NAME } from "@calcom/features/data-table/lib/utils"; export type ActiveFiltersValidator = (filters: ActiveFilters) => ActiveFilters; diff --git a/packages/features/data-table/contexts/index.ts b/apps/web/modules/data-table/contexts/index.ts similarity index 100% rename from packages/features/data-table/contexts/index.ts rename to apps/web/modules/data-table/contexts/index.ts diff --git a/packages/features/data-table/hooks/index.ts b/apps/web/modules/data-table/hooks/index.ts similarity index 100% rename from packages/features/data-table/hooks/index.ts rename to apps/web/modules/data-table/hooks/index.ts diff --git a/packages/features/data-table/hooks/useChangeTimeZoneWithPreservedLocalTime.ts b/apps/web/modules/data-table/hooks/useChangeTimeZoneWithPreservedLocalTime.ts similarity index 88% rename from packages/features/data-table/hooks/useChangeTimeZoneWithPreservedLocalTime.ts rename to apps/web/modules/data-table/hooks/useChangeTimeZoneWithPreservedLocalTime.ts index 4f91d41ef72e65..387c96074e4942 100644 --- a/packages/features/data-table/hooks/useChangeTimeZoneWithPreservedLocalTime.ts +++ b/apps/web/modules/data-table/hooks/useChangeTimeZoneWithPreservedLocalTime.ts @@ -2,7 +2,7 @@ import { useMemo } from "react"; import { CURRENT_TIMEZONE } from "@calcom/lib/timezoneConstants"; -import { preserveLocalTime } from "../lib/preserveLocalTime"; +import { preserveLocalTime } from "@calcom/features/data-table/lib/preserveLocalTime"; import { useDataTable } from "./useDataTable"; /** diff --git a/packages/features/data-table/hooks/useColumnFilters.ts b/apps/web/modules/data-table/hooks/useColumnFilters.ts similarity index 87% rename from packages/features/data-table/hooks/useColumnFilters.ts rename to apps/web/modules/data-table/hooks/useColumnFilters.ts index ce9a410370a69f..18783d3fd0991e 100644 --- a/packages/features/data-table/hooks/useColumnFilters.ts +++ b/apps/web/modules/data-table/hooks/useColumnFilters.ts @@ -1,8 +1,8 @@ import { useCallback, useMemo } from "react"; -import type { ColumnFilter } from "../lib/types"; -import { ZFilterValue } from "../lib/types"; -import { isMultiSelectFilterValue } from "../lib/utils"; +import type { ColumnFilter } from "@calcom/features/data-table/lib/types"; +import { ZFilterValue } from "@calcom/features/data-table/lib/types"; +import { isMultiSelectFilterValue } from "@calcom/features/data-table/lib/utils"; import { useDataTable } from "./useDataTable"; export function useColumnFilters({ exclude }: { exclude?: string[] } = {}): ColumnFilter[] { diff --git a/packages/features/data-table/hooks/useColumnResizing.ts b/apps/web/modules/data-table/hooks/useColumnResizing.ts similarity index 100% rename from packages/features/data-table/hooks/useColumnResizing.ts rename to apps/web/modules/data-table/hooks/useColumnResizing.ts diff --git a/packages/features/data-table/hooks/useColumnSizingVars.ts b/apps/web/modules/data-table/hooks/useColumnSizingVars.ts similarity index 100% rename from packages/features/data-table/hooks/useColumnSizingVars.ts rename to apps/web/modules/data-table/hooks/useColumnSizingVars.ts diff --git a/packages/features/data-table/hooks/useDataTable.ts b/apps/web/modules/data-table/hooks/useDataTable.ts similarity index 100% rename from packages/features/data-table/hooks/useDataTable.ts rename to apps/web/modules/data-table/hooks/useDataTable.ts diff --git a/packages/features/data-table/hooks/useDebouncedWidth.ts b/apps/web/modules/data-table/hooks/useDebouncedWidth.ts similarity index 100% rename from packages/features/data-table/hooks/useDebouncedWidth.ts rename to apps/web/modules/data-table/hooks/useDebouncedWidth.ts diff --git a/packages/features/data-table/hooks/useDisplayedFilterCount.ts b/apps/web/modules/data-table/hooks/useDisplayedFilterCount.ts similarity index 100% rename from packages/features/data-table/hooks/useDisplayedFilterCount.ts rename to apps/web/modules/data-table/hooks/useDisplayedFilterCount.ts diff --git a/packages/features/data-table/hooks/useFetchMoreOnBottomReached.ts b/apps/web/modules/data-table/hooks/useFetchMoreOnBottomReached.ts similarity index 100% rename from packages/features/data-table/hooks/useFetchMoreOnBottomReached.ts rename to apps/web/modules/data-table/hooks/useFetchMoreOnBottomReached.ts diff --git a/packages/features/data-table/hooks/useFilterValue.ts b/apps/web/modules/data-table/hooks/useFilterValue.ts similarity index 88% rename from packages/features/data-table/hooks/useFilterValue.ts rename to apps/web/modules/data-table/hooks/useFilterValue.ts index 468fc74af90ca9..408555f85ed10d 100644 --- a/packages/features/data-table/hooks/useFilterValue.ts +++ b/apps/web/modules/data-table/hooks/useFilterValue.ts @@ -1,7 +1,7 @@ import { useMemo } from "react"; import type { z } from "zod"; -import type { FilterValueSchema, ZFilterValue } from "../lib/types"; +import type { FilterValueSchema, ZFilterValue } from "@calcom/features/data-table/lib/types"; import type { FilterType } from "@calcom/types/data-table"; import { useDataTable } from "./useDataTable"; diff --git a/packages/features/data-table/hooks/useFilterableColumns.ts b/apps/web/modules/data-table/hooks/useFilterableColumns.ts similarity index 88% rename from packages/features/data-table/hooks/useFilterableColumns.ts rename to apps/web/modules/data-table/hooks/useFilterableColumns.ts index c7652b68345e11..6dcb87887dc62a 100644 --- a/packages/features/data-table/hooks/useFilterableColumns.ts +++ b/apps/web/modules/data-table/hooks/useFilterableColumns.ts @@ -4,9 +4,9 @@ import { type Table } from "@tanstack/react-table"; // eslint-disable-next-line no-restricted-imports import { useMemo } from "react"; -import type { FilterableColumn, FacetedValue } from "../lib/types"; -import { ColumnFilterType } from "../lib/types"; -import { convertMapToFacetedValues } from "../lib/utils"; +import type { FilterableColumn, FacetedValue } from "@calcom/features/data-table/lib/types"; +import { ColumnFilterType } from "@calcom/features/data-table/lib/types"; +import { convertMapToFacetedValues } from "@calcom/features/data-table/lib/utils"; export function useFilterableColumns(table: Table) { const columns = useMemo( diff --git a/packages/features/data-table/hooks/useSegmentsNoop.ts b/apps/web/modules/data-table/hooks/useSegmentsNoop.ts similarity index 79% rename from packages/features/data-table/hooks/useSegmentsNoop.ts rename to apps/web/modules/data-table/hooks/useSegmentsNoop.ts index a993588f231d04..1323db7d653eb6 100644 --- a/packages/features/data-table/hooks/useSegmentsNoop.ts +++ b/apps/web/modules/data-table/hooks/useSegmentsNoop.ts @@ -1,7 +1,7 @@ // eslint-disable-next-line no-restricted-imports import { noop } from "lodash"; -import { type UseSegments } from "../lib/types"; +import { type UseSegments } from "@calcom/features/data-table/lib/types"; export const useSegmentsNoop: UseSegments = ({}) => { return { diff --git a/apps/web/modules/ee/dsync/components/GroupTeamMappingTable.tsx b/apps/web/modules/ee/dsync/components/GroupTeamMappingTable.tsx index 93f287d1e5b0fe..76e79a5f00c190 100644 --- a/apps/web/modules/ee/dsync/components/GroupTeamMappingTable.tsx +++ b/apps/web/modules/ee/dsync/components/GroupTeamMappingTable.tsx @@ -3,7 +3,7 @@ import { useReactTable, getCoreRowModel } from "@tanstack/react-table"; import { usePathname } from "next/navigation"; import { useRef, useState } from "react"; -import { DataTableProvider } from "@calcom/features/data-table/DataTableProvider"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import { DataTable, DataTableToolbar } from "~/data-table/components"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc/react"; diff --git a/apps/web/modules/ee/organizations/admin/views/SystemBlocklistView.tsx b/apps/web/modules/ee/organizations/admin/views/SystemBlocklistView.tsx index 9dd9b695b073e9..9b3faf98eaed3d 100644 --- a/apps/web/modules/ee/organizations/admin/views/SystemBlocklistView.tsx +++ b/apps/web/modules/ee/organizations/admin/views/SystemBlocklistView.tsx @@ -11,7 +11,8 @@ import { PendingReportsTable, type SortByOption, } from "@calcom/web/modules/blocklist"; -import { DataTableProvider, useDataTable } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import { DataTableToolbar } from "~/data-table/components"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc/react"; diff --git a/apps/web/modules/ee/organizations/privacy.tsx b/apps/web/modules/ee/organizations/privacy.tsx index 00700b1efd76e9..4feda456fb3f97 100644 --- a/apps/web/modules/ee/organizations/privacy.tsx +++ b/apps/web/modules/ee/organizations/privacy.tsx @@ -2,7 +2,7 @@ import { usePathname } from "next/navigation"; -import { DataTableProvider } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import { useSegments } from "~/data-table/hooks/useSegments"; import LicenseRequired from "~/ee/common/components/LicenseRequired"; import OrgAutoJoinSetting from "~/ee/organizations/components/OrgAutoJoinSetting"; diff --git a/apps/web/modules/ee/organizations/privacy/blocklist-table.tsx b/apps/web/modules/ee/organizations/privacy/blocklist-table.tsx index 9c177564b2fe77..f5a1e8d770d0aa 100644 --- a/apps/web/modules/ee/organizations/privacy/blocklist-table.tsx +++ b/apps/web/modules/ee/organizations/privacy/blocklist-table.tsx @@ -10,7 +10,7 @@ import { PendingReportsTable, type SortByOption, } from "@calcom/web/modules/blocklist"; -import { useDataTable } from "@calcom/features/data-table"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import { DataTableToolbar } from "~/data-table/components"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc/react"; diff --git a/apps/web/modules/ee/teams/components/MemberList.tsx b/apps/web/modules/ee/teams/components/MemberList.tsx index 996a004d4085fd..7af6d2634c9d3a 100644 --- a/apps/web/modules/ee/teams/components/MemberList.tsx +++ b/apps/web/modules/ee/teams/components/MemberList.tsx @@ -18,13 +18,11 @@ import { useMemo, useReducer, useRef, useState } from "react"; import type { Dispatch, SetStateAction } from "react"; import { Dialog } from "@calcom/features/components/controlled-dialog"; -import { - DataTableProvider, - useDataTable, - useFetchMoreOnBottomReached, - useColumnFilters, - convertFacetedValuesToMap, -} from "@calcom/features/data-table"; +import { convertFacetedValuesToMap } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; +import { useFetchMoreOnBottomReached } from "~/data-table/hooks/useFetchMoreOnBottomReached"; +import { useColumnFilters } from "~/data-table/hooks/useColumnFilters"; import { DataTableToolbar, DataTableFilters, diff --git a/apps/web/modules/ee/workflows/components/VoiceSelectionDialog.tsx b/apps/web/modules/ee/workflows/components/VoiceSelectionDialog.tsx index 18f896715473ec..537bd8539b70a5 100644 --- a/apps/web/modules/ee/workflows/components/VoiceSelectionDialog.tsx +++ b/apps/web/modules/ee/workflows/components/VoiceSelectionDialog.tsx @@ -2,7 +2,7 @@ import { getCoreRowModel, getSortedRowModel, useReactTable, type ColumnDef } fro import { usePathname } from "next/navigation"; import { useMemo, useState, useCallback } from "react"; -import { DataTableProvider } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import { DataTableWrapper } from "~/data-table/components"; import { useSegments } from "~/data-table/hooks/useSegments"; import { useVoicePreview } from "@calcom/features/ee/workflows/hooks/useVoicePreview"; diff --git a/apps/web/modules/insights/components/booking/TimezoneBadge.tsx b/apps/web/modules/insights/components/booking/TimezoneBadge.tsx index ce2f8f06699551..81de591e348633 100644 --- a/apps/web/modules/insights/components/booking/TimezoneBadge.tsx +++ b/apps/web/modules/insights/components/booking/TimezoneBadge.tsx @@ -2,7 +2,7 @@ import { useMemo } from "react"; -import { useDataTable } from "@calcom/features/data-table"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import NoSSR from "@calcom/lib/components/NoSSR"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { CURRENT_TIMEZONE } from "@calcom/lib/timezoneConstants"; diff --git a/apps/web/modules/insights/components/routing/RoutingFormResponsesTable.tsx b/apps/web/modules/insights/components/routing/RoutingFormResponsesTable.tsx index 256d815fe68dea..79e15723ab99f2 100644 --- a/apps/web/modules/insights/components/routing/RoutingFormResponsesTable.tsx +++ b/apps/web/modules/insights/components/routing/RoutingFormResponsesTable.tsx @@ -7,13 +7,13 @@ import { useMemo, useEffect } from "react"; import { createPortal } from "react-dom"; import { - useDataTable, ColumnFilterType, convertMapToFacetedValues, - useFilterValue, ZSingleSelectFilterValue, type FilterableColumn, } from "@calcom/features/data-table"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; +import { useFilterValue } from "~/data-table/hooks/useFilterValue"; import { DataTableWrapper, DataTableFilters, diff --git a/apps/web/modules/insights/hooks/useInsightsBookingParameters.ts b/apps/web/modules/insights/hooks/useInsightsBookingParameters.ts index 1330346f9d1140..16d086fcc9ae2f 100644 --- a/apps/web/modules/insights/hooks/useInsightsBookingParameters.ts +++ b/apps/web/modules/insights/hooks/useInsightsBookingParameters.ts @@ -1,8 +1,8 @@ import { useMemo } from "react"; import dayjs from "@calcom/dayjs"; -import { useColumnFilters } from "@calcom/features/data-table/hooks/useColumnFilters"; -import { useDataTable } from "@calcom/features/data-table/hooks/useDataTable"; +import { useColumnFilters } from "~/data-table/hooks/useColumnFilters"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import { getDefaultStartDate, getDefaultEndDate, diff --git a/apps/web/modules/insights/hooks/useInsightsRoutingParameters.ts b/apps/web/modules/insights/hooks/useInsightsRoutingParameters.ts index a641b306f27434..085639d70a69e0 100644 --- a/apps/web/modules/insights/hooks/useInsightsRoutingParameters.ts +++ b/apps/web/modules/insights/hooks/useInsightsRoutingParameters.ts @@ -1,7 +1,9 @@ import { useMemo } from "react"; import dayjs from "@calcom/dayjs"; -import { useFilterValue, useColumnFilters, ZDateRangeFilterValue } from "@calcom/features/data-table"; +import { ZDateRangeFilterValue } from "@calcom/features/data-table"; +import { useFilterValue } from "~/data-table/hooks/useFilterValue"; +import { useColumnFilters } from "~/data-table/hooks/useColumnFilters"; import { getDefaultStartDate, getDefaultEndDate } from "@calcom/features/data-table/lib/dateRange"; import { useInsightsOrgTeams } from "./useInsightsOrgTeams"; diff --git a/apps/web/modules/insights/views/insights-call-history-view.tsx b/apps/web/modules/insights/views/insights-call-history-view.tsx index 5dbbf0d405e43c..c9c6143956286f 100644 --- a/apps/web/modules/insights/views/insights-call-history-view.tsx +++ b/apps/web/modules/insights/views/insights-call-history-view.tsx @@ -4,12 +4,9 @@ import { getCoreRowModel, getSortedRowModel, useReactTable, type ColumnDef } fro import { usePathname } from "next/navigation"; import { useMemo, useState, useReducer } from "react"; -import { - DataTableProvider, - ColumnFilterType, - convertFacetedValuesToMap, - useDataTable, -} from "@calcom/features/data-table"; +import { ColumnFilterType, convertFacetedValuesToMap } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import { DataTableWrapper, DataTableToolbar, DataTableFilters } from "~/data-table/components"; import { useSegments } from "~/data-table/hooks/useSegments"; import { useOrgBranding } from "@calcom/features/ee/organizations/context/provider"; diff --git a/apps/web/modules/insights/views/insights-routing-view.tsx b/apps/web/modules/insights/views/insights-routing-view.tsx index ac9b1aebf2344f..aa074694b7659d 100644 --- a/apps/web/modules/insights/views/insights-routing-view.tsx +++ b/apps/web/modules/insights/views/insights-routing-view.tsx @@ -2,7 +2,7 @@ import { usePathname } from "next/navigation"; -import { DataTableProvider } from "@calcom/features/data-table/DataTableProvider"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import { useSegments } from "~/data-table/hooks/useSegments"; import { RoutingFormResponsesTable, diff --git a/apps/web/modules/insights/views/insights-view.tsx b/apps/web/modules/insights/views/insights-view.tsx index 0e6085214c97a9..adc39de7b35fb5 100644 --- a/apps/web/modules/insights/views/insights-view.tsx +++ b/apps/web/modules/insights/views/insights-view.tsx @@ -3,10 +3,11 @@ import { usePathname } from "next/navigation"; import { useState, useCallback } from "react"; -import { DataTableProvider, ColumnFilterType, type FilterableColumn } from "@calcom/features/data-table"; +import { ColumnFilterType, type FilterableColumn } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import { DataTableFilters, DateRangeFilter } from "~/data-table/components"; import type { FilterType } from "@calcom/types/data-table"; -import { useDataTable } from "@calcom/features/data-table/hooks/useDataTable"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import { useSegments } from "~/data-table/hooks/useSegments"; import { AverageEventDurationChart, diff --git a/apps/web/modules/settings/billing/components/InvoicesTable.tsx b/apps/web/modules/settings/billing/components/InvoicesTable.tsx index cc4ceabe161bb2..c45c409d5647de 100644 --- a/apps/web/modules/settings/billing/components/InvoicesTable.tsx +++ b/apps/web/modules/settings/billing/components/InvoicesTable.tsx @@ -6,13 +6,9 @@ import { useSession } from "next-auth/react"; import { useState, useEffect, useRef } from "react"; import dayjs from "@calcom/dayjs"; -import { - DataTableProvider, - ColumnFilterType, - useFilterValue, - ZDateRangeFilterValue, - type FilterableColumn, -} from "@calcom/features/data-table"; +import { ColumnFilterType, ZDateRangeFilterValue, type FilterableColumn } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useFilterValue } from "~/data-table/hooks/useFilterValue"; import { useSegments } from "~/data-table/hooks/useSegments"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc/react"; diff --git a/apps/web/modules/settings/outOfOffice/OutOfOfficeEntriesList.tsx b/apps/web/modules/settings/outOfOffice/OutOfOfficeEntriesList.tsx index 0c4fe5855de01c..301e7d6307eb0a 100644 --- a/apps/web/modules/settings/outOfOffice/OutOfOfficeEntriesList.tsx +++ b/apps/web/modules/settings/outOfOffice/OutOfOfficeEntriesList.tsx @@ -11,13 +11,10 @@ import { usePathname } from "next/navigation"; import { useEffect, useMemo, useRef, useState } from "react"; import dayjs from "@calcom/dayjs"; -import { - DataTableProvider, - ColumnFilterType, - useDataTable, - useFilterValue, - ZDateRangeFilterValue, -} from "@calcom/features/data-table"; +import { ColumnFilterType, ZDateRangeFilterValue } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; +import { useFilterValue } from "~/data-table/hooks/useFilterValue"; import { DataTableWrapper, DataTableToolbar, diff --git a/apps/web/modules/timezone-buddy/components/AvailabilitySliderTable.tsx b/apps/web/modules/timezone-buddy/components/AvailabilitySliderTable.tsx index 3417093d991983..ed4a4b94aa2fa4 100644 --- a/apps/web/modules/timezone-buddy/components/AvailabilitySliderTable.tsx +++ b/apps/web/modules/timezone-buddy/components/AvailabilitySliderTable.tsx @@ -7,9 +7,9 @@ import { usePathname } from "next/navigation"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import dayjs from "@calcom/dayjs"; -import { DataTableProvider } from "@calcom/features/data-table/DataTableProvider"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; import { DataTable, DataTableToolbar } from "~/data-table/components"; -import { useDataTable } from "@calcom/features/data-table/hooks"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import type { DateRange } from "@calcom/features/schedules/lib/date-ranges"; import { APP_NAME, WEBAPP_URL } from "@calcom/lib/constants"; import { useLocale } from "@calcom/lib/hooks/useLocale"; diff --git a/apps/web/modules/users/components/UserTable/PlatformManagedUsersTable.tsx b/apps/web/modules/users/components/UserTable/PlatformManagedUsersTable.tsx index 82088dcba7f122..81c9e377bb5fa4 100644 --- a/apps/web/modules/users/components/UserTable/PlatformManagedUsersTable.tsx +++ b/apps/web/modules/users/components/UserTable/PlatformManagedUsersTable.tsx @@ -4,7 +4,9 @@ import { keepPreviousData } from "@tanstack/react-query"; import { getCoreRowModel, getSortedRowModel, useReactTable, type ColumnDef } from "@tanstack/react-table"; import { useMemo, useReducer, useState } from "react"; -import { DataTableProvider, useColumnFilters, useDataTable } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useColumnFilters } from "~/data-table/hooks/useColumnFilters"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import { DataTableWrapper, DataTableToolbar, diff --git a/apps/web/modules/users/components/UserTable/UserListTable.tsx b/apps/web/modules/users/components/UserTable/UserListTable.tsx index adebe5c965b0ca..284f8027b2f824 100644 --- a/apps/web/modules/users/components/UserTable/UserListTable.tsx +++ b/apps/web/modules/users/components/UserTable/UserListTable.tsx @@ -1,14 +1,10 @@ "use client"; import { checkAdminOrOwner } from "@calcom/features/auth/lib/checkAdminOrOwner"; -import { - ColumnFilterType, - convertFacetedValuesToMap, - DataTableProvider, - type FacetedValue, - useColumnFilters, - useDataTable, -} from "@calcom/features/data-table"; +import { ColumnFilterType, convertFacetedValuesToMap, type FacetedValue } from "@calcom/features/data-table"; +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useColumnFilters } from "~/data-table/hooks/useColumnFilters"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; import { useSegments } from "~/data-table/hooks/useSegments"; import { useOrgBranding } from "@calcom/features/ee/organizations/context/provider"; import type { MemberPermissions } from "@calcom/features/pbac/lib/team-member-permissions"; diff --git a/packages/features/data-table/GUIDE.md b/packages/features/data-table/GUIDE.md index 907186d2e283ea..5814fb4fe79b23 100644 --- a/packages/features/data-table/GUIDE.md +++ b/packages/features/data-table/GUIDE.md @@ -101,13 +101,17 @@ DataTableProvider (Context) ### Basic Setup ```tsx -import { - DataTableProvider, - DataTableWrapper, - DataTableFilters, - useDataTable, - ColumnFilterType, -} from "@calcom/features/data-table"; +// Types and utilities stay in @calcom/features/data-table +import { ColumnFilterType } from "@calcom/features/data-table"; + +// Hooks, contexts, and providers are in apps/web/modules/data-table +// (use ~/data-table/... imports within apps/web) +import { DataTableProvider } from "~/data-table/DataTableProvider"; +import { useDataTable } from "~/data-table/hooks/useDataTable"; + +// UI components are in apps/web/modules/data-table/components +import { DataTableWrapper } from "~/data-table/components/DataTableWrapper"; +import { DataTableFilters } from "~/data-table/components/filters"; // 1. Define your data type type User = { @@ -586,7 +590,7 @@ const table = useReactTable({ **Custom Faceted Values Hook Example:** -From `apps/web/modules/bookings/hooks/useFacetedUniqueValues.ts`: +From `apps/web/modules/bookings/hooks/useFacetedUniqueValues.ts` (hooks live in `apps/web/modules/`): ```tsx export function useFacetedUniqueValues() { @@ -625,7 +629,7 @@ export function useFacetedUniqueValues() { **Usage in Table Configuration:** ```tsx -// From packages/features/users/components/UserTable/UserListTable.tsx +// From apps/web/modules/users/components/UserTable/UserListTable.tsx const table = useReactTable({ // ... other options getFacetedUniqueValues: (_, columnId) => () => { @@ -848,6 +852,10 @@ The DataTable system is designed for **server-side filtering, sorting, and pagin #### Basic Server-Side Pattern ```tsx +// Hooks are imported from ~/data-table/hooks/ within apps/web +import { useDataTable } from "~/data-table/hooks/useDataTable"; +import { useColumnFilters } from "~/data-table/hooks/useColumnFilters"; + // Get current table state for API calls const { limit, offset, sorting } = useDataTable(); const columnFilters = useColumnFilters(); @@ -951,7 +959,7 @@ async getFilterConditions(): Promise { For complex cases where you need to manipulate filter data before sending to the backend, extract the logic into a separate hook: ```tsx -// packages/features/insights/hooks/useInsightsRoutingParameters.ts +// apps/web/modules/insights/hooks/useInsightsRoutingParameters.ts export function useInsightsRoutingParameters() { const { scope, selectedTeamId } = useInsightsOrgTeams(); @@ -982,10 +990,10 @@ export function useInsightsRoutingParameters() { #### Key Hooks for Server-Side Integration -- **`useColumnFilters()`** - Get applied filters for backend requests -- **`useDataTable()`** - Get `limit`, `offset`, `sorting` for pagination -- **`useFilterValue(columnId, schema)`** - Get specific filter value with validation -- **Custom parameter hooks** - Extract complex manipulation logic +- **`useColumnFilters()`** - Get applied filters for backend requests (import from `~/data-table/hooks/useColumnFilters`) +- **`useDataTable()`** - Get `limit`, `offset`, `sorting` for pagination (import from `~/data-table/hooks/useDataTable`) +- **`useFilterValue(columnId, schema)`** - Get specific filter value with validation (import from `~/data-table/hooks/useFilterValue`) +- **Custom parameter hooks** - Extract complex manipulation logic (place in `apps/web/modules/`) #### Server Utility Functions @@ -1072,7 +1080,7 @@ const { ctaContainerRef } = useDataTable(); ### Example 1: User Management Table -From `packages/features/users/components/UserTable/UserListTable.tsx`: +From `apps/web/modules/users/components/UserTable/UserListTable.tsx`: ```tsx @@ -1110,7 +1118,7 @@ From `packages/features/users/components/UserTable/UserListTable.tsx`: ### Example 2: Bookings List -From `apps/web/modules/bookings/components/BookingsList.tsx`: +From `apps/web/modules/bookings/components/BookingsList.tsx` (hooks/providers imported from `~/data-table/`): ```tsx