refactor: migrate to monorepo (#83)

* refactor: migrate to monorepo

* massive movement

* fix(gui): error bundle and styling

- bundle for browser to access webcrypto
- add config to bundle css module
- use the bundled css in client page

* fix(gui): disable css-module in favor of tailwind

* remove all css module

* feat: transpile package for dev

* refactor: move more code to gui

* feat: fixing all eslint

* fixing all the typecheck error

* fixing typecheck

* refactor: migrate to pnpm workspace

* refactor(studio): change absolute path to `@studio/...`

* refactor(gui): change absolute path to `@gui/...`

* refactor: fix types error

* refactor: formating

* ci: update ci and add cache

* fix: ci and test

* fixing the typecheck

* remove unused workspace

* remove some part

* fix: error on local client

* fixing windows

* using different check

---------

Co-authored-by: Visal .In <[email protected]>

.github/workflows/check.yaml

@@ -0,0 +1,56 @@
+name: Check
+
+on:
+  push:
+    branches:
+      - develop
+  pull_request:
+  workflow_dispatch:
+
+jobs:
+  quality-check:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8.13.1
+          run_install: false
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          cache: pnpm
+
+      - name: Get pnpm store directory
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
+
+      - name: Cache pnpm
+        uses: actions/cache@v4
+        with:
+          path: ${{ env.STORE_PATH }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
+
+      - name: Cache turbo tasks
+        uses: actions/cache@v4
+        with:
+          path: .turbo
+          key: ${{ runner.os }}-turbo-${{ github.sha }}
+          restore-keys: |
+            ${{ runner.os }}-turbo-
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Run Check
+        run: pnpm run staged
+
+      - name: Log success
+        run: echo "✅ Success!"

.gitignore

@@ -2,6 +2,7 @@
 
 # dependencies
 /node_modules
+**/node_modules
 /.pnp
 .pnp.js
 .yarn/install-state.gz
@@ -10,13 +11,16 @@
 /coverage
 
 # next.js
+**/.next
 /.next/
 /out/
 
 # production
 /build
+**/dist
 
 # misc
+**/.DS_Store
 .DS_Store
 *.pem
 
@@ -32,6 +36,11 @@ yarn-error.log*
 # vercel
 .vercel
 
+# turbo
+**/.turbo
+.turbo
+
 # typescript
+**/*.tsbuildinfo
 *.tsbuildinfo
 next-env.d.ts

.prettierignore

@@ -0,0 +1,11 @@
+package-lock.json
+.next
+dist
+drizzle/*
+**/*/drizzle
+.prettierignore
+.gitignore
+
+.changeset/
+
+

.vscode/settings.json

@@ -1,3 +1,4 @@
 {
-    "editor.formatOnSave": true
+    "editor.formatOnSave": true,
+    "typescript.tsdk": "node_modules\\typescript\\lib"
 }

config/eslint/base.js

@@ -0,0 +1,63 @@
+/** @type {import('eslint').Linter.Config} */
+const config = {
+  ignorePatterns: ["node_modules", "dist", ".next"],
+  env: {
+    es2022: true,
+    node: true,
+  },
+  extends: ["plugin:eslint-comments/recommended", "prettier"],
+  overrides: [
+    {
+      files: [
+        "**/*.ts",
+        "**/*.tsx",
+        "**/*.js",
+        "**/*.jsx",
+        "**/*.mjs",
+        "**/*.cjs",
+      ],
+      parser: "@typescript-eslint/parser",
+      parserOptions: {
+        project: true,
+      },
+      plugins: ["@typescript-eslint"],
+      extends: [
+        "plugin:@typescript-eslint/strict-type-checked",
+        "plugin:@typescript-eslint/stylistic-type-checked",
+      ],
+      rules: {
+        "@typescript-eslint/no-empty-interface": "off",
+        "@typescript-eslint/prefer-nullish-coalescing": "off",
+        "@typescript-eslint/restrict-template-expressions": "off",
+        "@typescript-eslint/consistent-type-definitions": "off",
+        "@typescript-eslint/array-type": [
+          "error",
+          {
+            default: "array-simple",
+            readonly: "array-simple",
+          },
+        ],
+        "@typescript-eslint/consistent-type-imports": [
+          "warn",
+          {
+            prefer: "type-imports",
+            fixStyle: "inline-type-imports",
+          },
+        ],
+        "@typescript-eslint/no-unused-vars": [
+          "warn",
+          { argsIgnorePattern: "^_" },
+        ],
+        "@typescript-eslint/require-await": "error",
+        "@typescript-eslint/no-misused-promises": [
+          "error",
+          {
+            checksVoidReturn: { attributes: false },
+          },
+        ],
+      },
+    },
+  ],
+};
+
+module.exports = config;

config/eslint/next.js

@@ -0,0 +1,6 @@
+/** @type {import('eslint').Linter.Config} */
+const config = {
+  extends: ["plugin:@next/next/recommended"],
+};
+
+module.exports = config;

config/eslint/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "eslint-config-libsqlstudio",
+  "private": true,
+  "version": "1.0.0",
+  "files": [
+    "./base.js",
+    "./next.js",
+    "./react.js"
+  ],
+  "devDependencies": {
+    "@typescript-eslint/eslint-plugin": "^7.6.0",
+    "@typescript-eslint/parser": "^7.6.0",
+    "eslint-config-next": "^14.1.4",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-eslint-comments": "^3.2.0",
+    "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-react-hooks": "^4.6.0"
+  }
+}

config/eslint/react.js

@@ -0,0 +1,25 @@
+/** @type {import('eslint').Linter.Config} */
+const config = {
+  overrides: [
+    {
+      files: ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"],
+      extends: [
+        "plugin:react/recommended",
+        "plugin:react-hooks/recommended",
+        // "plugin:jsx-a11y/recommended",
+      ],
+      settings: {
+        react: {
+          version: "detect",
+        },
+      },
+      rules: {
+        "react/react-in-jsx-scope": "off",
+        "react/prop-types": "off",
+        "react/no-unknown-property": "warn"
+      },
+    },
+  ],
+};
+
+module.exports = config;

config/eslint/tsconfig.json

@@ -0,0 +1,4 @@
+{
+	"extends": ["../tsconfig/base.json"],
+	"include": ["**/*.cjs"]
+}

config/tailwind/index.ts

@@ -0,0 +1,93 @@
+import type { Config } from "tailwindcss";
+
+export const LibSqlStudoTailwindPreset: Config = {
+  darkMode: ["class"],
+  content: [
+    "./pages/**/*.{ts,tsx}",
+    "./components/**/*.{ts,tsx}",
+    "./app/**/*.{ts,tsx}",
+    "./src/**/*.{ts,tsx}",
+  ],
+  prefix: "",
+  theme: {
+    container: {
+      center: true,
+      padding: "2rem",
+      screens: {
+        "2xl": "1400px",
+      },
+    },
+    extend: {
+      colors: {
+        border: "hsl(var(--border))",
+        input: "hsl(var(--input))",
+        ring: "hsl(var(--ring))",
+        background: "hsl(var(--background))",
+        foreground: "hsl(var(--foreground))",
+        primary: {
+          DEFAULT: "hsl(var(--primary))",
+          foreground: "hsl(var(--primary-foreground))",
+        },
+        secondary: {
+          DEFAULT: "hsl(var(--secondary))",
+          foreground: "hsl(var(--secondary-foreground))",
+        },
+        destructive: {
+          DEFAULT: "hsl(var(--destructive))",
+          foreground: "hsl(var(--destructive-foreground))",
+        },
+        muted: {
+          DEFAULT: "hsl(var(--muted))",
+          foreground: "hsl(var(--muted-foreground))",
+        },
+        accent: {
+          DEFAULT: "hsl(var(--accent))",
+          foreground: "hsl(var(--accent-foreground))",
+        },
+        popover: {
+          DEFAULT: "hsl(var(--popover))",
+          foreground: "hsl(var(--popover-foreground))",
+        },
+        card: {
+          DEFAULT: "hsl(var(--card))",
+          foreground: "hsl(var(--card-foreground))",
+        },
+      },
+      borderRadius: {
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
+        sm: "calc(var(--radius) - 4px)",
+      },
+      keyframes: {
+        "accordion-down": {
+          from: { height: "0" },
+          to: { height: "var(--radix-accordion-content-height)" },
+        },
+        "accordion-up": {
+          from: { height: "var(--radix-accordion-content-height)" },
+          to: { height: "0" },
+        },
+        shake: {
+          "10%, 90%": {
+            transform: "translate3d(-1px, 0, 0)",
+          },
+          "20%, 80%": {
+            transform: "translate3d(2px, 0, 0)",
+          },
+          "30%, 50%, 70%": {
+            transform: "translate3d(-4px, 0, 0)",
+          },
+          "40%, 60%": {
+            transform: "translate3d(4px, 0, 0)",
+          },
+        },
+      },
+      animation: {
+        "accordion-down": "accordion-down 0.2s ease-out",
+        "accordion-up": "accordion-up 0.2s ease-out",
+        shake: "shake 0.82s cubic-bezier(.36,.07,.19,.97) both",
+      },
+    },
+  },
+  plugins: [require("tailwindcss-animate")],
+};

config/tailwind/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "@libsqlstudio/tailwind",
+  "private": true,
+  "version": "1.0.0",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./index.ts",
+      "default": "./index.ts"
+    },
+    "./css": "./style.css"
+  },
+  "devDependencies": {
+    "tailwindcss": "^3.4.3",
+    "tailwindcss-animate": "^1.0.7"
+  }
+}

config/tailwind/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": ["../tsconfig/base.json"],
+  "include": ["**/*.ts"]
+}