58 lines
1.9 KiB
TypeScript
58 lines
1.9 KiB
TypeScript
import { useState } from "react";
|
|
import { View } from "react-native";
|
|
import BaseBottomSheetComponent from "../../../components/bottomsheet/BaseBottomSheetComponent";
|
|
import { GenericActionPayload } from "../actions/GenericAction";
|
|
import {
|
|
BOTTOMSHEET_ANIMATION_DURATION,
|
|
BOTTOMSHEET_DISMISS_ANIMATION_DURATION,
|
|
} from "../constants";
|
|
import { ModalView } from "../interface/modals/ModalView";
|
|
import { clearBottomSheet, setBottomSheetView } from "../utilities/AlfredUtils";
|
|
|
|
export const useBottomSheet = (
|
|
handleActions: (actionPayload?: GenericActionPayload) => void,
|
|
) => {
|
|
const [bottomsheet, setBottomSheet] = useState<JSX.Element[]>([]);
|
|
|
|
const onAnimationEndHandler = (id: number | null) => {
|
|
if (!id) return;
|
|
setBottomSheetView(id);
|
|
};
|
|
|
|
const addBottomSheet = (modalView: ModalView) => {
|
|
setBottomSheet(prevState => [
|
|
...prevState,
|
|
<View>
|
|
<BaseBottomSheetComponent
|
|
onBottomSheetAnimationEnd={onAnimationEndHandler}
|
|
showModal={true}
|
|
onClose={() => removeBottomSheet()}
|
|
modalView={modalView}
|
|
handleActions={handleActions}
|
|
/>
|
|
</View>,
|
|
]);
|
|
};
|
|
|
|
const removeBottomSheet = () => {
|
|
clearBottomSheet();
|
|
setBottomSheet(prevState => {
|
|
const newState = [...prevState];
|
|
newState.pop();
|
|
return newState;
|
|
});
|
|
};
|
|
|
|
const replaceBottomSheet = (modalView: ModalView) => {
|
|
setTimeout(() => {
|
|
removeBottomSheet();
|
|
}, BOTTOMSHEET_DISMISS_ANIMATION_DURATION); // This delay ensures the first bottom sheet closes before the next one appears.
|
|
setTimeout(() => {
|
|
addBottomSheet(modalView);
|
|
}, BOTTOMSHEET_ANIMATION_DURATION);
|
|
// BOTTOMSHEET_ANIMATION_DURATION is for allowing the current bottomsheet to close animatically before opening the new one.
|
|
};
|
|
|
|
return { bottomsheet, addBottomSheet, removeBottomSheet, replaceBottomSheet };
|
|
};
|