chore: image file update, icon consistency, bug fixes and code refactor (#3107)

* chore: workspace view icon consistency

* chore: icon added in breadcrumb dropdown

* chore: svg image replaced with webp

* fix: build fix

* chore: unused variables removed

* chore: module sidebar copy module link fix

web/components/gantt-chart/sidebar/sidebar.tsx

@@ -15,7 +15,6 @@ import { IGanttBlock, IBlockUpdateData } from "components/gantt-chart/types";
 import { IIssue } from "types";
 
 type Props = {
-  title: string;
   blockUpdateHandler: (block: any, payload: IBlockUpdateData) => void;
   blocks: IGanttBlock[] | null;
   enableReorder: boolean;
@@ -33,7 +32,6 @@ type Props = {
 export const IssueGanttSidebar: React.FC<Props> = (props) => {
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const {
-    title,
     blockUpdateHandler,
     blocks,
     enableReorder,

web/components/headers/cycle-issues.tsx

@@ -155,7 +155,10 @@ export const CycleIssuesHeader: React.FC = observer(() => {
                       key={cycle.id}
                       onClick={() => router.push(`/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`)}
                     >
-                      {truncateText(cycle.name, 40)}
+                      <div className="flex items-center gap-1.5">
+                        <ContrastIcon className="h-3 w-3" />
+                        {truncateText(cycle.name, 40)}
+                      </div>
                     </CustomMenu.MenuItem>
                   ))}
                 </CustomMenu>

web/components/headers/module-issues.tsx

@@ -11,7 +11,7 @@ import { ProjectAnalyticsModal } from "components/analytics";
 // ui
 import { Breadcrumbs, Button, CustomMenu, DiceIcon } from "@plane/ui";
 // icons
-import { ArrowRight, ContrastIcon, Plus } from "lucide-react";
+import { ArrowRight, Plus } from "lucide-react";
 // helpers
 import { truncateText } from "helpers/string.helper";
 import { renderEmoji } from "helpers/emoji.helper";
@@ -143,7 +143,7 @@ export const ModuleIssuesHeader: React.FC = observer(() => {
                 <CustomMenu
                   label={
                     <>
-                      <ContrastIcon className="h-3 w-3" />
+                      <DiceIcon className="h-3 w-3" />
                       {moduleDetails?.name && truncateText(moduleDetails.name, 40)}
                     </>
                   }
@@ -156,7 +156,10 @@ export const ModuleIssuesHeader: React.FC = observer(() => {
                       key={module.id}
                       onClick={() => router.push(`/${workspaceSlug}/projects/${projectId}/modules/${module.id}`)}
                     >
-                      {truncateText(module.name, 40)}
+                      <div className="flex items-center gap-1.5">
+                        <DiceIcon className="h-3 w-3" />
+                        {truncateText(module.name, 40)}
+                      </div>
                     </CustomMenu.MenuItem>
                   ))}
                 </CustomMenu>

web/components/headers/project-view-issues.tsx

@@ -17,7 +17,6 @@ import { IIssueDisplayFilterOptions, IIssueDisplayProperties, IIssueFilterOption
 import { ISSUE_DISPLAY_FILTERS_BY_LAYOUT } from "constants/issue";
 import { EFilterType } from "store/issues/types";
 import { EProjectStore } from "store/command-palette.store";
-import { EUserWorkspaceRoles } from "constants/workspace";
 
 export const ProjectViewIssuesHeader: React.FC = observer(() => {
   const router = useRouter();
@@ -36,7 +35,6 @@ export const ProjectViewIssuesHeader: React.FC = observer(() => {
     viewIssuesFilter: { issueFilters, updateFilters },
     commandPalette: commandPaletteStore,
     trackEvent: { setTrackElement },
-    user: { currentProjectRole },
   } = useMobxStore();
 
   const activeLayout = issueFilters?.displayFilters?.layout;
@@ -87,9 +85,6 @@ export const ProjectViewIssuesHeader: React.FC = observer(() => {
   const viewsList = projectId ? projectViewsStore.viewsList[projectId.toString()] : undefined;
   const viewDetails = viewId ? projectViewsStore.viewDetails[viewId.toString()] : undefined;
 
-  const canUserCreateIssue =
-    currentProjectRole && [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER].includes(currentProjectRole);
-
   return (
     <div className="relative z-10 flex h-[3.75rem] w-full items-center justify-between gap-x-2 gap-y-4 border-b border-custom-border-200 bg-custom-sidebar-background-100 p-4">
       <div className="flex items-center gap-2">
@@ -138,7 +133,10 @@ export const ProjectViewIssuesHeader: React.FC = observer(() => {
                     key={view.id}
                     onClick={() => router.push(`/${workspaceSlug}/projects/${projectId}/views/${view.id}`)}
                   >
-                    {truncateText(view.name, 40)}
+                    <div className="flex items-center gap-1.5">
+                      <PhotoFilterIcon height={12} width={12} />
+                      {truncateText(view.name, 40)}
+                    </div>
                   </CustomMenu.MenuItem>
                 ))}
               </CustomMenu>

web/components/modules/sidebar.tsx

@@ -144,7 +144,7 @@ export const ModuleDetailsSidebar: React.FC<Props> = observer((props) => {
   };
 
   const handleCopyText = () => {
-    copyUrlToClipboard(`${workspaceSlug}/projects/${projectId}/modules/${module?.id}`)
+    copyUrlToClipboard(`${workspaceSlug}/projects/${projectId}/modules/${moduleId}`)
       .then(() => {
         setToastAlert({
           type: "success",

web/components/onboarding/user-details.tsx

@@ -14,7 +14,7 @@ import { IUser } from "types";
 // services
 import { FileService } from "services/file.service";
 // assets
-import IssuesSvg from "public/onboarding/onboarding-issues.svg";
+import IssuesSvg from "public/onboarding/onboarding-issues.webp";
 
 const defaultValues: Partial<IUser> = {
   first_name: "",

web/components/workspace/views/default-view-list-item.tsx

@@ -3,7 +3,7 @@ import Link from "next/link";
 import { observer } from "mobx-react-lite";
 
 // icons
-import { Sparkles } from "lucide-react";
+import { PhotoFilterIcon } from "@plane/ui";
 // helpers
 import { truncateText } from "helpers/string.helper";
 
@@ -22,7 +22,7 @@ export const GlobalDefaultViewListItem: React.FC<Props> = observer((props) => {
           <div className="flex w-full items-center justify-between">
             <div className="flex items-center gap-4">
               <div className="grid h-10 w-10 place-items-center rounded bg-custom-background-90 group-hover:bg-custom-background-100">
-                <Sparkles size={14} strokeWidth={2} />
+                <PhotoFilterIcon className="h-3.5 w-3.5" />
               </div>
               <div className="flex flex-col">
                 <p className="truncate text-sm font-medium leading-4">{truncateText(view.label, 75)}</p>

web/pages/profile/activity.tsx

@@ -1,6 +1,5 @@
 import { ReactElement } from "react";
 import useSWR from "swr";
-import { useRouter } from "next/router";
 import Link from "next/link";
 // services
 import { UserService } from "services/user.service";
@@ -23,9 +22,6 @@ import { NextPageWithLayout } from "types/app";
 const userService = new UserService();
 
 const ProfileActivityPage: NextPageWithLayout = () => {
-  const router = useRouter();
-  const { workspaceSlug } = router.query;
-
   const { data: userActivity } = useSWR(USER_ACTIVITY, () => userService.getUserActivity());
 
   return (