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

44
web/components/cycles/cycles-list-item.tsx
View file

@ -6,26 +6,26 @@ import useToast from "hooks/use-toast";
import { CycleCreateEditModal } from "./cycle-create-edit-modal";
import { CycleDeleteModal } from "./cycle-delete-modal";
// ui
import { RadialProgressBar, Tooltip, LinearProgressIndicator } from "@plane/ui";
import { RadialProgressBar, Tooltip, LinearProgressIndicator, ContrastIcon, RunningIcon } from "@plane/ui";
import { CustomMenu } from "components/ui";
// icons
import { CalendarDaysIcon } from "@heroicons/react/20/solid";
import {
TargetIcon,
ContrastIcon,
PersonRunningIcon,
ArrowRightIcon,
TriangleExclamationIcon,
AlarmClockIcon,
} from "components/icons";
// hooks
import { useMobxStore } from "lib/mobx/store-provider";
import { LinkIcon, PencilIcon, StarIcon, TrashIcon } from "@heroicons/react/24/outline";
AlarmClock,
AlertTriangle,
ArrowRight,
CalendarDays,
LinkIcon,
Pencil,
Star,
Target,
Trash2,
} from "lucide-react";
// helpers
import { getDateRangeStatus, renderShortDateWithYearFormat, findHowManyDaysLeft } from "helpers/date-time.helper";
import { copyTextToClipboard } from "helpers/string.helper";
// types
import { ICycle } from "types";
import { useMobxStore } from "lib/mobx/store-provider";
type TCyclesListItem = {
cycle: ICycle;
@ -188,12 +188,12 @@ export const CyclesListItem: FC<TCyclesListItem> = (props) => {
>
{cycleStatus === "current" ? (
<span className="flex items-center gap-1 whitespace-nowrap">
<PersonRunningIcon className="h-3.5 w-3.5" />
<RunningIcon className="h-3.5 w-3.5" />
{findHowManyDaysLeft(cycle.end_date ?? new Date())} days left
</span>
) : cycleStatus === "upcoming" ? (
<span className="flex items-center gap-1">
<AlarmClockIcon className="h-3.5 w-3.5" />
<AlarmClock className="h-3.5 w-3.5" />
{findHowManyDaysLeft(cycle.start_date ?? new Date())} days left
</span>
) : cycleStatus === "completed" ? (
@ -205,7 +205,7 @@ export const CyclesListItem: FC<TCyclesListItem> = (props) => {
}`}
>
<span>
<TriangleExclamationIcon className="h-3.5 w-3.5 fill-current" />
<AlertTriangle className="h-3.5 w-3.5" />
</span>
</Tooltip>
)}{" "}
@ -220,14 +220,14 @@ export const CyclesListItem: FC<TCyclesListItem> = (props) => {
{cycleStatus !== "draft" && (
<div className="flex items-center justify-start gap-2 text-custom-text-200">
<div className="flex items-start gap-1 whitespace-nowrap">
<CalendarDaysIcon className="h-4 w-4" />
<CalendarDays className="h-4 w-4" />
<span>{renderShortDateWithYearFormat(startDate)}</span>
</div>
<ArrowRightIcon className="h-4 w-4" />
<ArrowRight className="h-4 w-4" />
<div className="flex items-start gap-1 whitespace-nowrap">
<TargetIcon className="h-4 w-4" />
<Target className="h-4 w-4" />
<span>{renderShortDateWithYearFormat(endDate)}</span>
</div>
</div>
@ -306,11 +306,11 @@ export const CyclesListItem: FC<TCyclesListItem> = (props) => {
{/* cycle favorite */}
{cycle.is_favorite ? (
<button type="button" onClick={handleRemoveFromFavorites}>
<StarIcon className="h-4 w-4 text-orange-400" fill="#f6ad55" />
<Star className="h-4 w-4 text-orange-400" fill="#f6ad55" />
</button>
) : (
<button type="button" onClick={handleAddToFavorites}>
<StarIcon className="h-4 w-4 " color="rgb(var(--color-text-200))" />
<Star className="h-4 w-4 " color="rgb(var(--color-text-200))" />
</button>
)}
</div>
@ -323,7 +323,7 @@ export const CyclesListItem: FC<TCyclesListItem> = (props) => {
{!isCompleted && (
<CustomMenu.MenuItem onClick={() => setUpdateModal(true)}>
<span className="flex items-center justify-start gap-2">
<PencilIcon className="h-4 w-4" />
<Pencil className="h-4 w-4" />
<span>Edit Cycle</span>
</span>
</CustomMenu.MenuItem>
@ -332,7 +332,7 @@ export const CyclesListItem: FC<TCyclesListItem> = (props) => {
{!isCompleted && (
<CustomMenu.MenuItem onClick={() => setDeleteModal(true)}>
<span className="flex items-center justify-start gap-2">
<TrashIcon className="h-4 w-4" />
<Trash2 className="h-4 w-4" />
<span>Delete cycle</span>
</span>
</CustomMenu.MenuItem>