chore: updated radix with lucid icons

makeplane · Jan 10, 2024 · 0beca83 · 0beca83
1 parent dea9e64
commit 0beca83
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 14 deletions.
diff --git a/packages/editor/document-editor/package.json b/packages/editor/document-editor/package.json
@@ -32,12 +32,12 @@
     "@plane/editor-core": "*",
     "@plane/editor-extensions": "*",
     "@plane/ui": "*",
-    "@radix-ui/react-icons": "^1.3.0",
     "@tiptap/core": "^2.1.13",
     "@tiptap/extension-placeholder": "^2.1.13",
     "@tiptap/pm": "^2.1.13",
     "@tiptap/suggestion": "^2.1.13",
     "eslint-config-next": "13.2.4",
+    "lucide-react": "^0.309.0",
     "react-popper": "^2.3.0",
     "tippy.js": "^6.3.7",
     "uuid": "^9.0.1"

diff --git a/packages/editor/document-editor/src/ui/components/links/link-edit-view.tsx b/packages/editor/document-editor/src/ui/components/links/link-edit-view.tsx
@@ -1,6 +1,6 @@
 import { isValidHttpUrl } from "@plane/editor-core";
-import { LinkBreak1Icon } from "@radix-ui/react-icons";
 import { Node } from "@tiptap/pm/model";
+import { Link2Off } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
 import { LinkViewProps } from "./link-view";
 
@@ -50,11 +50,11 @@ export const LinkEditView = ({
   const isValidUrl = (urlString: string) => {
     var urlPattern = new RegExp(
       "^(https?:\\/\\/)?" + // validate protocol
-      "([\\w-]+\\.)+[\\w-]{2,}" + // validate domain name
-      "|((\\d{1,3}\\.){3}\\d{1,3})" + // validate IP (v4) address
-      "(\\:\\d+)?(\\/[-\\w.%]+)*" + // validate port and path
-      "(\\?[;&\\w.%=-]*)?" + // validate query string
-      "(\\#[-\\w]*)?$", // validate fragment locator
+        "([\\w-]+\\.)+[\\w-]{2,}" + // validate domain name
+        "|((\\d{1,3}\\.){3}\\d{1,3})" + // validate IP (v4) address
+        "(\\:\\d+)?(\\/[-\\w.%]+)*" + // validate port and path
+        "(\\?[;&\\w.%=-]*)?" + // validate query string
+        "(\\#[-\\w]*)?$", // validate fragment locator
       "i"
     );
     const regexTest = urlPattern.test(urlString);
@@ -138,7 +138,7 @@ export const LinkEditView = ({
       />
       <div className="mb-1 bg-custom-border-300 h-[1px] w-full gap-2" />
       <div className="flex text-sm text-custom-text-800 gap-2 items-center">
-        <LinkBreak1Icon className="inline-block" />
+        <Link2Off size={14} className="inline-block" />
         <button onClick={() => removeLink()} className="cursor-pointer">
           Remove Link
         </button>

diff --git a/packages/editor/document-editor/src/ui/components/links/link-preview.tsx b/packages/editor/document-editor/src/ui/components/links/link-preview.tsx
@@ -1,4 +1,4 @@
-import { CopyIcon, GlobeIcon, LinkBreak1Icon, Pencil1Icon } from "@radix-ui/react-icons";
+import { Copy, GlobeIcon, Link2Off, PencilIcon } from "lucide-react";
 import { LinkViewProps } from "./link-view";
 
 export const LinkPreview = ({
@@ -32,18 +32,18 @@ export const LinkPreview = ({
 
   return (
     <div className="absolute left-0 top-0 max-w-max">
-      <div className="shadow-md rounded p-2 flex gap-3 bg-custom-background-90 border-custom-border-100 border-2 text-custom-text-300 text-xs">
-        <GlobeIcon className="inline-block" />
+      <div className="shadow-md items-center rounded p-2 flex gap-3 bg-custom-background-90 border-custom-border-100 border-2 text-custom-text-300 text-xs">
+        <GlobeIcon size={14} className="inline-block" />
         <p>{url.length > 40 ? url.slice(0, 40) + "..." : url}</p>
         <div className="flex gap-2">
           <button onClick={copyLinkToClipboard} className="cursor-pointer">
-            <CopyIcon className="inline-block" />
+            <Copy size={14} className="inline-block" />
           </button>
           <button onClick={() => switchView("LinkEditView")} className="cursor-pointer">
-            <Pencil1Icon className="inline-block" />
+            <PencilIcon size={14} className="inline-block" />
           </button>
           <button onClick={removeLink} className="cursor-pointer">
-            <LinkBreak1Icon className="inline-block" />
+            <Link2Off size={14} className="inline-block" />
           </button>
         </div>
       </div>

diff --git a/yarn.lock b/yarn.lock
@@ -6212,6 +6212,11 @@ lucide-react@^0.294.0:
   resolved "https://registry.yarnpkg.com/lucide-react/-/lucide-react-0.294.0.tgz#dc406e1e7e2f722cf93218fe5b31cf3c95778817"
   integrity sha512-V7o0/VECSGbLHn3/1O67FUgBwWB+hmzshrgDVRJQhMh8uj5D3HBuIvhuAmQTtlupILSplwIZg5FTc4tTKMA2SA==
 
+lucide-react@^0.309.0:
+  version "0.309.0"
+  resolved "https://registry.yarnpkg.com/lucide-react/-/lucide-react-0.309.0.tgz#7369893cb4b074a0a0b1d3acdc6fd9a8bdb5add1"
+  integrity sha512-zNVPczuwFrCfksZH3zbd1UDE6/WYhYAdbe2k7CImVyPAkXLgIwbs6eXQ4loigqDnUFjyFYCI5jZ1y10Kqal0dg==
+
 magic-string@^0.25.0, magic-string@^0.25.7:
   version "0.25.9"
   resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c"