From 8ea42aa0b6268670b573ad91235ac6e85d459f5f Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Wed, 6 Dec 2023 20:31:42 +0530 Subject: [PATCH] fix: remove all unused variables and added dependecies to useEffect and useCallback (#3013) --- .../filters/applied-filters/filters-list.tsx | 3 +- .../issues/filters/helpers/dropdown.tsx | 2 - space/components/issues/filters/selection.tsx | 4 +- space/components/issues/navbar/index.tsx | 14 +++++- space/lib/mobx/store-init.tsx | 8 +--- .../command-palette/command-pallette.tsx | 1 + web/components/cycles/sidebar.tsx | 4 +- web/components/headers/global-issues.tsx | 2 +- .../headers/project-view-issues.tsx | 3 -- web/components/issues/description-form.tsx | 6 +-- web/components/issues/form.tsx | 2 +- .../roots/global-view-root.tsx | 11 +---- .../header/display-filters/extra-options.tsx | 34 ++++++------- .../issues/issue-layouts/kanban/default.tsx | 2 + .../list/headers/empty-group.tsx | 2 +- .../issue-layouts/list/headers/priority.tsx | 2 +- .../issue-layouts/properties/assignee.tsx | 1 - .../roots/all-issue-layout-root.tsx | 5 +- .../spreadsheet/base-spreadsheet-root.tsx | 4 +- .../spreadsheet/quick-add-issue-form.tsx | 2 +- web/components/issues/modal.tsx | 48 +++++++++++-------- .../projects/[projectId]/pages/[pageId].tsx | 1 + web/pages/onboarding/index.tsx | 23 +++++---- 23 files changed, 89 insertions(+), 95 deletions(-) diff --git a/space/components/issues/filters/applied-filters/filters-list.tsx b/space/components/issues/filters/applied-filters/filters-list.tsx index 1a2e388d3..9b8432eb0 100644 --- a/space/components/issues/filters/applied-filters/filters-list.tsx +++ b/space/components/issues/filters/applied-filters/filters-list.tsx @@ -1,5 +1,4 @@ // components -import { AppliedLabelsFilters } from "./label"; import { AppliedPriorityFilters } from "./priority"; import { AppliedStateFilters } from "./state"; // icons @@ -20,7 +19,7 @@ type Props = { export const replaceUnderscoreIfSnakeCase = (str: string) => str.replace(/_/g, " "); export const AppliedFiltersList: React.FC = (props) => { - const { appliedFilters, handleRemoveAllFilters, handleRemoveFilter, labels, states } = props; + const { appliedFilters, handleRemoveAllFilters, handleRemoveFilter, states } = props; return (
diff --git a/space/components/issues/filters/helpers/dropdown.tsx b/space/components/issues/filters/helpers/dropdown.tsx index 5ce504c7f..d92415b96 100644 --- a/space/components/issues/filters/helpers/dropdown.tsx +++ b/space/components/issues/filters/helpers/dropdown.tsx @@ -4,8 +4,6 @@ import { Popover, Transition } from "@headlessui/react"; import { Placement } from "@popperjs/core"; // ui import { Button } from "@plane/ui"; -// icons -import { ChevronUp } from "lucide-react"; type Props = { children: React.ReactNode; diff --git a/space/components/issues/filters/selection.tsx b/space/components/issues/filters/selection.tsx index ac00b7fca..e0a141ef9 100644 --- a/space/components/issues/filters/selection.tsx +++ b/space/components/issues/filters/selection.tsx @@ -2,7 +2,7 @@ import React, { useState } from "react"; import { observer } from "mobx-react-lite"; import { Search, X } from "lucide-react"; // components -import { FilterLabels, FilterPriority, FilterState } from "./"; +import { FilterPriority, FilterState } from "./"; // types // filter helpers @@ -19,7 +19,7 @@ type Props = { }; export const FilterSelection: React.FC = observer((props) => { - const { filters, handleFilters, layoutDisplayFiltersOptions, labels, states } = props; + const { filters, handleFilters, layoutDisplayFiltersOptions, states } = props; const [filtersSearchQuery, setFiltersSearchQuery] = useState(""); diff --git a/space/components/issues/navbar/index.tsx b/space/components/issues/navbar/index.tsx index 68ac61def..bfaeb2466 100644 --- a/space/components/issues/navbar/index.tsx +++ b/space/components/issues/navbar/index.tsx @@ -105,7 +105,19 @@ const IssueNavbar = observer(() => { } } } - }, [board, workspace_slug, project_slug, router, projectStore, projectStore?.deploySettings, updateFilters]); + }, [ + board, + workspace_slug, + project_slug, + router, + projectStore, + projectStore?.deploySettings, + updateFilters, + labels, + states, + priorities, + peekId, + ]); return (
diff --git a/space/lib/mobx/store-init.tsx b/space/lib/mobx/store-init.tsx index 50bf1a853..bcefd203b 100644 --- a/space/lib/mobx/store-init.tsx +++ b/space/lib/mobx/store-init.tsx @@ -1,17 +1,11 @@ import { useEffect } from "react"; -// next imports -import { useRouter } from "next/router"; // js cookie import Cookie from "js-cookie"; // mobx store import { useMobxStore } from "lib/mobx/store-provider"; -import { RootStore } from "store/root"; const MobxStoreInit = () => { - const { user: userStore }: RootStore = useMobxStore(); - - const router = useRouter(); - const { states, labels, priorities } = router.query as { states: string[]; labels: string[]; priorities: string[] }; + const { user: userStore } = useMobxStore(); useEffect(() => { const authToken = Cookie.get("accessToken") || null; diff --git a/web/components/command-palette/command-pallette.tsx b/web/components/command-palette/command-pallette.tsx index 6891279b1..0bd7d7eb7 100644 --- a/web/components/command-palette/command-pallette.tsx +++ b/web/components/command-palette/command-pallette.tsx @@ -151,6 +151,7 @@ export const CommandPalette: FC = observer(() => { projectId, workspaceSlug, isAnyModalOpen, + setTrackElement, ] ); diff --git a/web/components/cycles/sidebar.tsx b/web/components/cycles/sidebar.tsx index 890a09f49..2074422f9 100644 --- a/web/components/cycles/sidebar.tsx +++ b/web/components/cycles/sidebar.tsx @@ -1,7 +1,6 @@ import React, { useEffect, useState } from "react"; import { useRouter } from "next/router"; import { observer } from "mobx-react-lite"; -import { mutate } from "swr"; import { useForm } from "react-hook-form"; import { Disclosure, Popover, Transition } from "@headlessui/react"; // mobx store @@ -32,7 +31,6 @@ import { // types import { ICycle } from "types"; // fetch-keys -import { CYCLE_DETAILS } from "constants/fetch-keys"; import { CYCLE_STATUS } from "constants/cycle"; type Props = { @@ -54,7 +52,7 @@ export const CycleDetailsSidebar: React.FC = observer((props) => { const { cycle: cycleDetailsStore, - trackEvent: { setTrackElement, postHogEventTracker }, + trackEvent: { setTrackElement }, } = useMobxStore(); const cycleDetails = cycleDetailsStore.cycle_details[cycleId] ?? undefined; diff --git a/web/components/headers/global-issues.tsx b/web/components/headers/global-issues.tsx index 964e14c8b..30caabfdb 100644 --- a/web/components/headers/global-issues.tsx +++ b/web/components/headers/global-issues.tsx @@ -12,7 +12,7 @@ import { Breadcrumbs, Button, LayersIcon, PhotoFilterIcon, Tooltip } from "@plan // icons import { List, PlusIcon, Sheet } from "lucide-react"; // types -import { IIssueDisplayFilterOptions, IIssueDisplayProperties, IIssueFilterOptions, TStaticViewTypes } from "types"; +import { IIssueDisplayFilterOptions, IIssueDisplayProperties, IIssueFilterOptions } from "types"; // constants import { ISSUE_DISPLAY_FILTERS_BY_LAYOUT } from "constants/issue"; import { EFilterType } from "store/issues/types"; diff --git a/web/components/headers/project-view-issues.tsx b/web/components/headers/project-view-issues.tsx index b5f28b706..2ba54ad34 100644 --- a/web/components/headers/project-view-issues.tsx +++ b/web/components/headers/project-view-issues.tsx @@ -27,7 +27,6 @@ export const ProjectViewIssuesHeader: React.FC = observer(() => { }; const { - projectViewFilters: projectViewFiltersStore, project: { currentProjectDetails }, projectLabel: { projectLabels }, projectMember: { projectMembers }, @@ -38,8 +37,6 @@ export const ProjectViewIssuesHeader: React.FC = observer(() => { trackEvent: { setTrackElement }, } = useMobxStore(); - const storedFilters = viewId ? projectViewFiltersStore.storedFilters[viewId.toString()] : undefined; - const activeLayout = issueFilters?.displayFilters?.layout; const handleLayoutChange = useCallback( diff --git a/web/components/issues/description-form.tsx b/web/components/issues/description-form.tsx index c61382a40..ff1fcaf19 100644 --- a/web/components/issues/description-form.tsx +++ b/web/components/issues/description-form.tsx @@ -63,7 +63,7 @@ export const IssueDescriptionForm: FC = (props) => { setLocalIssueDescription(issue.description_html); setLocalTitleValue(issue.name); } - }, [issue.id]); + }, [issue.id, issue.name, issue.description_html]); const handleDescriptionFormSubmit = useCallback( async (formData: Partial) => { @@ -86,7 +86,7 @@ export const IssueDescriptionForm: FC = (props) => { } else if (isSubmitting === "submitting") { setShowAlert(true); } - }, [isSubmitting, setShowAlert]); + }, [isSubmitting, setShowAlert, setIsSubmitting]); // reset form values useEffect(() => { @@ -147,7 +147,7 @@ export const IssueDescriptionForm: FC = (props) => { ( + render={({ field: { onChange } }) => ( = observer((props) => { project: projectId, ...initialData, }); - }, [setFocus, initialData, reset]); + }, [setFocus, initialData, projectId, reset]); // update projectId in form when projectId changes useEffect(() => { diff --git a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx index faf836d87..543d18645 100644 --- a/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx +++ b/web/components/issues/issue-layouts/filters/applied-filters/roots/global-view-root.tsx @@ -1,4 +1,3 @@ -import { useEffect } from "react"; import { useRouter } from "next/router"; import { observer } from "mobx-react-lite"; @@ -6,29 +5,21 @@ import { observer } from "mobx-react-lite"; import { useMobxStore } from "lib/mobx/store-provider"; // components import { AppliedFiltersList } from "components/issues"; -// ui -import { Button } from "@plane/ui"; -// helpers -import { areFiltersDifferent } from "helpers/filter.helper"; // types import { IIssueFilterOptions } from "types"; import { EFilterType } from "store/issues/types"; export const GlobalViewsAppliedFiltersRoot = observer(() => { const router = useRouter(); - const { workspaceSlug, globalViewId } = router.query as { workspaceSlug: string; globalViewId: string }; + const { workspaceSlug } = router.query as { workspaceSlug: string; globalViewId: string }; const { - globalViews: globalViewsStore, - globalViewFilters: globalViewFiltersStore, project: { workspaceProjects }, workspace: { workspaceLabels }, workspaceMember: { workspaceMembers }, workspaceGlobalIssuesFilter: { issueFilters, updateFilters }, } = useMobxStore(); - const viewDetails = globalViewId ? globalViewsStore.globalViewDetails[globalViewId.toString()] : undefined; - const userFilters = issueFilters?.filters; // filters whose value not null or empty array diff --git a/web/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx b/web/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx index 2b0b2086d..cb75b53f4 100644 --- a/web/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx +++ b/web/components/issues/issue-layouts/filters/header/display-filters/extra-options.tsx @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React from "react"; import { observer } from "mobx-react-lite"; // components @@ -20,28 +20,22 @@ type Props = { export const FilterExtraOptions: React.FC = observer((props) => { const { selectedExtraOptions, handleUpdate, enabledExtraOptions } = props; - const [previewEnabled, setPreviewEnabled] = useState(true); - const isExtraOptionEnabled = (option: TIssueExtraOptions) => enabledExtraOptions.includes(option); return ( - <> - {previewEnabled && ( -
- {ISSUE_EXTRA_OPTIONS.map((option) => { - if (!isExtraOptionEnabled(option.key)) return null; +
+ {ISSUE_EXTRA_OPTIONS.map((option) => { + if (!isExtraOptionEnabled(option.key)) return null; - return ( - handleUpdate(option.key, !selectedExtraOptions?.[option.key])} - title={option.title} - /> - ); - })} -
- )} - + return ( + handleUpdate(option.key, !selectedExtraOptions?.[option.key])} + title={option.title} + /> + ); + })} +
); }); diff --git a/web/components/issues/issue-layouts/kanban/default.tsx b/web/components/issues/issue-layouts/kanban/default.tsx index 0a527e845..6e2390d50 100644 --- a/web/components/issues/issue-layouts/kanban/default.tsx +++ b/web/components/issues/issue-layouts/kanban/default.tsx @@ -57,6 +57,7 @@ const GroupByKanBan: React.FC = observer((props) => { issueIds, sub_group_by, group_by, + // eslint-disable-next-line @typescript-eslint/no-unused-vars order_by, sub_group_id = "null", list, @@ -69,6 +70,7 @@ const GroupByKanBan: React.FC = observer((props) => { kanBanToggle, handleKanBanToggle, enableQuickIssueCreate, + // eslint-disable-next-line @typescript-eslint/no-unused-vars isDragStarted, quickAddCallback, viewId, diff --git a/web/components/issues/issue-layouts/list/headers/empty-group.tsx b/web/components/issues/issue-layouts/list/headers/empty-group.tsx index ef256332c..c7b16fe26 100644 --- a/web/components/issues/issue-layouts/list/headers/empty-group.tsx +++ b/web/components/issues/issue-layouts/list/headers/empty-group.tsx @@ -14,7 +14,7 @@ export interface IEmptyHeader { } export const EmptyHeader: React.FC = observer((props) => { - const { column_id, column_value, issues_count, disableIssueCreation, currentStore, addIssuesToView } = props; + const { column_value, issues_count, disableIssueCreation, currentStore, addIssuesToView } = props; return ( ( ); export const PriorityHeader: FC = observer((props) => { - const { column_id, column_value, issues_count, disableIssueCreation, currentStore, addIssuesToView } = props; + const { column_value, issues_count, disableIssueCreation, currentStore, addIssuesToView } = props; const priority = column_value ?? null; diff --git a/web/components/issues/issue-layouts/properties/assignee.tsx b/web/components/issues/issue-layouts/properties/assignee.tsx index 3d7f2c274..00656446d 100644 --- a/web/components/issues/issue-layouts/properties/assignee.tsx +++ b/web/components/issues/issue-layouts/properties/assignee.tsx @@ -38,7 +38,6 @@ export const IssuePropertyAssignee: React.FC = observer( optionsClassName, placement, multiple = false, - noLabelBorder = false, } = props; // store const { diff --git a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx index fe552bf0d..a45c8d867 100644 --- a/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx +++ b/web/components/issues/issue-layouts/roots/all-issue-layout-root.tsx @@ -5,7 +5,7 @@ import useSWR from "swr"; // mobx store import { useMobxStore } from "lib/mobx/store-provider"; // components -import { GlobalViewEmptyState, GlobalViewsAppliedFiltersRoot } from "components/issues"; +import { GlobalViewsAppliedFiltersRoot } from "components/issues"; import { SpreadsheetView } from "components/issues/issue-layouts"; import { AllIssueQuickActions } from "components/issues/issue-layouts/quick-action-dropdowns"; // ui @@ -81,7 +81,8 @@ export const AllIssueLayoutRoot: React.FC = observer((props) => { if (action === EIssueActions.UPDATE) await issueActions[action]!(issue); if (action === EIssueActions.DELETE) await issueActions[action]!(issue); }, - [getIssues] + // eslint-disable-next-line react-hooks/exhaustive-deps + [] ); const handleDisplayFiltersUpdate = useCallback( diff --git a/web/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx b/web/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx index 39c2d22a0..a995f0716 100644 --- a/web/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/base-spreadsheet-root.tsx @@ -63,7 +63,7 @@ export const BaseSpreadsheetRoot = observer((props: IBaseSpreadsheetRoot) => { issueActions[action]!(issue); } }, - [issueStore] + [issueActions] ); const handleDisplayFiltersUpdate = useCallback( @@ -80,7 +80,7 @@ export const BaseSpreadsheetRoot = observer((props: IBaseSpreadsheetRoot) => { viewId ); }, - [issueFiltersStore, projectId, workspaceSlug] + [issueFiltersStore, projectId, workspaceSlug, viewId] ); return ( diff --git a/web/components/issues/issue-layouts/spreadsheet/quick-add-issue-form.tsx b/web/components/issues/issue-layouts/spreadsheet/quick-add-issue-form.tsx index b663ed523..9189a9a59 100644 --- a/web/components/issues/issue-layouts/spreadsheet/quick-add-issue-form.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/quick-add-issue-form.tsx @@ -56,7 +56,7 @@ const Inputs = (props: any) => { }; export const SpreadsheetQuickAddIssueForm: React.FC = observer((props) => { - const { formKey, groupId, subGroupId = null, prePopulatedData, quickAddCallback, viewId } = props; + const { formKey, prePopulatedData, quickAddCallback, viewId } = props; // router const router = useRouter(); diff --git a/web/components/issues/modal.tsx b/web/components/issues/modal.tsx index 062aba141..e195d21bf 100644 --- a/web/components/issues/modal.tsx +++ b/web/components/issues/modal.tsx @@ -82,7 +82,7 @@ export const CreateUpdateIssueModal: React.FC = observer((prop moduleIssues: moduleIssueStore, user: userStore, trackEvent: { postHogEventTracker }, - workspace: { currentWorkspace } + workspace: { currentWorkspace }, } = useMobxStore(); const user = userStore.currentUser; @@ -216,7 +216,7 @@ export const CreateUpdateIssueModal: React.FC = observer((prop // in the url. This has the least priority. if (projects && projects.length > 0 && !activeProject) setActiveProject(projects?.find((p) => p.id === projectId)?.id ?? projects?.[0].id ?? null); - }, [data, projectId, projects, isOpen]); + }, [data, projectId, projects, isOpen, activeProject]); const addIssueToCycle = async (issue: IIssue, cycleId: string) => { if (!workspaceSlug || !activeProject) return; @@ -251,14 +251,16 @@ export const CreateUpdateIssueModal: React.FC = observer((prop title: "Success!", message: "Issue created successfully.", }); - postHogEventTracker("ISSUE_CREATED", { - ...res, - state: "SUCCESS", - }, + postHogEventTracker( + "ISSUE_CREATED", + { + ...res, + state: "SUCCESS", + }, { isGrouping: true, groupType: "Workspace_metrics", - gorupId: currentWorkspace?.id! + gorupId: currentWorkspace?.id!, } ); if (payload.parent && payload.parent !== "") mutate(SUB_ISSUES(payload.parent)); @@ -270,13 +272,15 @@ export const CreateUpdateIssueModal: React.FC = observer((prop title: "Error!", message: "Issue could not be created. Please try again.", }); - postHogEventTracker("ISSUE_CREATED", { - state: "FAILED", - }, + postHogEventTracker( + "ISSUE_CREATED", + { + state: "FAILED", + }, { isGrouping: true, groupType: "Workspace_metrics", - gorupId: currentWorkspace?.id! + gorupId: currentWorkspace?.id!, } ); }); @@ -330,14 +334,16 @@ export const CreateUpdateIssueModal: React.FC = observer((prop title: "Success!", message: "Issue updated successfully.", }); - postHogEventTracker("ISSUE_UPDATED", { - ...res, - state: "SUCCESS", - }, + postHogEventTracker( + "ISSUE_UPDATED", + { + ...res, + state: "SUCCESS", + }, { isGrouping: true, groupType: "Workspace_metrics", - gorupId: currentWorkspace?.id! + gorupId: currentWorkspace?.id!, } ); }) @@ -347,13 +353,15 @@ export const CreateUpdateIssueModal: React.FC = observer((prop title: "Error!", message: "Issue could not be updated. Please try again.", }); - postHogEventTracker("ISSUE_UPDATED", { - state: "FAILED", - }, + postHogEventTracker( + "ISSUE_UPDATED", + { + state: "FAILED", + }, { isGrouping: true, groupType: "Workspace_metrics", - gorupId: currentWorkspace?.id! + gorupId: currentWorkspace?.id!, } ); }); diff --git a/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx b/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx index b963207db..1f4650485 100644 --- a/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx +++ b/web/pages/[workspaceSlug]/projects/[projectId]/pages/[pageId].tsx @@ -38,6 +38,7 @@ const pageService = new PageService(); const PageDetailsPage: NextPageWithLayout = observer(() => { const editorRef = useRef(null); // states + // eslint-disable-next-line @typescript-eslint/no-unused-vars const [isSubmitting, setIsSubmitting] = useState<"submitting" | "submitted" | "saved">("saved"); const [gptModalOpen, setGptModal] = useState(false); // store diff --git a/web/pages/onboarding/index.tsx b/web/pages/onboarding/index.tsx index 72f9fecfe..536abd070 100644 --- a/web/pages/onboarding/index.tsx +++ b/web/pages/onboarding/index.tsx @@ -36,7 +36,7 @@ const OnboardingPage: NextPageWithLayout = observer(() => { const { user: { currentUser, updateCurrentUser, updateUserOnBoard }, workspace: workspaceStore, - trackEvent: { postHogEventTracker } + trackEvent: { postHogEventTracker }, } = useMobxStore(); const router = useRouter(); @@ -78,19 +78,18 @@ const OnboardingPage: NextPageWithLayout = observer(() => { const finishOnboarding = async () => { if (!user || !workspaces) return; - await updateUserOnBoard().then(() => { - postHogEventTracker( - "USER_ONBOARDING_COMPLETE", - { + await updateUserOnBoard() + .then(() => { + postHogEventTracker("USER_ONBOARDING_COMPLETE", { user_role: user.role, email: user.email, user_id: user.id, - status: "SUCCESS" - } - ) - }).catch((error) => { - console.log(error); - }) + status: "SUCCESS", + }); + }) + .catch((error) => { + console.log(error); + }); router.replace(`/${workspaces[0].slug}`); }; @@ -133,7 +132,7 @@ const OnboardingPage: NextPageWithLayout = observer(() => { }; handleStepChange(); - }, [user, invitations, step]); + }, [user, invitations, step, updateCurrentUser, workspaces]); return ( <>