fix: remove all unused variables and added dependecies to useEffect and useCallback (#3013)

This commit is contained in:
Aaryan Khandelwal 2023-12-06 20:31:42 +05:30 committed by Aaryan Khandelwal
parent a510ffcdf9
commit 8cbf77e993
23 changed files with 89 additions and 95 deletions

View File

@ -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> = (props) => {
const { appliedFilters, handleRemoveAllFilters, handleRemoveFilter, labels, states } = props;
const { appliedFilters, handleRemoveAllFilters, handleRemoveFilter, states } = props;
return (
<div className="flex items-stretch gap-2 flex-wrap bg-custom-background-100">

View File

@ -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;

View File

@ -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<Props> = observer((props) => {
const { filters, handleFilters, layoutDisplayFiltersOptions, labels, states } = props;
const { filters, handleFilters, layoutDisplayFiltersOptions, states } = props;
const [filtersSearchQuery, setFiltersSearchQuery] = useState("");

View File

@ -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 (
<div className="relative flex w-full items-center gap-4 px-5">

View File

@ -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;

View File

@ -151,6 +151,7 @@ export const CommandPalette: FC = observer(() => {
projectId,
workspaceSlug,
isAnyModalOpen,
setTrackElement,
]
);

View File

@ -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<Props> = observer((props) => {
const {
cycle: cycleDetailsStore,
trackEvent: { setTrackElement, postHogEventTracker },
trackEvent: { setTrackElement },
} = useMobxStore();
const cycleDetails = cycleDetailsStore.cycle_details[cycleId] ?? undefined;

View File

@ -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";

View File

@ -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(

View File

@ -63,7 +63,7 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = (props) => {
setLocalIssueDescription(issue.description_html);
setLocalTitleValue(issue.name);
}
}, [issue.id]);
}, [issue.id, issue.name, issue.description_html]);
const handleDescriptionFormSubmit = useCallback(
async (formData: Partial<IIssue>) => {
@ -86,7 +86,7 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = (props) => {
} else if (isSubmitting === "submitting") {
setShowAlert(true);
}
}, [isSubmitting, setShowAlert]);
}, [isSubmitting, setShowAlert, setIsSubmitting]);
// reset form values
useEffect(() => {
@ -147,7 +147,7 @@ export const IssueDescriptionForm: FC<IssueDetailsProps> = (props) => {
<Controller
name="description_html"
control={control}
render={({ field: { value, onChange } }) => (
render={({ field: { onChange } }) => (
<RichTextEditor
cancelUploadImage={fileService.cancelUpload}
uploadFile={fileService.getUploadFileFunction(workspaceSlug)}

View File

@ -229,7 +229,7 @@ export const IssueForm: FC<IssueFormProps> = observer((props) => {
project: projectId,
...initialData,
});
}, [setFocus, initialData, reset]);
}, [setFocus, initialData, projectId, reset]);
// update projectId in form when projectId changes
useEffect(() => {

View File

@ -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

View File

@ -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<Props> = observer((props) => {
const { selectedExtraOptions, handleUpdate, enabledExtraOptions } = props;
const [previewEnabled, setPreviewEnabled] = useState(true);
const isExtraOptionEnabled = (option: TIssueExtraOptions) => enabledExtraOptions.includes(option);
return (
<>
{previewEnabled && (
<div>
{ISSUE_EXTRA_OPTIONS.map((option) => {
if (!isExtraOptionEnabled(option.key)) return null;
<div>
{ISSUE_EXTRA_OPTIONS.map((option) => {
if (!isExtraOptionEnabled(option.key)) return null;
return (
<FilterOption
key={option.key}
isChecked={selectedExtraOptions?.[option.key] ? true : false}
onClick={() => handleUpdate(option.key, !selectedExtraOptions?.[option.key])}
title={option.title}
/>
);
})}
</div>
)}
</>
return (
<FilterOption
key={option.key}
isChecked={selectedExtraOptions?.[option.key] ? true : false}
onClick={() => handleUpdate(option.key, !selectedExtraOptions?.[option.key])}
title={option.title}
/>
);
})}
</div>
);
});

View File

@ -57,6 +57,7 @@ const GroupByKanBan: React.FC<IGroupByKanBan> = 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<IGroupByKanBan> = observer((props) => {
kanBanToggle,
handleKanBanToggle,
enableQuickIssueCreate,
// eslint-disable-next-line @typescript-eslint/no-unused-vars
isDragStarted,
quickAddCallback,
viewId,

View File

@ -14,7 +14,7 @@ export interface IEmptyHeader {
}
export const EmptyHeader: React.FC<IEmptyHeader> = observer((props) => {
const { column_id, column_value, issues_count, disableIssueCreation, currentStore, addIssuesToView } = props;
const { column_value, issues_count, disableIssueCreation, currentStore, addIssuesToView } = props;
return (
<HeaderGroupByCard

View File

@ -42,7 +42,7 @@ const Icon = ({ priority }: any) => (
);
export const PriorityHeader: FC<IPriorityHeader> = 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;

View File

@ -38,7 +38,6 @@ export const IssuePropertyAssignee: React.FC<IIssuePropertyAssignee> = observer(
optionsClassName,
placement,
multiple = false,
noLabelBorder = false,
} = props;
// store
const {

View File

@ -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<Props> = 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(

View File

@ -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 (

View File

@ -56,7 +56,7 @@ const Inputs = (props: any) => {
};
export const SpreadsheetQuickAddIssueForm: React.FC<Props> = observer((props) => {
const { formKey, groupId, subGroupId = null, prePopulatedData, quickAddCallback, viewId } = props;
const { formKey, prePopulatedData, quickAddCallback, viewId } = props;
// router
const router = useRouter();

View File

@ -82,7 +82,7 @@ export const CreateUpdateIssueModal: React.FC<IssuesModalProps> = 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<IssuesModalProps> = 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<IssuesModalProps> = 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<IssuesModalProps> = 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<IssuesModalProps> = 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<IssuesModalProps> = 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!,
}
);
});

View File

@ -38,6 +38,7 @@ const pageService = new PageService();
const PageDetailsPage: NextPageWithLayout = observer(() => {
const editorRef = useRef<any>(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

View File

@ -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 (
<>