@stoker-platform/web-app 0.5.61 → 0.5.63

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 CHANGED
@@ -1,5 +1,18 @@
1
1
  # @stoker-platform/web-app
2
2
 
3
+ ## 0.5.63
4
+
5
+ ### Patch Changes
6
+
7
+ - fix: improve collection view layout
8
+
9
+ ## 0.5.62
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+ - @stoker-platform/web-client@0.5.39
15
+
3
16
  ## 0.5.61
4
17
 
5
18
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoker-platform/web-app",
3
- "version": "0.5.61",
3
+ "version": "0.5.63",
4
4
  "type": "module",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "scripts": {
@@ -53,7 +53,7 @@
53
53
  "@sentry/react": "^10.47.0",
54
54
  "@stoker-platform/node-client": "0.5.40",
55
55
  "@stoker-platform/utils": "0.5.34",
56
- "@stoker-platform/web-client": "0.5.38",
56
+ "@stoker-platform/web-client": "0.5.39",
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/Calendar.tsx CHANGED
@@ -158,6 +158,7 @@ interface CalendarProps {
158
158
  backToStartKey: number
159
159
  relationList?: boolean
160
160
  formList?: boolean
161
+ hasBreadcrumbs?: boolean
161
162
  }
162
163
 
163
164
  export function Calendar({
@@ -173,6 +174,7 @@ export function Calendar({
173
174
  backToStartKey,
174
175
  relationList,
175
176
  formList,
177
+ hasBreadcrumbs,
176
178
  }: CalendarProps) {
177
179
  const { labels, access, fields, recordTitleField, preloadCache } = collection
178
180
  const { serverWriteOnly } = access
@@ -1044,8 +1046,12 @@ export function Calendar({
1044
1046
  <Card className="flex-1">
1045
1047
  <ScrollArea
1046
1048
  className={cn(
1047
- "hidden sm:block h-[calc(100vh-188px)] print:h-full",
1048
- relationList && "h-[calc(100vh-304px)]",
1049
+ "hidden sm:block print:h-full",
1050
+ relationList && hasBreadcrumbs
1051
+ ? "h-[calc(100vh-306px-73px)]"
1052
+ : relationList && !hasBreadcrumbs
1053
+ ? "h-[calc(100vh-306px)]"
1054
+ : "h-[calc(100vh-206px)]",
1049
1055
  )}
1050
1056
  >
1051
1057
  <CardContent className="p-4 h-full">
@@ -1118,7 +1124,7 @@ export function Calendar({
1118
1124
  (!calendarConfig?.unscheduled.roles ||
1119
1125
  calendarConfig?.unscheduled.roles.includes(permissions.Role)) &&
1120
1126
  hasStartUpdateAccess && (
1121
- <Card className="hidden xl:block w-[300px] h-[calc(100vh-188px)] print:hidden">
1127
+ <Card className="hidden xl:block w-[300px] h-[calc(100vh-204px)] print:hidden">
1122
1128
  <CardHeader className="px-4">
1123
1129
  <CardTitle>{calendarConfig.unscheduled.title}</CardTitle>
1124
1130
  </CardHeader>
package/src/Cards.tsx CHANGED
@@ -1097,6 +1097,7 @@ interface CardsProps {
1097
1097
  search: string | undefined
1098
1098
  relationList?: boolean
1099
1099
  formList?: boolean
1100
+ hasBreadcrumbs?: boolean
1100
1101
  }
1101
1102
 
1102
1103
  export function Cards({
@@ -1117,6 +1118,7 @@ export function Cards({
1117
1118
  search,
1118
1119
  relationList,
1119
1120
  formList,
1121
+ hasBreadcrumbs,
1120
1122
  }: CardsProps) {
1121
1123
  const { labels, fields, preloadCache, recordTitleField, fullTextSearch } = collection
1122
1124
  const customization = getCollectionConfigModule(labels.collection)
@@ -1521,7 +1523,8 @@ export function Cards({
1521
1523
  "pb-4",
1522
1524
  "h-full",
1523
1525
  "select-none",
1524
- relationList && "xl:h-[calc(100vh-304px)] overflow-y-scroll",
1526
+ relationList && hasBreadcrumbs && "xl:h-[calc(100vh-304px-73px)] overflow-y-scroll",
1527
+ relationList && !hasBreadcrumbs && "xl:h-[calc(100vh-352px)] overflow-y-scroll",
1525
1528
  )}
1526
1529
  >
1527
1530
  {statusValues.map((statusValue) => (
@@ -118,6 +118,7 @@ interface CollectionProps {
118
118
  relationParent?: StokerRecord
119
119
  isAssigning?: boolean
120
120
  assignable?: Assignable
121
+ hasBreadcrumbs?: boolean
121
122
  }
122
123
 
123
124
  export interface Query {
@@ -145,6 +146,7 @@ function Collection({
145
146
  relationParent,
146
147
  isAssigning,
147
148
  assignable,
149
+ hasBreadcrumbs,
148
150
  }: CollectionProps) {
149
151
  const navigate = useNavigate()
150
152
  const location = useLocation()
@@ -2407,6 +2409,7 @@ function Collection({
2407
2409
  relationParent={relationParent}
2408
2410
  formList={formList}
2409
2411
  itemsPerPage={itemsPerPage}
2412
+ hasBreadcrumbs={hasBreadcrumbs}
2410
2413
  />
2411
2414
  </TabsContent>
2412
2415
  <TabsContent value="cards">
@@ -2430,6 +2433,7 @@ function Collection({
2430
2433
  search={search}
2431
2434
  relationList={!!relationList}
2432
2435
  formList={!!formList}
2436
+ hasBreadcrumbs={hasBreadcrumbs}
2433
2437
  />
2434
2438
  </TabsContent>
2435
2439
  <TabsContent value="images">
@@ -2452,6 +2456,7 @@ function Collection({
2452
2456
  formList={!!formList}
2453
2457
  isAssigning={isAssigning}
2454
2458
  assignable={assignable}
2459
+ hasBreadcrumbs={hasBreadcrumbs}
2455
2460
  />
2456
2461
  </TabsContent>
2457
2462
  <TabsContent value="map">
@@ -2467,6 +2472,7 @@ function Collection({
2467
2472
  setOptimisticList={setOptimisticList}
2468
2473
  relationList={!!relationList}
2469
2474
  formList={!!formList}
2475
+ hasBreadcrumbs={hasBreadcrumbs}
2470
2476
  />
2471
2477
  </TabsContent>
2472
2478
  <TabsContent value="calendar">
@@ -2485,6 +2491,7 @@ function Collection({
2485
2491
  backToStartKey={backToStartKey}
2486
2492
  relationList={!!relationList}
2487
2493
  formList={!!formList}
2494
+ hasBreadcrumbs={hasBreadcrumbs}
2488
2495
  />
2489
2496
  )}
2490
2497
  </TabsContent>
package/src/Images.tsx CHANGED
@@ -323,6 +323,7 @@ interface ImagesProps {
323
323
  formList?: boolean
324
324
  isAssigning?: boolean
325
325
  assignable?: Assignable
326
+ hasBreadcrumbs?: boolean
326
327
  }
327
328
 
328
329
  export const Images = memo(
@@ -343,6 +344,7 @@ export const Images = memo(
343
344
  formList,
344
345
  isAssigning,
345
346
  assignable,
347
+ hasBreadcrumbs,
346
348
  }: ImagesProps) => {
347
349
  const { labels, recordTitleField, fullTextSearch } = collection
348
350
  const customization = getCollectionConfigModule(labels.collection)
@@ -800,7 +802,15 @@ export const Images = memo(
800
802
 
801
803
  if (isPreloadCacheEnabled || isServerReadOnly) {
802
804
  return (
803
- <div className={cn(relationList ? "xl:h-[calc(100vh-304px)] overflow-y-scroll" : "")}>
805
+ <div
806
+ className={cn(
807
+ relationList && hasBreadcrumbs
808
+ ? "xl:h-[calc(100vh-304px-73px)] overflow-y-scroll"
809
+ : relationList && !hasBreadcrumbs
810
+ ? "xl:h-[calc(100vh-304px)] overflow-y-scroll"
811
+ : "",
812
+ )}
813
+ >
804
814
  {!formList && <Meta />}
805
815
  <List
806
816
  height={height}
@@ -817,7 +827,15 @@ export const Images = memo(
817
827
  )
818
828
  } else {
819
829
  return (
820
- <div className={cn(relationList ? "xl:h-[calc(100vh-304px)] overflow-y-scroll" : "")}>
830
+ <div
831
+ className={cn(
832
+ relationList && hasBreadcrumbs
833
+ ? "xl:h-[calc(100vh-304px-73px)] overflow-y-scroll"
834
+ : relationList && !hasBreadcrumbs
835
+ ? "xl:h-[calc(100vh-304px)] overflow-y-scroll"
836
+ : "",
837
+ )}
838
+ >
821
839
  {!formList && <Meta />}
822
840
  <InfiniteLoader
823
841
  isItemLoaded={(index) => index < itemCount}
package/src/List.tsx CHANGED
@@ -126,6 +126,7 @@ interface ListProps {
126
126
  relationParent?: StokerRecord
127
127
  formList?: FormList
128
128
  itemsPerPage?: number
129
+ hasBreadcrumbs?: boolean
129
130
  }
130
131
 
131
132
  export function List({
@@ -150,6 +151,7 @@ export function List({
150
151
  relationParent,
151
152
  formList,
152
153
  itemsPerPage: itemsPerPageOverride,
154
+ hasBreadcrumbs,
153
155
  }: ListProps) {
154
156
  const { labels, fields, access, recordTitleField, softDelete, fullTextSearch } = collection
155
157
  const { serverWriteOnly } = access
@@ -1314,7 +1316,8 @@ export function List({
1314
1316
  <ScrollArea
1315
1317
  className={cn(
1316
1318
  !relationList && !formList && "min-h-screen xl:min-h-full xl:h-[calc(100vh-252px)]",
1317
- relationList && "xl:h-[calc(100vh-352px)]",
1319
+ relationList && hasBreadcrumbs && "xl:h-[calc(100vh-352px-73px)]",
1320
+ relationList && !hasBreadcrumbs && "xl:h-[calc(100vh-352px)]",
1318
1321
  formList && "h-[264px] xl:h-[316px]",
1319
1322
  )}
1320
1323
  >
package/src/Map.tsx CHANGED
@@ -112,6 +112,7 @@ interface MapProps {
112
112
  setOptimisticList: () => void
113
113
  relationList?: boolean
114
114
  formList?: boolean
115
+ hasBreadcrumbs?: boolean
115
116
  }
116
117
 
117
118
  export function Map({
@@ -125,6 +126,7 @@ export function Map({
125
126
  setOptimisticList,
126
127
  relationList,
127
128
  formList,
129
+ hasBreadcrumbs,
128
130
  }: MapProps) {
129
131
  const { labels, fields, access, recordTitleField } = collection
130
132
  const { serverWriteOnly } = access
@@ -570,7 +572,11 @@ export function Map({
570
572
  "flex-1",
571
573
  "mb-2",
572
574
  "xl:mb-0",
573
- relationList ? "xl:h-[calc(100vh-304px)] overflow-y-scroll" : "xl:h-[calc(100vh-204px)]",
575
+ relationList && hasBreadcrumbs
576
+ ? "xl:h-[calc(100vh-304px-73px)] overflow-y-scroll"
577
+ : relationList && !hasBreadcrumbs
578
+ ? "xl:h-[calc(100vh-304px)] overflow-y-scroll"
579
+ : "xl:h-[calc(100vh-204px)]",
574
580
  "print:h-[500px]",
575
581
  background,
576
582
  )}
@@ -633,7 +639,11 @@ export function Map({
633
639
  <Card
634
640
  className={cn(
635
641
  "hidden xl:block w-[300px] print:hidden",
636
- relationList ? "xl:h-[calc(100vh-304px)] overflow-y-scroll" : "xl:h-[calc(100vh-204px)]",
642
+ relationList && hasBreadcrumbs
643
+ ? "xl:h-[calc(100vh-304px-73px)] overflow-y-scroll"
644
+ : relationList && !hasBreadcrumbs
645
+ ? "xl:h-[calc(100vh-304px)] overflow-y-scroll"
646
+ : "xl:h-[calc(100vh-204px)]",
637
647
  )}
638
648
  >
639
649
  <CardHeader className="px-4">
package/src/Record.tsx CHANGED
@@ -276,6 +276,7 @@ export const Record = ({ collection }: { collection: CollectionSchema }) => {
276
276
  (item: Assignable) =>
277
277
  item.collection === relationList.collection,
278
278
  )}
279
+ hasBreadcrumbs={!!breadcrumbs}
279
280
  />
280
281
  </FiltersProvider>
281
282
  </main>
package/vite.config.ts CHANGED
@@ -17,7 +17,7 @@ export default defineConfig(async () => {
17
17
 
18
18
  return {
19
19
  plugins: [
20
- // eslint(),
20
+ eslint(),
21
21
  react(),
22
22
  VitePWA({
23
23
  registerType: "autoUpdate",