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

38
app/core/components/form.tsx
View File

@ -1,26 +1,26 @@
import { useState, ReactNode, PropsWithoutRef } from "react"
import { FormProvider, useForm, UseFormProps } from "react-hook-form"
import { zodResolver } from "@hookform/resolvers/zod"
import { z } from "zod"
import { useState, ReactNode, PropsWithoutRef } from "react";
import { FormProvider, useForm, UseFormProps } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import { z } from "zod";
export interface FormProps<S extends z.ZodType<any, any>>
extends Omit<PropsWithoutRef<JSX.IntrinsicElements["form"]>, "onSubmit"> {
/** All your form fields */
children?: ReactNode
children?: ReactNode;
/** Text to display in the submit button */
submitText?: string
schema?: S
onSubmit: (values: z.infer<S>) => Promise<void | OnSubmitResult>
initialValues?: UseFormProps<z.infer<S>>["defaultValues"]
submitText?: string;
schema?: S;
onSubmit: (values: z.infer<S>) => Promise<void | OnSubmitResult>;
initialValues?: UseFormProps<z.infer<S>>["defaultValues"];
}
interface OnSubmitResult {
FORM_ERROR?: string
FORM_ERROR?: string;
[prop: string]: any
[prop: string]: any;
}
export const FORM_ERROR = "FORM_ERROR"
export const FORM_ERROR = "FORM_ERROR";
export function Form<S extends z.ZodType<any, any>>({
children,
@ -34,22 +34,22 @@ export function Form<S extends z.ZodType<any, any>>({
mode: "onBlur",
resolver: schema ? zodResolver(schema) : undefined,
defaultValues: initialValues,
})
const [formError, setFormError] = useState<string | null>(null)
});
const [formError, setFormError] = useState<string | null>(null);
return (
<FormProvider {...ctx}>
<form
onSubmit={ctx.handleSubmit(async (values) => {
const result = (await onSubmit(values)) || {}
const result = (await onSubmit(values)) || {};
for (const [key, value] of Object.entries(result)) {
if (key === FORM_ERROR) {
setFormError(value)
setFormError(value);
} else {
ctx.setError(key as any, {
type: "submit",
message: value,
})
});
}
}
})}
@ -78,7 +78,7 @@ export function Form<S extends z.ZodType<any, any>>({
`}</style>
</form>
</FormProvider>
)
);
}
export default Form
export default Form;

22
app/core/components/labeled-text-field.tsx
View File

@ -1,14 +1,14 @@
import { forwardRef, PropsWithoutRef } from "react"
import { useFormContext } from "react-hook-form"
import { forwardRef, PropsWithoutRef } from "react";
import { useFormContext } from "react-hook-form";
export interface LabeledTextFieldProps extends PropsWithoutRef<JSX.IntrinsicElements["input"]> {
/** Field name. */
name: string
name: string;
/** Field label. */
label: string
label: string;
/** Field type. Doesn't include radio buttons and checkboxes */
type?: "text" | "password" | "email" | "number"
outerProps?: PropsWithoutRef<JSX.IntrinsicElements["div"]>
type?: "text" | "password" | "email" | "number";
outerProps?: PropsWithoutRef<JSX.IntrinsicElements["div"]>;
}
export const LabeledTextField = forwardRef<HTMLInputElement, LabeledTextFieldProps>(
@ -16,10 +16,10 @@ export const LabeledTextField = forwardRef<HTMLInputElement, LabeledTextFieldPro
const {
register,
formState: { isSubmitting, errors },
} = useFormContext()
} = useFormContext();
const error = Array.isArray(errors[name])
? errors[name].join(", ")
: errors[name]?.message || errors[name]
: errors[name]?.message || errors[name];
return (
<div {...outerProps}>
@ -51,8 +51,8 @@ export const LabeledTextField = forwardRef<HTMLInputElement, LabeledTextFieldPro
}
`}</style>
</div>
)
);
}
)
);
export default LabeledTextField
export default LabeledTextField;

8
app/core/hooks/use-current-customer.ts
View File

@ -1,11 +1,11 @@
import { useQuery } from "blitz"
import { useQuery } from "blitz";
import getCurrentCustomer from "../../customers/queries/get-current-customer"
import getCurrentCustomer from "../../customers/queries/get-current-customer";
export default function useCurrentCustomer() {
const [customer] = useQuery(getCurrentCustomer, null)
const [customer] = useQuery(getCurrentCustomer, null);
return {
customer,
hasCompletedOnboarding: Boolean(!!customer && customer.accountSid && customer.authToken),
}
};
}

12
app/core/hooks/use-customer-phone-number.ts
View File

@ -1,15 +1,15 @@
import { useQuery } from "blitz"
import { useQuery } from "blitz";
import getCurrentCustomerPhoneNumber from "../../phone-numbers/queries/get-current-customer-phone-number"
import useCurrentCustomer from "./use-current-customer"
import getCurrentCustomerPhoneNumber from "../../phone-numbers/queries/get-current-customer-phone-number";
import useCurrentCustomer from "./use-current-customer";
export default function useCustomerPhoneNumber() {
const { hasCompletedOnboarding } = useCurrentCustomer()
const { hasCompletedOnboarding } = useCurrentCustomer();
const [customerPhoneNumber] = useQuery(
getCurrentCustomerPhoneNumber,
{},
{ enabled: hasCompletedOnboarding }
)
);
return customerPhoneNumber
return customerPhoneNumber;
}

18
app/core/hooks/use-require-onboarding.ts
View File

@ -1,15 +1,15 @@
import { Routes, useRouter } from "blitz"
import { Routes, useRouter } from "blitz";
import useCurrentCustomer from "./use-current-customer"
import useCustomerPhoneNumber from "./use-customer-phone-number"
import useCurrentCustomer from "./use-current-customer";
import useCustomerPhoneNumber from "./use-customer-phone-number";
export default function useRequireOnboarding() {
const router = useRouter()
const { customer, hasCompletedOnboarding } = useCurrentCustomer()
const customerPhoneNumber = useCustomerPhoneNumber()
const router = useRouter();
const { customer, hasCompletedOnboarding } = useCurrentCustomer();
const customerPhoneNumber = useCustomerPhoneNumber();
if (!hasCompletedOnboarding) {
throw router.push(Routes.StepTwo())
throw router.push(Routes.StepTwo());
}
/*if (!customer.paddleCustomerId || !customer.paddleSubscriptionId) {
@ -17,8 +17,8 @@ export default function useRequireOnboarding() {
return;
}*/
console.log("customerPhoneNumber", customerPhoneNumber)
console.log("customerPhoneNumber", customerPhoneNumber);
if (!customerPhoneNumber) {
throw router.push(Routes.StepThree())
throw router.push(Routes.StepThree());
}
}

16
app/core/layouts/base-layout.tsx
View File

@ -1,10 +1,10 @@
import { ReactNode } from "react"
import { Head } from "blitz"
import { ReactNode } from "react";
import { Head } from "blitz";
type LayoutProps = {
title?: string
children: ReactNode
}
title?: string;
children: ReactNode;
};
const BaseLayout = ({ title, children }: LayoutProps) => {
return (
@ -16,7 +16,7 @@ const BaseLayout = ({ title, children }: LayoutProps) => {
{children}
</>
)
}
);
};
export default BaseLayout
export default BaseLayout;

34
app/core/layouts/layout/footer.tsx
View File

@ -1,19 +1,19 @@
import type { ReactNode } from "react"
import Link from "next/link"
import { useRouter } from "next/router"
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
import type { ReactNode } from "react";
import Link from "next/link";
import { useRouter } from "next/router";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import {
faPhoneAlt as fasPhone,
faTh as fasTh,
faComments as fasComments,
faCog as fasCog,
} from "@fortawesome/pro-solid-svg-icons"
} from "@fortawesome/pro-solid-svg-icons";
import {
faPhoneAlt as farPhone,
faTh as farTh,
faComments as farComments,
faCog as farCog,
} from "@fortawesome/pro-regular-svg-icons"
} from "@fortawesome/pro-regular-svg-icons";
export default function Footer() {
return (
@ -51,22 +51,22 @@ export default function Footer() {
}}
/>
</footer>
)
);
}
type NavLinkProps = {
path: string
label: string
path: string;
label: string;
icons: {
active: ReactNode
inactive: ReactNode
}
}
active: ReactNode;
inactive: ReactNode;
};
};
function NavLink({ path, label, icons }: NavLinkProps) {
const router = useRouter()
const isActiveRoute = router.pathname.startsWith(path)
const icon = isActiveRoute ? icons.active : icons.inactive
const router = useRouter();
const isActiveRoute = router.pathname.startsWith(path);
const icon = isActiveRoute ? icons.active : icons.inactive;
return (
<div className="flex flex-col items-center justify-around h-full">
@ -77,5 +77,5 @@ function NavLink({ path, label, icons }: NavLinkProps) {
</a>
</Link>
</div>
)
);
}

50
app/core/layouts/layout/index.tsx
View File

@ -1,20 +1,20 @@
import type { ErrorInfo, FunctionComponent } from "react"
import { Component } from "react"
import Head from "next/head"
import type { WithRouterProps } from "next/dist/client/with-router"
import { withRouter } from "next/router"
import type { ErrorInfo, FunctionComponent } from "react";
import { Component } from "react";
import Head from "next/head";
import type { WithRouterProps } from "next/dist/client/with-router";
import { withRouter } from "next/router";
import appLogger from "../../../../integrations/logger"
import appLogger from "../../../../integrations/logger";
import Footer from "./footer"
import Footer from "./footer";
type Props = {
title: string
pageTitle?: string
hideFooter?: true
}
title: string;
pageTitle?: string;
hideFooter?: true;
};
const logger = appLogger.child({ module: "Layout" })
const logger = appLogger.child({ module: "Layout" });
const Layout: FunctionComponent<Props> = ({
children,
@ -41,33 +41,33 @@ const Layout: FunctionComponent<Props> = ({
</div>
</div>
</>
)
}
);
};
type ErrorBoundaryState =
| {
isError: false
isError: false;
}
| {
isError: true
errorMessage: string
}
isError: true;
errorMessage: string;
};
const ErrorBoundary = withRouter(
class ErrorBoundary extends Component<WithRouterProps, ErrorBoundaryState> {
public readonly state = {
isError: false,
} as const
} as const;
static getDerivedStateFromError(error: Error): ErrorBoundaryState {
return {
isError: true,
errorMessage: error.message,
}
};
}
public componentDidCatch(error: Error, errorInfo: ErrorInfo) {
logger.error(error, errorInfo.componentStack)
logger.error(error, errorInfo.componentStack);
}
public render() {
@ -90,12 +90,12 @@ const ErrorBoundary = withRouter(
?
</p>
</>
)
);
}
return this.props.children
return this.props.children;
}
}
)
);
export default Layout
export default Layout;