Bug fix on kitchen-sink example (#7624)

### Description

- moved tsup flags from `dev` script and `build` script into
`tsup.config.ts` file
- ignored `.eslintrc.js` in both `storeFront` and `api` apps
- removed unused and duplicated `style.css` in `storeFront` app
- changed `rootDir` of `admin` app to "." so that `tsconfig.json` could
include `vite.config.ts`
- changed `rootDir` of `blog` app to "." so that `tsconfig.json` could
include `server.js` and `remix.config.js`
- improved imports from react (use `import React from "react"` instead
of `import * as React from "react"` )
- included `next.config.js` in `tsconfig.json` in order to fix the
parsing error in `next.config.js`
- set `api` app to use the default `module:"ESNEXT"` as the
`moduleResolution` is set to `Bundler`
- fixed the error `@remix-run/vercel was not found` in
apps/blog/server.js
- replaced `V2MetaFunction` with `MetaFunction`
- removed `future` object that was used to enable features of version 2
of remix as the version 2 is being used
- ran `pnpm i` and updated versions of dependencies

### Testing Instructions

Running `npx create-turbo@latest -e kitchen-sink` and then `pnpm dev`
should work fine and there should be no errors.

---------

Co-authored-by: Anthony Shew <[email protected]>

Author: zsh77

examples/kitchen-sink/apps/admin/src/main.tsx

@@ -1,4 +1,4 @@
-import * as React from "react";
+import React from "react";
 import { createRoot } from "react-dom/client";
 import App from "./app";
 import "./index.css";

examples/kitchen-sink/apps/admin/tsconfig.json

@@ -2,8 +2,8 @@
   "exclude": ["node_modules"],
   "extends": "@repo/typescript-config/vite.json",
   "compilerOptions": {
-    "rootDir": "src",
+    "rootDir": ".",
     "outDir": "dist"
   },
-  "include": ["src"]
+  "include": ["src", "vite.config.ts"]
 }

examples/kitchen-sink/apps/api/tsconfig.json

@@ -2,8 +2,7 @@
   "extends": "@repo/typescript-config/base.json",
   "compilerOptions": {
     "lib": ["ES2015"],
-    "module": "CommonJS",
-    "outDir": "./dist",
+    "outDir": "./dist"
   },
   "exclude": ["node_modules"],
   "include": ["."]

examples/kitchen-sink/apps/blog/app/root.tsx

@@ -1,7 +1,4 @@
-import type {
-  V2_MetaFunction as V2MetaFunction,
-  LinksFunction,
-} from "@remix-run/node";
+import type { MetaFunction, LinksFunction } from "@remix-run/node";
 import {
   Links,
   LiveReload,
@@ -13,7 +10,7 @@ import {
 import { Analytics } from "@vercel/analytics/react";
 import styles from "./styles.css";
 
-export const meta: V2MetaFunction = () => [
+export const meta: MetaFunction = () => [
   {
     charset: "utf-8",
     title: "Blog | Kitchen Sink",

examples/kitchen-sink/apps/blog/remix.config.js

@@ -1,13 +1,5 @@
 /** @type {import('@remix-run/dev').AppConfig} */
 module.exports = {
-  future: {
-    v2_dev: true,
-    v2_errorBoundary: true,
-    v2_headers: true,
-    v2_meta: true,
-    v2_normalizeFormMethod: true,
-    v2_routeConvention: true,
-  },
   ignoredRouteFiles: ["**/.*"],
   serverModuleFormat: "cjs",
   // appDirectory: "app",

examples/kitchen-sink/apps/blog/server.js

@@ -1,4 +1,4 @@
-import { createRequestHandler } from "@remix-run/vercel";
+import { createRequestHandler } from "@remix-run/server-runtime";
 import * as build from "@remix-run/dev/server-build";
 
 export default createRequestHandler({ build, mode: process.env.NODE_ENV });

examples/kitchen-sink/apps/blog/tsconfig.json

@@ -1,12 +1,18 @@
 {
-  "exclude": ["node_modules", "build"],
   "extends": "@repo/typescript-config/remix.json",
   "compilerOptions": {
-    "rootDir": "app",
+    "rootDir": ".",
     "outDir": "dist",
     "paths": {
       "~/*": ["./app/*"]
-    },
+    }
   },
-  "include": ["remix.env.d.ts", "**/*.ts", "**/*.tsx"],
+  "include": [
+    "remix.env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    "server.js",
+    "remix.config.js"
+  ],
+  "exclude": ["node_modules", "build"]
 }

examples/kitchen-sink/apps/storefront/src/styles.css

@@ -9,5 +9,5 @@
       }
     ]
   },
-  "include": ["src", "next-env.d.ts", ".next/types/**/*.ts"]
+  "include": ["src", "next.config.js", "next-env.d.ts", ".next/types/**/*.ts"]
 }

examples/kitchen-sink/apps/storefront/tsconfig.json

@@ -17,4 +17,4 @@
   "engines": {
     "node": ">=18"
   }
-}
+}

examples/kitchen-sink/package.json

@@ -35,7 +35,7 @@ module.exports = {
       },
     },
   },
-  ignorePatterns: ["node_modules/", "dist/"],
+  ignorePatterns: [".*.js", "node_modules/", "dist/"],
   // add rules configurations here
   rules: {
     "import/no-default-export": "off",

examples/kitchen-sink/packages/config-eslint/next.js

@@ -39,7 +39,7 @@ module.exports = {
       },
     },
   ],
-  ignorePatterns: ["node_modules/", "dist/"],
+  ignorePatterns: [".*.js", "node_modules/", "dist/"],
   // add rules configurations here
   rules: {
     "import/no-default-export": "off",

examples/kitchen-sink/packages/config-eslint/server.js

@@ -11,9 +11,9 @@
     "dist/**"
   ],
   "scripts": {
-    "build": "tsup src/index.tsx --format esm,cjs --dts --external react",
+    "build": "tsup",
     "clean": "rm -rf dist",
-    "dev": "tsup src/index.tsx --format esm,cjs --watch --dts --external react",
+    "dev": "tsup --watch",
     "typecheck": "tsc --noEmit",
     "lint": "eslint src/",
     "test": "jest"

examples/kitchen-sink/packages/ui/package.json

@@ -1,6 +1,10 @@
 import { defineConfig, type Options } from "tsup";
 
 export default defineConfig((options: Options) => ({
+  entry: ["./src/index.tsx"],
+  format: ["cjs", "esm"],
+  dts: true,
+  external: ["react"],
   banner: {
     js: "'use client'",
   },