diff --git a/src/app/deals/components/shared/DealCard/DealCard.tsx b/src/app/deals/components/shared/DealCard/DealCard.tsx index e5e499e..1e445b7 100644 --- a/src/app/deals/components/shared/DealCard/DealCard.tsx +++ b/src/app/deals/components/shared/DealCard/DealCard.tsx @@ -9,6 +9,7 @@ import useIsMobile from "@/hooks/utils/useIsMobile"; import { DealSchema } from "@/lib/client"; import { ModuleNames } from "@/modules/modules"; import styles from "./DealCard.module.css"; +import DealTags from "@/components/ui/DealTags/DealTags"; type Props = { deal: DealSchema; @@ -100,6 +101,7 @@ const DealCard = ({ deal, isInGroup = false }: Props) => { )} + {!deal.group && } ); diff --git a/src/app/deals/components/shared/DealsGroup/DealsGroup.tsx b/src/app/deals/components/shared/DealsGroup/DealsGroup.tsx index 1fdb491..fc08f9a 100644 --- a/src/app/deals/components/shared/DealsGroup/DealsGroup.tsx +++ b/src/app/deals/components/shared/DealsGroup/DealsGroup.tsx @@ -7,6 +7,7 @@ import { useDebouncedValue } from "@mantine/hooks"; import GroupMenu from "@/app/deals/components/mobile/GroupMenu/GroupMenu"; import DealCard from "@/app/deals/components/shared/DealCard/DealCard"; import { useDealsContext } from "@/app/deals/contexts/DealsContext"; +import DealTags from "@/components/ui/DealTags/DealTags"; import useIsMobile from "@/hooks/utils/useIsMobile"; import GroupWithDealsSchema from "@/types/GroupWithDealsSchema"; import styles from "./DealsGroup.module.css"; @@ -87,6 +88,12 @@ const DealsGroup: FC = ({ group }) => { key={deal.id} /> ))} + {group.items.length > 0 && ( + + )} ); }; diff --git a/src/app/deals/contexts/ProjectsContext.tsx b/src/app/deals/contexts/ProjectsContext.tsx index c314d12..c95cd3b 100644 --- a/src/app/deals/contexts/ProjectsContext.tsx +++ b/src/app/deals/contexts/ProjectsContext.tsx @@ -33,6 +33,8 @@ const useProjectsContextState = (): ProjectsContextState => { [projects, selectedProjectId] ); + console.log(selectedProject); + const modulesSet = useMemo( () => new Set( diff --git a/src/components/layout/Navbar/hooks/useProjectActions.tsx b/src/components/layout/Navbar/hooks/useProjectActions.tsx index 81d78a1..84f9c4b 100644 --- a/src/components/layout/Navbar/hooks/useProjectActions.tsx +++ b/src/components/layout/Navbar/hooks/useProjectActions.tsx @@ -3,7 +3,8 @@ import { useProjectsContext } from "@/app/deals/contexts/ProjectsContext"; import { useDrawersContext } from "@/drawers/DrawersContext"; const useProjectActions = () => { - const { selectedProject, projectsCrud } = useProjectsContext(); + const { selectedProject, projectsCrud, refetchProjects } = + useProjectsContext(); const { openDrawer } = useDrawersContext(); const onCreateClick = () => { @@ -27,6 +28,7 @@ const useProjectActions = () => { onChange: value => projectsCrud.onUpdate(value.id, value), onDelete: projectsCrud.onDelete, }, + onClose: refetchProjects, }); }; diff --git a/src/components/ui/DealTag/DealTag.tsx b/src/components/ui/DealTag/DealTag.tsx new file mode 100644 index 0000000..4de86c0 --- /dev/null +++ b/src/components/ui/DealTag/DealTag.tsx @@ -0,0 +1,34 @@ +import { lighten, Pill, useMantineColorScheme } from "@mantine/core"; +import { DealTagSchema } from "@/lib/client"; + +type Props = { + tag: Partial; +}; + +const DealTag = ({ tag }: Props) => { + const theme = useMantineColorScheme(); + const isInherit = tag.tagColor!.backgroundColor === "inherit"; + + let color = tag.tagColor!.color; + const backgroundColor = tag.tagColor!.backgroundColor; + + if (!(theme.colorScheme === "dark" || isInherit)) { + color = lighten(color, 0.95); + } + + return ( + + {tag.name} + + ); +}; + +export default DealTag; diff --git a/src/components/ui/DealTags/DealTags.module.css b/src/components/ui/DealTags/DealTags.module.css new file mode 100644 index 0000000..0e88cc9 --- /dev/null +++ b/src/components/ui/DealTags/DealTags.module.css @@ -0,0 +1,30 @@ +.add-tag-button { + @mixin light { + background-color: var(--mantine-color-gray-1); + } + @mixin dark { + background-color: var(--mantine-color-dark-6); + } + color: gray; + border: 1px gray dashed; + border-radius: 50%; + width: 1.5rem; + height: 1.5rem; + padding: 0; + cursor: pointer; +} + +.add-tag-button:hover { + @mixin light { + border-color: black; + color: black; + } + @mixin dark { + border-color: white; + color: white; + } +} + +.add-tag-button-icon { + color: inherit !important; +} diff --git a/src/components/ui/DealTags/DealTags.tsx b/src/components/ui/DealTags/DealTags.tsx new file mode 100644 index 0000000..519a4c9 --- /dev/null +++ b/src/components/ui/DealTags/DealTags.tsx @@ -0,0 +1,93 @@ +import React, { useMemo } from "react"; +import { IconPlus } from "@tabler/icons-react"; +import classNames from "classnames"; +import { Button, Center, Checkbox, Group, Menu, Stack } from "@mantine/core"; +import { useProjectsContext } from "@/app/deals/contexts/ProjectsContext"; +import DealTag from "@/components/ui/DealTag/DealTag"; +import useDealTags from "@/components/ui/DealTags/hooks/useDealTags"; +import { DealTagSchema } from "@/lib/client"; +import styles from "./DealTags.module.css"; + +type Props = { + dealId?: number; + groupId?: number; + tags: DealTagSchema[]; +}; + +const DealTags = ({ tags, dealId, groupId }: Props) => { + const { selectedProject } = useProjectsContext(); + const { switchTag } = useDealTags(); + const tagIdsSet = useMemo(() => new Set(tags.map(t => t.id)), [tags]); + + if (selectedProject?.tags.length === 0) return; + + const onTagClick = (tagId: number, event: MouseEvent) => { + event.preventDefault(); + event.stopPropagation(); + + switchTag({ dealId, groupId, tagId }); + }; + + const addTagButton = useMemo( + () => ( + + + + + + e.stopPropagation()}> + {selectedProject?.tags.map(tag => ( + + + onTagClick( + tag.id, + event as unknown as any + ) + } + label={tag.name} + /> + + ))} + + + + ), + [selectedProject?.tags, tags] + ); + + return ( + + {addTagButton} + {selectedProject?.tags.map( + tag => + tagIdsSet.has(tag.id) && ( + + ) + )} + + ); +}; + +export default DealTags; diff --git a/src/components/ui/DealTags/hooks/useDealTags.ts b/src/components/ui/DealTags/hooks/useDealTags.ts new file mode 100644 index 0000000..eded4b4 --- /dev/null +++ b/src/components/ui/DealTags/hooks/useDealTags.ts @@ -0,0 +1,25 @@ +import { useMutation } from "@tanstack/react-query"; +import { useDealsContext } from "@/app/deals/contexts/DealsContext"; +import { SwitchDealTagRequest } from "@/lib/client"; +import { switchDealTagMutation } from "@/lib/client/@tanstack/react-query.gen"; + +const useDealTags = () => { + const { refetchDeals } = useDealsContext(); + + const switchTagMutation = useMutation({ + ...switchDealTagMutation(), + onSettled: refetchDeals, + }); + + const switchTag = (data: SwitchDealTagRequest) => { + switchTagMutation.mutate({ + body: data, + }); + }; + + return { + switchTag, + }; +}; + +export default useDealTags; diff --git a/src/drawers/common/ProjectEditorDrawer/components/ProjectEditorBody.tsx b/src/drawers/common/ProjectEditorDrawer/components/ProjectEditorBody.tsx index baf99e9..2e482e0 100644 --- a/src/drawers/common/ProjectEditorDrawer/components/ProjectEditorBody.tsx +++ b/src/drawers/common/ProjectEditorDrawer/components/ProjectEditorBody.tsx @@ -1,9 +1,13 @@ import { FC } from "react"; -import { IconBlocks, IconEdit } from "@tabler/icons-react"; +import { IconBlocks, IconEdit, IconTags } from "@tabler/icons-react"; import { Tabs } from "@mantine/core"; +import { + GeneralTab, + ModulesTab, +} from "@/drawers/common/ProjectEditorDrawer/tabs"; +import TagsTab from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/TagsTab"; import { ProjectSchema } from "@/lib/client"; import styles from "../ProjectEditorDrawer.module.css"; -import { GeneralTab, ModulesTab } from "@/drawers/common/ProjectEditorDrawer/tabs"; type Props = { value: ProjectSchema; @@ -27,13 +31,21 @@ const ProjectEditorBody: FC = props => { leftSection={}> Модули + }> + Теги + - + - + + + + ); }; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/TagsTab.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/TagsTab.tsx new file mode 100644 index 0000000..9ea05e5 --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/TagsTab.tsx @@ -0,0 +1,26 @@ +import { FC } from "react"; +import { Flex } from "@mantine/core"; +import TagsTabHeader from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTabHeader"; +import TagsTable from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTable"; +import { DealTagsContextProvider } from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/contexts/DealTagsContext"; +import { ProjectSchema } from "@/lib/client"; + +type Props = { + value: ProjectSchema; +}; + +const TagsTab: FC = ({ value }) => { + return ( + + + + + + + ); +}; + +export default TagsTab; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagColorInput.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagColorInput.tsx new file mode 100644 index 0000000..cffac0d --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagColorInput.tsx @@ -0,0 +1,60 @@ +"use client"; + +import { IconCheck } from "@tabler/icons-react"; +import { Group, SelectProps } from "@mantine/core"; +import ObjectSelect, { + ObjectSelectProps, +} from "@/components/selects/ObjectSelect/ObjectSelect"; +import DealTag from "@/components/ui/DealTag/DealTag"; +import { DealTagColorSchema } from "@/lib/client"; +import useTagColorList from "../hooks/useTagColorList"; + +type Props = Omit< + ObjectSelectProps, + "data" | "getValueFn" | "getLabelFn" +>; + +const TagColorInput = (props: Props) => { + const { colors } = useTagColorList(); + const colorsMap = new Map( + colors.map( + color => + [color.id.toString(), color] as [string, DealTagColorSchema] + ) + ); + + const renderSelectOption: SelectProps["renderOption"] = ({ + option, + checked, + }) => { + const tag = { + id: Number(option.value), + name: "Тег-пример", + tagColor: colorsMap.get(option.value), + }; + + return ( + + + {option.label} + {checked && } + + ); + }; + + return ( + color.id.toString()} + getLabelFn={color => color.label} + searchable + {...props} + /> + ); +}; + +export default TagColorInput; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTabHeader.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTabHeader.tsx new file mode 100644 index 0000000..72c6646 --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTabHeader.tsx @@ -0,0 +1,21 @@ +import { IconPlus } from "@tabler/icons-react"; +import { Group } from "@mantine/core"; +import InlineButton from "@/components/ui/InlineButton/InlineButton"; +import useDealTagActions from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useDealTagActions"; + +const TagsTabHeader = () => { + const { onCreateClick } = useDealTagActions(); + + return ( + + + + Создать + + + ); +}; + +export default TagsTabHeader; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTable.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTable.tsx new file mode 100644 index 0000000..47155bb --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagsTable.tsx @@ -0,0 +1,38 @@ +import { IconMoodSad } from "@tabler/icons-react"; +import { Group, Text } from "@mantine/core"; +import BaseTable from "@/components/ui/BaseTable/BaseTable"; +import { useDealTagsContext } from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/contexts/DealTagsContext"; +import tagsTableColumns from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/tagsTableColumns"; +import useDealTagActions from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useDealTagActions"; + +const TagsTable = () => { + const { dealTags, dealTagsCrud } = useDealTagsContext(); + const { onChangeClick } = useDealTagActions(); + + const columns = tagsTableColumns({ + onDelete: dealTagsCrud.onDelete, + onChange: onChangeClick, + }); + + return ( + + Нет тегов + + + } + /> + ); +}; + +export default TagsTable; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/contexts/DealTagsContext.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/contexts/DealTagsContext.tsx new file mode 100644 index 0000000..6776bbc --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/contexts/DealTagsContext.tsx @@ -0,0 +1,38 @@ +"use dealTag"; + +import { DealTagsCrud, useDealTagsCrud } from "@/hooks/cruds/useDealTagsCrud"; +import useDealTagsList from "@/hooks/lists/useDealTagsList"; +import { DealTagSchema, ProjectSchema } from "@/lib/client"; +import makeContext from "@/lib/contextFactory/contextFactory"; + +type DealTagsContextState = { + dealTags: DealTagSchema[]; + refetchDealTags: () => void; + project: ProjectSchema; + dealTagsCrud: DealTagsCrud; +}; + +type Props = { + project: ProjectSchema; +}; + +const useDealTagsContextState = ({ project }: Props): DealTagsContextState => { + const dealTagsList = useDealTagsList({ projectId: project.id }); + + const dealTagsCrud = useDealTagsCrud({ + ...dealTagsList, + projectId: project.id, + }); + + return { + dealTags: dealTagsList.dealTags, + refetchDealTags: dealTagsList.refetch, + project, + dealTagsCrud, + }; +}; + +export const [DealTagsContextProvider, useDealTagsContext] = makeContext< + DealTagsContextState, + Props +>(useDealTagsContextState, "DealTags"); diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/tagsTableColumns.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/tagsTableColumns.tsx new file mode 100644 index 0000000..ebfda7c --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/tagsTableColumns.tsx @@ -0,0 +1,49 @@ +import { useMemo } from "react"; +import { DataTableColumn } from "mantine-datatable"; +import { Center } from "@mantine/core"; +import UpdateDeleteTableActions from "@/components/ui/BaseTable/components/UpdateDeleteTableActions"; +import DealTag from "@/components/ui/DealTag/DealTag"; +import { DealTagSchema } from "@/lib/client"; + +type Props = { + onDelete: (tag: DealTagSchema) => void; + onChange: (tag: DealTagSchema) => void; +}; + +const useTagsTableColumns = ({ onDelete, onChange }: Props) => { + return useMemo( + () => + [ + { + accessor: "actions", + title:
Действия
, + width: "0%", + render: tag => ( + onDelete(tag)} + onChange={() => onChange(tag)} + /> + ), + }, + { + title: "Название", + accessor: "name", + width: 2, + }, + { + title: "Цвет", + accessor: "tagColor.label", + width: 2, + }, + { + title: "Пример", + accessor: "tagColor", + width: 3, + render: tag => , + }, + ] as DataTableColumn[], + [] + ); +}; + +export default useTagsTableColumns; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useDealTagActions.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useDealTagActions.tsx new file mode 100644 index 0000000..0421195 --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useDealTagActions.tsx @@ -0,0 +1,37 @@ +import { modals } from "@mantine/modals"; +import { useDealTagsContext } from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/contexts/DealTagsContext"; +import { DealTagSchema } from "@/lib/client"; + +const useDealTagActions = () => { + const { dealTagsCrud } = useDealTagsContext(); + + const onChangeClick = (tag: DealTagSchema) => { + modals.openContextModal({ + modal: "dealTagModal", + innerProps: { + entity: tag, + onChange: data => dealTagsCrud.onUpdate(tag.id, data), + isEditing: true, + }, + withCloseButton: false, + }); + }; + + const onCreateClick = () => { + modals.openContextModal({ + modal: "dealTagModal", + innerProps: { + onCreate: dealTagsCrud.onCreate, + isEditing: false, + }, + withCloseButton: false, + }); + }; + + return { + onChangeClick, + onCreateClick, + }; +}; + +export default useDealTagActions; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useTagColorList.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useTagColorList.tsx new file mode 100644 index 0000000..a10c972 --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/hooks/useTagColorList.tsx @@ -0,0 +1,13 @@ +import { useQuery } from "@tanstack/react-query"; +import { getDealTagColorsOptions } from "@/lib/client/@tanstack/react-query.gen"; + +const useTagColorList = () => { + const { data, refetch } = useQuery(getDealTagColorsOptions()); + + return { + colors: data?.items ?? [], + refetch, + }; +}; + +export default useTagColorList; diff --git a/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/modals/DealTagModal.tsx b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/modals/DealTagModal.tsx new file mode 100644 index 0000000..46ebc0c --- /dev/null +++ b/src/drawers/common/ProjectEditorDrawer/tabs/TagsTab/modals/DealTagModal.tsx @@ -0,0 +1,68 @@ +"use client"; + +import { Stack, TextInput } from "@mantine/core"; +import { useForm } from "@mantine/form"; +import { ContextModalProps } from "@mantine/modals"; +import TagColorInput from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/components/TagColorInput"; +import { + CreateDealTagSchema, + DealTagSchema, + UpdateDealTagSchema, +} from "@/lib/client"; +import BaseFormModal, { + CreateEditFormProps, +} from "@/modals/base/BaseFormModal/BaseFormModal"; + +type Props = CreateEditFormProps< + CreateDealTagSchema, + UpdateDealTagSchema, + DealTagSchema +>; + +const DealTagModal = ({ + context, + id, + innerProps, +}: ContextModalProps) => { + const initialValues: Partial = innerProps.isEditing + ? innerProps.entity + : { + name: "", + tagColor: undefined, + tagColorId: undefined, + }; + + const form = useForm>({ + initialValues, + validate: { + name: name => !name && "Необходимо указать название тега", + tagColor: tagColor => !tagColor && "Необходимо указать цвет тега", + }, + }); + + return ( + context.closeContextModal(id)} + {...innerProps}> + + + { + form.setFieldValue("tagColor", tag); + form.setFieldValue("tagColorId", tag.id); + }} + /> + + + ); +}; + +export default DealTagModal; diff --git a/src/hooks/cruds/useDealTagsCrud.tsx b/src/hooks/cruds/useDealTagsCrud.tsx new file mode 100644 index 0000000..af5991c --- /dev/null +++ b/src/hooks/cruds/useDealTagsCrud.tsx @@ -0,0 +1,53 @@ +import { useCrudOperations } from "@/hooks/cruds/baseCrud"; +import { + CreateDealTagSchema, + DealTagSchema, + UpdateDealTagSchema, +} from "@/lib/client"; +import { + createDealTagMutation, + deleteDealTagMutation, + updateDealTagMutation, +} from "@/lib/client/@tanstack/react-query.gen"; + +type UseDealTagsOperationsProps = { + queryKey: any[]; + projectId: number; +}; + +export type DealTagsCrud = { + onCreate: (data: CreateDealTagSchema) => void; + onUpdate: (dealTagId: number, dealTag: UpdateDealTagSchema) => void; + onDelete: (dealTag: DealTagSchema) => void; +}; + +export const useDealTagsCrud = ({ + queryKey, + projectId, +}: UseDealTagsOperationsProps): DealTagsCrud => { + return useCrudOperations< + DealTagSchema, + UpdateDealTagSchema, + CreateDealTagSchema + >({ + key: "getDealTags", + queryKey, + mutations: { + create: createDealTagMutation(), + update: updateDealTagMutation(), + delete: deleteDealTagMutation(), + }, + getCreateEntity: data => ({ + tagColorId: data.tagColorId!, + name: data.name!, + projectId, + }), + getUpdateEntity: (old, update) => ({ + ...old, + name: update.name ?? old.name, + tagColor: update.tagColor ?? old.tagColor, + tagColorId: update.tagColor?.id ?? old.tagColorId, + }), + getDeleteConfirmTitle: () => "Удаление доски", + }); +}; diff --git a/src/hooks/lists/useDealTagsList.ts b/src/hooks/lists/useDealTagsList.ts new file mode 100644 index 0000000..2d2937b --- /dev/null +++ b/src/hooks/lists/useDealTagsList.ts @@ -0,0 +1,39 @@ +import { useQuery, useQueryClient } from "@tanstack/react-query"; +import { DealTagSchema } from "@/lib/client"; +import { + getDealTagsOptions, + getDealTagsQueryKey, +} from "@/lib/client/@tanstack/react-query.gen"; + +type Props = { + projectId: number; +}; + +const useDealTagsList = ({ projectId }: Props) => { + const queryClient = useQueryClient(); + const options = { + path: { projectId }, + }; + const { data, refetch } = useQuery(getDealTagsOptions(options)); + + const queryKey = getDealTagsQueryKey(options); + + const setDealTags = (dealTags: DealTagSchema[]) => { + queryClient.setQueryData( + queryKey, + (old: { items: DealTagSchema[] }) => ({ + ...old, + items: dealTags, + }) + ); + }; + + return { + dealTags: data?.items ?? [], + setDealTags, + refetch, + queryKey, + }; +}; + +export default useDealTagsList; diff --git a/src/lib/client/@tanstack/react-query.gen.ts b/src/lib/client/@tanstack/react-query.gen.ts index e29e685..7d01f20 100644 --- a/src/lib/client/@tanstack/react-query.gen.ts +++ b/src/lib/client/@tanstack/react-query.gen.ts @@ -3,6 +3,7 @@ import { infiniteQueryOptions, queryOptions, + type DefaultError, type InfiniteData, type UseMutationOptions, } from "@tanstack/react-query"; @@ -19,6 +20,7 @@ import { createDealProduct, createDealProductService, createDealService, + createDealTag, createMarketplace, createProduct, createProject, @@ -26,7 +28,6 @@ import { createServiceCategory, createServicesKit, createStatus, - createTag, deleteBarcodeTemplate, deleteBoard, deleteClient, @@ -35,6 +36,7 @@ import { deleteDealProduct, deleteDealProductService, deleteDealService, + deleteDealTag, deleteMarketplace, deleteProduct, deleteProject, @@ -42,7 +44,6 @@ import { deleteServiceCategory, deleteServicesKit, deleteStatus, - deleteTag, duplicateProductServices, getBarcodeTemplateAttributes, getBarcodeTemplates, @@ -55,6 +56,7 @@ import { getDeals, getDealServices, getDealTagColors, + getDealTags, getMarketplaces, getProductBarcodePdf, getProducts, @@ -74,6 +76,7 @@ import { updateDealProductService, updateDealService, updateDealsInGroup, + updateDealTag, updateMarketplace, updateProduct, updateProject, @@ -81,7 +84,6 @@ import { updateServiceCategory, updateServicesKit, updateStatus, - updateTag, type Options, } from "../sdk.gen"; import type { @@ -115,6 +117,9 @@ import type { CreateDealServiceData, CreateDealServiceError, CreateDealServiceResponse2, + CreateDealTagData, + CreateDealTagError, + CreateDealTagResponse2, CreateMarketplaceData, CreateMarketplaceError, CreateMarketplaceResponse2, @@ -136,9 +141,6 @@ import type { CreateStatusData, CreateStatusError, CreateStatusResponse2, - CreateTagData, - CreateTagError, - CreateTagResponse, DeleteBarcodeTemplateData, DeleteBarcodeTemplateError, DeleteBarcodeTemplateResponse2, @@ -163,6 +165,9 @@ import type { DeleteDealServiceData, DeleteDealServiceError, DeleteDealServiceResponse2, + DeleteDealTagData, + DeleteDealTagError, + DeleteDealTagResponse2, DeleteMarketplaceData, DeleteMarketplaceError, DeleteMarketplaceResponse2, @@ -184,9 +189,6 @@ import type { DeleteStatusData, DeleteStatusError, DeleteStatusResponse2, - DeleteTagData, - DeleteTagError, - DeleteTagResponse, DuplicateProductServicesData, DuplicateProductServicesError, DuplicateProductServicesResponse, @@ -203,6 +205,8 @@ import type { GetDealServicesData, GetDealsResponse2, GetDealTagColorsData, + GetDealTagColorsResponse, + GetDealTagsData, GetMarketplacesData, GetProductBarcodePdfData, GetProductBarcodePdfError, @@ -246,6 +250,9 @@ import type { UpdateDealsInGroupData, UpdateDealsInGroupError, UpdateDealsInGroupResponse2, + UpdateDealTagData, + UpdateDealTagError, + UpdateDealTagResponse2, UpdateMarketplaceData, UpdateMarketplaceError, UpdateMarketplaceResponse2, @@ -267,9 +274,6 @@ import type { UpdateStatusData, UpdateStatusError, UpdateStatusResponse2, - UpdateTagData, - UpdateTagError, - UpdateTagResponse, } from "../types.gen"; export type QueryKey = [ @@ -795,43 +799,16 @@ export const updateDealsInGroupMutation = ( return mutationOptions; }; -/** - * Update Tag - */ -export const updateTagMutation = ( - options?: Partial> -): UseMutationOptions< - UpdateTagResponse, - AxiosError, - Options -> => { - const mutationOptions: UseMutationOptions< - UpdateTagResponse, - AxiosError, - Options - > = { - mutationFn: async localOptions => { - const { data } = await updateTag({ - ...options, - ...localOptions, - throwOnError: true, - }); - return data; - }, - }; - return mutationOptions; -}; - -export const createTagQueryKey = (options: Options) => - createQueryKey("createTag", options); +export const getDealTagsQueryKey = (options: Options) => + createQueryKey("getDealTags", options); /** - * Create Tag + * Get Deal Tags */ -export const createTagOptions = (options: Options) => { +export const getDealTagsOptions = (options: Options) => { return queryOptions({ queryFn: async ({ queryKey, signal }) => { - const { data } = await createTag({ + const { data } = await getDealTags({ ...options, ...queryKey[0], signal, @@ -839,27 +816,48 @@ export const createTagOptions = (options: Options) => { }); return data; }, - queryKey: createTagQueryKey(options), + queryKey: getDealTagsQueryKey(options), + }); +}; + +export const createDealTagQueryKey = (options: Options) => + createQueryKey("createDealTag", options); + +/** + * Create Deal Tag + */ +export const createDealTagOptions = (options: Options) => { + return queryOptions({ + queryFn: async ({ queryKey, signal }) => { + const { data } = await createDealTag({ + ...options, + ...queryKey[0], + signal, + throwOnError: true, + }); + return data; + }, + queryKey: createDealTagQueryKey(options), }); }; /** - * Create Tag + * Create Deal Tag */ -export const createTagMutation = ( - options?: Partial> +export const createDealTagMutation = ( + options?: Partial> ): UseMutationOptions< - CreateTagResponse, - AxiosError, - Options + CreateDealTagResponse2, + AxiosError, + Options > => { const mutationOptions: UseMutationOptions< - CreateTagResponse, - AxiosError, - Options + CreateDealTagResponse2, + AxiosError, + Options > = { mutationFn: async localOptions => { - const { data } = await createTag({ + const { data } = await createDealTag({ ...options, ...localOptions, throwOnError: true, @@ -871,22 +869,49 @@ export const createTagMutation = ( }; /** - * Delete Tag + * Delete Deal Tag */ -export const deleteTagMutation = ( - options?: Partial> +export const deleteDealTagMutation = ( + options?: Partial> ): UseMutationOptions< - DeleteTagResponse, - AxiosError, - Options + DeleteDealTagResponse2, + AxiosError, + Options > => { const mutationOptions: UseMutationOptions< - DeleteTagResponse, - AxiosError, - Options + DeleteDealTagResponse2, + AxiosError, + Options > = { mutationFn: async localOptions => { - const { data } = await deleteTag({ + const { data } = await deleteDealTag({ + ...options, + ...localOptions, + throwOnError: true, + }); + return data; + }, + }; + return mutationOptions; +}; + +/** + * Update Deal Tag + */ +export const updateDealTagMutation = ( + options?: Partial> +): UseMutationOptions< + UpdateDealTagResponse2, + AxiosError, + Options +> => { + const mutationOptions: UseMutationOptions< + UpdateDealTagResponse2, + AxiosError, + Options + > = { + mutationFn: async localOptions => { + const { data } = await updateDealTag({ ...options, ...localOptions, throwOnError: true, @@ -969,6 +994,33 @@ export const getDealTagColorsOptions = ( }); }; +/** + * Get Deal Tag Colors + */ +export const getDealTagColorsMutation = ( + options?: Partial> +): UseMutationOptions< + GetDealTagColorsResponse, + AxiosError, + Options +> => { + const mutationOptions: UseMutationOptions< + GetDealTagColorsResponse, + AxiosError, + Options + > = { + mutationFn: async localOptions => { + const { data } = await getDealTagColors({ + ...options, + ...localOptions, + throwOnError: true, + }); + return data; + }, + }; + return mutationOptions; +}; + export const getBuiltInModulesQueryKey = ( options?: Options ) => createQueryKey("getBuiltInModules", options); diff --git a/src/lib/client/sdk.gen.ts b/src/lib/client/sdk.gen.ts index 8da1ff2..bb22067 100644 --- a/src/lib/client/sdk.gen.ts +++ b/src/lib/client/sdk.gen.ts @@ -33,6 +33,9 @@ import type { CreateDealServiceData, CreateDealServiceErrors, CreateDealServiceResponses, + CreateDealTagData, + CreateDealTagErrors, + CreateDealTagResponses, CreateMarketplaceData, CreateMarketplaceErrors, CreateMarketplaceResponses, @@ -54,9 +57,6 @@ import type { CreateStatusData, CreateStatusErrors, CreateStatusResponses, - CreateTagData, - CreateTagErrors, - CreateTagResponses, DeleteBarcodeTemplateData, DeleteBarcodeTemplateErrors, DeleteBarcodeTemplateResponses, @@ -81,6 +81,9 @@ import type { DeleteDealServiceData, DeleteDealServiceErrors, DeleteDealServiceResponses, + DeleteDealTagData, + DeleteDealTagErrors, + DeleteDealTagResponses, DeleteMarketplaceData, DeleteMarketplaceErrors, DeleteMarketplaceResponses, @@ -102,9 +105,6 @@ import type { DeleteStatusData, DeleteStatusErrors, DeleteStatusResponses, - DeleteTagData, - DeleteTagErrors, - DeleteTagResponses, DuplicateProductServicesData, DuplicateProductServicesErrors, DuplicateProductServicesResponses, @@ -135,6 +135,9 @@ import type { GetDealsResponses, GetDealTagColorsData, GetDealTagColorsResponses, + GetDealTagsData, + GetDealTagsErrors, + GetDealTagsResponses, GetMarketplacesData, GetMarketplacesErrors, GetMarketplacesResponses, @@ -188,6 +191,9 @@ import type { UpdateDealsInGroupData, UpdateDealsInGroupErrors, UpdateDealsInGroupResponses, + UpdateDealTagData, + UpdateDealTagErrors, + UpdateDealTagResponses, UpdateMarketplaceData, UpdateMarketplaceErrors, UpdateMarketplaceResponses, @@ -209,9 +215,6 @@ import type { UpdateStatusData, UpdateStatusErrors, UpdateStatusResponses, - UpdateTagData, - UpdateTagErrors, - UpdateTagResponses, } from "./types.gen"; import { zAddKitToDealData, @@ -234,6 +237,8 @@ import { zCreateDealResponse2, zCreateDealServiceData, zCreateDealServiceResponse2, + zCreateDealTagData, + zCreateDealTagResponse2, zCreateMarketplaceData, zCreateMarketplaceResponse2, zCreateProductData, @@ -248,8 +253,6 @@ import { zCreateServicesKitResponse2, zCreateStatusData, zCreateStatusResponse2, - zCreateTagData, - zCreateTagResponse, zDeleteBarcodeTemplateData, zDeleteBarcodeTemplateResponse2, zDeleteBoardData, @@ -266,6 +269,8 @@ import { zDeleteDealResponse2, zDeleteDealServiceData, zDeleteDealServiceResponse2, + zDeleteDealTagData, + zDeleteDealTagResponse2, zDeleteMarketplaceData, zDeleteMarketplaceResponse2, zDeleteProductData, @@ -280,8 +285,6 @@ import { zDeleteServicesKitResponse2, zDeleteStatusData, zDeleteStatusResponse2, - zDeleteTagData, - zDeleteTagResponse, zDuplicateProductServicesData, zDuplicateProductServicesResponse, zGetBarcodeTemplateAttributesData, @@ -306,6 +309,8 @@ import { zGetDealsResponse2, zGetDealTagColorsData, zGetDealTagColorsResponse, + zGetDealTagsData, + zGetDealTagsResponse2, zGetMarketplacesData, zGetMarketplacesResponse2, zGetProductBarcodePdfData, @@ -344,6 +349,8 @@ import { zUpdateDealServiceResponse2, zUpdateDealsInGroupData, zUpdateDealsInGroupResponse2, + zUpdateDealTagData, + zUpdateDealTagResponse2, zUpdateMarketplaceData, zUpdateMarketplaceResponse2, zUpdateProductData, @@ -358,8 +365,6 @@ import { zUpdateServicesKitResponse2, zUpdateStatusData, zUpdateStatusResponse2, - zUpdateTagData, - zUpdateTagResponse, } from "./zod.gen"; export type Options< @@ -684,49 +689,45 @@ export const updateDealsInGroup = ( }; /** - * Update Tag + * Get Deal Tags */ -export const updateTag = ( - options: Options +export const getDealTags = ( + options: Options ) => { - return (options.client ?? _heyApiClient).patch< - UpdateTagResponses, - UpdateTagErrors, + return (options.client ?? _heyApiClient).get< + GetDealTagsResponses, + GetDealTagsErrors, ThrowOnError >({ requestValidator: async data => { - return await zUpdateTagData.parseAsync(data); + return await zGetDealTagsData.parseAsync(data); }, responseType: "json", responseValidator: async data => { - return await zUpdateTagResponse.parseAsync(data); + return await zGetDealTagsResponse2.parseAsync(data); }, - url: "/crm/v1/deal-tag/", + url: "/crm/v1/deal-tag/{projectId}", ...options, - headers: { - "Content-Type": "application/json", - ...options.headers, - }, }); }; /** - * Create Tag + * Create Deal Tag */ -export const createTag = ( - options: Options +export const createDealTag = ( + options: Options ) => { return (options.client ?? _heyApiClient).post< - CreateTagResponses, - CreateTagErrors, + CreateDealTagResponses, + CreateDealTagErrors, ThrowOnError >({ requestValidator: async data => { - return await zCreateTagData.parseAsync(data); + return await zCreateDealTagData.parseAsync(data); }, responseType: "json", responseValidator: async data => { - return await zCreateTagResponse.parseAsync(data); + return await zCreateDealTagResponse2.parseAsync(data); }, url: "/crm/v1/deal-tag/", ...options, @@ -738,28 +739,55 @@ export const createTag = ( }; /** - * Delete Tag + * Delete Deal Tag */ -export const deleteTag = ( - options: Options +export const deleteDealTag = ( + options: Options ) => { return (options.client ?? _heyApiClient).delete< - DeleteTagResponses, - DeleteTagErrors, + DeleteDealTagResponses, + DeleteDealTagErrors, ThrowOnError >({ requestValidator: async data => { - return await zDeleteTagData.parseAsync(data); + return await zDeleteDealTagData.parseAsync(data); }, responseType: "json", responseValidator: async data => { - return await zDeleteTagResponse.parseAsync(data); + return await zDeleteDealTagResponse2.parseAsync(data); }, - url: "/crm/v1/deal-tag/{deal_tag_id}", + url: "/crm/v1/deal-tag/{pk}", ...options, }); }; +/** + * Update Deal Tag + */ +export const updateDealTag = ( + options: Options +) => { + return (options.client ?? _heyApiClient).patch< + UpdateDealTagResponses, + UpdateDealTagErrors, + ThrowOnError + >({ + requestValidator: async data => { + return await zUpdateDealTagData.parseAsync(data); + }, + responseType: "json", + responseValidator: async data => { + return await zUpdateDealTagResponse2.parseAsync(data); + }, + url: "/crm/v1/deal-tag/{pk}", + ...options, + headers: { + "Content-Type": "application/json", + ...options.headers, + }, + }); +}; + /** * Switch Deal Tag */ @@ -793,7 +821,7 @@ export const switchDealTag = ( export const getDealTagColors = ( options?: Options ) => { - return (options?.client ?? _heyApiClient).get< + return (options?.client ?? _heyApiClient).post< GetDealTagColorsResponses, unknown, ThrowOnError diff --git a/src/lib/client/types.gen.ts b/src/lib/client/types.gen.ts index 6677c59..08ee9a7 100644 --- a/src/lib/client/types.gen.ts +++ b/src/lib/client/types.gen.ts @@ -985,6 +985,10 @@ export type DealSchema = { */ createdAt: string; group: DealGroupSchema | null; + /** + * Tags + */ + tags: Array; /** * Productsquantity */ @@ -1318,6 +1322,16 @@ export type GetDealServicesResponse = { items: Array; }; +/** + * GetDealTagsResponse + */ +export type GetDealTagsResponse = { + /** + * Items + */ + items: Array; +}; + /** * GetDealsResponse */ @@ -1650,6 +1664,10 @@ export type ProjectSchema = { * Builtinmodules */ builtInModules: Array; + /** + * Tags + */ + tags: Array; }; /** @@ -2851,85 +2869,124 @@ export type UpdateDealsInGroupResponses = { export type UpdateDealsInGroupResponse2 = UpdateDealsInGroupResponses[keyof UpdateDealsInGroupResponses]; -export type UpdateTagData = { - body: UpdateDealTagRequest; - path?: never; +export type GetDealTagsData = { + body?: never; + path: { + /** + * Projectid + */ + projectId: number; + }; query?: never; - url: "/crm/v1/deal-tag/"; + url: "/crm/v1/deal-tag/{projectId}"; }; -export type UpdateTagErrors = { +export type GetDealTagsErrors = { /** * Validation Error */ 422: HttpValidationError; }; -export type UpdateTagError = UpdateTagErrors[keyof UpdateTagErrors]; +export type GetDealTagsError = GetDealTagsErrors[keyof GetDealTagsErrors]; -export type UpdateTagResponses = { +export type GetDealTagsResponses = { /** * Successful Response */ - 200: UpdateDealTagResponse; + 200: GetDealTagsResponse; }; -export type UpdateTagResponse = UpdateTagResponses[keyof UpdateTagResponses]; +export type GetDealTagsResponse2 = + GetDealTagsResponses[keyof GetDealTagsResponses]; -export type CreateTagData = { +export type CreateDealTagData = { body: CreateDealTagRequest; path?: never; query?: never; url: "/crm/v1/deal-tag/"; }; -export type CreateTagErrors = { +export type CreateDealTagErrors = { /** * Validation Error */ 422: HttpValidationError; }; -export type CreateTagError = CreateTagErrors[keyof CreateTagErrors]; +export type CreateDealTagError = CreateDealTagErrors[keyof CreateDealTagErrors]; -export type CreateTagResponses = { +export type CreateDealTagResponses = { /** * Successful Response */ 200: CreateDealTagResponse; }; -export type CreateTagResponse = CreateTagResponses[keyof CreateTagResponses]; +export type CreateDealTagResponse2 = + CreateDealTagResponses[keyof CreateDealTagResponses]; -export type DeleteTagData = { +export type DeleteDealTagData = { body?: never; path: { /** - * Deal Tag Id + * Pk */ - deal_tag_id: number; + pk: number; }; query?: never; - url: "/crm/v1/deal-tag/{deal_tag_id}"; + url: "/crm/v1/deal-tag/{pk}"; }; -export type DeleteTagErrors = { +export type DeleteDealTagErrors = { /** * Validation Error */ 422: HttpValidationError; }; -export type DeleteTagError = DeleteTagErrors[keyof DeleteTagErrors]; +export type DeleteDealTagError = DeleteDealTagErrors[keyof DeleteDealTagErrors]; -export type DeleteTagResponses = { +export type DeleteDealTagResponses = { /** * Successful Response */ 200: DeleteDealTagResponse; }; -export type DeleteTagResponse = DeleteTagResponses[keyof DeleteTagResponses]; +export type DeleteDealTagResponse2 = + DeleteDealTagResponses[keyof DeleteDealTagResponses]; + +export type UpdateDealTagData = { + body: UpdateDealTagRequest; + path: { + /** + * Pk + */ + pk: number; + }; + query?: never; + url: "/crm/v1/deal-tag/{pk}"; +}; + +export type UpdateDealTagErrors = { + /** + * Validation Error + */ + 422: HttpValidationError; +}; + +export type UpdateDealTagError = UpdateDealTagErrors[keyof UpdateDealTagErrors]; + +export type UpdateDealTagResponses = { + /** + * Successful Response + */ + 200: UpdateDealTagResponse; +}; + +export type UpdateDealTagResponse2 = + UpdateDealTagResponses[keyof UpdateDealTagResponses]; export type SwitchDealTagData = { body: SwitchDealTagRequest; diff --git a/src/lib/client/zod.gen.ts b/src/lib/client/zod.gen.ts index b754f99..33e6e59 100644 --- a/src/lib/client/zod.gen.ts +++ b/src/lib/client/zod.gen.ts @@ -348,6 +348,27 @@ export const zStatusSchema = z.object({ color: z.string(), }); +/** + * DealTagColorSchema + */ +export const zDealTagColorSchema = z.object({ + id: z.int(), + color: z.string(), + backgroundColor: z.string(), + label: z.string(), +}); + +/** + * DealTagSchema + */ +export const zDealTagSchema = z.object({ + name: z.string(), + projectId: z.int(), + tagColorId: z.int(), + id: z.int(), + tagColor: zDealTagColorSchema, +}); + /** * DealSchema */ @@ -361,6 +382,7 @@ export const zDealSchema = z.object({ offset: true, }), group: z.union([zDealGroupSchema, z.null()]), + tags: z.array(zDealTagSchema), productsQuantity: z.optional(z.int()).default(0), totalPrice: z.optional(z.number()).default(0), client: z.optional(z.union([zClientSchema, z.null()])), @@ -427,27 +449,6 @@ export const zCreateDealTagRequest = z.object({ entity: zCreateDealTagSchema, }); -/** - * DealTagColorSchema - */ -export const zDealTagColorSchema = z.object({ - id: z.int(), - color: z.string(), - backgroundColor: z.string(), - label: z.string(), -}); - -/** - * DealTagSchema - */ -export const zDealTagSchema = z.object({ - name: z.string(), - projectId: z.int(), - tagColorId: z.int(), - id: z.int(), - tagColor: zDealTagColorSchema, -}); - /** * CreateDealTagResponse */ @@ -571,6 +572,7 @@ export const zProjectSchema = z.object({ id: z.int(), name: z.string(), builtInModules: z.array(zBuiltInModuleSchemaOutput), + tags: z.array(zDealTagSchema), }); /** @@ -899,6 +901,13 @@ export const zGetDealServicesResponse = z.object({ items: z.array(zDealServiceSchema), }); +/** + * GetDealTagsResponse + */ +export const zGetDealTagsResponse = z.object({ + items: z.array(zDealTagSchema), +}); + /** * PaginationInfoSchema */ @@ -1628,18 +1637,20 @@ export const zUpdateDealsInGroupData = z.object({ */ export const zUpdateDealsInGroupResponse2 = zUpdateDealsInGroupResponse; -export const zUpdateTagData = z.object({ - body: zUpdateDealTagRequest, - path: z.optional(z.never()), +export const zGetDealTagsData = z.object({ + body: z.optional(z.never()), + path: z.object({ + projectId: z.int(), + }), query: z.optional(z.never()), }); /** * Successful Response */ -export const zUpdateTagResponse = zUpdateDealTagResponse; +export const zGetDealTagsResponse2 = zGetDealTagsResponse; -export const zCreateTagData = z.object({ +export const zCreateDealTagData = z.object({ body: zCreateDealTagRequest, path: z.optional(z.never()), query: z.optional(z.never()), @@ -1648,12 +1659,12 @@ export const zCreateTagData = z.object({ /** * Successful Response */ -export const zCreateTagResponse = zCreateDealTagResponse; +export const zCreateDealTagResponse2 = zCreateDealTagResponse; -export const zDeleteTagData = z.object({ +export const zDeleteDealTagData = z.object({ body: z.optional(z.never()), path: z.object({ - deal_tag_id: z.int(), + pk: z.int(), }), query: z.optional(z.never()), }); @@ -1661,7 +1672,20 @@ export const zDeleteTagData = z.object({ /** * Successful Response */ -export const zDeleteTagResponse = zDeleteDealTagResponse; +export const zDeleteDealTagResponse2 = zDeleteDealTagResponse; + +export const zUpdateDealTagData = z.object({ + body: zUpdateDealTagRequest, + path: z.object({ + pk: z.int(), + }), + query: z.optional(z.never()), +}); + +/** + * Successful Response + */ +export const zUpdateDealTagResponse2 = zUpdateDealTagResponse; export const zSwitchDealTagData = z.object({ body: zSwitchDealTagRequest, diff --git a/src/modals/modals.ts b/src/modals/modals.ts index e4293ee..c5ac8a7 100644 --- a/src/modals/modals.ts +++ b/src/modals/modals.ts @@ -20,6 +20,7 @@ import { ProductServiceEditorModal, ServicesKitSelectModal, } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/modals"; +import DealTagModal from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/modals/DealTagModal"; export const modals = { enterNameModal: EnterNameModal, @@ -40,4 +41,5 @@ export const modals = { printBarcodeModal: PrintBarcodeModal, statusColorPickerModal: ColorPickerModal, marketplaceEditorModal: MarketplaceEditorModal, + dealTagModal: DealTagModal, };