# ManuallyRequestSheet

Canonical page: https://docs.ovok.com/native-sdk/guide/components/data-sync/manually-request-sheet

Use this compound component to present a custom screen before the app calls the
authorization provider's `requestAccess` callback. It wraps
`@gorhom/bottom-sheet`'s `BottomSheetModal`; your app owns when the modal opens,
how the user dismisses it, and what happens after Skip.

The authorization provider must receive both `renderManualRequestUI` and
`skipRequest={false}` for this manual flow. The callback supplies
`requestAccess` to your screen. See the
[HealthKit and Health Connect guide](/native-sdk/guide/modules/data-sync).

~~~tsx
import * as React from "react";
import { BottomSheetModal } from "@gorhom/bottom-sheet";
import { DataSync } from "@ovok/native/data-sync";

function RequestHealthAccess({
  requestAccess,
  onSkip,
}: {
  requestAccess: () => void;
  onSkip: () => void;
}) {
  const sheetRef = React.useRef<BottomSheetModal>(null);

  React.useEffect(() => {
    sheetRef.current?.present();
  }, []);

  return (
    <DataSync.ManuallyRequestSheet ref={sheetRef}>
      <DataSync.ManuallyRequestSheet.Container>
        <DataSync.ManuallyRequestSheet.Title>
          Connect health data
        </DataSync.ManuallyRequestSheet.Title>
        <DataSync.ManuallyRequestSheet.Description>
          Choose whether to share your weight with this app.
        </DataSync.ManuallyRequestSheet.Description>
        <DataSync.ManuallyRequestSheet.RequestButton onPress={requestAccess}>
          Continue
        </DataSync.ManuallyRequestSheet.RequestButton>
        <DataSync.ManuallyRequestSheet.SkipButton
          onPress={onSkip}
        >
          Not now
        </DataSync.ManuallyRequestSheet.SkipButton>
      </DataSync.ManuallyRequestSheet.Container>
    </DataSync.ManuallyRequestSheet>
  );
}
~~~

## Setup [#setup]

Mount `BottomSheetModalProvider` from `@gorhom/bottom-sheet` above this
component. In the manual request callback, present the sheet after its ref is set.
After a permission request completes, update or close the app's UI based on the
provider status. The sheet does not dismiss itself when either button is pressed.

## Members [#members]

- [`Container`](/native-sdk/guide/components/data-sync/manually-request-sheet/container/) adds themed spacing and bottom safe-area padding.
- [`Title`](/native-sdk/guide/components/data-sync/manually-request-sheet/title/) and [`Description`](/native-sdk/guide/components/data-sync/manually-request-sheet/description/) provide themed text.
- [`Image`](/native-sdk/guide/components/data-sync/manually-request-sheet/image/) renders bundled or app-provided artwork.
- [`RequestButton`](/native-sdk/guide/components/data-sync/manually-request-sheet/request-button/) defaults to a contained button.
- [`SkipButton`](/native-sdk/guide/components/data-sync/manually-request-sheet/skip-button/) defaults to a text button.

## Modal props [#modal-props]

`ManuallyRequestSheet` accepts `BottomSheetModalProps` and forwards its ref to
the underlying `BottomSheetModal`. Dynamic sizing defaults to enabled and
pan-down-to-close defaults to disabled; pass the corresponding bottom-sheet props
to change those defaults. The sheet background uses the active theme background
color, merged with the supplied `backgroundStyle`.

## Related [#related]

- [AppleHealthAuthorizationProvider](/native-sdk/guide/components/data-sync/apple/health-authorization-provider/)
- [AndroidHealthConnectAuthorizationProvider](/native-sdk/guide/components/data-sync/android/health-connect-authorization-provider/)
- [HealthKit and Health Connect guide](/native-sdk/guide/modules/data-sync)