binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: icon revamp and refactor (#2447)

Browse source 
* chore: svg icons added in plane/ui package

* chore: swap priority and state icon with plane/ui icons

* chore: replace core folder icons with lucide and plane ui icons

* style: priority icon size

* chore: replace icons with lucide and plane/ui icons

* chore: replace cycle folder icons with lucide and plane/ui icons

* chore: replace existing icons with lucide and plane/ui icons

* chore: replace existing icons with lucide and plane/ui icons

* chore: replace existing icons with lucide and plane/ui icons

* chore: replace existing icons with lucide and plane/ui icons

* chore: replace existing icons with lucide and plane/ui icons

* fix: build error

* fix: build error

* fix: build error
This commit is contained in:
Anmol Singh Bhatia 2023-10-16 20:27:22 +05:30 • committed by GitHub
parent 1fc5d2bd45
commit 651b252c23
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
270 changed files with 2567 additions and 1480 deletions
Download patch file Download diff file Expand all files Collapse all files

20
web/components/web-view/comment-card.tsx
View file

@ -3,13 +3,13 @@ import React, { useEffect, useState } from "react";
// react-hook-form
import { useForm } from "react-hook-form";
// icons
import { ChatBubbleLeftEllipsisIcon, CheckIcon, XMarkIcon } from "@heroicons/react/24/outline";
import { Check, Globe2, Lock, MessageSquare, Pencil, Trash2, X } from "lucide-react";
// service
import { FileService } from "services/file.service";
// hooks
import useUser from "hooks/use-user";
// ui
import { CustomMenu, Icon } from "components/ui";
import { CustomMenu } from "components/ui";
import { CommentReaction } from "components/issues";
import { LiteTextEditorWithRef, LiteReadOnlyEditorWithRef } from "@plane/lite-text-editor";
@ -86,7 +86,7 @@ export const CommentCard: React.FC<Props> = (props) => {
)}
<span className="absolute -bottom-0.5 -right-1 rounded-tl bg-custom-background-80 px-0.5 py-px">
<ChatBubbleLeftEllipsisIcon className="h-3.5 w-3.5 text-custom-text-200" aria-hidden="true" />
<MessageSquare className="h-3.5 w-3.5 text-custom-text-200" />
</span>
</div>
<div className="min-w-0 flex-1">
@ -119,21 +119,21 @@ export const CommentCard: React.FC<Props> = (props) => {
disabled={isSubmitting || disabled}
className="group rounded border border-green-500 bg-green-500/20 p-2 shadow-md duration-300 hover:bg-green-500"
>
<CheckIcon className="h-3 w-3 text-green-500 duration-300 group-hover:text-white" />
<Check className="h-3 w-3 text-green-500 duration-300 group-hover:text-white" />
</button>
<button
type="button"
className="group rounded border border-red-500 bg-red-500/20 p-2 shadow-md duration-300 hover:bg-red-500"
onClick={() => setIsEditing(false)}
>
<XMarkIcon className="h-3 w-3 text-red-500 duration-300 group-hover:text-white" />
<X className="h-3 w-3 text-red-500 duration-300 group-hover:text-white" />
</button>
</div>
</form>
<div className={`relative ${isEditing ? "hidden" : ""}`}>
{showAccessSpecifier && (
<div className="absolute top-1 right-1.5 z-[1] text-custom-text-300">
<Icon iconName={comment.access === "INTERNAL" ? "lock" : "public"} className="!text-xs" />
{comment.access === "INTERNAL" ? <Lock className="h-3 w-3" /> : <Globe2 className="h-3 w-3" />}
</div>
)}
<LiteReadOnlyEditorWithRef
@ -148,7 +148,7 @@ export const CommentCard: React.FC<Props> = (props) => {
{user?.id === comment.actor && !disabled && (
<CustomMenu ellipsis>
<CustomMenu.MenuItem onClick={() => setIsEditing(true)} className="flex items-center gap-1">
<Icon iconName="edit" />
<Pencil className="h-3 w-3" />
Edit comment
</CustomMenu.MenuItem>
{showAccessSpecifier && (
@ -159,7 +159,7 @@ export const CommentCard: React.FC<Props> = (props) => {
onClick={() => onSubmit(comment.id, { access: "EXTERNAL" })}
className="flex items-center gap-1"
>
<Icon iconName="public" />
<Globe2 className="h-3 w-3" />
Switch to public comment
</CustomMenu.MenuItem>
) : (
@ -168,7 +168,7 @@ export const CommentCard: React.FC<Props> = (props) => {
onClick={() => onSubmit(comment.id, { access: "INTERNAL" })}
className="flex items-center gap-1"
>
<Icon iconName="lock" />
<Lock className="h-3 w-3" />
Switch to private comment
</CustomMenu.MenuItem>
)}
@ -180,7 +180,7 @@ export const CommentCard: React.FC<Props> = (props) => {
}}
className="flex items-center gap-1"
>
<Icon iconName="delete" />
<Trash2 className="h-3 w-3" />
Delete comment
</CustomMenu.MenuItem>
</CustomMenu>