@stoker-platform/web-app 0.5.14 → 0.5.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +15 -0
- package/package.json +4 -4
- package/src/Cards.tsx +5 -5
- package/src/DashboardReminder.tsx +1 -1
- package/src/Form.tsx +10 -1
- package/src/List.tsx +49 -7
- package/src/utils/getFormattedFieldValue.tsx +9 -9
- package/src/utils/getSortingValue.ts +2 -3
- package/src/utils/sortList.ts +18 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @stoker-platform/web-app
|
|
2
2
|
|
|
3
|
+
## 0.5.16
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- perf: improve list view performance
|
|
8
|
+
|
|
9
|
+
## 0.5.15
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- Updated dependencies
|
|
14
|
+
- @stoker-platform/node-client@0.5.11
|
|
15
|
+
- @stoker-platform/utils@0.5.7
|
|
16
|
+
- @stoker-platform/web-client@0.5.7
|
|
17
|
+
|
|
3
18
|
## 0.5.14
|
|
4
19
|
|
|
5
20
|
### Patch Changes
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stoker-platform/web-app",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.16",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"scripts": {
|
|
@@ -51,9 +51,9 @@
|
|
|
51
51
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
52
52
|
"@react-google-maps/api": "^2.20.8",
|
|
53
53
|
"@sentry/react": "^10.32.1",
|
|
54
|
-
"@stoker-platform/node-client": "0.5.
|
|
55
|
-
"@stoker-platform/utils": "0.5.
|
|
56
|
-
"@stoker-platform/web-client": "0.5.
|
|
54
|
+
"@stoker-platform/node-client": "0.5.11",
|
|
55
|
+
"@stoker-platform/utils": "0.5.7",
|
|
56
|
+
"@stoker-platform/web-client": "0.5.7",
|
|
57
57
|
"@tanstack/react-table": "^8.21.3",
|
|
58
58
|
"@types/react": "18.3.13",
|
|
59
59
|
"@types/react-dom": "18.3.1",
|
package/src/Cards.tsx
CHANGED
|
@@ -105,7 +105,7 @@ function CardItem({ index, style, data }: CardItemProps) {
|
|
|
105
105
|
|
|
106
106
|
const headerFieldValue = cardsConfig.headerField
|
|
107
107
|
? getFormattedFieldValue(
|
|
108
|
-
|
|
108
|
+
customization,
|
|
109
109
|
getField(fields.concat(systemFields), cardsConfig.headerField),
|
|
110
110
|
record,
|
|
111
111
|
connectionStatus,
|
|
@@ -116,7 +116,7 @@ function CardItem({ index, style, data }: CardItemProps) {
|
|
|
116
116
|
const maxFootlerLines = cardsConfig.maxFooterLines === 2 ? 2 : 1
|
|
117
117
|
const footerFieldValue = cardsConfig.footerField
|
|
118
118
|
? getFormattedFieldValue(
|
|
119
|
-
|
|
119
|
+
customization,
|
|
120
120
|
getField(fields.concat(systemFields), cardsConfig.footerField),
|
|
121
121
|
record,
|
|
122
122
|
connectionStatus,
|
|
@@ -347,7 +347,7 @@ function CardItem({ index, style, data }: CardItemProps) {
|
|
|
347
347
|
)}
|
|
348
348
|
>
|
|
349
349
|
{getFormattedFieldValue(
|
|
350
|
-
|
|
350
|
+
customization,
|
|
351
351
|
field,
|
|
352
352
|
record,
|
|
353
353
|
connectionStatus,
|
|
@@ -401,7 +401,7 @@ function CardItem({ index, style, data }: CardItemProps) {
|
|
|
401
401
|
)}
|
|
402
402
|
>
|
|
403
403
|
{getFormattedFieldValue(
|
|
404
|
-
|
|
404
|
+
customization,
|
|
405
405
|
field,
|
|
406
406
|
record,
|
|
407
407
|
connectionStatus,
|
|
@@ -453,7 +453,7 @@ function CardItem({ index, style, data }: CardItemProps) {
|
|
|
453
453
|
</span>
|
|
454
454
|
<span className="max-w-[50%] text-right break-words">
|
|
455
455
|
{getFormattedFieldValue(
|
|
456
|
-
|
|
456
|
+
customization,
|
|
457
457
|
field,
|
|
458
458
|
record,
|
|
459
459
|
connectionStatus,
|
package/src/Form.tsx
CHANGED
|
@@ -2080,6 +2080,7 @@ function RelationField({
|
|
|
2080
2080
|
}
|
|
2081
2081
|
|
|
2082
2082
|
function ComputedField({ form, collection, label, description, field, record, icon }: FieldProps) {
|
|
2083
|
+
const customization = getCollectionConfigModule(collection.labels.collection)
|
|
2083
2084
|
const [connectionStatus] = useConnection()
|
|
2084
2085
|
const goToRecord = useGoToRecord()
|
|
2085
2086
|
const values = { ...record, ...form.getValues() } as StokerRecord
|
|
@@ -2095,7 +2096,15 @@ function ComputedField({ form, collection, label, description, field, record, ic
|
|
|
2095
2096
|
/>
|
|
2096
2097
|
<FormControl>
|
|
2097
2098
|
<div>
|
|
2098
|
-
{getFormattedFieldValue(
|
|
2099
|
+
{getFormattedFieldValue(
|
|
2100
|
+
customization,
|
|
2101
|
+
field,
|
|
2102
|
+
values,
|
|
2103
|
+
connectionStatus,
|
|
2104
|
+
undefined,
|
|
2105
|
+
goToRecord,
|
|
2106
|
+
true,
|
|
2107
|
+
)}
|
|
2099
2108
|
</div>
|
|
2100
2109
|
</FormControl>
|
|
2101
2110
|
{description && <FormDescription>{description}</FormDescription>}
|
package/src/List.tsx
CHANGED
|
@@ -509,7 +509,7 @@ export function List({
|
|
|
509
509
|
return (
|
|
510
510
|
<div className={className}>
|
|
511
511
|
{getFormattedFieldValue(
|
|
512
|
-
|
|
512
|
+
customization,
|
|
513
513
|
field,
|
|
514
514
|
row.original,
|
|
515
515
|
connectionStatus,
|
|
@@ -613,8 +613,22 @@ export function List({
|
|
|
613
613
|
sortingFns: {
|
|
614
614
|
/* eslint-disable security/detect-object-injection */
|
|
615
615
|
stringSortingFn: (rowA, rowB, columnId) => {
|
|
616
|
-
const valueA = getSortingValue(
|
|
617
|
-
|
|
616
|
+
const valueA = getSortingValue(
|
|
617
|
+
collection,
|
|
618
|
+
customization,
|
|
619
|
+
columnId,
|
|
620
|
+
rowA.original,
|
|
621
|
+
relationCollection,
|
|
622
|
+
relationParent,
|
|
623
|
+
)
|
|
624
|
+
const valueB = getSortingValue(
|
|
625
|
+
collection,
|
|
626
|
+
customization,
|
|
627
|
+
columnId,
|
|
628
|
+
rowB.original,
|
|
629
|
+
relationCollection,
|
|
630
|
+
relationParent,
|
|
631
|
+
)
|
|
618
632
|
const rawA = valueA?.toString().toLowerCase()
|
|
619
633
|
const rawB = valueB?.toString().toLowerCase()
|
|
620
634
|
return rawA > rawB ? 1 : rawA < rawB ? -1 : 0
|
|
@@ -642,15 +656,43 @@ export function List({
|
|
|
642
656
|
}
|
|
643
657
|
},
|
|
644
658
|
dateSortingFn: (rowA, rowB, columnId) => {
|
|
645
|
-
const valueA = getSortingValue(
|
|
646
|
-
|
|
659
|
+
const valueA = getSortingValue(
|
|
660
|
+
collection,
|
|
661
|
+
customization,
|
|
662
|
+
columnId,
|
|
663
|
+
rowA.original,
|
|
664
|
+
relationCollection,
|
|
665
|
+
relationParent,
|
|
666
|
+
)
|
|
667
|
+
const valueB = getSortingValue(
|
|
668
|
+
collection,
|
|
669
|
+
customization,
|
|
670
|
+
columnId,
|
|
671
|
+
rowB.original,
|
|
672
|
+
relationCollection,
|
|
673
|
+
relationParent,
|
|
674
|
+
)
|
|
647
675
|
const rawA = Number(valueA?.valueOf() || 0)
|
|
648
676
|
const rawB = Number(valueB?.valueOf() || 0)
|
|
649
677
|
return rawA > rawB ? 1 : rawA < rawB ? -1 : 0
|
|
650
678
|
},
|
|
651
679
|
rawSortingFn: (rowA, rowB, columnId) => {
|
|
652
|
-
const valueA = getSortingValue(
|
|
653
|
-
|
|
680
|
+
const valueA = getSortingValue(
|
|
681
|
+
collection,
|
|
682
|
+
customization,
|
|
683
|
+
columnId,
|
|
684
|
+
rowA.original,
|
|
685
|
+
relationCollection,
|
|
686
|
+
relationParent,
|
|
687
|
+
)
|
|
688
|
+
const valueB = getSortingValue(
|
|
689
|
+
collection,
|
|
690
|
+
customization,
|
|
691
|
+
columnId,
|
|
692
|
+
rowB.original,
|
|
693
|
+
relationCollection,
|
|
694
|
+
relationParent,
|
|
695
|
+
)
|
|
654
696
|
const rawA = valueA
|
|
655
697
|
const rawB = valueB
|
|
656
698
|
return rawA > rawB ? 1 : rawA < rawB ? -1 : 0
|
|
@@ -1,13 +1,14 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
CollectionCustomization,
|
|
3
|
+
CollectionField,
|
|
4
|
+
CollectionSchema,
|
|
5
|
+
RelationField,
|
|
6
|
+
StokerRecord,
|
|
7
|
+
} from "@stoker-platform/types"
|
|
2
8
|
import { collectionAccess, getFieldCustomization, isRelationField, tryFunction } from "@stoker-platform/utils"
|
|
3
9
|
import { Timestamp } from "firebase/firestore"
|
|
4
10
|
import zip from "lodash/zip.js"
|
|
5
|
-
import {
|
|
6
|
-
convertTimestampToTimezone,
|
|
7
|
-
getCollectionConfigModule,
|
|
8
|
-
getCurrentUserPermissions,
|
|
9
|
-
getSchema,
|
|
10
|
-
} from "@stoker-platform/web-client"
|
|
11
|
+
import { convertTimestampToTimezone, getCurrentUserPermissions, getSchema } from "@stoker-platform/web-client"
|
|
11
12
|
import { Badge } from "../components/ui/badge"
|
|
12
13
|
import { Check, X } from "lucide-react"
|
|
13
14
|
import { LoadingSpinner } from "@/components/ui/loading-spinner"
|
|
@@ -18,7 +19,7 @@ import { cn } from "@/lib/utils"
|
|
|
18
19
|
import { getSafeUrl } from "./isSafeUrl"
|
|
19
20
|
|
|
20
21
|
export const getFormattedFieldValue = (
|
|
21
|
-
|
|
22
|
+
customization: CollectionCustomization,
|
|
22
23
|
field: CollectionField,
|
|
23
24
|
record: StokerRecord,
|
|
24
25
|
connectionStatus: "online" | "offline",
|
|
@@ -47,7 +48,6 @@ export const getFormattedFieldValue = (
|
|
|
47
48
|
}
|
|
48
49
|
|
|
49
50
|
const schema = getSchema()
|
|
50
|
-
const customization = getCollectionConfigModule(collection.labels.collection)
|
|
51
51
|
const fieldCustomization = getFieldCustomization(field, customization)
|
|
52
52
|
const permissions = getCurrentUserPermissions()
|
|
53
53
|
if (!permissions) return ""
|
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
import { getField, getFieldCustomization, tryFunction } from "@stoker-platform/utils"
|
|
2
|
-
import { CollectionSchema, StokerRecord } from "@stoker-platform/types"
|
|
3
|
-
import { getCollectionConfigModule } from "@stoker-platform/web-client"
|
|
2
|
+
import { CollectionCustomization, CollectionSchema, StokerRecord } from "@stoker-platform/types"
|
|
4
3
|
|
|
5
4
|
export const getSortingValue = (
|
|
6
5
|
collection: CollectionSchema,
|
|
6
|
+
customization: CollectionCustomization,
|
|
7
7
|
field: string,
|
|
8
8
|
record: StokerRecord,
|
|
9
9
|
parentCollection?: CollectionSchema,
|
|
10
10
|
parentRecord?: StokerRecord,
|
|
11
11
|
) => {
|
|
12
12
|
const { fields } = collection
|
|
13
|
-
const customization = getCollectionConfigModule(collection.labels.collection)
|
|
14
13
|
const fieldSchema = getField(fields, field)
|
|
15
14
|
const fieldCustomization = getFieldCustomization(fieldSchema, customization)
|
|
16
15
|
// eslint-disable-next-line security/detect-object-injection
|
package/src/utils/sortList.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { CollectionSchema, StokerRecord } from "@stoker-platform/types"
|
|
2
2
|
import { getField, isRelationField } from "@stoker-platform/utils"
|
|
3
3
|
import { getSortingValue } from "./getSortingValue"
|
|
4
|
+
import { getCollectionConfigModule } from "@stoker-platform/web-client"
|
|
4
5
|
|
|
5
6
|
export const sortList = (
|
|
6
7
|
collection: CollectionSchema,
|
|
@@ -10,6 +11,7 @@ export const sortList = (
|
|
|
10
11
|
relationCollection?: CollectionSchema,
|
|
11
12
|
relationParent?: StokerRecord,
|
|
12
13
|
) => {
|
|
14
|
+
const customization = getCollectionConfigModule(collection.labels.collection)
|
|
13
15
|
const { fields } = collection
|
|
14
16
|
let orderByFieldName = orderByField
|
|
15
17
|
if (orderByField.endsWith("_Lowercase") && !orderByField.includes("_Single.")) {
|
|
@@ -21,8 +23,22 @@ export const sortList = (
|
|
|
21
23
|
const orderByFieldSchema = getField(fields, orderByFieldName)
|
|
22
24
|
if (!isRelationField(orderByFieldSchema)) {
|
|
23
25
|
const sortedList = [...list].sort((a, b) => {
|
|
24
|
-
const valueA = getSortingValue(
|
|
25
|
-
|
|
26
|
+
const valueA = getSortingValue(
|
|
27
|
+
collection,
|
|
28
|
+
customization,
|
|
29
|
+
orderByFieldName,
|
|
30
|
+
a,
|
|
31
|
+
relationCollection,
|
|
32
|
+
relationParent,
|
|
33
|
+
)
|
|
34
|
+
const valueB = getSortingValue(
|
|
35
|
+
collection,
|
|
36
|
+
customization,
|
|
37
|
+
orderByFieldName,
|
|
38
|
+
b,
|
|
39
|
+
relationCollection,
|
|
40
|
+
relationParent,
|
|
41
|
+
)
|
|
26
42
|
const fieldA =
|
|
27
43
|
orderByFieldSchema.type === "String"
|
|
28
44
|
? // eslint-disable-next-line security/detect-object-injection
|