Prateek ShouryaandGitHub
9cfde896b3
* [WEB-5134] refactor: update `web` ESLint configuration and refactor imports to use type imports - Enhanced ESLint configuration by adding new rules for import consistency and type imports. - Refactored multiple files to replace regular imports with type imports for better clarity and performance. - Ensured consistent use of type imports across the application to align with TypeScript best practices. * refactor: standardize type imports across components - Updated multiple files to replace regular imports with type imports for improved clarity and consistency. - Ensured adherence to TypeScript best practices in the rich filters and issue layouts components.
56 lines
1.9 KiB
TypeScript
56 lines
1.9 KiB
TypeScript
import type { FC } from "react";
|
|
import React from "react";
|
|
import { observer } from "mobx-react";
|
|
import { MODULE_STATUS } from "@plane/constants";
|
|
import { useTranslation } from "@plane/i18n";
|
|
import type { TModuleStatus } from "@plane/propel/icons";
|
|
import { ModuleStatusIcon } from "@plane/propel/icons";
|
|
import type { IModule } from "@plane/types";
|
|
import { CustomSelect } from "@plane/ui";
|
|
|
|
type Props = {
|
|
isDisabled: boolean;
|
|
moduleDetails: IModule;
|
|
handleModuleDetailsChange: (payload: Partial<IModule>) => Promise<void>;
|
|
};
|
|
|
|
export const ModuleStatusDropdown: FC<Props> = observer((props: Props) => {
|
|
const { isDisabled, moduleDetails, handleModuleDetailsChange } = props;
|
|
const { t } = useTranslation();
|
|
const moduleStatus = MODULE_STATUS.find((status) => status.value === moduleDetails.status);
|
|
|
|
if (!moduleStatus) return <></>;
|
|
|
|
return (
|
|
<CustomSelect
|
|
customButton={
|
|
<span
|
|
className={`flex h-6 w-20 items-center justify-center rounded-sm text-center text-xs ${
|
|
isDisabled ? "cursor-not-allowed" : "cursor-pointer"
|
|
}`}
|
|
style={{
|
|
color: moduleStatus ? moduleStatus.color : "#a3a3a2",
|
|
backgroundColor: moduleStatus ? `${moduleStatus.color}20` : "#a3a3a220",
|
|
}}
|
|
>
|
|
{(moduleStatus && t(moduleStatus?.i18n_label)) ?? t("project_modules.status.backlog")}
|
|
</span>
|
|
}
|
|
value={moduleStatus?.value}
|
|
onChange={(val: TModuleStatus) => {
|
|
handleModuleDetailsChange({ status: val });
|
|
}}
|
|
disabled={isDisabled}
|
|
>
|
|
{MODULE_STATUS.map((status) => (
|
|
<CustomSelect.Option key={status.value} value={status.value}>
|
|
<div className="flex items-center gap-2">
|
|
<ModuleStatusIcon status={status.value} />
|
|
{t(status.i18n_label)}
|
|
</div>
|
|
</CustomSelect.Option>
|
|
))}
|
|
</CustomSelect>
|
|
);
|
|
});
|