refactor: replace Pencil icon with PenLine and update TreePine to CirclePlus in document components

This commit is contained in:
Anish Sarkar 2026-03-27 23:26:12 +05:30
parent 13f4b175a6
commit 0204ed5363
3 changed files with 11 additions and 12 deletions

View file

@ -1,6 +1,6 @@
"use client"; "use client";
import { Eye, MoreHorizontal, Move, Pencil, Trash2 } from "lucide-react"; import { Eye, MoreHorizontal, Move, PenLine, Trash2 } from "lucide-react";
import React, { useCallback } from "react"; import React, { useCallback } from "react";
import { useDrag } from "react-dnd"; import { useDrag } from "react-dnd";
import { getDocumentTypeIcon } from "@/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentTypeIcon"; import { getDocumentTypeIcon } from "@/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentTypeIcon";
@ -146,7 +146,7 @@ export const DocumentNode = React.memo(function DocumentNode({
</DropdownMenuItem> </DropdownMenuItem>
{isEditable && ( {isEditable && (
<DropdownMenuItem onClick={() => onEdit(doc)}> <DropdownMenuItem onClick={() => onEdit(doc)}>
<Pencil className="mr-2 h-4 w-4" /> <PenLine className="mr-2 h-4 w-4" />
Edit Edit
</DropdownMenuItem> </DropdownMenuItem>
)} )}
@ -175,7 +175,7 @@ export const DocumentNode = React.memo(function DocumentNode({
</ContextMenuItem> </ContextMenuItem>
{isEditable && ( {isEditable && (
<ContextMenuItem onClick={() => onEdit(doc)}> <ContextMenuItem onClick={() => onEdit(doc)}>
<Pencil className="mr-2 h-4 w-4" /> <PenLine className="mr-2 h-4 w-4" />
Edit Edit
</ContextMenuItem> </ContextMenuItem>
)} )}

View file

@ -8,7 +8,7 @@ import {
FolderPlus, FolderPlus,
MoreHorizontal, MoreHorizontal,
Move, Move,
Pencil, PenLine,
Trash2, Trash2,
} from "lucide-react"; } from "lucide-react";
import React, { useCallback, useEffect, useRef, useState } from "react"; import React, { useCallback, useEffect, useRef, useState } from "react";
@ -18,14 +18,12 @@ import {
ContextMenu, ContextMenu,
ContextMenuContent, ContextMenuContent,
ContextMenuItem, ContextMenuItem,
ContextMenuSeparator,
ContextMenuTrigger, ContextMenuTrigger,
} from "@/components/ui/context-menu"; } from "@/components/ui/context-menu";
import { import {
DropdownMenu, DropdownMenu,
DropdownMenuContent, DropdownMenuContent,
DropdownMenuItem, DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger, DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"; } from "@/components/ui/dropdown-menu";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
@ -265,7 +263,8 @@ export const FolderNode = React.memo(function FolderNode({
onBlur={handleRenameSubmit} onBlur={handleRenameSubmit}
onKeyDown={handleRenameKeyDown} onKeyDown={handleRenameKeyDown}
onClick={(e) => e.stopPropagation()} onClick={(e) => e.stopPropagation()}
className="flex-1 min-w-0 rounded border border-primary bg-background px-1 py-0.5 text-sm outline-none" placeholder="Enter folder name"
className="flex-1 min-w-0 bg-transparent px-1 py-0.5 text-sm outline-none caret-primary placeholder:text-muted-foreground/50"
/> />
) : ( ) : (
<span className="flex-1 min-w-0 truncate">{folder.name}</span> <span className="flex-1 min-w-0 truncate">{folder.name}</span>
@ -305,7 +304,7 @@ export const FolderNode = React.memo(function FolderNode({
startRename(); startRename();
}} }}
> >
<Pencil className="mr-2 h-4 w-4" /> <PenLine className="mr-2 h-4 w-4" />
Rename Rename
</DropdownMenuItem> </DropdownMenuItem>
<DropdownMenuItem <DropdownMenuItem
@ -340,7 +339,7 @@ export const FolderNode = React.memo(function FolderNode({
New subfolder New subfolder
</ContextMenuItem> </ContextMenuItem>
<ContextMenuItem onClick={() => startRename()}> <ContextMenuItem onClick={() => startRename()}>
<Pencil className="mr-2 h-4 w-4" /> <PenLine className="mr-2 h-4 w-4" />
Rename Rename
</ContextMenuItem> </ContextMenuItem>
<ContextMenuItem onClick={() => onMove(folder)}> <ContextMenuItem onClick={() => onMove(folder)}>

View file

@ -1,7 +1,7 @@
"use client"; "use client";
import { useAtom } from "jotai"; import { useAtom } from "jotai";
import { TreePine } from "lucide-react"; import { CirclePlus } from "lucide-react";
import { useCallback, useMemo, useState } from "react"; import { useCallback, useMemo, useState } from "react";
import { DndProvider } from "react-dnd"; import { DndProvider } from "react-dnd";
import { HTML5Backend } from "react-dnd-html5-backend"; import { HTML5Backend } from "react-dnd-html5-backend";
@ -195,7 +195,7 @@ export function FolderTreeView({
if (treeNodes.length === 0 && folders.length === 0 && documents.length === 0) { if (treeNodes.length === 0 && folders.length === 0 && documents.length === 0) {
return ( return (
<div className="flex flex-1 flex-col items-center justify-center gap-3 px-4 py-12 text-muted-foreground"> <div className="flex flex-1 flex-col items-center justify-center gap-3 px-4 py-12 text-muted-foreground">
<TreePine className="h-10 w-10" /> <CirclePlus className="h-10 w-10 rotate-45" />
<p className="text-sm">No documents yet</p> <p className="text-sm">No documents yet</p>
</div> </div>
); );
@ -204,7 +204,7 @@ export function FolderTreeView({
if (treeNodes.length === 0 && activeTypes.length > 0) { if (treeNodes.length === 0 && activeTypes.length > 0) {
return ( return (
<div className="flex flex-1 flex-col items-center justify-center gap-3 px-4 py-12 text-muted-foreground"> <div className="flex flex-1 flex-col items-center justify-center gap-3 px-4 py-12 text-muted-foreground">
<TreePine className="h-10 w-10" /> <CirclePlus className="h-10 w-10 rotate-45" />
<p className="text-sm">No matching documents</p> <p className="text-sm">No matching documents</p>
</div> </div>
); );