condo icon indicating copy to clipboard operation
condo copied to clipboard
verified publisher icon open-condo-software

feat(condo): DOMA-12533, DOMA-11058, DOMA-11673, DOMA-10972 add table on contact page

Open tolmachev21 opened this issue 3 months ago • 2 comments

tolmachev21 avatar Nov 15 '25 12:11 tolmachev21

Walkthrough

Adds component-based filter factories and typings, integrates a global table search (globalFilter) into the Table API/state and URL sync, refactors the Contacts page to a table-driven lazy-loading flow using TableRef/GetTableData, updates GraphQL queries/types, translations, and related UI styling and utils.

Changes

Cohort / File(s) Summary
Filter components & mapping
apps/condo/domains/common/components/Table/Filters.tsx, apps/condo/domains/common/utils/filters.utils.ts, apps/condo/domains/common/components/Table/Filters.module.css		 Add Open UI-based filter component types and public component factories (text, checkbox group, select, gql-select, date, date-range), introduce getFilterComponentByKey and component getters, deprecate dropdown variants, expose new TableFilterComponentType/TableFiltersMeta types, and add CSS container classes.
Table core, types & utils
packages/ui/src/components/Table/table.tsx, packages/ui/src/components/Table/types.ts, packages/ui/src/components/Table/utils/urlQuery.ts, packages/ui/src/components/Table/index.ts, packages/ui/src/index.ts, packages/ui/src/stories/Table.stories.tsx		 Add globalFilter to Table state and API with get/setGlobalFilter and full state get/set, rename onGridReady→onTableReady, add enableColumnResize, extend render signature to accept globalFilter, and thread globalFilter through URL parsing/serialization and stories.
Table UI tweaks (header/pagination/style)
packages/ui/src/components/Table/components/TableHeader.tsx, packages/ui/src/components/Table/components/TablePagination.tsx, packages/ui/src/components/Table/style.less		 Simplify header dropdown rendering and clear behavior, change dropdown alignment, remove some pagination props, add jump-control styling and resize-handle styles.
Table translations & URL helpers
apps/condo/domains/common/hooks/useTableTranslations.tsx, apps/condo/domains/common/utils/tableUrls.ts		 Add useTableTranslations hook and table URL utilities to parse/serialize full table state (filters + globalFilter, sorters, selection) and perform shallow router.replace on updates.
Query mappers & search hooks
apps/condo/domains/common/hooks/useQueryMappers.ts, apps/condo/domains/common/hooks/useSearch.ts		 Relax sortableColumns typing to allow null, accept SortState shapes, adjust default sorter handling; add useTableSearch hook to debounce and set globalFilter via tableRef.api.setGlobalFilter and mark old useSearch deprecated.
Contacts: columns, filters & page refactor
apps/condo/domains/contact/hooks/useTableColumns.tsx, apps/condo/domains/contact/hooks/useTableFilters.tsx, apps/condo/pages/contact/index.tsx		 Migrate Contacts to table-driven lazy loading (GetTableData + TableRef), change hooks to return TableColumn/TableFiltersMeta, add columns/filters (email, communityFee, unitType), wire getFilterComponentByKey, and surface tableRef in page and action bars.
Filter render helpers
apps/condo/domains/common/components/Table/Renders.tsx		 Update getAddressRender parameter type to ObjectWithAddressInfo and add getUnitTypeRender for localized unit type display.
GraphQL queries & generated types
apps/condo/domains/contact/queries/Contact.graphql, apps/condo/gql/index.ts, apps/condo/gql/operation.types.ts		 Change getContactsExistence to return _allContactsMeta count instead of items; add organization.phoneNumberPrefix to getContactsForTable; update generated documents and types accordingly.
Apollo cache policies
apps/condo/domains/common/utils/next/apollo.ts		 Add sortBy to allContacts keyArgs and add new allContactRoles field policy with read/merge helpers.
Translations
apps/condo/lang/en/en.json, apps/condo/lang/es/es.json, apps/condo/lang/ru/ru.json		 Add translations: Table.ResetFilter and contact column headers (email, ownershipPercentage, note, communityFee) and one import label.
URL parsing helpers (condo domain)
apps/condo/domains/common/utils/tableUrls.ts		 New module to parse/serialize table FullTableState (filters + globalFilter, sorters, selection) and update URL via router.replace.
Submodule pointer
apps/callcenter		 Update submodule pointer (commit bump, no code changes).

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant SearchInput
    participant Table as Table Component
    participant API as TableRef.api
    participant DataLoader as GetTableData
    participant GraphQL

    User->>SearchInput: type text
    SearchInput->>API: setGlobalFilter(text)
    API->>Table: update globalFilter
    Note over Table: pagination reset (startRow → 0)
    Table->>DataLoader: fetch(params including globalFilter)
    DataLoader->>GraphQL: query with where + globalFilter
    GraphQL-->>DataLoader: return rows
    DataLoader-->>Table: provide rows
    Table->>User: render filtered rows

    alt user sets column filter
        User->>Table: setColumnFilter(column, value)
        Table->>DataLoader: fetch with filterState + globalFilter
        DataLoader->>GraphQL: query with combined where
        GraphQL-->>DataLoader: return rows
        DataLoader-->>Table: update rows
    end

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~75 minutes

  • Areas needing extra attention:
    • globalFilter threading across Table implementation, URL parsing/utils, and GetTableData fetch params (packages/ui table.tsx, utils/urlQuery.ts, apps/condo/domains/common/utils/tableUrls.ts).
    • Contacts page migration to lazy GetTableData and updated hook signatures (apps/condo/pages/contact/index.tsx, useTableColumns, useTableFilters).
    • Filter component factory mappings, new Open/Table types, and deprecation compatibility (Filters.tsx, filters.utils.ts).
    • GraphQL query shape change for contacts existence and regenerated types/documents.

Possibly related PRs

  • open-condo-software/condo#6658 — overlaps table/filter component factories and Table API changes.
  • open-condo-software/condo#6569 — related changes to useQueryMappers and sorter handling.
  • open-condo-software/condo#6033 — overlaps GraphQL contact query change adding organization.phoneNumberPrefix.

Suggested reviewers

  • Alexander-Turkin
  • toplenboren
  • nomerdvadcatpyat

Poem

🐇 I hopped through columns, filters in paw,
New components sprout where old ones once saw.
A global hum searches every row,
URLs remember where we go.
Tables and tea — tidy, and awe-filled — hurrah! 🥕

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 25.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly summarizes the main objective: adding a table component to the contact page, referencing four related issue IDs (DOMA-12533, DOMA-11058, DOMA-11673, DOMA-10972).
✨ Finishing touches
  • [ ] 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • [ ] Create PR with unit tests
  • [ ] Post copyable unit tests in a comment
  • [ ] Commit unit tests in branch feat/condo/DOMA-12533/add-table-on-contact-page
📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7d669f8781ded5e8626a03ef60b38926a7f56de2 and bfe65f44394c4db4422c042ef932c028d0efb85b.

📒 Files selected for processing (2)
  • apps/condo/domains/contact/hooks/useTableColumns.tsx (1 hunks)
  • apps/condo/domains/contact/hooks/useTableFilters.tsx (6 hunks)
🧰 Additional context used
🧬 Code graph analysis (2)
apps/condo/domains/contact/hooks/useTableFilters.tsx (5)
apps/condo/domains/common/utils/tables.utils.ts (1)
  • getFilter (110-170)
packages/next/intl.tsx (1)
  • useIntl (198-198)
packages/next/organization.tsx (1)
  • useOrganization (455-455)
apps/condo/gql/index.ts (1)
  • useGetCommonOrOrganizationContactRolesQuery (1516-1519)
apps/condo/domains/property/utils/tables.utils.ts (1)
  • getUnitFilter (25-48)
apps/condo/domains/contact/hooks/useTableColumns.tsx (4)
apps/condo/domains/common/utils/filters.utils.ts (2)
  • TableFiltersMeta (224-226)
  • getFilterComponentByKey (338-446)
packages/ui/src/components/Table/index.ts (2)
  • TableColumn (13-13)
  • RenderTableCell (14-14)
packages/ui/src/index.ts (2)
  • TableColumn (59-59)
  • RenderTableCell (60-60)
apps/condo/domains/common/components/Table/Renders.tsx (5)
  • getTableCellRenderer (169-219)
  • getAddressRender (226-249)
  • getUnitNameRender (251-266)
  • getUnitTypeRender (268-272)
  • getDateRender (274-285)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (6)
  • GitHub Check: Resident App Tests
  • GitHub Check: Build open-source part (ubuntu-22.04, 24.x, 3.14)
  • GitHub Check: Semgrep vulnerabilities check
  • GitHub Check: Check dependencies integrity (24.x)
  • GitHub Check: Lint source code (24.x)
  • GitHub Check: Build Docker Image
🔇 Additional comments (11)
apps/condo/domains/contact/hooks/useTableColumns.tsx (4)

17-35: Typed row alias and localized headers look correct

Using TData = GetContactsForTableQuery['contacts'][number] and strongly typed UseTableColumns keeps the hook aligned with the GraphQL schema, and the header messages are consistently localized via intl.formatMessage. No issues here.

38-60: Render callbacks correctly integrate global filter and shared renderers

renderName, renderAddress, renderRole, renderUnitName, renderUnitType, and renderDate are wired cleanly to getTableCellRenderer / getAddressRender / getUnitNameRender / getUnitTypeRender / getDateRender, passing globalFilter through without unsafe coercion and using appropriate dependency arrays. This looks good.

66-72: Boolean and email rendering are consistent and robust

renderIsVerified correctly maps to localized Yes/No labels with search highlighting, and renderEmail safely builds a mailto: href only when email is present while falling back to '—'. This behavior is clear and user-friendly.

75-173: Column definitions and memoization dependencies are coherent

Column configs (headers, dataKey, id, render, filter components, sizes, and initial visibility) line up with the row type and render callbacks. useMemo’s dependency list correctly includes filterMetas, localized messages, and all render functions, so column identity updates only when relevant inputs change. Looks solid.

apps/condo/domains/contact/hooks/useTableFilters.tsx (7)

1-27: LGTM - Imports and filter definitions are well-structured.

The separation of filterAddressStringContains (for global text search) and filterAddress (for ID-based dropdown filtering) follows a clean pattern. Filter definitions correctly use the utility functions from tables.utils.ts.

44-58: LGTM - GraphQL query setup with proper skip logic.

The skip condition correctly prevents the query from running when organizationId or persistor is unavailable. The memoization chain from contactRolesData → contactRoles → contactRoleOptions is correctly structured.

122-129: LGTM - unitType filter configuration.

The CheckboxGroup component with memoized options follows the established pattern for multi-select filters.

150-159: LGTM - email filter configuration.

Simple Input filter following the established pattern, consistent with the existing phone and name filters.

160-170: LGTM - Role filter with loading state handling.

Using disabled: contactRolesLoading provides good UX by preventing user interaction while options are being fetched.

184-199: LGTM - Dependency array is complete.

All values referenced within the useMemo callback are properly included in the dependency array. The memoization chain through contactRoleOptions correctly captures changes from contactRolesData.

62-68: No action needed. All translation keys for ContactUnitTypeType enum values (apartment, commercial, flat, parking, warehouse) are present in the translation files for all supported languages (en, ru, es).

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

coderabbitai[bot] avatar Nov 15 '25 12:11 coderabbitai[bot]

Quality Gate Passed Quality Gate passed

Issues
4 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

sonarqubecloud[bot] avatar Dec 09 '25 13:12 sonarqubecloud[bot]