From 3c27f08a97554ea1bac0f479dab279d3caf4f532 Mon Sep 17 00:00:00 2001 From: Mike Cao Date: Tue, 7 May 2024 22:47:39 -0700 Subject: [PATCH] Render children for data tables. --- package.json | 2 +- .../settings/websites/WebsitesDataTable.tsx | 8 ++-- .../settings/websites/WebsitesTable.tsx | 5 ++- src/components/common/DataTable.module.css | 14 ------- src/components/common/DataTable.tsx | 2 +- src/components/hooks/queries/useRealtime.ts | 2 +- .../hooks/queries/useWebsiteValues.ts | 2 +- yarn.lock | 39 +++++++++++++++---- 8 files changed, 45 insertions(+), 29 deletions(-) diff --git a/package.json b/package.json index d5a090df..3d5b74ae 100644 --- a/package.json +++ b/package.json @@ -71,7 +71,7 @@ "@react-spring/web": "^9.7.3", "@tanstack/react-query": "^5.28.6", "@umami/prisma-client": "^0.14.0", - "@umami/redis-client": "^0.20.0", + "@umami/redis-client": "^0.21.0", "chalk": "^4.1.1", "chart.js": "^4.4.2", "chartjs-adapter-date-fns": "^3.0.0", diff --git a/src/app/(main)/settings/websites/WebsitesDataTable.tsx b/src/app/(main)/settings/websites/WebsitesDataTable.tsx index 6ffe6fd0..b3472942 100644 --- a/src/app/(main)/settings/websites/WebsitesDataTable.tsx +++ b/src/app/(main)/settings/websites/WebsitesDataTable.tsx @@ -18,6 +18,10 @@ export function WebsitesDataTable({ }) { const queryResult = useWebsites({ teamId }); + if (!queryResult?.result?.data?.length) { + return children; + } + return ( {({ data }) => ( @@ -27,9 +31,7 @@ export function WebsitesDataTable({ showActions={showActions} allowEdit={allowEdit} allowView={allowView} - > - {children} - + /> )} ); diff --git a/src/app/(main)/settings/websites/WebsitesTable.tsx b/src/app/(main)/settings/websites/WebsitesTable.tsx index 022191cf..dced90be 100644 --- a/src/app/(main)/settings/websites/WebsitesTable.tsx +++ b/src/app/(main)/settings/websites/WebsitesTable.tsx @@ -23,6 +23,10 @@ export function WebsitesTable({ const breakpoint = useBreakpoint(); const { renderTeamUrl } = useTeamUrl(); + if (!data?.length) { + return children; + } + return ( @@ -55,7 +59,6 @@ export function WebsitesTable({ }} )} - {children} ); } diff --git a/src/components/common/DataTable.module.css b/src/components/common/DataTable.module.css index 98d84c75..9a7cffb7 100644 --- a/src/components/common/DataTable.module.css +++ b/src/components/common/DataTable.module.css @@ -1,22 +1,8 @@ -.table { - grid-template-rows: repeat(auto-fit, max-content); -} - -.table td { - align-items: center; - max-height: max-content; -} - .search { max-width: 300px; margin: 20px 0; } -.action { - justify-content: flex-end; - gap: 5px; -} - .body { display: flex; flex-direction: column; diff --git a/src/components/common/DataTable.tsx b/src/components/common/DataTable.tsx index 4bca7fc3..ed910def 100644 --- a/src/components/common/DataTable.tsx +++ b/src/components/common/DataTable.tsx @@ -4,8 +4,8 @@ import { Banner, Loading, SearchField } from 'react-basics'; import { useMessages } from 'components/hooks'; import Empty from 'components/common/Empty'; import Pager from 'components/common/Pager'; -import styles from './DataTable.module.css'; import { FilterQueryResult } from 'lib/types'; +import styles from './DataTable.module.css'; const DEFAULT_SEARCH_DELAY = 600; diff --git a/src/components/hooks/queries/useRealtime.ts b/src/components/hooks/queries/useRealtime.ts index ccf6a62d..92b03bd0 100644 --- a/src/components/hooks/queries/useRealtime.ts +++ b/src/components/hooks/queries/useRealtime.ts @@ -1,6 +1,6 @@ import { useMemo, useRef } from 'react'; import { RealtimeData } from 'lib/types'; -import { useApi } from 'components/hooks'; +import { useApi } from './useApi'; import { REALTIME_INTERVAL, REALTIME_RANGE } from 'lib/constants'; import { startOfMinute, subMinutes } from 'date-fns'; import { percentFilter } from 'lib/filters'; diff --git a/src/components/hooks/queries/useWebsiteValues.ts b/src/components/hooks/queries/useWebsiteValues.ts index 02e26fc3..c5358df2 100644 --- a/src/components/hooks/queries/useWebsiteValues.ts +++ b/src/components/hooks/queries/useWebsiteValues.ts @@ -1,4 +1,4 @@ -import { useApi } from 'components/hooks'; +import { useApi } from './useApi'; export function useWebsiteValues({ websiteId, diff --git a/yarn.lock b/yarn.lock index 95cc310b..5720f25d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2899,10 +2899,10 @@ chalk "^4.1.2" debug "^4.3.4" -"@umami/redis-client@^0.20.0": - version "0.20.0" - resolved "https://registry.yarnpkg.com/@umami/redis-client/-/redis-client-0.20.0.tgz#93b4598d68983b1ad266a0a527c56533c6248bf2" - integrity sha512-ACpoO+M/J2eLWEtusjbslhR4le+rPN4h9x7TXjaVJ905icVE0Qgu5y+A7nxXjcYvlgkHk+8HPeVeeaw5P+rxqw== +"@umami/redis-client@^0.21.0": + version "0.21.0" + resolved "https://registry.yarnpkg.com/@umami/redis-client/-/redis-client-0.21.0.tgz#96426b28860b8b06fae8825fc2f2d9575b64e863" + integrity sha512-PpdJunvT4sAsVWIeEl+cHU6iSV2r/Df9dof2gdUwSigfD88ACsVs1/BvlWERxk/T93rTgVJWSpLvdw/oMYvkcw== dependencies: debug "^4.3.4" redis "^4.5.1" @@ -9532,7 +9532,16 @@ string-length@^4.0.1: char-regex "^1.0.2" strip-ansi "^6.0.0" -"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: +"string-width-cjs@npm:string-width@^4.2.0": + version "4.2.3" + resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" + integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== + dependencies: + emoji-regex "^8.0.0" + is-fullwidth-code-point "^3.0.0" + strip-ansi "^6.0.1" + +string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -9605,7 +9614,14 @@ string.prototype.trimstart@^1.0.8: define-properties "^1.2.1" es-object-atoms "^1.0.0" -"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1: +"strip-ansi-cjs@npm:strip-ansi@^6.0.1": + version "6.0.1" + resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" + integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== + dependencies: + ansi-regex "^5.0.1" + +strip-ansi@^6.0.0, strip-ansi@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9" integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A== @@ -10366,7 +10382,7 @@ which@^2.0.1: dependencies: isexe "^2.0.0" -"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0: +"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0": version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== @@ -10384,6 +10400,15 @@ wrap-ansi@^6.2.0: string-width "^4.1.0" strip-ansi "^6.0.0" +wrap-ansi@^7.0.0: + version "7.0.0" + resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" + integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q== + dependencies: + ansi-styles "^4.0.0" + string-width "^4.1.0" + strip-ansi "^6.0.0" + wrap-ansi@^8.0.1, wrap-ansi@^8.1.0: version "8.1.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"