@stoker-platform/web-app 0.5.136 → 0.5.138

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.
Files changed (3) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/package.json +1 -2
  3. package/src/List.tsx +59 -48
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @stoker-platform/web-app
2
2
 
3
+ ## 0.5.138
4
+
5
+ ### Patch Changes
6
+
7
+ - fix: improve list selection
8
+
9
+ ## 0.5.137
10
+
11
+ ### Patch Changes
12
+
13
+ - chore: revert pinned web app Vite version
14
+
3
15
  ## 0.5.136
4
16
 
5
17
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoker-platform/web-app",
3
- "version": "0.5.136",
3
+ "version": "0.5.138",
4
4
  "type": "module",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "scripts": {
@@ -87,7 +87,6 @@
87
87
  "remark-gfm": "^4.0.1",
88
88
  "tailwind-merge": "^2.6.1",
89
89
  "tailwindcss-animate": "^1.0.7",
90
- "vite": "^7.3.3",
91
90
  "vite-plugin-eslint": "^1.8.1",
92
91
  "zod": "^3.25.76"
93
92
  },
package/src/List.tsx CHANGED
@@ -4,6 +4,7 @@ import {
4
4
  Chart,
5
5
  CollectionMeta,
6
6
  CollectionSchema,
7
+ Filter,
7
8
  FormList,
8
9
  Metric,
9
10
  RelationList,
@@ -552,9 +553,18 @@ export function List({
552
553
  return list || []
553
554
  }, [isPreloadCacheEnabled, isServerReadOnly, list, search])
554
555
 
556
+ const selectedRecords = useMemo(() => {
557
+ const selectedIds = Object.keys(rowSelection)
558
+ if (selectedIds.length === 0) return []
559
+ return selectedIds
560
+ .map((id) => searchList.find((record) => record.id === id))
561
+ .filter((record): record is StokerRecord => record !== undefined)
562
+ }, [rowSelection, searchList])
563
+
555
564
  const table = useReactTable<StokerRecord>({
556
565
  data: searchList,
557
566
  columns,
567
+ getRowId: (row) => row.id,
558
568
  getCoreRowModel: getCoreRowModel(),
559
569
  getPaginationRowModel: getPaginationRowModel(),
560
570
  onSortingChange: (sortingUpdater) => {
@@ -1080,11 +1090,7 @@ export function List({
1080
1090
  const titles = await getCachedConfigValue(customization, ["collections", labels.collection, "admin", "titles"])
1081
1091
  const recordTitle = titles?.record || labels.record
1082
1092
 
1083
- Object.keys(rowSelection).forEach((row) => {
1084
- const key = row as unknown as number
1085
- if (!list) return
1086
- // eslint-disable-next-line security/detect-object-injection
1087
- const record = list[key]
1093
+ selectedRecords.forEach((record) => {
1088
1094
  if (isGlobalLoading.get(record.id)?.server) {
1089
1095
  alert(
1090
1096
  `Record ${record.id} is currently being written to the server. Please wait for it to finish before deleting.`,
@@ -1121,10 +1127,19 @@ export function List({
1121
1127
  removeOptimisticDelete(labels.collection, record.id)
1122
1128
  }
1123
1129
  })
1130
+ setRowSelection({})
1124
1131
  toast({
1125
- description: `Deleting ${Object.keys(rowSelection).length} ${Object.keys(rowSelection).length > 1 ? "records" : "record"}.`,
1132
+ description: `Deleting ${selectedRecords.length} ${selectedRecords.length > 1 ? "records" : "record"}.`,
1126
1133
  })
1127
- }, [collection, rowSelection, list, isGlobalLoading, softDeleteField, softDeleteTimestampField, recordTitleField])
1134
+ }, [
1135
+ collection,
1136
+ selectedRecords,
1137
+ isGlobalLoading,
1138
+ softDeleteField,
1139
+ softDeleteTimestampField,
1140
+ recordTitleField,
1141
+ isServerReadOnly,
1142
+ ])
1128
1143
 
1129
1144
  const sortingField = getField(fields, sorting[0]?.id)
1130
1145
 
@@ -1318,6 +1333,10 @@ export function List({
1318
1333
  )
1319
1334
  }, [metrics])
1320
1335
 
1336
+ const statusFilter = useMemo(() => {
1337
+ return filters?.find((filter: Filter) => filter.type === "status")
1338
+ }, [filters])
1339
+
1321
1340
  return (
1322
1341
  <>
1323
1342
  {!formList && (meta?.title || collectionTitle) && (
@@ -1662,6 +1681,7 @@ export function List({
1662
1681
  path={[labels.collection]}
1663
1682
  onSuccess={() => {
1664
1683
  setIsUpdateDialogOpen(false)
1684
+ setRowSelection({})
1665
1685
  setTimeout(() => {
1666
1686
  updateButtonRef.current?.focus()
1667
1687
  }, 0)
@@ -1672,17 +1692,7 @@ export function List({
1672
1692
  onSaveRecord={() => {
1673
1693
  setOptimisticList()
1674
1694
  }}
1675
- rowSelection={Object.keys(rowSelection)
1676
- .map((row) => {
1677
- const key = row as unknown as number
1678
- if (!list) return undefined
1679
- // eslint-disable-next-line security/detect-object-injection
1680
- return list[key]
1681
- })
1682
- .filter(
1683
- (record): record is StokerRecord =>
1684
- record !== undefined,
1685
- )}
1695
+ rowSelection={selectedRecords}
1686
1696
  />
1687
1697
  </div>
1688
1698
  </div>
@@ -1690,36 +1700,37 @@ export function List({
1690
1700
  </div>,
1691
1701
  document.body,
1692
1702
  )}
1693
- {collectionAccess("Delete", collectionPermissions) && (
1694
- <AlertDialog>
1695
- <AlertDialogTrigger asChild>
1696
- <Button
1697
- type="button"
1698
- variant="destructive"
1699
- disabled={
1700
- connectionStatus === "offline" &&
1701
- (disableOfflineDelete || serverWriteOnly || collection.auth)
1702
- }
1703
- >
1704
- Delete Selected
1705
- </Button>
1706
- </AlertDialogTrigger>
1707
- <AlertDialogContent>
1708
- <AlertDialogHeader>
1709
- <AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
1710
- <AlertDialogDescription className="hidden">
1711
- This action delete the selected records.
1712
- </AlertDialogDescription>
1713
- </AlertDialogHeader>
1714
- <AlertDialogFooter>
1715
- <AlertDialogCancel>Cancel</AlertDialogCancel>
1716
- <AlertDialogAction onClick={handleDelete}>
1717
- Delete selected
1718
- </AlertDialogAction>
1719
- </AlertDialogFooter>
1720
- </AlertDialogContent>
1721
- </AlertDialog>
1722
- )}
1703
+ {collectionAccess("Delete", collectionPermissions) &&
1704
+ !(statusFilter?.value === "trash") && (
1705
+ <AlertDialog>
1706
+ <AlertDialogTrigger asChild>
1707
+ <Button
1708
+ type="button"
1709
+ variant="destructive"
1710
+ disabled={
1711
+ connectionStatus === "offline" &&
1712
+ (disableOfflineDelete || serverWriteOnly || collection.auth)
1713
+ }
1714
+ >
1715
+ Delete Selected
1716
+ </Button>
1717
+ </AlertDialogTrigger>
1718
+ <AlertDialogContent>
1719
+ <AlertDialogHeader>
1720
+ <AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
1721
+ <AlertDialogDescription className="hidden">
1722
+ This action delete the selected records.
1723
+ </AlertDialogDescription>
1724
+ </AlertDialogHeader>
1725
+ <AlertDialogFooter>
1726
+ <AlertDialogCancel>Cancel</AlertDialogCancel>
1727
+ <AlertDialogAction onClick={handleDelete}>
1728
+ Delete selected
1729
+ </AlertDialogAction>
1730
+ </AlertDialogFooter>
1731
+ </AlertDialogContent>
1732
+ </AlertDialog>
1733
+ )}
1723
1734
  </div>
1724
1735
  )}
1725
1736
  {pagesLoaded && list && (