94 lines
2.7 KiB
JavaScript
94 lines
2.7 KiB
JavaScript
import React, { useCallback, useEffect, useRef, useState } from "react";
|
|
|
|
import { Portal, Modal } from "react-native-paper";
|
|
|
|
import { useStyles } from "./styles";
|
|
|
|
import { setA11yFocusAfterInteractions } from "~/lib/a11y";
|
|
|
|
import AccountManagementModalConnect from "./AccountManagementModalConnect";
|
|
import AccountManagementModalDestroy from "./AccountManagementModalDestroy";
|
|
import AccountManagementModalImpersonate from "./AccountManagementModalImpersonate";
|
|
|
|
import Text from "~/components/Text";
|
|
|
|
export default function AccountManagementModal({
|
|
modalState,
|
|
profileData,
|
|
waitingSmsType,
|
|
clearAuthWaitParams,
|
|
triggerRefs,
|
|
}) {
|
|
const styles = useStyles();
|
|
const [modal, setModal] = modalState;
|
|
const { visible, component } = modal;
|
|
const [authMethod, setAuthMethod] = useState(false);
|
|
|
|
const titleRef = useRef(null);
|
|
const closeModal = useCallback(() => {
|
|
setModal({
|
|
visible: false,
|
|
});
|
|
setAuthMethod(false);
|
|
}, [setModal]);
|
|
|
|
useEffect(() => {
|
|
if (visible) {
|
|
setA11yFocusAfterInteractions(titleRef);
|
|
}
|
|
}, [visible]);
|
|
|
|
useEffect(() => {
|
|
if (visible) return;
|
|
|
|
const triggerRef = triggerRefs?.[component];
|
|
if (triggerRef?.current) {
|
|
setA11yFocusAfterInteractions(triggerRef);
|
|
}
|
|
// Intentionally include `component` so we restore to the correct trigger.
|
|
}, [visible, component, triggerRefs]);
|
|
|
|
return (
|
|
<Portal>
|
|
<Modal
|
|
visible={visible}
|
|
onDismiss={closeModal}
|
|
contentContainerStyle={styles.bottomModalContentContainer}
|
|
accessibilityViewIsModal
|
|
>
|
|
{/* Invisible header to control initial focus and SR context */}
|
|
<Text
|
|
ref={titleRef}
|
|
accessibilityRole="header"
|
|
style={{ height: 0, width: 0, opacity: 0 }}
|
|
>
|
|
{component === "destroy"
|
|
? "Supprimer le compte"
|
|
: "Se connecter à un compte"}
|
|
</Text>
|
|
{visible && component === "connect" && (
|
|
<AccountManagementModalConnect
|
|
closeModal={closeModal}
|
|
profileData={profileData}
|
|
authMethod={authMethod}
|
|
setAuthMethod={setAuthMethod}
|
|
waitingSmsType={waitingSmsType}
|
|
clearAuthWaitParams={clearAuthWaitParams}
|
|
/>
|
|
)}
|
|
{visible && component === "destroy" && (
|
|
<AccountManagementModalDestroy
|
|
closeModal={closeModal}
|
|
profileData={profileData}
|
|
/>
|
|
)}
|
|
{visible && component === "impersonate" && (
|
|
<AccountManagementModalImpersonate
|
|
closeModal={closeModal}
|
|
profileData={profileData}
|
|
/>
|
|
)}
|
|
</Modal>
|
|
</Portal>
|
|
);
|
|
}
|