mokhtar/shellphone.app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

session thingy for onboarding checks

Browse Source
This commit is contained in:
m5r
2021-08-01 22:01:51 +08:00
parent 7acbca65ce
commit 7d34fcd48f
15 changed files with 85 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/onboarding/components/onboarding-layout.tsx
View File

@ -1,9 +1,7 @@
import type { FunctionComponent } from "react";
import { Link } from "blitz";
import { CheckIcon } from "@heroicons/react/solid";
import clsx from "clsx";
import { Link, Routes, useRouter } from "blitz";
import useCustomerPhoneNumber from "../../core/hooks/use-customer-phone-number";
type StepLink = {
href: string;
@ -19,13 +17,6 @@ type Props = {
const steps = ["Welcome", "Twilio Credentials", "Pick a plan"] as const;
const OnboardingLayout: FunctionComponent<Props> = ({ children, currentStep, previous, next }) => {
const router = useRouter();
const customerPhoneNumber = useCustomerPhoneNumber();
if (customerPhoneNumber) {
throw router.push(Routes.Messages());
}
return (
<div className="bg-gray-800 fixed z-10 inset-0 overflow-y-auto">
<div className="min-h-screen text-center block p-0">

44
app/onboarding/mutations/set-phone-number.ts
View File

@ -12,29 +12,23 @@ const Body = z.object({
phoneNumberSid: z.string(),
});
export default resolver.pipe(
resolver.zod(Body),
resolver.authorize(),
async ({ phoneNumberSid }, context) => {
const customer = await getCurrentCustomer(null, context);
const customerId = customer!.id;
const phoneNumbers = await twilio(
customer!.accountSid!,
customer!.authToken!,
).incomingPhoneNumbers.list();
const phoneNumber = phoneNumbers.find((phoneNumber) => phoneNumber.sid === phoneNumberSid)!;
await db.phoneNumber.create({
data: {
customerId,
phoneNumberSid,
phoneNumber: phoneNumber.phoneNumber,
},
});
export default resolver.pipe(resolver.zod(Body), resolver.authorize(), async ({ phoneNumberSid }, context) => {
const customer = await getCurrentCustomer(null, context);
const customerId = customer!.id;
const phoneNumbers = await twilio(customer!.accountSid!, customer!.authToken!).incomingPhoneNumbers.list();
const phoneNumber = phoneNumbers.find((phoneNumber) => phoneNumber.sid === phoneNumberSid)!;
await db.phoneNumber.create({
data: {
customerId,
phoneNumberSid,
phoneNumber: phoneNumber.phoneNumber,
},
});
context.session.$setPrivateData({ hasCompletedOnboarding: true });
await Promise.all([
fetchMessagesQueue.enqueue({ customerId }, { id: `fetch-messages-${customerId}` }),
fetchCallsQueue.enqueue({ customerId }, { id: `fetch-messages-${customerId}` }),
setTwilioWebhooks.enqueue({ customerId }, { id: `set-twilio-webhooks-${customerId}` }),
]);
},
);
await Promise.all([
fetchMessagesQueue.enqueue({ customerId }, { id: `fetch-messages-${customerId}` }),
fetchCallsQueue.enqueue({ customerId }, { id: `fetch-messages-${customerId}` }),
setTwilioWebhooks.enqueue({ customerId }, { id: `set-twilio-webhooks-${customerId}` }),
]);
});

22
app/onboarding/pages/welcome/step-one.tsx
View File

@ -16,10 +16,7 @@ const StepOne: BlitzPage = () => {
};
StepOne.getLayout = (page) => (
<OnboardingLayout
currentStep={1}
next={{ href: Routes.StepTwo().pathname, label: "Set up your phone number" }}
>
<OnboardingLayout currentStep={1} next={{ href: Routes.StepTwo().pathname, label: "Set up your phone number" }}>
{page}
</OnboardingLayout>
);
@ -39,16 +36,17 @@ export const getServerSideProps: GetServerSideProps = async ({ req, res }) => {
}
const phoneNumber = await db.phoneNumber.findFirst({ where: { customerId: session.userId } });
if (!phoneNumber) {
return { props: {} };
if (phoneNumber) {
await session.$setPublicData({ hasCompletedOnboarding: true });
return {
redirect: {
destination: Routes.Messages().pathname,
permanent: false,
},
};
}
return {
redirect: {
destination: Routes.Messages().pathname,
permanent: false,
},
};
return { props: {} };
};
export default StepOne;

6
app/onboarding/pages/welcome/step-three.tsx
View File

@ -102,6 +102,7 @@ export const getServerSideProps: GetServerSideProps<Props> = async ({ req, res }
const phoneNumber = await db.phoneNumber.findFirst({ where: { customerId: session.userId } });
if (phoneNumber) {
await session.$setPublicData({ hasCompletedOnboarding: true });
return {
redirect: {
destination: Routes.Messages().pathname,
@ -129,10 +130,7 @@ export const getServerSideProps: GetServerSideProps<Props> = async ({ req, res }
};
}
const incomingPhoneNumbers = await twilio(
customer.accountSid,
customer.authToken,
).incomingPhoneNumbers.list();
const incomingPhoneNumbers = await twilio(customer.accountSid, customer.authToken).incomingPhoneNumbers.list();
const phoneNumbers = incomingPhoneNumbers.map(({ phoneNumber, sid }) => ({ phoneNumber, sid }));
return {

33
app/onboarding/pages/welcome/step-two.tsx
View File

@ -48,10 +48,7 @@ const StepTwo: BlitzPage = () => {
<div className="flex flex-col space-y-4 items-center">
<form onSubmit={onSubmit} className="flex flex-col gap-6">
<div className="w-full">
<label
htmlFor="twilioAccountSid"
className="block text-sm font-medium text-gray-700"
>
<label htmlFor="twilioAccountSid" className="block text-sm font-medium text-gray-700">
Twilio Account SID
</label>
<input
@ -62,10 +59,7 @@ const StepTwo: BlitzPage = () => {
/>
</div>
<div className="w-full">
<label
htmlFor="twilioAuthToken"
className="block text-sm font-medium text-gray-700"
>
<label htmlFor="twilioAuthToken" className="block text-sm font-medium text-gray-700">
Twilio Auth Token
</label>
<input
@ -108,11 +102,7 @@ const StepTwoLayout: FunctionComponent = ({ children }) => {
return (
<OnboardingLayout
currentStep={2}
next={
hasTwilioCredentials
? { href: Routes.StepThree().pathname, label: "Next" }
: undefined
}
next={hasTwilioCredentials ? { href: Routes.StepThree().pathname, label: "Next" } : undefined}
previous={{ href: Routes.StepOne().pathname, label: "Back" }}
>
{children}
@ -135,16 +125,17 @@ export const getServerSideProps: GetServerSideProps = async ({ req, res }) => {
}
const phoneNumber = await db.phoneNumber.findFirst({ where: { customerId: session.userId } });
if (!phoneNumber) {
return { props: {} };
if (phoneNumber) {
await session.$setPublicData({ hasCompletedOnboarding: true });
return {
redirect: {
destination: Routes.Messages().pathname,
permanent: false,
},
};
}
return {
redirect: {
destination: Routes.Messages().pathname,
permanent: false,
},
};
return { props: {} };
};
export default StepTwo;