refactor(*): extract ui and log from shared

xiaosen7 · Jul 30, 2024 · e233a6c · e233a6c
1 parent 5ef239b
commit e233a6c
Show file tree

Hide file tree

Showing 164 changed files with 804 additions and 576 deletions.
diff --git a/.eslintignore b/.eslintignore
@@ -1,6 +1,6 @@
 .next
 public
-esm
+**/esm
 dist
 .turbo
 .rollup.cache

diff --git a/README.md b/README.md
@@ -91,3 +91,4 @@ pnpm turbo compile:watch
 - [blitz](https://github.com/blitz-js/blitz/tree/main)
 - [Next-js-Boilerplate](https://github.com/ixartz/Next-js-Boilerplate/tree/main)
 - [create-t3-app](https://github.com/t3-oss/create-t3-app/blob/main/.github/workflows/ci.yml)
+- [nextjs-monorepo-example](https://github.com/belgattitude/nextjs-monorepo-example)
diff --git a/apps/large-file-upload/package.json b/apps/large-file-upload/package.json
@@ -12,9 +12,11 @@
   },
   "dependencies": {
     "@esbuild-plugins/tsconfig-paths": "^0.1.2",
+    "@npcs/log": "workspace:^",
     "@npcs/next-config": "workspace:^",
     "@npcs/playwright-config": "workspace:^",
     "@npcs/tailwind-config": "workspace:^",
+    "@npcs/ui": "workspace:^",
     "@npcs/upload": "workspace:*",
     "@prisma/client": "^5.16.2",
     "@radix-ui/react-icons": "^1.3.0",
@@ -65,7 +67,7 @@
     "@npcs/vitest-config": "workspace:^",
     "@testing-library/react": "^16.0.0",
     "@types/multistream": "^4.1.3",
-    "@types/node": "^20.14.10",
+    "@types/node": "*",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "@types/spark-md5": "^3.0.4",

diff --git a/apps/large-file-upload/src/app/globals.css b/apps/large-file-upload/src/app/globals.css
@@ -1,3 +1,5 @@
+@import url("@npcs/upload/styles.css");
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;

diff --git a/apps/large-file-upload/src/app/page.tsx b/apps/large-file-upload/src/app/page.tsx
@@ -4,7 +4,6 @@ import {
   startWebsocketServer,
   Upload,
 } from "@npcs/upload";
-import "@npcs/upload/styles.css";
 import path from "path";
 
 configuration.set({

diff --git a/apps/notes/package.json b/apps/notes/package.json
@@ -23,11 +23,12 @@
     "@clerk/nextjs": "^5.2.6",
     "@clerk/themes": "^2.1.12",
     "@faker-js/faker": "^8.4.1",
+    "@npcs/log": "workspace:^",
     "@npcs/next-config": "workspace:^",
     "@npcs/playwright-config": "workspace:^",
-    "@npcs/shared": "workspace:^",
     "@npcs/tailwind-config": "workspace:^",
     "@npcs/theme": "workspace:^",
+    "@npcs/ui": "workspace:^",
     "@prisma/client": "^5.16.2",
     "ahooks": "^3.8.0",
     "class-variance-authority": "^0.7.0",
@@ -55,7 +56,7 @@
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^16.0.0",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^20.14.10",
+    "@types/node": "*",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "dotenv": "^16.4.5",

diff --git a/apps/notes/src/app/(home)/page.tsx b/apps/notes/src/app/(home)/page.tsx
@@ -7,7 +7,7 @@ import { ImageFirstNote } from "@libs/components/image/first-note";
 import { InfoButton } from "@libs/components/info";
 import { HeaderLayout } from "@libs/components/layout/header";
 import { prisma } from "@libs/prisma/client";
-import { IPageProps } from "@npcs/shared/react-helpers";
+import { IPageProps } from "@npcs/ui";
 import Link from "next/link";
 import React from "react";
 

diff --git a/apps/notes/src/app/add/page.tsx b/apps/notes/src/app/add/page.tsx
@@ -4,7 +4,7 @@ import { NoteEdit } from "@libs/components/edit/edit";
 import { ENoteEditMode } from "@libs/components/edit/types";
 import { INoteValidationInfer } from "@libs/components/edit/validation";
 import { prisma } from "@libs/prisma/client";
-import { IPageProps } from "@npcs/shared/react-helpers";
+import { IPageProps } from "@npcs/ui";
 import { redirect } from "next/navigation";
 import React from "react";
 

diff --git a/apps/notes/src/app/globals.css b/apps/notes/src/app/globals.css
@@ -1,4 +1,4 @@
-@import url("@npcs/shared/styles.css");
+@import url("@npcs/ui/styles.css");
 @import url("@npcs/theme/styles.css");
 @import url("@libs/theme/variables.css");
 

diff --git a/apps/notes/src/app/layout.tsx b/apps/notes/src/app/layout.tsx
@@ -2,7 +2,7 @@ import { ClerkProvider } from "@clerk/nextjs";
 import { dark } from "@clerk/themes";
 import { createUserIfNeeded } from "@libs/actions/user";
 import { SyncElementClass } from "@libs/theme";
-import { cn } from "@npcs/shared/jsx";
+import { cn } from "@npcs/ui";
 import type { Metadata } from "next";
 import { Nunito } from "next/font/google";
 import "./globals.css";

diff --git a/apps/notes/src/app/search/page.tsx b/apps/notes/src/app/search/page.tsx
@@ -4,7 +4,7 @@ import { InputSearch } from "@libs/components/input/search";
 import { HeaderLayout } from "@libs/components/layout/header";
 import { prisma } from "@libs/prisma/client";
 import { Back } from "@libs/router/back";
-import { IPageProps } from "@npcs/shared/react-helpers";
+import { IPageProps } from "@npcs/ui";
 import React from "react";
 
 export const dynamic = "force-dynamic";

diff --git a/apps/notes/src/app/view/[id]/page.tsx b/apps/notes/src/app/view/[id]/page.tsx
@@ -2,7 +2,7 @@ import { NoteEdit } from "@libs/components/edit/edit";
 import { ENoteEditMode } from "@libs/components/edit/types";
 import { INoteValidationInfer } from "@libs/components/edit/validation";
 import { prisma } from "@libs/prisma/client";
-import { IPageProps } from "@npcs/shared/react-helpers";
+import { IPageProps } from "@npcs/ui";
 import { redirect } from "next/navigation";
 import React from "react";
 

diff --git a/apps/notes/src/libs/actions/user.ts b/apps/notes/src/libs/actions/user.ts
@@ -2,7 +2,7 @@
 
 import { currentUser } from "@clerk/nextjs/server";
 import { prisma } from "@libs/prisma/client";
-import { createLog } from "@npcs/shared/log";
+import { createLog } from "@npcs/log";
 
 const log = createLog("user actions");
 

diff --git a/apps/notes/src/libs/components/button/float.tsx b/apps/notes/src/libs/components/button/float.tsx
@@ -1,4 +1,4 @@
-import { mp } from "@npcs/shared/react-helpers";
+import { mp } from "@npcs/ui";
 import React from "react";
 
 export interface IFloatButtonProps extends React.ComponentProps<"div"> {

diff --git a/apps/notes/src/libs/components/button/icon.tsx b/apps/notes/src/libs/components/button/icon.tsx
@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import { cn, mp } from "@npcs/shared/react-helpers";
+import { cn, mp } from "@npcs/ui";
 
 export interface IIconButtonProps extends React.ComponentProps<"button"> {
   children: React.ReactNode;

diff --git a/apps/notes/src/libs/components/card/index.tsx b/apps/notes/src/libs/components/card/index.tsx
@@ -5,8 +5,10 @@ import {
   Carousel,
   CarouselContent,
   CarouselItem,
-} from "@npcs/shared/components/carousel.js";
-import { cn, IComponentBaseProps, mp } from "@npcs/shared/react-helpers";
+  cn,
+  IComponentBaseProps,
+  mp,
+} from "@npcs/ui";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import React from "react";

diff --git a/apps/notes/src/libs/components/edit/edit.tsx b/apps/notes/src/libs/components/edit/edit.tsx
@@ -12,9 +12,9 @@ import {
   FormControl,
   FormField,
   FormItem,
-} from "@npcs/shared/components";
-import { useForm } from "@npcs/shared/hooks/form";
-import { useRouter } from "@npcs/shared/router/hooks/index.js";
+  useForm,
+  useRouter,
+} from "@npcs/ui";
 import { useControllableValue, useRequest } from "ahooks";
 import React from "react";
 import { HeaderLayout } from "../layout/header";

diff --git a/apps/notes/src/libs/components/edit/save-button.tsx b/apps/notes/src/libs/components/edit/save-button.tsx
@@ -1,10 +1,6 @@
 import { ButtonIcon, IIconButtonProps } from "@libs/components/button/icon";
 import { IconSave } from "@libs/components/icon/save";
-import {
-  Dialog,
-  DialogContent,
-  DialogTrigger,
-} from "@npcs/shared/components/dialog.js";
+import { Dialog, DialogContent, DialogTrigger } from "@npcs/ui";
 import { Button } from "../button/button";
 import { IconWarn } from "../icon/warn";
 

diff --git a/apps/notes/src/libs/components/image/__create__.tsx b/apps/notes/src/libs/components/image/__create__.tsx
@@ -1,6 +1,6 @@
 /* eslint-disable jsx-a11y/alt-text */
 
-import { cn, mp } from "@npcs/shared/react-helpers";
+import { cn, mp } from "@npcs/ui";
 import Image, { ImageProps } from "next/image";
 import React from "react";
 

diff --git a/apps/notes/src/libs/components/info/index.tsx b/apps/notes/src/libs/components/info/index.tsx
@@ -1,8 +1,7 @@
 import { ButtonIcon } from "@libs/components/button/icon";
 import { IconInfo } from "@libs/components/icon/info";
 import { REPO } from "@libs/constants/repo";
-import { IComponentBaseProps } from "@npcs/shared/component-type";
-import { mp } from "@npcs/shared/react-helpers";
+import { IComponentBaseProps, mp } from "@npcs/ui";
 import Link from "next/link";
 import React from "react";
 

diff --git a/apps/notes/src/libs/components/input/content.tsx b/apps/notes/src/libs/components/input/content.tsx
@@ -1,5 +1,5 @@
 "use client";
-import { mp } from "@npcs/shared/react-helpers";
+import { mp } from "@npcs/ui";
 import { useControllableValue } from "ahooks";
 import React, { ComponentProps } from "react";
 

diff --git a/apps/notes/src/libs/components/input/search.tsx b/apps/notes/src/libs/components/input/search.tsx
@@ -1,9 +1,7 @@
 "use client";
 
 import { IconClose } from "@libs/components/icon/close";
-import { IComponentBaseProps } from "@npcs/shared/component-type";
-import { mp } from "@npcs/shared/jsx";
-import { useRouter } from "@npcs/shared/router/hooks/index.js";
+import { IComponentBaseProps, mp, useRouter } from "@npcs/ui";
 import { useControllableValue, useDebounceEffect } from "ahooks";
 import { omit } from "lodash-es";
 import React, { ComponentProps, useTransition } from "react";

diff --git a/apps/notes/src/libs/components/input/title.tsx b/apps/notes/src/libs/components/input/title.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { cn, mp } from "@npcs/shared/react-helpers";
+import { cn, mp } from "@npcs/ui";
 import { useControllableValue } from "ahooks";
 import React, { ComponentProps } from "react";
 

diff --git a/apps/notes/src/libs/components/layout/default.tsx b/apps/notes/src/libs/components/layout/default.tsx
@@ -1,4 +1,4 @@
-import { IComponentBaseProps, mp } from "@npcs/shared/react-helpers";
+import { IComponentBaseProps, mp } from "@npcs/ui";
 import React from "react";
 
 export interface IDefaultLayoutProps extends IComponentBaseProps {

diff --git a/apps/notes/src/libs/components/layout/header.tsx b/apps/notes/src/libs/components/layout/header.tsx
@@ -1,4 +1,4 @@
-import { cn, IComponentBaseProps, mp } from "@npcs/shared/react-helpers";
+import { cn, IComponentBaseProps, mp } from "@npcs/ui";
 import React from "react";
 
 export interface IHeaderLayoutProps extends IComponentBaseProps {

diff --git a/apps/notes/src/libs/components/layout/sidebar.tsx b/apps/notes/src/libs/components/layout/sidebar.tsx
@@ -1,4 +1,4 @@
-import { IComponentBaseProps, mp } from "@npcs/shared/react-helpers";
+import { IComponentBaseProps, mp } from "@npcs/ui";
 import React from "react";
 
 export interface ISidebarProps extends IComponentBaseProps {}

diff --git a/apps/notes/src/libs/router/back.tsx b/apps/notes/src/libs/router/back.tsx
@@ -2,7 +2,7 @@
 
 import { ButtonIcon } from "@libs/components/button/icon";
 import { IconBack } from "@libs/components/icon/back";
-import { IComponentBaseProps, mp } from "@npcs/shared/react-helpers";
+import { IComponentBaseProps, mp } from "@npcs/ui";
 import { useRouter } from "next/navigation";
 import React from "react";
 

diff --git a/apps/notes/src/stories/utils.ts b/apps/notes/src/stories/utils.ts
@@ -1,3 +1,3 @@
-import { createLog } from "@npcs/shared/log";
+import { createLog } from "@npcs/log";
 
 export const storyLog = createLog("story");
diff --git a/apps/stackoverflow/package.json b/apps/stackoverflow/package.json
@@ -23,11 +23,12 @@
     "@clerk/nextjs": "^5.2.6",
     "@faker-js/faker": "^8.4.1",
     "@hookform/resolvers": "^3.9.0",
+    "@npcs/log": "workspace:^",
     "@npcs/next-config": "workspace:^",
     "@npcs/playwright-config": "workspace:^",
-    "@npcs/shared": "workspace:^",
     "@npcs/storybook-config": "workspace:^",
     "@npcs/tailwind-config": "workspace:^",
+    "@npcs/ui": "workspace:^",
     "@prisma/client": "^5.16.2",
     "@radix-ui/react-dialog": "^1.1.1",
     "@radix-ui/react-label": "^2.1.0",
@@ -85,7 +86,7 @@
     "@tailwindcss/typography": "^0.5.13",
     "@testing-library/react": "^16.0.0",
     "@types/jsdom": "^21.1.7",
-    "@types/node": "^20.14.10",
+    "@types/node": "*",
     "@types/prismjs": "^1.26.4",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",

diff --git a/apps/stackoverflow/prisma/seed.ts b/apps/stackoverflow/prisma/seed.ts
@@ -1,7 +1,7 @@
 import { mock } from "@/mock";
 import { prisma } from "@/prisma";
 import { IQuestion, IUser } from "@/shared";
-import { createLog } from "@npcs/shared/log";
+import { createLog } from "@npcs/log";
 import { random } from "lodash-es";
 import { createLogUpdate } from "log-update";
 import os from "node:os";

diff --git a/apps/stackoverflow/src/app/(root)/profile/[id]/page.tsx b/apps/stackoverflow/src/app/(root)/profile/[id]/page.tsx
@@ -6,7 +6,7 @@ import {
   ProfileStats,
   ProfileTopQuestionCard,
 } from "@/profile";
-import { ESearchParamKey } from "@/search-params";
+import { ESearchParamKey, ISearchParams } from "@/search-params";
 import {
   IPageProps,
   PagePagination,
@@ -17,10 +17,9 @@ import {
 } from "@/shared";
 import React from "react";
 
-const ProFileDetailPage: React.FC<IPageProps<{ id: string }>> = async ({
-  params: { id },
-  searchParams,
-}) => {
+const ProFileDetailPage: React.FC<
+  IPageProps<{ id: string }, ISearchParams>
+> = async ({ params: { id }, searchParams }) => {
   const profileUser = await prisma.user.findUniqueOrThrow({
     where: {
       id,

diff --git a/apps/stackoverflow/src/app/(root)/question/[id]/page.tsx b/apps/stackoverflow/src/app/(root)/question/[id]/page.tsx
@@ -9,6 +9,7 @@ import {
   QuestionMetrics,
   QuestionTitle,
 } from "@/question";
+import { ISearchParams } from "@/search-params";
 import {
   DownVote,
   EditAndDelete,
@@ -25,7 +26,8 @@ import { UserAvatar } from "@/user";
 import { NextPage } from "next";
 import { redirect } from "next/navigation";
 
-export interface IQuestionDetailPageProps extends IPageProps<{ id: string }> {}
+interface IQuestionDetailPageProps
+  extends IPageProps<{ id: string }, ISearchParams> {}
 
 const QuestionDetailPage: NextPage<IQuestionDetailPageProps> = async (
   props,

diff --git a/apps/stackoverflow/src/app/globals.css b/apps/stackoverflow/src/app/globals.css
@@ -1,4 +1,4 @@
-@import url("@npcs/shared/styles.css");
+@import url("@npcs/ui/styles.css");
 @import url("@/theme/styles/index.css");
 
 @tailwind base;

diff --git a/apps/stackoverflow/src/libs/shared/components/filter.tsx b/apps/stackoverflow/src/libs/shared/components/filter.tsx
@@ -4,15 +4,15 @@ import { Prisma } from ".prisma/client";
 import { ESearchParamKey } from "@/search-params";
 import { useMemoizedFn } from "ahooks";
 import React from "react";
-import { useNextRouter } from "../hooks";
-import { IComponentBaseProps } from "../types";
 import {
   Button,
+  IComponentBaseProps,
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue,
+  useRouter,
 } from "../ui";
 import { cn, getModelFilterOptions, getUrl, mp } from "../utils";
 
@@ -32,7 +32,7 @@ export interface IFilterOption {
 
 export const Filter: React.FC<IFilterProps> = (props) => {
   const { variant = "default" } = props;
-  const { searchParams, router } = useNextRouter();
+  const { searchParams, router } = useRouter();
 
   const filter = searchParams.get(ESearchParamKey.Filter) ?? undefined;
 

diff --git a/apps/stackoverflow/src/libs/shared/components/form.tsx b/apps/stackoverflow/src/libs/shared/components/form.tsx
@@ -6,8 +6,7 @@ import { capitalize, lowerCase } from "lodash-es";
 import { ControllerRenderProps, FieldValues, Path } from "react-hook-form";
 import { z } from "zod";
 import { EFormTopic, EFormType } from "../constants";
-import { useForm } from "../hooks";
-import { IComponentBaseProps, ISafeAny } from "../types";
+import { ISafeAny } from "../types";
 import {
   Button,
   FormControl,
@@ -17,8 +16,10 @@ import {
   FormLabel,
   FormMessage,
   Form as FormUI,
+  IComponentBaseProps,
   Input,
   toast,
+  useForm,
 } from "../ui";
 import { cn, mp, removeNilKeys } from "../utils";
 

diff --git a/apps/stackoverflow/src/libs/shared/components/git-log.tsx b/apps/stackoverflow/src/libs/shared/components/git-log.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import React from "react";
-import { IComponentBaseProps } from "../types";
+import { IComponentBaseProps } from "../ui";
 import { mp } from "../utils";
 
 export interface IGitLogProps extends IComponentBaseProps {}
-Original file line number
+Diff line change
@@ -1,6 +1,6 @@
     .next
     public
-    esm
+    **/esm
     dist
     .turbo
     .rollup.cache
@@ Expand Down @@