Skip to content

Commit

Permalink
🐛 fix(customer): improve customer query performance (saasfly#56)
Browse files Browse the repository at this point in the history
* 🐛 fix(customer): improve customer query performance

* 🐛 fix(app,components): improve formatting and styling

* 🔧 chore: Upgrade dependencies in Next.js and Auth packages
  • Loading branch information
nextify authored May 13, 2024
1 parent fbb8fbc commit 8fc0e37
Show file tree
Hide file tree
Showing 13 changed files with 198 additions and 114 deletions.
26 changes: 17 additions & 9 deletions apps/nextjs/contentlayer.config.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,8 @@
import { ComputedFields, defineDocumentType, makeSource } from "contentlayer2/source-files";
import {
ComputedFields,
defineDocumentType,
makeSource,
} from "contentlayer2/source-files";
import rehypeAutolinkHeadings from "rehype-autolink-headings";
import rehypePrettyCode from "rehype-pretty-code";
import rehypeSlug from "rehype-slug";
Expand Down Expand Up @@ -33,7 +37,7 @@ export const Doc = defineDocumentType(() => ({
default: true,
},
},
computedFields:defaultComputedFields
computedFields: defaultComputedFields,
}));

export const Guide = defineDocumentType(() => ({
Expand Down Expand Up @@ -61,7 +65,7 @@ export const Guide = defineDocumentType(() => ({
default: false,
},
},
computedFields:defaultComputedFields
computedFields: defaultComputedFields,
}));

export const Post = defineDocumentType(() => ({
Expand Down Expand Up @@ -98,7 +102,7 @@ export const Post = defineDocumentType(() => ({
required: true,
},
},
computedFields:defaultComputedFields
computedFields: defaultComputedFields,
}));

export const Author = defineDocumentType(() => ({
Expand All @@ -122,7 +126,7 @@ export const Author = defineDocumentType(() => ({
required: true,
},
},
computedFields:defaultComputedFields
computedFields: defaultComputedFields,
}));

export const Page = defineDocumentType(() => ({
Expand All @@ -138,7 +142,7 @@ export const Page = defineDocumentType(() => ({
type: "string",
},
},
computedFields:defaultComputedFields,
computedFields: defaultComputedFields,
}));

export default makeSource({
Expand All @@ -152,14 +156,16 @@ export default makeSource({
rehypePrettyCode,
{
theme: "github-dark",
onVisitLine(node: { children: string | any[]; }) {
onVisitLine(node: { children: string | any[] }) {
// Prevent lines from collapsing in `display: grid` mode, and allow empty
// lines to be copy/pasted
if (node.children.length === 0) {
node.children = [{ type: "text", value: " " }];
}
},
onVisitHighlightedLine(node: { properties: { className: string[]; }; }) {
onVisitHighlightedLine(node: {
properties: { className: string[] };
}) {
// node.properties.className.push("line--highlighted")

// FIX: I changed remark-gmf 4.0.0 to 3.0.1 (return a lot errors in mdx?)
Expand All @@ -172,7 +178,9 @@ export default makeSource({
node.properties.className = ["line--highlighted"];
}
},
onVisitHighlightedWord(node: { properties: { className: string[]; }; }) {
onVisitHighlightedWord(node: {
properties: { className: string[] };
}) {
node.properties.className = ["word--highlighted"];
},
},
Expand Down
2 changes: 1 addition & 1 deletion apps/nextjs/next.config.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@
import "./src/env.mjs";
import "@saasfly/auth/env.mjs";

import { withNextDevtools } from "@next-devtools/core/plugin";
// import "@saasfly/api/env"
import withMDX from "@next/mdx";
import {withNextDevtools} from "@next-devtools/core/plugin";

!process.env.SKIP_ENV_VALIDATION && (await import("./src/env.mjs"));

Expand Down
12 changes: 6 additions & 6 deletions apps/nextjs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
"@dinero.js/currencies": "2.0.0-alpha.14",
"@formatjs/intl-localematcher": "0.5.4",
"@hookform/resolvers": "3.3.4",
"@next/mdx": "14.0.4",
"@next/mdx": "14.2.3",
"@saasfly/api": "workspace:*",
"@saasfly/auth": "workspace:*",
"@saasfly/db": "workspace:*",
Expand All @@ -24,14 +24,14 @@
"@tanstack/react-query": "5.18.1",
"@tanstack/react-query-devtools": "5.18.1",
"@tanstack/react-table": "8.11.8",
"@trpc/client": "10.44.1",
"@trpc/next": "10.44.1",
"@trpc/react-query": "10.44.1",
"@trpc/server": "10.44.1",
"@trpc/client": "next",
"@trpc/next": "next",
"@trpc/react-query": "next",
"@trpc/server": "next",
"date-fns": "3.3.1",
"framer-motion": "11.0.3",
"negotiator": "0.6.3",
"next": "14.0.4",
"next": "14.2.3",
"next-themes": "0.2.1",
"react": "18.3.1",
"react-day-picker": "8.10.0",
Expand Down
2 changes: 1 addition & 1 deletion apps/nextjs/src/app/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import localFont from "next/font/local";

import "~/styles/globals.css";

import { NextDevtoolsProvider } from "@next-devtools/core";
import { Analytics } from "@vercel/analytics/react";
import { SpeedInsights } from "@vercel/speed-insights/next";

Expand All @@ -13,7 +14,6 @@ import { TailwindIndicator } from "~/components/tailwind-indicator";
import { ThemeProvider } from "~/components/theme-provider";
import { i18n } from "~/config/i18n-config";
import { siteConfig } from "~/config/site";
import {NextDevtoolsProvider} from "@next-devtools/core";

// import { Suspense } from "react";
// import { PostHogPageview } from "~/config/providers";
Expand Down
8 changes: 4 additions & 4 deletions apps/nextjs/src/components/k8s/cluster-config.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -343,11 +343,11 @@ export function ClusterConfig({ cluster, params: { lang } }: ClusterProps) {
</CardContent>
<div className="w-2/3 space-y-6 p-6 pt-0">
<Button type="submit" disabled={_isSaving}>
{_isSaving && (
<Icons.Spinner className="mr-2 h-4 w-4 animate-spin" />
)}
{_isSaving && (
<Icons.Spinner className="mr-2 h-4 w-4 animate-spin" />
)}
Submit
</Button>
</Button>
</div>
</Card>
</form>
Expand Down
10 changes: 6 additions & 4 deletions apps/nextjs/src/components/main-nav.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,11 @@ export function MainNav({ items, children, params: { lang } }: MainNavProps) {
const segment = useSelectedLayoutSegment();
const [showMobileMenu, setShowMobileMenu] = React.useState<boolean>(false);
const toggleMenu = () => {
setShowMobileMenu(!showMobileMenu)
}
setShowMobileMenu(!showMobileMenu);
};
const handleMenuItemClick = () => {
toggleMenu();
}
};
return (
<div className="flex gap-6 md:gap-10">
<Link href={`/${lang}`} className="hidden items-center space-x-2 md:flex">
Expand Down Expand Up @@ -61,7 +61,9 @@ export function MainNav({ items, children, params: { lang } }: MainNavProps) {
<span className="font-bold">Menu</span>
</button>
{showMobileMenu && items && (
<MobileNav items={items} menuItemClick={handleMenuItemClick}>{children}</MobileNav>
<MobileNav items={items} menuItemClick={handleMenuItemClick}>
{children}
</MobileNav>
)}
</div>
);
Expand Down
2 changes: 1 addition & 1 deletion apps/nextjs/src/components/mobile-nav.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ interface MobileNavProps {
menuItemClick?: () => void;
}

export function MobileNav({ items, children, menuItemClick}: MobileNavProps) {
export function MobileNav({ items, children, menuItemClick }: MobileNavProps) {
useLockBody();
return (
<div
Expand Down
44 changes: 33 additions & 11 deletions apps/nextjs/src/trpc/client.ts
Original file line number Diff line number Diff line change
@@ -1,31 +1,53 @@
import { loggerLink } from "@trpc/client";
import { experimental_createTRPCNextAppDirClient } from "@trpc/next/app-dir/client";
import { experimental_nextHttpLink } from "@trpc/next/app-dir/links/nextHttp";
import superjson from "superjson";

import type { AppRouter } from "@saasfly/api";

import { endingLink, transformer } from "./shared";
import { getUrl } from "./shared";

// export const trpc = experimental_createTRPCNextAppDirClient<AppRouter>({
// config() {
// return {
// transformer,
// links: [
// // loggerLink({
// // enabled: (opts) =>
// // process.env.NODE_ENV === "development" ||
// // (opts.direction === "down" && opts.result instanceof Error),
// // }),
// loggerLink({
// enabled: () => true,
// }),
// endingLink({
// headers: {
// "x-trpc-source": "client",
// },
// }),
// ],
// };
// },
// });
export const trpc = experimental_createTRPCNextAppDirClient<AppRouter>({
config() {
return {
transformer,
links: [
// loggerLink({
// enabled: (opts) =>
// process.env.NODE_ENV === "development" ||
// (opts.direction === "down" && opts.result instanceof Error),
// }),
loggerLink({
enabled: () => true,
}),
endingLink({
headers: {
"x-trpc-source": "client",
experimental_nextHttpLink({
transformer: superjson,
batch: true,
url: getUrl(),
headers() {
return {
"x-trpc-source": "client",
};
},
}),
],
};
},
});

export { type RouterInputs, type RouterOutputs } from "@saasfly/api";
78 changes: 56 additions & 22 deletions apps/nextjs/src/trpc/server.ts
Original file line number Diff line number Diff line change
@@ -1,42 +1,76 @@
"use server";

import "server-only";

import { cookies, headers } from "next/headers";
// "use server";
//
// import "server-only";
//
// import { cookies, headers } from "next/headers";
// import { loggerLink } from "@trpc/client";
// import { experimental_createTRPCNextAppDirServer } from "@trpc/next/app-dir/server";
//
import { cookies } from "next/headers";
//
// import { endingLink, transformer } from "./shared";
//
// export const trpc = experimental_createTRPCNextAppDirServer<AppRouter>({
// config() {
// return {
// ssr: true,
// transformer,
// links: [
// // loggerLink({
// // enabled: (opts) =>
// // process.env.NODE_ENV === "development" ||
// // (opts.direction === "down" && opts.result instanceof Error),
// // }),
// loggerLink({
// enabled: () => true,
// }),
// endingLink({
// headers: () => {
// const h = new Map(headers());
// h.delete("connection");
// h.delete("transfer-encoding");
// h.set("x-trpc-source", "server");
// h.set("cookie", cookies().toString());
// return Object.fromEntries(h.entries());
// },
// }),
// ],
// };
// },
// });
//
import { loggerLink } from "@trpc/client";
import { experimental_nextHttpLink } from "@trpc/next/app-dir/links/nextHttp";
import { experimental_createTRPCNextAppDirServer } from "@trpc/next/app-dir/server";
import superjson from "superjson";

import type { AppRouter } from "@saasfly/api";

import { endingLink, transformer } from "./shared";
import { getUrl } from "~/trpc/shared";

/**
* This client invokes procedures directly on the server without fetching over HTTP.
*/
export const trpc = experimental_createTRPCNextAppDirServer<AppRouter>({
config() {
return {
ssr: true,
transformer,
links: [
// loggerLink({
// enabled: (opts) =>
// process.env.NODE_ENV === "development" ||
// (opts.direction === "down" && opts.result instanceof Error),
// }),
loggerLink({
enabled: () => true,
}),
endingLink({
headers: () => {
const h = new Map(headers());
h.delete("connection");
h.delete("transfer-encoding");
h.set("x-trpc-source", "server");
h.set("cookie", cookies().toString());
return Object.fromEntries(h.entries());
experimental_nextHttpLink({
batch: true,
url: getUrl(),
transformer: superjson,
headers() {
return {
cookie: cookies().toString(),
"x-trpc-source": "rsc-http",
};
},
}),
],
};
},
});

export { type RouterInputs, type RouterOutputs } from "@saasfly/api";
Loading

0 comments on commit 8fc0e37

Please sign in to comment.