@stoker-platform/web-app 0.5.232 → 0.5.234

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 +18 -0
  2. package/package.json +4 -4
  3. package/src/Form.tsx +45 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @stoker-platform/web-app
2
2
 
3
+ ## 0.5.234
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+ - @stoker-platform/utils@0.5.82
9
+ - @stoker-platform/node-client@0.5.93
10
+ - @stoker-platform/web-client@0.5.98
11
+
12
+ ## 0.5.233
13
+
14
+ ### Patch Changes
15
+
16
+ - feat: add originalRecord argument to overrideFormRequiredValidation method
17
+ - @stoker-platform/node-client@0.5.92
18
+ - @stoker-platform/utils@0.5.81
19
+ - @stoker-platform/web-client@0.5.97
20
+
3
21
  ## 0.5.232
4
22
 
5
23
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stoker-platform/web-app",
3
- "version": "0.5.232",
3
+ "version": "0.5.234",
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.56.0",
54
- "@stoker-platform/node-client": "0.5.91",
55
- "@stoker-platform/utils": "0.5.80",
56
- "@stoker-platform/web-client": "0.5.96",
54
+ "@stoker-platform/node-client": "0.5.93",
55
+ "@stoker-platform/utils": "0.5.82",
56
+ "@stoker-platform/web-client": "0.5.98",
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/Form.tsx CHANGED
@@ -185,9 +185,19 @@ interface FormLabelWithIconProps {
185
185
  icon?: FormFieldIcon
186
186
  className?: string
187
187
  form: UseFormReturn
188
+ prevState?: Partial<StokerRecord>
188
189
  }
189
190
 
190
- const FormLabelWithIcon = ({ collection, label, field, operation, icon, className, form }: FormLabelWithIconProps) => {
191
+ const FormLabelWithIcon = ({
192
+ collection,
193
+ label,
194
+ field,
195
+ operation,
196
+ icon,
197
+ className,
198
+ form,
199
+ prevState,
200
+ }: FormLabelWithIconProps) => {
191
201
  const customization = getCollectionConfigModule(collection.labels.collection)
192
202
  const fieldCustomization = getFieldCustomization(field, customization)
193
203
 
@@ -198,6 +208,7 @@ const FormLabelWithIcon = ({ collection, label, field, operation, icon, classNam
198
208
  isRequired = !!tryFunction(fieldCustomization.admin.overrideFormRequiredValidation, [
199
209
  operation,
200
210
  form.getValues(),
211
+ prevState,
201
212
  ])
202
213
  }
203
214
 
@@ -266,6 +277,7 @@ interface FieldProps {
266
277
  setIsUploading?: React.Dispatch<React.SetStateAction<Record<string, boolean>>>
267
278
  enqueueImageForCreate?: (fieldName: string, file: File) => void
268
279
  uploadImageForUpdate?: (fieldName: string, file: File) => Promise<void>
280
+ prevState?: Partial<StokerRecord>
269
281
  }
270
282
 
271
283
  interface CustomFieldProps {
@@ -585,6 +597,7 @@ function StringField({
585
597
  isButtonGroup,
586
598
  isTime,
587
599
  icon,
600
+ prevState,
588
601
  }: FieldProps & { isTextarea?: boolean; isRadio?: boolean; isButtonGroup?: boolean; isTime?: boolean }) {
589
602
  const customization = getCollectionConfigModule(collection.labels.collection)
590
603
  const fieldCustomization = getFieldCustomization(field, customization)
@@ -612,6 +625,7 @@ function StringField({
612
625
  operation={operation}
613
626
  icon={icon}
614
627
  form={form}
628
+ prevState={prevState}
615
629
  />
616
630
  <FormControl>
617
631
  <RadioGroup
@@ -673,6 +687,7 @@ function StringField({
673
687
  operation={operation}
674
688
  icon={icon}
675
689
  form={form}
690
+ prevState={prevState}
676
691
  />
677
692
  <FormControl>
678
693
  <div className="mt-2 flex flex-row gap-2 max-w-[750px] flex-wrap">
@@ -731,6 +746,7 @@ function StringField({
731
746
  operation={operation}
732
747
  icon={icon}
733
748
  form={form}
749
+ prevState={prevState}
734
750
  />
735
751
  <FormControl>
736
752
  <Select onValueChange={formField.onChange} value={formField.value} disabled={isDisabled}>
@@ -776,6 +792,7 @@ function StringField({
776
792
  operation={operation}
777
793
  icon={icon}
778
794
  form={form}
795
+ prevState={prevState}
779
796
  />
780
797
  <FormControl>
781
798
  {isTextarea ? (
@@ -824,6 +841,7 @@ function ImageField({
824
841
  setIsUploading,
825
842
  enqueueImageForCreate,
826
843
  uploadImageForUpdate,
844
+ prevState,
827
845
  }: FieldProps) {
828
846
  const [showFileDialog, setShowFileDialog] = useState(false)
829
847
  const [fileItems, setFileItems] = useState<StorageItem[]>([])
@@ -921,6 +939,7 @@ function ImageField({
921
939
  operation={operation}
922
940
  icon={icon}
923
941
  form={form}
942
+ prevState={prevState}
924
943
  />
925
944
  <FormControl>
926
945
  <div className="flex flex-col gap-2">
@@ -1056,6 +1075,7 @@ function NumberField({
1056
1075
  isDisabled,
1057
1076
  isSlider,
1058
1077
  icon,
1078
+ prevState,
1059
1079
  }: FieldProps & { isSlider?: boolean }) {
1060
1080
  if ("autoIncrement" in field && field.autoIncrement) {
1061
1081
  return null
@@ -1085,6 +1105,7 @@ function NumberField({
1085
1105
  operation={operation}
1086
1106
  icon={icon}
1087
1107
  form={form}
1108
+ prevState={prevState}
1088
1109
  />
1089
1110
  <FormControl>
1090
1111
  <Select
@@ -1140,6 +1161,7 @@ function NumberField({
1140
1161
  operation={operation}
1141
1162
  icon={icon}
1142
1163
  form={form}
1164
+ prevState={prevState}
1143
1165
  />
1144
1166
  <FormControl>
1145
1167
  <div className="space-y-3">
@@ -1185,6 +1207,7 @@ function NumberField({
1185
1207
  operation={operation}
1186
1208
  icon={icon}
1187
1209
  form={form}
1210
+ prevState={prevState}
1188
1211
  />
1189
1212
  <FormControl>
1190
1213
  <Input
@@ -1218,6 +1241,7 @@ function BooleanField({
1218
1241
  isSwitch,
1219
1242
  isDisabled,
1220
1243
  icon,
1244
+ prevState,
1221
1245
  }: FieldProps & { isSwitch?: boolean }) {
1222
1246
  return (
1223
1247
  <FormField
@@ -1235,6 +1259,7 @@ function BooleanField({
1235
1259
  icon={icon}
1236
1260
  className="text-sm font-normal relative bottom-1"
1237
1261
  form={form}
1262
+ prevState={prevState}
1238
1263
  />
1239
1264
  <FormControl>
1240
1265
  {isSwitch ? (
@@ -1277,6 +1302,7 @@ function TimestampField({
1277
1302
  isTime,
1278
1303
  isMonth,
1279
1304
  icon,
1305
+ prevState,
1280
1306
  }: FieldProps & { isTime?: boolean; isMonth?: boolean }) {
1281
1307
  const [open, setOpen] = useState(false)
1282
1308
  const globalConfig = getGlobalConfigModule()
@@ -1310,6 +1336,7 @@ function TimestampField({
1310
1336
  operation={operation}
1311
1337
  icon={icon}
1312
1338
  form={form}
1339
+ prevState={prevState}
1313
1340
  />
1314
1341
  <FormControl>
1315
1342
  <div className="flex flex-col gap-2">
@@ -1358,6 +1385,7 @@ function TimestampField({
1358
1385
  operation={operation}
1359
1386
  icon={icon}
1360
1387
  form={form}
1388
+ prevState={prevState}
1361
1389
  />
1362
1390
  <FormControl>
1363
1391
  <div className="flex gap-4 flex-col sm:flex-row">
@@ -1481,6 +1509,7 @@ function TimestampField({
1481
1509
  operation={operation}
1482
1510
  icon={icon}
1483
1511
  form={form}
1512
+ prevState={prevState}
1484
1513
  />
1485
1514
  <FormControl>
1486
1515
  <div className="flex flex-col gap-2">
@@ -1537,6 +1566,7 @@ function ArrayField({
1537
1566
  isDisabled,
1538
1567
  isLocation,
1539
1568
  icon,
1569
+ prevState,
1540
1570
  }: FieldProps & { isLocation?: LocationFieldAdmin }) {
1541
1571
  const [selectedValue, setSelectedValue] = useState<string | undefined>(undefined)
1542
1572
 
@@ -1554,6 +1584,7 @@ function ArrayField({
1554
1584
  operation={operation}
1555
1585
  icon={icon}
1556
1586
  form={form}
1587
+ prevState={prevState}
1557
1588
  />
1558
1589
  <FormControl>
1559
1590
  <LocationPicker
@@ -1585,6 +1616,7 @@ function ArrayField({
1585
1616
  operation={operation}
1586
1617
  icon={icon}
1587
1618
  form={form}
1619
+ prevState={prevState}
1588
1620
  />
1589
1621
  <FormControl>
1590
1622
  <div className="flex flex-col">
@@ -1795,6 +1827,7 @@ function MapField({
1795
1827
  isRichText,
1796
1828
  icon,
1797
1829
  isDisabled,
1830
+ prevState,
1798
1831
  }: FieldProps & { isRichText?: boolean }) {
1799
1832
  const quillRef = useRef<Quill | null>(null)
1800
1833
  if (isRichText) {
@@ -1811,6 +1844,7 @@ function MapField({
1811
1844
  operation={operation}
1812
1845
  icon={icon}
1813
1846
  form={form}
1847
+ prevState={prevState}
1814
1848
  />
1815
1849
  <FormControl>
1816
1850
  <RichTextEditor
@@ -1843,6 +1877,7 @@ function RelationField({
1843
1877
  readOnly,
1844
1878
  operation,
1845
1879
  icon,
1880
+ prevState,
1846
1881
  }: FieldProps) {
1847
1882
  const schema = getSchema(true)
1848
1883
  const relationCollection = schema.collections[(field as RelationFieldType).collection]
@@ -2268,6 +2303,7 @@ function RelationField({
2268
2303
  operation={operation}
2269
2304
  icon={icon}
2270
2305
  form={form}
2306
+ prevState={prevState}
2271
2307
  />
2272
2308
  <FormControl>
2273
2309
  {isMobile ? (
@@ -2372,7 +2408,7 @@ function RelationField({
2372
2408
  )
2373
2409
  }
2374
2410
 
2375
- function ComputedField({ form, collection, label, description, field, record, icon }: FieldProps) {
2411
+ function ComputedField({ form, collection, label, description, field, record, icon, prevState }: FieldProps) {
2376
2412
  const customization = getCollectionConfigModule(collection.labels.collection)
2377
2413
  const [connectionStatus] = useConnection()
2378
2414
  const goToRecord = useGoToRecord()
@@ -2386,6 +2422,7 @@ function ComputedField({ form, collection, label, description, field, record, ic
2386
2422
  operation="update"
2387
2423
  icon={icon}
2388
2424
  form={form}
2425
+ prevState={prevState}
2389
2426
  />
2390
2427
  <FormControl>
2391
2428
  <div>
@@ -3063,6 +3100,7 @@ function RecordForm({
3063
3100
  setIsUploading={setIsUploading}
3064
3101
  enqueueImageForCreate={enqueueImageForCreate}
3065
3102
  uploadImageForUpdate={uploadImageForUpdate}
3103
+ prevState={prevState}
3066
3104
  />
3067
3105
  )
3068
3106
  })
@@ -3117,6 +3155,7 @@ function RecordForm({
3117
3155
  setIsUploading={setIsUploading}
3118
3156
  enqueueImageForCreate={enqueueImageForCreate}
3119
3157
  uploadImageForUpdate={uploadImageForUpdate}
3158
+ prevState={prevState}
3120
3159
  />
3121
3160
  )
3122
3161
  } else {
@@ -3951,7 +3990,7 @@ function RecordForm({
3951
3990
  const label = tryFunction(fieldCustomization.admin?.label) || field.name
3952
3991
  const overrideFormRequiredValidation = tryFunction(
3953
3992
  fieldCustomization.admin?.overrideFormRequiredValidation,
3954
- [operation, values],
3993
+ [operation, values, prevState],
3955
3994
  )
3956
3995
  let hasValue = false
3957
3996
  switch (field.type) {
@@ -3960,6 +3999,9 @@ function RecordForm({
3960
3999
  values[field.name] &&
3961
4000
  !(values[field.name].ops.length === 1 && values[field.name].ops[0].insert === "\n")
3962
4001
  break
4002
+ case "Boolean":
4003
+ hasValue = typeof values[field.name] === "boolean"
4004
+ break
3963
4005
  default:
3964
4006
  hasValue = !!values[field.name]
3965
4007
  }