fix: iOS backdrop blur rendering issue

packages/payload/src/admin/forms/Form.ts

@@ -168,6 +168,7 @@ export type BuildFormStateArgs = {
    * @experimental This property is experimental and may change in the future. Use at your own risk.
    */
   skipClientConfigAuth?: boolean
+  skipConditionChecks?: boolean
   skipValidation?: boolean
   updateLastEdited?: boolean
 } & (

packages/payload/src/collections/operations/local/create.ts

@@ -218,7 +218,10 @@ export async function createLocal<
 
   const req = await createLocalReq(options as CreateLocalReqOptions, payload)
 
-  req.file = file ?? (await getFileByPath(filePath!))
+  const collectionConfig = collection.config
+  if (collectionConfig.upload) {
+    req.file = file ?? (await getFileByPath(filePath!))
+  }
 
   return createOperation<TSlug, TSelect>({
     collection,

packages/payload/src/collections/operations/local/update.ts

@@ -256,7 +256,10 @@ async function updateLocal<
   }
 
   const req = await createLocalReq(options as CreateLocalReqOptions, payload)
-  req.file = file ?? (await getFileByPath(filePath!))
+  const collectionConfig = collection.config
+  if (collectionConfig.upload) {
+    req.file = file ?? (await getFileByPath(filePath!))
+  }
 
   const args = {
     id,

packages/ui/src/elements/AppHeader/index.scss

@@ -27,6 +27,7 @@
 
     &__localizer-spacing {
       visibility: hidden;
+      width: calc(var(--base) * 0.5);
     }
 
     &__bg {
@@ -188,6 +189,13 @@
       &__actions {
         max-width: 150px;
         margin-right: 0;
+        overflow-x: auto;
+        flex-wrap: nowrap;
+      }
+
+      &__actions-wrapper {
+        gap: calc(var(--base) / 4);
+        margin-right: calc(var(--base) / 2);
       }
     }
   }

packages/ui/src/elements/EditMany/DrawerContent.tsx

@@ -204,6 +204,7 @@ export const EditManyDrawerContent: React.FC<EditManyDrawerContentProps> = (prop
         schemaPath: collection.slug,
         select,
         signal: controller.signal,
+        skipConditionChecks: true,
         skipValidation: !submitted,
       })
 
@@ -303,6 +304,7 @@ export const EditManyDrawerContent: React.FC<EditManyDrawerContentProps> = (prop
             return acc
           }, {} as SelectType),
         ),
+        skipConditionChecks: true,
         skipValidation: true,
       })
 

packages/ui/src/elements/SortRow/index.scss

@@ -16,7 +16,6 @@
       margin-left: -2px;
       margin-top: -2px;
       display: block;
-      width: min-content;
     }
   }
 }

packages/ui/src/fields/Blocks/BlockRow.tsx

@@ -25,6 +25,7 @@ type BlocksFieldProps = {
   addRow: (rowIndex: number, blockType: string) => Promise<void> | void
   block: ClientBlock
   blocks: (ClientBlock | string)[] | ClientBlock[]
+  blocksFiltered: (ClientBlock | string)[] | ClientBlock[]
   copyRow: (rowIndex: number) => void
   duplicateRow: (rowIndex: number) => void
   errorCount: number
@@ -53,6 +54,7 @@ export const BlockRow: React.FC<BlocksFieldProps> = ({
   attributes,
   block,
   blocks,
+  blocksFiltered,
   copyRow,
   duplicateRow,
   errorCount,
@@ -145,6 +147,7 @@ export const BlockRow: React.FC<BlocksFieldProps> = ({
             <RowActions
               addRow={addRow}
               blocks={blocks}
+              blocksFiltered={blocksFiltered}
               blockType={row.blockType}
               copyRow={copyRow}
               duplicateRow={duplicateRow}

packages/ui/src/fields/Blocks/RowActions.tsx

@@ -11,6 +11,7 @@ import { BlocksDrawer } from './BlocksDrawer/index.js'
 export const RowActions: React.FC<{
   readonly addRow: (rowIndex: number, blockType: string) => Promise<void> | void
   readonly blocks: (ClientBlock | string)[]
+  readonly blocksFiltered: (ClientBlock | string)[]
   readonly blockType: string
   readonly copyRow: (rowIndex: number) => void
   readonly duplicateRow: (rowIndex: number, blockType: string) => void
@@ -27,6 +28,7 @@ export const RowActions: React.FC<{
   const {
     addRow,
     blocks,
+    blocksFiltered,
     blockType,
     copyRow,
     duplicateRow,
@@ -55,7 +57,7 @@ export const RowActions: React.FC<{
           closeModal(drawerSlug)
         }}
         addRowIndex={rowIndex}
-        blocks={blocks}
+        blocks={blocksFiltered}
         drawerSlug={drawerSlug}
         labels={labels}
       />

packages/ui/src/fields/Blocks/index.tsx

@@ -441,6 +441,7 @@ const BlocksFieldComponent: BlocksFieldClientComponent = (props) => {
                       block={blockConfig}
                       // Pass all blocks, not just clientBlocksAfterFilter, as existing blocks should still be displayed even if they don't match the new filter
                       blocks={clientBlocks}
+                      blocksFiltered={clientBlocksAfterFilter}
                       copyRow={copyRow}
                       duplicateRow={duplicateRow}
                       errorCount={rowErrorCount}

packages/ui/src/forms/fieldSchemasToFormState/index.tsx

@@ -77,6 +77,7 @@ type Args = {
   schemaPath: string
   select?: SelectType
   selectMode?: SelectMode
+  skipConditionChecks?: boolean
   skipValidation?: boolean
 }
 
@@ -101,6 +102,7 @@ export const fieldSchemasToFormState = async ({
   schemaPath,
   select,
   selectMode,
+  skipConditionChecks,
   skipValidation,
 }: Args): Promise<FormState> => {
   if (!clientFieldSchemaMap && renderFieldFn) {
@@ -160,6 +162,7 @@ export const fieldSchemasToFormState = async ({
       req,
       select,
       selectMode,
+      skipConditionChecks,
       skipValidation,
       state,
     })

packages/ui/src/scss/vars.scss

@@ -110,6 +110,8 @@ $focus-box-shadow: 0 0 0 $style-stroke-width-m var(--theme-success-500);
 
   &:after {
     backdrop-filter: blur(8px);
+    -webkit-transform: translateZ(0);
+    transform: translateZ(0);
   }
 }
 

packages/ui/src/utilities/buildFormState.ts

@@ -118,6 +118,7 @@ export const buildFormState = async (
     schemaPath = collectionSlug || globalSlug || widgetSlug,
     select,
     skipClientConfigAuth,
+    skipConditionChecks,
     skipValidation,
     updateLastEdited,
   } = args
@@ -228,6 +229,7 @@ export const buildFormState = async (
     schemaPath,
     select,
     selectMode,
+    skipConditionChecks,
     skipValidation,
   })
 

packages/ui/src/views/Edit/index.tsx

@@ -185,6 +185,7 @@ export function DefaultEditView({
 
   const hasCheckedForStaleDataRef = useRef(false)
   const originalUpdatedAtRef = useRef(data?.updatedAt)
+  const lastServerRefreshRef = useRef<number>(Date.now())
 
   const lockExpiryTime = lastUpdateTime + lockDurationInMilliseconds
   const isLockExpired = Date.now() > lockExpiryTime
@@ -315,6 +316,7 @@ export function DefaultEditView({
       // This allows detecting if another user modifies the document after this save
       originalUpdatedAtRef.current = updatedAt
       hasCheckedForStaleDataRef.current = false
+      lastServerRefreshRef.current = Date.now()
 
       if (context?.incrementVersionCount !== false) {
         incrementVersionCount()
@@ -580,6 +582,36 @@ export function DefaultEditView({
     }
   }, [isInitializing])
 
+  // Fix #14217: Refresh document when user returns to tab after being away
+  // This prevents stale data from being displayed after publish
+  useEffect(() => {
+    if (typeof window === 'undefined' || !id) return
+
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === 'visible') {
+        const timeSinceLastRefresh = Date.now() - lastServerRefreshRef.current
+        if (timeSinceLastRefresh >= 5000) {
+          router.refresh()
+        }
+      }
+    }
+
+    const handleFocus = () => {
+      const timeSinceLastRefresh = Date.now() - lastServerRefreshRef.current
+      if (timeSinceLastRefresh >= 5000) {
+        router.refresh()
+      }
+    }
+
+    document.addEventListener('visibilitychange', handleVisibilityChange)
+    window.addEventListener('focus', handleFocus)
+
+    return () => {
+      document.removeEventListener('visibilitychange', handleVisibilityChange)
+      window.removeEventListener('focus', handleFocus)
+    }
+  }, [id, router])
+
   const shouldShowDocumentLockedModal =
     documentIsLocked &&
     currentEditor &&