diff --git a/README.md b/README.md index fabac0f..e30c48f 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ A community-driven platform for bloggers to improve their skills and connect with like-minded individuals -## :construction: Status :construction: +## :construction: Status BlogHive is currently _early_ in the development cycle. This app is not yet functional but is being actively developed. Please "watch" the project and leave a star and help us build this platform. @@ -39,8 +39,12 @@ not yet functional but is being actively developed. Please "watch" the project a │ │ ├── README.md │ │ ├── src │ │ │ ├── components -│ │ │ │ ├── Footer.tsx -│ │ │ │ └── Header.tsx +│ │ │ │ ├── atoms +│ │ │ │ │ └─── ... +│ │ │ │ ├── molecules +│ │ │ │ │ └─── ... +│ │ │ │ └── organisms +│ │ │ │ └─── ... │ │ │ ├── pages │ │ │ │ ├── _app.tsx │ │ │ │ └── index.tsx @@ -69,11 +73,6 @@ not yet functional but is being actively developed. Please "watch" the project a ├── LICENSE ├── package.json ├── packages -│ ├── atoms -│ │ ├── Button.tsx -│ │ ├── index.tsx -│ │ ├── package.json -│ │ └── tsconfig.json │ ├── eslint-config-custom │ │ ├── eslint-next.js │ │ ├── eslint-server.js diff --git a/apps/client/next.config.js b/apps/client/next.config.js index 16964ea..da1bb77 100644 --- a/apps/client/next.config.js +++ b/apps/client/next.config.js @@ -1,5 +1,3 @@ -const withTM = require("next-transpile-modules")(["atoms"]); - -module.exports = withTM({ +module.exports = { reactStrictMode: true, -}); +}; diff --git a/apps/client/package.json b/apps/client/package.json index 5b27af7..e74dd0f 100644 --- a/apps/client/package.json +++ b/apps/client/package.json @@ -12,10 +12,12 @@ "format": "prettier --write **/*.{js,ts,tsx,css,md,json,yml,yaml}" }, "dependencies": { + "class-variance-authority": "^0.4.0", + "clsx": "^1.2.1", "next": "13.1.1", "react": "18.2.0", "react-dom": "18.2.0", - "atoms": "workspace:*" + "tailwind-merge": "^1.9.1" }, "devDependencies": { "@types/node": "^18.0.0", @@ -23,7 +25,6 @@ "autoprefixer": "^10.4.13", "eslint": "8.30.0", "eslint-config-custom": "workspace:*", - "next-transpile-modules": "10.0.0", "postcss": "^8.4.20", "prettier": "^2.7.1", "prettier-config-custom": "workspace:*", diff --git a/apps/client/src/components/Header.tsx b/apps/client/src/components/Header.tsx deleted file mode 100644 index a7b6c84..0000000 --- a/apps/client/src/components/Header.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import { Button } from 'atoms'; -import Image from 'next/image'; -import Link from 'next/link'; -import React from 'react'; - -import logoTextBlack from '@/public/logo-text-black.png'; - -const Header = () => ( -
- - Logo - - -
-); - -export default Header; diff --git a/apps/client/src/components/Footer.tsx b/apps/client/src/components/footer.tsx similarity index 100% rename from apps/client/src/components/Footer.tsx rename to apps/client/src/components/footer.tsx diff --git a/apps/client/src/components/header.tsx b/apps/client/src/components/header.tsx new file mode 100644 index 0000000..6e05ab2 --- /dev/null +++ b/apps/client/src/components/header.tsx @@ -0,0 +1,20 @@ +import Image from 'next/image'; +import Link from 'next/link'; +import React from 'react'; + +import { Button } from '@/components/ui/button'; + +import logoTextBlack from '@/public/logo-text-black.png'; + +const Header = () => ( +
+
+ + Logo + + +
+
+); + +export default Header; diff --git a/apps/client/src/components/ui/button.tsx b/apps/client/src/components/ui/button.tsx new file mode 100644 index 0000000..e0860fa --- /dev/null +++ b/apps/client/src/components/ui/button.tsx @@ -0,0 +1,55 @@ +import * as React from "react" +import { VariantProps, cva } from "class-variance-authority" + +import { cn } from '@/lib/utils' + +const buttonVariants = cva( + "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 dark:hover:bg-slate-800 dark:hover:text-slate-100 disabled:opacity-50 dark:focus:ring-slate-400 disabled:pointer-events-none dark:focus:ring-offset-slate-900 data-[state=open]:bg-slate-100 dark:data-[state=open]:bg-slate-800", + { + variants: { + variant: { + default: + "bg-slate-900 text-white hover:bg-slate-700 dark:bg-slate-50 dark:text-slate-900", + primary: + "bg-blue-500 text-white hover:bg-blue-600 dark:bg-slate-50 dark:text-slate-900", + destructive: + "bg-red-500 text-white hover:bg-red-600 dark:hover:bg-red-600", + outline: + "bg-transparent border border-slate-200 hover:bg-slate-100 dark:border-slate-700 dark:text-slate-100", + subtle: + "bg-slate-100 text-slate-900 hover:bg-slate-200 dark:bg-slate-700 dark:text-slate-100", + ghost: + "bg-transparent hover:bg-slate-100 dark:hover:bg-slate-800 dark:text-slate-100 dark:hover:text-slate-100 data-[state=open]:bg-transparent dark:data-[state=open]:bg-transparent", + link: "bg-transparent underline-offset-4 hover:underline text-slate-900 dark:text-slate-100 hover:bg-transparent dark:hover:bg-transparent", + }, + size: { + default: "h-10 py-2 px-4", + sm: "h-9 px-2 rounded-md", + lg: "h-11 px-8 rounded-md", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + } +) + +export interface ButtonProps + extends React.ButtonHTMLAttributes, + VariantProps {} + +const Button = React.forwardRef( + ({ className, variant, size, ...props }, ref) => { + return ( + ; -}; diff --git a/packages/atoms/index.tsx b/packages/atoms/index.tsx deleted file mode 100644 index 916730e..0000000 --- a/packages/atoms/index.tsx +++ /dev/null @@ -1,2 +0,0 @@ -import * as React from "react"; -export * from "./Button"; diff --git a/packages/atoms/package.json b/packages/atoms/package.json deleted file mode 100644 index a222845..0000000 --- a/packages/atoms/package.json +++ /dev/null @@ -1,22 +0,0 @@ -{ - "name": "atoms", - "version": "0.0.0", - "main": "./index.tsx", - "types": "./index.tsx", - "license": "MIT", - "scripts": { - "lint": "eslint *.ts*" - }, - "devDependencies": { - "@types/react": "^18.0.0", - "@types/react-dom": "^18.0.0", - "eslint": "^8.0.0", - "eslint-config-custom": "workspace:*", - "react": "^18.0.0", - "tsconfig": "workspace:*", - "typescript": "^4.5.2" - }, - "dependencies": { - "clsx": "^1.2.1" - } -} diff --git a/packages/atoms/tsconfig.json b/packages/atoms/tsconfig.json deleted file mode 100644 index 945987d..0000000 --- a/packages/atoms/tsconfig.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "extends": "tsconfig/nextjs.json", - "include": ["."], - "exclude": ["dist", "build", "node_modules"] -} diff --git a/packages/eslint-config-custom/eslint-next.js b/packages/eslint-config-custom/eslint-next.js index 18a462d..abb7a33 100644 --- a/packages/eslint-config-custom/eslint-next.js +++ b/packages/eslint-config-custom/eslint-next.js @@ -81,6 +81,11 @@ module.exports = { "prefer-spread": "error", "prefer-template": "error", "quotes": ["error", "single"], + "react/button-has-type": [true, { + "button": true, + "submit": true, + "reset": false + }], "react/function-component-definition": "off", "react/prop-types": "off", "react/jsx-props-no-spreading": "off", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3d0b215..230f8d0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -32,33 +32,35 @@ importers: specifiers: '@types/node': ^18.0.0 '@types/react': 18.0.26 - atoms: workspace:* autoprefixer: ^10.4.13 + class-variance-authority: ^0.4.0 + clsx: ^1.2.1 eslint: 8.30.0 eslint-config-custom: workspace:* next: 13.1.1 - next-transpile-modules: 10.0.0 postcss: ^8.4.20 prettier: ^2.7.1 prettier-config-custom: workspace:* prettier-plugin-tailwindcss: ^0.1.13 react: 18.2.0 react-dom: 18.2.0 + tailwind-merge: ^1.9.1 tailwindcss: ^3.2.4 tsconfig: workspace:* typescript: ^4.5.3 dependencies: - atoms: link:../../packages/atoms + class-variance-authority: 0.4.0_typescript@4.8.4 + clsx: 1.2.1 next: 13.1.1_biqbaboplfbrettd7655fr4n2y react: 18.2.0 react-dom: 18.2.0_react@18.2.0 + tailwind-merge: 1.9.1 devDependencies: '@types/node': 18.11.10 '@types/react': 18.0.26 autoprefixer: 10.4.13_postcss@8.4.20 eslint: 8.30.0 eslint-config-custom: link:../../packages/eslint-config-custom - next-transpile-modules: 10.0.0 postcss: 8.4.20 prettier: 2.8.1 prettier-config-custom: link:../../packages/prettier-config-custom @@ -130,27 +132,6 @@ importers: tsconfig-paths: 4.1.1 typescript: 4.7.4 - packages/atoms: - specifiers: - '@types/react': ^18.0.0 - '@types/react-dom': ^18.0.0 - clsx: ^1.2.1 - eslint: ^8.0.0 - eslint-config-custom: workspace:* - react: ^18.0.0 - tsconfig: workspace:* - typescript: ^4.5.2 - dependencies: - clsx: 1.2.1 - devDependencies: - '@types/react': 18.0.26 - '@types/react-dom': 18.0.9 - eslint: 8.30.0 - eslint-config-custom: link:../eslint-config-custom - react: 18.2.0 - tsconfig: link:../tsconfig - typescript: 4.8.4 - packages/eslint-config-custom: specifiers: '@typescript-eslint/eslint-plugin': ^5.27.1 @@ -1676,12 +1657,6 @@ packages: resolution: {integrity: sha512-EEhsLsD6UsDM1yFhAvy0Cjr6VwmpMWqFBCb9w07wVugF7w9nfajxLuVmngTIpgS6svCnm6Vaw+MZhoDCKnOfsw==} dev: true - /@types/react-dom/18.0.9: - resolution: {integrity: sha512-qnVvHxASt/H7i+XG1U1xMiY5t+IHcPGUK7TDMDzom08xa7e86eCeKOiLZezwCKVxJn6NEiiy2ekgX8aQssjIKg==} - dependencies: - '@types/react': 18.0.26 - dev: true - /@types/react/18.0.26: resolution: {integrity: sha512-hCR3PJQsAIXyxhTNSiDFY//LhnMZWpNNr5etoCqx/iUfGc5gXWtQR2Phl908jVR6uPXacojQWTg4qRpkxTuGug==} dependencies: @@ -2760,6 +2735,17 @@ packages: resolution: {integrity: sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==} dev: true + /class-variance-authority/0.4.0_typescript@4.8.4: + resolution: {integrity: sha512-74enNN8O9ZNieycac/y8FxqgyzZhZbxmCitAtAeUrLPlxjSd5zA7LfpprmxEcOmQBnaGs5hYhiSGnJ0mqrtBLQ==} + peerDependencies: + typescript: '>= 4.5.5 < 5' + peerDependenciesMeta: + typescript: + optional: true + dependencies: + typescript: 4.8.4 + dev: false + /clean-stack/2.2.0: resolution: {integrity: sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==} engines: {node: '>=6'} @@ -5663,13 +5649,6 @@ packages: resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==} dev: true - /next-transpile-modules/10.0.0: - resolution: {integrity: sha512-FyeJ++Lm2Fq31gbThiRCrJlYpIY9QaI7A3TjuhQLzOix8ChQrvn5ny4MhfIthS5cy6+uK1AhDRvxVdW17y3Xdw==} - deprecated: All features of next-transpile-modules are now natively built-in Next.js 13.1. Please use Next's transpilePackages option :) - dependencies: - enhanced-resolve: 5.10.0 - dev: true - /next/13.1.1_biqbaboplfbrettd7655fr4n2y: resolution: {integrity: sha512-R5eBAaIa3X7LJeYvv1bMdGnAVF4fVToEjim7MkflceFPuANY3YyvFxXee/A+acrSYwYPvOvf7f6v/BM/48ea5w==} engines: {node: '>=14.6.0'} @@ -6942,6 +6921,10 @@ packages: tslib: 2.4.1 dev: false + /tailwind-merge/1.9.1: + resolution: {integrity: sha512-ED9MkiUHlmfh58EC1xHRqXcH1IQyRtmDP0AmXlugYkP2tvfu7ejtjFEHJLJt93mQ7ZJkcqSIgm9M394bq5vOJg==} + dev: false + /tailwindcss/3.2.4_postcss@8.4.20: resolution: {integrity: sha512-AhwtHCKMtR71JgeYDaswmZXhPcW9iuI9Sp2LvZPo9upDZ7231ZJ7eA9RaURbhpXGVlrjX4cFNlB4ieTetEb7hQ==} engines: {node: '>=12.13.0'}