chore: lint related changes and packaging fixes

admin/core/components/admin-sidebar/root.tsx

@@ -3,7 +3,7 @@
 import { FC, useEffect, useRef } from "react";
 import { observer } from "mobx-react";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // components
 import { HelpSection, SidebarMenu, SidebarDropdown } from "@/components/admin-sidebar";
 // hooks

admin/package.json

@@ -14,9 +14,10 @@
   "dependencies": {
     "@headlessui/react": "^1.7.19",
     "@plane/constants": "*",
-    "@plane/helpers": "*",
+    "@plane/hooks": "*",
     "@plane/types": "*",
     "@plane/ui": "*",
+    "@plane/utils": "*",
     "@sentry/nextjs": "^8.32.0",
     "@tailwindcss/typography": "^0.5.9",
     "@types/lodash": "^4.17.0",
@@ -26,7 +27,7 @@
     "lucide-react": "^0.356.0",
     "mobx": "^6.12.0",
     "mobx-react": "^9.1.1",
-    "next": "^14.2.12",
+    "next": "^14.2.20",
     "next-themes": "^0.2.1",
     "postcss": "^8.4.38",
     "react": "^18.3.1",

packages/editor/package.json

@@ -27,6 +27,7 @@
     "dev": "tsup --watch",
     "check-types": "tsc --noEmit",
     "lint": "eslint src --ext .ts,.tsx",
+    "lint:errors": "eslint src --ext .ts,.tsx --quiet",
     "format": "prettier --write \"**/*.{ts,tsx,md}\""
   },
   "peerDependencies": {
@@ -36,8 +37,8 @@
   "dependencies": {
     "@floating-ui/react": "^0.26.4",
     "@hocuspocus/provider": "^2.13.5",
-    "@plane/helpers": "*",
     "@plane/ui": "*",
+    "@plane/utils": "*",
     "@tiptap/core": "^2.1.13",
     "@tiptap/extension-blockquote": "^2.1.13",
     "@tiptap/extension-character-count": "^2.6.5",

packages/editor/src/core/extensions/callout/logo-selector.tsx

@@ -1,5 +1,5 @@
 // plane helpers
-import { convertHexEmojiToDecimal } from "@plane/helpers";
+import { convertHexEmojiToDecimal } from "@plane/utils";
 // plane ui
 import { EmojiIconPicker, EmojiIconPickerTypes, Logo, TEmojiLogoProps } from "@plane/ui";
 // helpers

packages/editor/src/core/extensions/callout/utils.ts

@@ -1,5 +1,5 @@
 // plane helpers
-import { sanitizeHTML } from "@plane/helpers";
+import { sanitizeHTML } from "@plane/utils";
 // plane ui
 import { TEmojiLogoProps } from "@plane/ui";
 // types

packages/eslint-config/package.json

@@ -10,7 +10,7 @@
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^8.6.0",
     "@typescript-eslint/parser": "^8.6.0",
-    "eslint": "8",
+    "eslint": "8.57.1",
     "eslint-config-next": "^14.1.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-config-turbo": "^1.12.4",

packages/hooks/.eslintignore

@@ -0,0 +1,3 @@
+build/*
+dist/*
+out/*

packages/hooks/.eslintrc.js

@@ -0,0 +1,9 @@
+/** @type {import("eslint").Linter.Config} */
+module.exports = {
+  root: true,
+  extends: ["@plane/eslint-config/library.js"],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    project: true,
+  },
+};

packages/hooks/.prettierignore

@@ -0,0 +1,4 @@
+.turbo
+out/
+dist/
+build/

packages/hooks/.prettierrc

@@ -0,0 +1,5 @@
+{
+  "printWidth": 120,
+  "tabWidth": 2,
+  "trailingComma": "es5"
+}

packages/hooks/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@plane/hooks",
+  "version": "0.24.0",
+  "description": "React hooks that are shared across multiple apps internally",
+  "private": true,
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist/**"
+  ],
+  "scripts": {
+    "build": "tsup ./src/index.ts --format esm,cjs --dts --external react --minify",
+    "lint": "eslint . --ext .ts,.tsx",
+    "lint:errors": "eslint . --ext .ts,.tsx --quiet"
+  },
+  "dependencies": {
+    "react": "^18.3.1"
+  },
+  "devDependencies": {
+    "@plane/eslint-config": "*",
+    "@types/node": "^22.5.4",
+    "@types/react": "^18.3.11",
+    "tsup": "^7.2.0",
+    "typescript": "^5.3.3"
+  }
+}

packages/helpers/tsconfig.json → packages/hooks/tsconfig.json

@@ -4,6 +4,6 @@
     "jsx": "react",
     "lib": ["esnext", "dom"]
   },
-  "include": ["."],
+  "include": ["./src"],
   "exclude": ["dist", "build", "node_modules"]
 }

packages/ui/package.json

@@ -18,7 +18,8 @@
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
     "postcss": "postcss styles/globals.css -o styles/output.css --watch",
-    "lint": "eslint src --ext .ts,.tsx"
+    "lint": "eslint src --ext .ts,.tsx",
+    "lint:errors": "eslint src --ext .ts,.tsx --quiet"
   },
   "peerDependencies": {
     "react": "^18.3.1",
@@ -31,7 +32,8 @@
     "@blueprintjs/popover2": "^1.13.3",
     "@headlessui/react": "^1.7.3",
     "@popperjs/core": "^2.11.8",
-    "@plane/helpers": "*",
+    "@plane/hooks": "*",
+    "@plane/utils": "*",
     "clsx": "^2.0.0",
     "emoji-picker-react": "^4.5.16",
     "lodash": "^4.17.21",

packages/ui/src/dropdown/multi-select.tsx

@@ -5,7 +5,7 @@ import { Combobox } from "@headlessui/react";
 // popper-js
 import { usePopper } from "react-popper";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // components
 import { DropdownButton } from "./common";
 import { DropdownOptions } from "./common/options";

packages/ui/src/dropdown/single-select.tsx

@@ -5,7 +5,7 @@ import { Combobox } from "@headlessui/react";
 // popper-js
 import { usePopper } from "react-popper";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // components
 import { DropdownButton } from "./common";
 import { DropdownOptions } from "./common/options";

packages/ui/src/dropdowns/context-menu/root.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useRef, useState } from "react";
 import ReactDOM from "react-dom";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // components
 import { ContextMenuItem } from "./item";
 // helpers

packages/ui/src/dropdowns/custom-menu.tsx

@@ -4,7 +4,7 @@ import { Menu } from "@headlessui/react";
 import { usePopper } from "react-popper";
 import { ChevronDown, MoreHorizontal } from "lucide-react";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // hooks
 import { useDropdownKeyDown } from "../hooks/use-dropdown-key-down";
 // helpers

packages/ui/src/dropdowns/custom-search-select.tsx

@@ -4,7 +4,7 @@ import { Combobox } from "@headlessui/react";
 import { Check, ChevronDown, Info, Search } from "lucide-react";
 import { createPortal } from "react-dom";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // hooks
 import { useDropdownKeyDown } from "../hooks/use-dropdown-key-down";
 // helpers
@@ -97,10 +97,11 @@ export const CustomSearchSelect = (props: ICustomSearchSelectProps) => {
                 <button
                   ref={setReferenceElement}
                   type="button"
-                  className={`flex w-full items-center justify-between gap-1 text-xs ${disabled
-                    ? "cursor-not-allowed text-custom-text-200"
-                    : "cursor-pointer hover:bg-custom-background-80"
-                    }  ${customButtonClassName}`}
+                  className={`flex w-full items-center justify-between gap-1 text-xs ${
+                    disabled
+                      ? "cursor-not-allowed text-custom-text-200"
+                      : "cursor-pointer hover:bg-custom-background-80"
+                  }  ${customButtonClassName}`}
                   onClick={toggleDropdown}
                 >
                   {customButton}
@@ -186,15 +187,13 @@ export const CustomSearchSelect = (props: ICustomSearchSelectProps) => {
                                   {selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
                                   {option.tooltip && (
                                     <>
-                                      {
-                                        typeof option.tooltip === "string" ? (
-                                          <Tooltip tooltipContent={option.tooltip}>
-                                            <Info className="h-3.5 w-3.5 flex-shrink-0 cursor-pointer text-custom-text-200" />
-                                          </Tooltip>
-                                        ) : (
-                                            option.tooltip
-                                        )
-                                      }
+                                      {typeof option.tooltip === "string" ? (
+                                        <Tooltip tooltipContent={option.tooltip}>
+                                          <Info className="h-3.5 w-3.5 flex-shrink-0 cursor-pointer text-custom-text-200" />
+                                        </Tooltip>
+                                      ) : (
+                                        option.tooltip
+                                      )}
                                     </>
                                   )}
                                 </>

packages/ui/src/dropdowns/custom-select.tsx

@@ -3,7 +3,7 @@ import { usePopper } from "react-popper";
 import { Listbox } from "@headlessui/react";
 import { Check, ChevronDown } from "lucide-react";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // hooks
 import { useDropdownKeyDown } from "../hooks/use-dropdown-key-down";
 // helpers

packages/ui/src/emoji/emoji-icon-picker-new.tsx

@@ -3,7 +3,7 @@ import { usePopper } from "react-popper";
 import { Popover, Tab } from "@headlessui/react";
 import EmojiPicker from "emoji-picker-react";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // helpers
 import { cn } from "../../helpers";
 // hooks

packages/ui/src/emoji/emoji-icon-picker.tsx

@@ -3,7 +3,7 @@ import { usePopper } from "react-popper";
 import EmojiPicker from "emoji-picker-react";
 import { Popover, Tab } from "@headlessui/react";
 // plane helpers
-import { useOutsideClickDetector } from "@plane/helpers";
+import { useOutsideClickDetector } from "@plane/hooks";
 // components
 import { IconsList } from "./icons-list";
 // helpers

packages/ui/src/tabs/tabs.tsx

@@ -2,7 +2,7 @@ import React, { FC, Fragment } from "react";
 import { Tab } from "@headlessui/react";
 import { LucideProps } from "lucide-react";
 // helpers
-import { useLocalStorage } from "@plane/helpers";
+import { useLocalStorage } from "@plane/hooks";
 import { cn } from "../../helpers";
 
 type TabItem = {

packages/utils/.eslintignore

@@ -0,0 +1,3 @@
+build/*
+dist/*
+out/*

packages/utils/.eslintrc.js

@@ -0,0 +1,9 @@
+/** @type {import("eslint").Linter.Config} */
+module.exports = {
+  root: true,
+  extends: ["@plane/eslint-config/library.js"],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    project: true,
+  },
+};

packages/utils/.prettierrc

@@ -0,0 +1,5 @@
+{
+  "printWidth": 120,
+  "tabWidth": 2,
+  "trailingComma": "es5"
+}

packages/helpers/package.json → packages/utils/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@plane/helpers",
+  "name": "@plane/utils",
   "version": "0.24.0",
   "description": "Helper functions shared across multiple apps internally",
   "private": true,
@@ -10,16 +10,19 @@
     "dist/**"
   ],
   "scripts": {
-    "build": "tsup ./index.ts --format esm,cjs --dts --external react --minify"
+    "build": "tsup ./src/index.ts --format esm,cjs --dts --external react --minify",
+    "lint": "eslint . --ext .ts,.tsx",
+    "lint:errors": "eslint . --ext .ts,.tsx --quiet"
+  },
+  "dependencies": {
+    "isomorphic-dompurify": "^2.16.0",
+    "react": "^18.3.1"
   },
   "devDependencies": {
+    "@plane/eslint-config": "*",
     "@types/node": "^22.5.4",
     "@types/react": "^18.3.11",
     "tsup": "^7.2.0",
-    "typescript": "^5.6.2"
-  },
-  "dependencies": {
-    "isomorphic-dompurify": "^2.16.0",
-    "react": "^18.3.1"
+    "typescript": "^5.3.3"
   }
 }