fix: missing default font in pagesDir (t3-oss#1778)

.changeset/eight-balloons-whisper.md

@@ -0,0 +1,5 @@
+---
+"create-t3-app": patch
+---
+
+fix: add missing default font in pagesDir

cli/src/helpers/selectBoilerplate.ts

@@ -14,16 +14,25 @@ export const selectAppFile = ({
 }: SelectBoilerplateProps) => {
  const appFileDir = path.join(PKG_ROOT, "template/extras/src/pages/_app");
 
+ const usingTw = packages.tailwind.inUse;
  const usingTRPC = packages.trpc.inUse;
  const usingNextAuth = packages.nextAuth.inUse;
 
  let appFile = "base.tsx";
- if (usingNextAuth && usingTRPC) {
+ if (usingTRPC && usingTw && usingNextAuth) {
+ appFile = "with-auth-trpc-tw.tsx";
+ } else if (usingTRPC && !usingTw && usingNextAuth) {
  appFile = "with-auth-trpc.tsx";
- } else if (usingNextAuth && !usingTRPC) {
- appFile = "with-auth.tsx";
- } else if (!usingNextAuth && usingTRPC) {
+ } else if (usingTRPC && usingTw) {
+ appFile = "with-trpc-tw.tsx";
+ } else if (usingTRPC && !usingTw) {
  appFile = "with-trpc.tsx";
+ } else if (!usingTRPC && usingTw) {
+ appFile = "with-tw.tsx";
+ } else if (usingNextAuth && usingTw) {
+ appFile = "with-auth-tw.tsx";
+ } else if (usingNextAuth && !usingTw) {
+ appFile = "with-auth.tsx";
  }
 
  const appSrc = path.join(appFileDir, appFile);

cli/template/extras/src/pages/_app/base.tsx

@@ -1,9 +1,18 @@
 import { type AppType } from "next/dist/shared/lib/utils";
+import { Inter } from "next/font/google";
 
 import "~/styles/globals.css";
 
+const inter = Inter({
+ subsets: ["latin"],
+});
+
 const MyApp: AppType = ({ Component, pageProps }) => {
- return <Component {...pageProps} />;
+ return (
+ <main className={inter.className}>
+ <Component {...pageProps} />
+ </main>
+ );
 };
 
 export default MyApp;

cli/template/extras/src/pages/_app/with-auth-trpc-tw.tsx

@@ -0,0 +1,28 @@
+import { type Session } from "next-auth";
+import { SessionProvider } from "next-auth/react";
+import { type AppType } from "next/app";
+import { Inter } from "next/font/google";
+
+import { api } from "~/utils/api";
+
+import "~/styles/globals.css";
+
+const inter = Inter({
+ subsets: ["latin"],
+ variable: "--font-sans",
+});
+
+const MyApp: AppType<{ session: Session | null }> = ({
+ Component,
+ pageProps: { session, ...pageProps },
+}) => {
+ return (
+ <SessionProvider session={session}>
+ <main className={`font-sans ${inter.variable}`}>
+ <Component {...pageProps} />
+ </main>
+ </SessionProvider>
+ );
+};
+
+export default api.withTRPC(MyApp);

cli/template/extras/src/pages/_app/with-auth-trpc.tsx

@@ -1,18 +1,25 @@
 import { type Session } from "next-auth";
 import { SessionProvider } from "next-auth/react";
 import { type AppType } from "next/app";
+import { Inter } from "next/font/google";
 
 import { api } from "~/utils/api";
 
 import "~/styles/globals.css";
 
+const inter = Inter({
+ subsets: ["latin"],
+});
+
 const MyApp: AppType<{ session: Session | null }> = ({
  Component,
  pageProps: { session, ...pageProps },
 }) => {
  return (
  <SessionProvider session={session}>
- <Component {...pageProps} />
+ <main className={inter.className}>
+ <Component {...pageProps} />
+ </main>
  </SessionProvider>
  );
 };

cli/template/extras/src/pages/_app/with-auth-tw.tsx

@@ -0,0 +1,26 @@
+import { type Session } from "next-auth";
+import { SessionProvider } from "next-auth/react";
+import { type AppType } from "next/app";
+import { Inter } from "next/font/google";
+
+import "~/styles/globals.css";
+
+const inter = Inter({
+ subsets: ["latin"],
+ variable: "--font-sans",
+});
+
+const MyApp: AppType<{ session: Session | null }> = ({
+ Component,
+ pageProps: { session, ...pageProps },
+}) => {
+ return (
+ <SessionProvider session={session}>
+ <main className={`font-sans ${inter.variable}`}>
+ <Component {...pageProps} />
+ </main>
+ </SessionProvider>
+ );
+};
+
+export default MyApp;

cli/template/extras/src/pages/_app/with-auth.tsx

@@ -1,16 +1,23 @@
 import { type Session } from "next-auth";
 import { SessionProvider } from "next-auth/react";
 import { type AppType } from "next/app";
+import { Inter } from "next/font/google";
 
 import "~/styles/globals.css";
 
+const inter = Inter({
+ subsets: ["latin"],
+});
+
 const MyApp: AppType<{ session: Session | null }> = ({
  Component,
  pageProps: { session, ...pageProps },
 }) => {
  return (
  <SessionProvider session={session}>
- <Component {...pageProps} />
+ <main className={inter.className}>
+ <Component {...pageProps} />
+ </main>
  </SessionProvider>
  );
 };

cli/template/extras/src/pages/_app/with-trpc-tw.tsx

@@ -0,0 +1,20 @@
+import { type AppType } from "next/app";
+import { Inter } from "next/font/google";
+
+import { api } from "~/utils/api";
+
+import "~/styles/globals.css";
+
+const inter = Inter({
+ subsets: ["latin"],
+ variable: "--font-sans",
+});
+const MyApp: AppType = ({ Component, pageProps }) => {
+ return (
+ <main className={`font-sans ${inter.variable}`}>
+ <Component {...pageProps} />
+ </main>
+ );
+};
+
+export default api.withTRPC(MyApp);

cli/template/extras/src/pages/_app/with-trpc.tsx

@@ -1,11 +1,20 @@
 import { type AppType } from "next/app";
+import { Inter } from "next/font/google";
 
 import { api } from "~/utils/api";
 
 import "~/styles/globals.css";
 
+const inter = Inter({
+ subsets: ["latin"],
+});
+
 const MyApp: AppType = ({ Component, pageProps }) => {
- return <Component {...pageProps} />;
+ return (
+ <main className={inter.className}>
+ <Component {...pageProps} />
+ </main>
+ );
 };
 
 export default api.withTRPC(MyApp);

cli/template/extras/src/pages/_app/with-tw.tsx

@@ -0,0 +1,19 @@
+import { type AppType } from "next/app";
+import { Inter } from "next/font/google";
+
+import "~/styles/globals.css";
+
+const inter = Inter({
+ subsets: ["latin"],
+ variable: "--font-sans",
+});
+
+const MyApp: AppType = ({ Component, pageProps }) => {
+ return (
+ <main className={`font-sans ${inter.variable}`}>
+ <Component {...pageProps} />
+ </main>
+ );
+};
+
+export default MyApp;