diff --git a/web/components/custom-attributes/attribute-forms/file-attribute-form.tsx b/web/components/custom-attributes/attribute-forms/file-attribute-form.tsx index 41253e786..e2d60cbcf 100644 --- a/web/components/custom-attributes/attribute-forms/file-attribute-form.tsx +++ b/web/components/custom-attributes/attribute-forms/file-attribute-form.tsx @@ -1,7 +1,5 @@ // react-hook-form -import { Controller, useForm } from "react-hook-form"; -// headless ui -import { Disclosure } from "@headlessui/react"; +import { Controller } from "react-hook-form"; // components import { FileFormatsDropdown, FormComponentProps, Input } from "components/custom-attributes"; diff --git a/web/components/custom-attributes/index.ts b/web/components/custom-attributes/index.ts index b446e167c..679082d31 100644 --- a/web/components/custom-attributes/index.ts +++ b/web/components/custom-attributes/index.ts @@ -4,3 +4,4 @@ export * from "./delete-object-modal"; export * from "./input"; export * from "./object-modal"; export * from "./objects-list"; +export * from "./objects-select"; diff --git a/web/components/custom-attributes/objects-select.tsx b/web/components/custom-attributes/objects-select.tsx new file mode 100644 index 000000000..17b2ea8d9 --- /dev/null +++ b/web/components/custom-attributes/objects-select.tsx @@ -0,0 +1,54 @@ +import { useEffect } from "react"; + +import { useRouter } from "next/router"; + +// mobx +import { observer } from "mobx-react-lite"; +import { useMobxStore } from "lib/mobx/store-provider"; +// ui +import { CustomSearchSelect } from "components/ui"; + +type Props = { + onChange: (val: string | null) => void; + projectId: string; + value: string | null; +}; + +export const ObjectsSelect: React.FC = observer(({ onChange, projectId, value }) => { + const router = useRouter(); + const { workspaceSlug } = router.query; + + const { customAttributes: customAttributesStore } = useMobxStore(); + const { entities, fetchEntities } = customAttributesStore; + + const options: + | { + value: any; + query: string; + content: string; + }[] + | undefined = entities?.map((entity) => ({ + value: entity.id, + query: entity.display_name, + content: entity.display_name, + })); + options?.unshift({ value: null, query: "default", content: "Default" }); + + useEffect(() => { + if (!workspaceSlug) return; + + if (!entities) fetchEntities(workspaceSlug.toString(), projectId); + }, [entities, fetchEntities, projectId, workspaceSlug]); + + return ( + e.id === value)?.display_name ?? "Default"} + value={value} + maxHeight="md" + optionsClassName="!min-w-[10rem]" + onChange={onChange} + options={options} + position="right" + /> + ); +}); diff --git a/web/components/issues/form.tsx b/web/components/issues/form.tsx index ae8a01896..48cf67bf8 100644 --- a/web/components/issues/form.tsx +++ b/web/components/issues/form.tsx @@ -22,6 +22,7 @@ import { } from "components/issues/select"; import { CreateStateModal } from "components/states"; import { CreateLabelModal } from "components/labels"; +import { ObjectsSelect } from "components/custom-attributes"; // ui import { CustomMenu, Input, PrimaryButton, SecondaryButton, ToggleSwitch } from "components/ui"; import { TipTapEditor } from "components/tiptap"; @@ -33,15 +34,8 @@ import type { ICurrentUserResponse, IIssue, ISearchIssueResponse } from "types"; const defaultValues: Partial = { project: "", name: "", - description: { - type: "doc", - content: [ - { - type: "paragraph", - }, - ], - }, description_html: "

", + entity: null, estimate_point: null, state: "", parent: null, @@ -68,6 +62,7 @@ export interface IssueFormProps { | "project" | "name" | "description" + | "entity" | "state" | "priority" | "assignee" @@ -249,25 +244,38 @@ export const IssueForm: FC = ({ )}
-
- {(fieldsToShow.includes("all") || fieldsToShow.includes("project")) && ( - ( - { - onChange(val); - setActiveProject(val); - }} - /> - )} - /> - )} -

- {status ? "Update" : "Create"} Issue -

+
+
+ {(fieldsToShow.includes("all") || fieldsToShow.includes("project")) && ( + ( + { + onChange(val); + setActiveProject(val); + }} + /> + )} + /> + )} +

+ {status ? "Update" : "Create"} Issue +

+
+
+ {(fieldsToShow.includes("all") || fieldsToShow.includes("project")) && ( + ( + + )} + /> + )} +
{watch("parent") && (fieldsToShow.includes("all") || fieldsToShow.includes("parent")) && @@ -407,128 +415,133 @@ export const IssueForm: FC = ({ )} /> )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("priority")) && ( - ( - - )} - /> - )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("assignee")) && ( - ( - + {(fieldsToShow.includes("all") || fieldsToShow.includes("priority")) && ( + ( + + )} /> )} - /> - )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("label")) && ( - ( - ( + + )} /> )} - /> - )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("startDate")) && ( -
- ( - ( + + )} + /> + )} + {(fieldsToShow.includes("all") || fieldsToShow.includes("startDate")) && ( +
+ ( + + )} /> - )} - /> -
- )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("dueDate")) && ( -
- ( - + )} + {(fieldsToShow.includes("all") || fieldsToShow.includes("dueDate")) && ( +
+ ( + + )} /> - )} - /> -
- )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("estimate")) && ( -
- ( - - )} - /> -
- )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("parent")) && ( - ( - setParentIssueListModalOpen(false)} - onChange={(issue) => { - onChange(issue.id); - setSelectedParentIssue(issue); - }} - projectId={projectId} +
+ )} + {(fieldsToShow.includes("all") || fieldsToShow.includes("estimate")) && ( +
+ ( + + )} + /> +
+ )} + {(fieldsToShow.includes("all") || fieldsToShow.includes("parent")) && ( + ( + setParentIssueListModalOpen(false)} + onChange={(issue) => { + onChange(issue.id); + setSelectedParentIssue(issue); + }} + projectId={projectId} + /> + )} /> )} - /> - )} - {(fieldsToShow.includes("all") || fieldsToShow.includes("parent")) && ( - - {watch("parent") ? ( - <> - setParentIssueListModalOpen(true)} - > - Change parent issue - - setValue("parent", null)} - > - Remove parent issue - - - ) : ( - setParentIssueListModalOpen(true)} - > - Select Parent Issue - + {(fieldsToShow.includes("all") || fieldsToShow.includes("parent")) && ( + + {watch("parent") ? ( + <> + setParentIssueListModalOpen(true)} + > + Change parent issue + + setValue("parent", null)} + > + Remove parent issue + + + ) : ( + setParentIssueListModalOpen(true)} + > + Select Parent Issue + + )} + )} - + )}
diff --git a/web/types/issues.d.ts b/web/types/issues.d.ts index cc95dfa66..ca2232e06 100644 --- a/web/types/issues.d.ts +++ b/web/types/issues.d.ts @@ -2,19 +2,13 @@ import { KeyedMutator } from "swr"; import type { IState, IUser, - IProject, ICycle, IModule, IUserLite, IProjectLite, IWorkspaceLite, IStateLite, - TStateGroups, Properties, - IIssueFilterOptions, - TIssueGroupByOptions, - TIssueViewOptions, - TIssueOrderByOptions, IIssueDisplayFilterOptions, } from "types"; @@ -87,6 +81,7 @@ export interface IIssue { assignees_list: string[]; attachment_count: number; attachments: any[]; + entity: string | null; issue_relations: { id: string; issue: string;