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

reformat with prettier with semicolons and tabs

Browse Source
This commit is contained in:
m5r
2021-07-31 23:57:43 +08:00
parent fc4278ca7b
commit 079241ddb0
80 changed files with 1187 additions and 1270 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,29 +1,29 @@
import type { FunctionComponent } from "react"
import { CheckIcon } from "@heroicons/react/solid"
import clsx from "clsx"
import { Link, Routes, useRouter } from "blitz"
import type { FunctionComponent } from "react";
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"
import useCustomerPhoneNumber from "../../core/hooks/use-customer-phone-number";
type StepLink = {
href: string
label: string
}
href: string;
label: string;
};
type Props = {
currentStep: 1 | 2 | 3
previous?: StepLink
next?: StepLink
}
currentStep: 1 | 2 | 3;
previous?: StepLink;
next?: StepLink;
};
const steps = ["Welcome", "Twilio Credentials", "Pick a plan"] as const
const steps = ["Welcome", "Twilio Credentials", "Pick a plan"] as const;
const OnboardingLayout: FunctionComponent<Props> = ({ children, currentStep, previous, next }) => {
const router = useRouter()
const customerPhoneNumber = useCustomerPhoneNumber()
const router = useRouter();
const customerPhoneNumber = useCustomerPhoneNumber();
if (customerPhoneNumber) {
throw router.push(Routes.Messages())
throw router.push(Routes.Messages());
}
return (
@ -57,8 +57,8 @@ const OnboardingLayout: FunctionComponent<Props> = ({ children, currentStep, pre
<ol className="flex items-center">
{steps.map((step, stepIdx) => {
const isComplete = currentStep > stepIdx + 1
const isCurrent = stepIdx + 1 === currentStep
const isComplete = currentStep > stepIdx + 1;
const isCurrent = stepIdx + 1 === currentStep;
return (
<li
@ -100,14 +100,14 @@ const OnboardingLayout: FunctionComponent<Props> = ({ children, currentStep, pre
</>
)}
</li>
)
);
})}
</ol>
</nav>
</div>
</div>
</div>
)
}
);
};
export default OnboardingLayout
export default OnboardingLayout;

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

@ -1,40 +1,40 @@
import { resolver } from "blitz"
import { z } from "zod"
import twilio from "twilio"
import { resolver } from "blitz";
import { z } from "zod";
import twilio from "twilio";
import db from "../../../db"
import getCurrentCustomer from "../../customers/queries/get-current-customer"
import fetchMessagesQueue from "../../api/queue/fetch-messages"
import fetchCallsQueue from "../../api/queue/fetch-calls"
import setTwilioWebhooks from "../../api/queue/set-twilio-webhooks"
import db from "../../../db";
import getCurrentCustomer from "../../customers/queries/get-current-customer";
import fetchMessagesQueue from "../../api/queue/fetch-messages";
import fetchCallsQueue from "../../api/queue/fetch-calls";
import setTwilioWebhooks from "../../api/queue/set-twilio-webhooks";
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 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)!
).incomingPhoneNumbers.list();
const phoneNumber = phoneNumbers.find((phoneNumber) => phoneNumber.sid === phoneNumberSid)!;
await db.phoneNumber.create({
data: {
customerId,
phoneNumberSid,
phoneNumber: phoneNumber.phoneNumber,
},
})
});
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}` }),
])
]);
}
)
);

18
app/onboarding/mutations/set-twilio-api-fields.ts
View File

@ -1,26 +1,26 @@
import { resolver } from "blitz"
import { z } from "zod"
import { resolver } from "blitz";
import { z } from "zod";
import db from "../../../db"
import getCurrentCustomer from "../../customers/queries/get-current-customer"
import db from "../../../db";
import getCurrentCustomer from "../../customers/queries/get-current-customer";
const Body = z.object({
twilioAccountSid: z.string(),
twilioAuthToken: z.string(),
})
});
export default resolver.pipe(
resolver.zod(Body),
resolver.authorize(),
async ({ twilioAccountSid, twilioAuthToken }, context) => {
const customer = await getCurrentCustomer(null, context)
const customerId = customer!.id
const customer = await getCurrentCustomer(null, context);
const customerId = customer!.id;
await db.customer.update({
where: { id: customerId },
data: {
accountSid: twilioAccountSid,
authToken: twilioAuthToken,
},
})
});
}
)
);

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

@ -1,10 +1,10 @@
import type { BlitzPage } from "blitz"
import type { BlitzPage } from "blitz";
import OnboardingLayout from "../../components/onboarding-layout"
import useCurrentCustomer from "../../../core/hooks/use-current-customer"
import OnboardingLayout from "../../components/onboarding-layout";
import useCurrentCustomer from "../../../core/hooks/use-current-customer";
const StepOne: BlitzPage = () => {
useCurrentCustomer() // preload for step two
useCurrentCustomer(); // preload for step two
return (
<OnboardingLayout
@ -15,9 +15,9 @@ const StepOne: BlitzPage = () => {
<span>Welcome, let’s set up your virtual phone!</span>
</div>
</OnboardingLayout>
)
}
);
};
StepOne.authenticate = true
StepOne.authenticate = true;
export default StepOne
export default StepOne;

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

@ -1,26 +1,26 @@
import type { BlitzPage, GetServerSideProps } from "blitz"
import { Routes, getSession, useRouter, useMutation } from "blitz"
import { useEffect } from "react"
import twilio from "twilio"
import { useForm } from "react-hook-form"
import clsx from "clsx"
import type { BlitzPage, GetServerSideProps } from "blitz";
import { Routes, getSession, useRouter, useMutation } from "blitz";
import { useEffect } from "react";
import twilio from "twilio";
import { useForm } from "react-hook-form";
import clsx from "clsx";
import db from "../../../../db"
import OnboardingLayout from "../../components/onboarding-layout"
import setPhoneNumber from "../../mutations/set-phone-number"
import db from "../../../../db";
import OnboardingLayout from "../../components/onboarding-layout";
import setPhoneNumber from "../../mutations/set-phone-number";
type PhoneNumber = {
phoneNumber: string
sid: string
}
phoneNumber: string;
sid: string;
};
type Props = {
availablePhoneNumbers: PhoneNumber[]
}
availablePhoneNumbers: PhoneNumber[];
};
type Form = {
phoneNumberSid: string
}
phoneNumberSid: string;
};
const StepThree: BlitzPage<Props> = ({ availablePhoneNumbers }) => {
const {
@ -28,24 +28,24 @@ const StepThree: BlitzPage<Props> = ({ availablePhoneNumbers }) => {
handleSubmit,
setValue,
formState: { isSubmitting },
} = useForm<Form>()
const router = useRouter()
const [setPhoneNumberMutation] = useMutation(setPhoneNumber)
} = useForm<Form>();
const router = useRouter();
const [setPhoneNumberMutation] = useMutation(setPhoneNumber);
useEffect(() => {
if (availablePhoneNumbers[0]) {
setValue("phoneNumberSid", availablePhoneNumbers[0].sid)
setValue("phoneNumberSid", availablePhoneNumbers[0].sid);
}
})
});
const onSubmit = handleSubmit(async ({ phoneNumberSid }) => {
if (isSubmitting) {
return
return;
}
await setPhoneNumberMutation({ phoneNumberSid })
await router.push(Routes.Messages())
})
await setPhoneNumberMutation({ phoneNumberSid });
await router.push(Routes.Messages());
});
return (
<OnboardingLayout currentStep={3} previous={{ href: "/welcome/step-two", label: "Back" }}>
@ -82,21 +82,21 @@ const StepThree: BlitzPage<Props> = ({ availablePhoneNumbers }) => {
</form>
</div>
</OnboardingLayout>
)
}
);
};
StepThree.authenticate = true
StepThree.authenticate = true;
export const getServerSideProps: GetServerSideProps<Props> = async ({ req, res }) => {
const session = await getSession(req, res)
const customer = await db.customer.findFirst({ where: { id: session.userId! } })
const session = await getSession(req, res);
const customer = await db.customer.findFirst({ where: { id: session.userId! } });
if (!customer) {
return {
redirect: {
destination: Routes.StepOne().pathname,
permanent: false,
},
}
};
}
if (!customer.accountSid || !customer.authToken) {
@ -105,20 +105,20 @@ export const getServerSideProps: GetServerSideProps<Props> = async ({ req, res }
destination: Routes.StepTwo().pathname,
permanent: false,
},
}
};
}
const incomingPhoneNumbers = await twilio(
customer.accountSid,
customer.authToken
).incomingPhoneNumbers.list()
const phoneNumbers = incomingPhoneNumbers.map(({ phoneNumber, sid }) => ({ phoneNumber, sid }))
).incomingPhoneNumbers.list();
const phoneNumbers = incomingPhoneNumbers.map(({ phoneNumber, sid }) => ({ phoneNumber, sid }));
return {
props: {
availablePhoneNumbers: phoneNumbers,
},
}
}
};
};
export default StepThree
export default StepThree;

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

@ -1,17 +1,17 @@
import type { BlitzPage } from "blitz"
import { Routes, useMutation, useRouter } from "blitz"
import clsx from "clsx"
import { useEffect } from "react"
import { useForm } from "react-hook-form"
import type { BlitzPage } from "blitz";
import { Routes, useMutation, useRouter } from "blitz";
import clsx from "clsx";
import { useEffect } from "react";
import { useForm } from "react-hook-form";
import OnboardingLayout from "../../components/onboarding-layout"
import useCurrentCustomer from "../../../core/hooks/use-current-customer"
import setTwilioApiFields from "../../mutations/set-twilio-api-fields"
import OnboardingLayout from "../../components/onboarding-layout";
import useCurrentCustomer from "../../../core/hooks/use-current-customer";
import setTwilioApiFields from "../../mutations/set-twilio-api-fields";
type Form = {
twilioAccountSid: string
twilioAuthToken: string
}
twilioAccountSid: string;
twilioAuthToken: string;
};
const StepTwo: BlitzPage = () => {
const {
@ -19,31 +19,31 @@ const StepTwo: BlitzPage = () => {
handleSubmit,
setValue,
formState: { isSubmitting },
} = useForm<Form>()
const router = useRouter()
const { customer } = useCurrentCustomer()
const [setTwilioApiFieldsMutation] = useMutation(setTwilioApiFields)
} = useForm<Form>();
const router = useRouter();
const { customer } = useCurrentCustomer();
const [setTwilioApiFieldsMutation] = useMutation(setTwilioApiFields);
const initialAuthToken = customer?.authToken ?? ""
const initialAccountSid = customer?.accountSid ?? ""
const hasTwilioCredentials = initialAccountSid.length > 0 && initialAuthToken.length > 0
const initialAuthToken = customer?.authToken ?? "";
const initialAccountSid = customer?.accountSid ?? "";
const hasTwilioCredentials = initialAccountSid.length > 0 && initialAuthToken.length > 0;
useEffect(() => {
setValue("twilioAuthToken", initialAuthToken)
setValue("twilioAccountSid", initialAccountSid)
}, [initialAuthToken, initialAccountSid])
setValue("twilioAuthToken", initialAuthToken);
setValue("twilioAccountSid", initialAccountSid);
}, [initialAuthToken, initialAccountSid]);
const onSubmit = handleSubmit(async ({ twilioAccountSid, twilioAuthToken }) => {
if (isSubmitting) {
return
return;
}
await setTwilioApiFieldsMutation({
twilioAccountSid,
twilioAuthToken,
})
});
await router.push(Routes.StepThree())
})
await router.push(Routes.StepThree());
});
return (
<OnboardingLayout
@ -95,9 +95,9 @@ const StepTwo: BlitzPage = () => {
</form>
</div>
</OnboardingLayout>
)
}
);
};
StepTwo.authenticate = true
StepTwo.authenticate = true;
export default StepTwo
export default StepTwo;