tap phone button in keypad to "paste" latest recipient

This commit is contained in:
m5r 2021-08-30 08:43:39 +08:00
parent 3d1c545892
commit e77e7d17e0

View File

@ -7,13 +7,16 @@ import { Transition } from "@headlessui/react";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faBackspace, faPhoneAlt as faPhone } from "@fortawesome/pro-solid-svg-icons"; import { faBackspace, faPhoneAlt as faPhone } from "@fortawesome/pro-solid-svg-icons";
import { Direction } from "db";
import Layout from "../../core/layouts/layout"; import Layout from "../../core/layouts/layout";
import Keypad from "../components/keypad"; import Keypad from "../components/keypad";
import useRequireOnboarding from "../../core/hooks/use-require-onboarding"; import useRequireOnboarding from "../../core/hooks/use-require-onboarding";
import usePhoneCalls from "../hooks/use-phone-calls";
const KeypadPage: BlitzPage = () => { const KeypadPage: BlitzPage = () => {
useRequireOnboarding(); useRequireOnboarding();
const router = useRouter(); const router = useRouter();
const [phoneCalls] = usePhoneCalls();
const [phoneNumber, setPhoneNumber] = useAtom(phoneNumberAtom); const [phoneNumber, setPhoneNumber] = useAtom(phoneNumberAtom);
const removeDigit = useAtom(pressBackspaceAtom)[1]; const removeDigit = useAtom(pressBackspaceAtom)[1];
const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null); const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
@ -71,21 +74,26 @@ const KeypadPage: BlitzPage = () => {
</div> </div>
<Keypad onDigitPressProps={onDigitPressProps} onZeroPressProps={onZeroPressProps}> <Keypad onDigitPressProps={onDigitPressProps} onZeroPressProps={onZeroPressProps}>
<Link href={Routes.OutgoingCall({ recipient: encodeURI(phoneNumber) })}> <button
<button onClick={async () => {
onClick={async () => { if (phoneNumber === "") {
if (phoneNumber === "") { const lastCall = phoneCalls[0];
// TODO setPhoneNumber(lastCallRecipient); if (lastCall) {
const lastCallRecipient =
lastCall.direction === Direction.Inbound ? lastCall.from : lastCall.to;
setPhoneNumber(lastCallRecipient);
} }
await router.push(Routes.OutgoingCall({ recipient: encodeURI(phoneNumber) })); return;
setPhoneNumber(""); }
}}
className="cursor-pointer select-none col-start-2 h-12 w-12 flex justify-center items-center mx-auto bg-green-800 rounded-full" await router.push(Routes.OutgoingCall({ recipient: encodeURI(phoneNumber) }));
> setPhoneNumber("");
<FontAwesomeIcon className="w-6 h-6" icon={faPhone} color="white" size="lg" /> }}
</button> className="cursor-pointer select-none col-start-2 h-12 w-12 flex justify-center items-center mx-auto bg-green-800 rounded-full"
</Link> >
<FontAwesomeIcon className="w-6 h-6" icon={faPhone} color="white" size="lg" />
</button>
<Transition <Transition
as={Fragment} as={Fragment}