From 189ac41f2a6799a0974ecba940f9ac1738cc8d09 Mon Sep 17 00:00:00 2001
From: Omair Baskanderi <omairb@gmail.com>
Date: Thu, 16 Apr 2026 17:08:36 -0400
Subject: [PATCH] Fix Form safe area spacing

---
 .../components-native/src/Form/Form.test.tsx  |  6 +-
 packages/components-native/src/Form/Form.tsx  |  7 +--
 .../src/Form/components/FormBody/FormBody.tsx | 55 +++++++------------
 3 files changed, 25 insertions(+), 43 deletions(-)

diff --git a/packages/components-native/src/Form/Form.test.tsx b/packages/components-native/src/Form/Form.test.tsx
index 676f8af89d..deae4b8156 100644
--- a/packages/components-native/src/Form/Form.test.tsx
+++ b/packages/components-native/src/Form/Form.test.tsx
@@ -557,12 +557,12 @@ describe("Form", () => {
       expect(getByTestId("ATL-FormSafeArea")).toBeDefined();
     });
 
-    it("does NOT render a safe area when there's a saveButtonOffset is provided", () => {
-      const { queryByTestId } = render(
+    it("does render a safe area when there's a saveButtonOffset is provided", () => {
+      const { getByTestId } = render(
         <FormTest onSubmit={onSubmitMock} saveButtonOffset={30} />,
       );
 
-      expect(queryByTestId("ATL-FormSafeArea")).toBeNull();
+      expect(getByTestId("ATL-FormSafeArea")).toBeDefined();
     });
   });
 
diff --git a/packages/components-native/src/Form/Form.tsx b/packages/components-native/src/Form/Form.tsx
index 029e8eeaf6..94a5b139f3 100644
--- a/packages/components-native/src/Form/Form.tsx
+++ b/packages/components-native/src/Form/Form.tsx
@@ -33,7 +33,6 @@ import { useScrollToError } from "./hooks/useScrollToError";
 import { FormSaveButton } from "./components/FormSaveButton";
 import { useSaveButtonPosition } from "./hooks/useSaveButtonPosition";
 import { FormCache } from "./components/FormCache/FormCache";
-import { useAtlantisFormContext } from "./context/AtlantisFormContext";
 import { IOSKeyboardAwareScrollViewSpacer } from "./components/IOSKeyboardAwareScrollViewSpacer/IOSKeyboardAwareScrollViewSpacer";
 import { InputAccessoriesProvider } from "../InputText";
 import { tokens } from "../utils/design";
@@ -179,8 +178,6 @@ function InternalForm<T extends FieldValues, S>({
 
   const styles = useStyles();
 
-  const { edgeToEdgeEnabled } = useAtlantisFormContext();
-
   return (
     <FormProvider {...formMethods}>
       <>
@@ -234,9 +231,7 @@ function InternalForm<T extends FieldValues, S>({
                     <View
                       style={[
                         styles.fixedSaveButton,
-                        (edgeToEdgeEnabled || Platform.OS !== "android") && {
-                          marginBottom: paddingBottom,
-                        },
+                        paddingBottom > 0 && { marginBottom: paddingBottom },
                       ]}
                     >
                       {renderStickySection ? (
diff --git a/packages/components-native/src/Form/components/FormBody/FormBody.tsx b/packages/components-native/src/Form/components/FormBody/FormBody.tsx
index f6e2251561..c1e20269f1 100644
--- a/packages/components-native/src/Form/components/FormBody/FormBody.tsx
+++ b/packages/components-native/src/Form/components/FormBody/FormBody.tsx
@@ -1,13 +1,11 @@
-import React, { type ReactElement, useMemo } from "react";
-import { View } from "react-native";
+import React, { type ReactNode } from "react";
+import { SafeAreaView } from "react-native-safe-area-context";
 import { useStyles } from "./FormBody.style";
-import { useScreenInformation } from "../../hooks/useScreenInformation";
 import type { FormActionBarProps } from "../FormActionBar";
 import { FormActionBar } from "../FormActionBar";
-import { tokens } from "../../../utils/design";
 
 interface FormBodyProps extends FormActionBarProps {
-  readonly children: ReactElement;
+  readonly children: ReactNode;
   readonly shouldRenderActionBar?: boolean;
   readonly saveButtonOffset?: number;
 }
@@ -23,43 +21,32 @@ export function FormBody({
   secondaryActions,
   setSecondaryActionLoading,
   setSaveButtonHeight,
-  saveButtonOffset,
 }: FormBodyProps) {
-  const paddingBottom = useBottomPadding();
-  const fullViewPadding = useMemo(() => ({ paddingBottom }), [paddingBottom]);
   const styles = useStyles();
 
   return (
-    <>
-      <View style={[styles.container]}>
-        {children}
-        {shouldRenderActionBar && (
-          <FormActionBar
-            setSecondaryActionLoading={setSecondaryActionLoading}
-            keyboardHeight={keyboardHeight}
-            submit={submit}
-            isFormSubmitting={isFormSubmitting}
-            saveButtonLabel={saveButtonLabel}
-            renderStickySection={renderStickySection}
-            secondaryActions={secondaryActions}
-            setSaveButtonHeight={setSaveButtonHeight}
-          />
-        )}
-      </View>
-
-      {shouldRenderActionBar && !saveButtonOffset && (
-        <View
-          style={[fullViewPadding, styles.safeArea]}
-          testID="ATL-FormSafeArea"
+    <SafeAreaView
+      edges={["bottom"]}
+      style={[styles.container, styles.safeArea]}
+      testID="ATL-FormSafeArea"
+    >
+      {children}
+      {shouldRenderActionBar && (
+        <FormActionBar
+          setSecondaryActionLoading={setSecondaryActionLoading}
+          keyboardHeight={keyboardHeight}
+          submit={submit}
+          isFormSubmitting={isFormSubmitting}
+          saveButtonLabel={saveButtonLabel}
+          renderStickySection={renderStickySection}
+          secondaryActions={secondaryActions}
+          setSaveButtonHeight={setSaveButtonHeight}
         />
       )}
-    </>
+    </SafeAreaView>
   );
 }
 
 export function useBottomPadding(): number {
-  const { insets } = useScreenInformation();
-  const extraBottomSpace = insets.bottom - tokens["space-base"];
-
-  return extraBottomSpace >= 0 ? extraBottomSpace : 0;
+  return 0;
 }