From 6139c59a873e0088c2bcc35c4e625a2510148e80 Mon Sep 17 00:00:00 2001 From: Sachin Chaurasiya Date: Wed, 5 Jul 2023 18:30:15 +0530 Subject: [PATCH] refactor(ui): task flow (#12248) * refactor(ui): task flow * fix: task workflow * fix(ui): pass initial value on modal form based on task type * fix(ui): pass proper value in initial form values. --------- Co-authored-by: karanh37 --- .../ActivityFeedTab.component.tsx | 10 +- .../ActivityFeedTab.interface.ts | 3 - .../Task/TaskTab/TaskTab.component.tsx | 122 +++++++----------- .../Task/TaskTab/TaskTab.interface.ts | 5 +- .../TableDetailsPageV1/TableDetailsPageV1.tsx | 2 - .../TasksPage/UpdateTagPage/UpdateTagPage.tsx | 4 +- .../TasksPage/shared/DescriptionTask.test.tsx | 10 +- .../TasksPage/shared/DescriptionTask.tsx | 43 ++---- .../pages/TasksPage/shared/TagsTabs.test.tsx | 2 +- .../src/pages/TasksPage/shared/TagsTask.tsx | 19 ++- .../src/main/resources/ui/src/styles/app.less | 4 + 11 files changed, 87 insertions(+), 137 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.component.tsx index 7691a0c81e8..c05177a6d6c 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.component.tsx @@ -56,8 +56,6 @@ import { ReactComponent as TaskIcon } from '/assets/svg/ic-task.svg'; export const ActivityFeedTab = ({ fqn, owner, - tags, - description, columns, entityType, onUpdateEntityDetails, @@ -385,20 +383,16 @@ export const ActivityFeedTab = ({ {entityType === EntityType.TABLE ? ( ) : ( )} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.interface.ts index 67f918c2471..4edb14d6f58 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.interface.ts +++ b/openmetadata-ui/src/main/resources/ui/src/components/ActivityFeed/ActivityFeedTab/ActivityFeedTab.interface.ts @@ -13,7 +13,6 @@ import { EntityType } from 'enums/entity.enum'; import { Column } from 'generated/entity/data/table'; import { EntityReference } from 'generated/entity/type'; -import { TagLabel } from 'generated/type/tagLabel'; export type FeedKeys = 'all' | 'mentions' | 'tasks'; @@ -28,8 +27,6 @@ export interface ActivityFeedTabBasicProps { onFeedUpdate: () => void; onUpdateEntityDetails?: () => void; owner?: EntityReference; - tags?: TagLabel[]; - description?: string; } export type ActivityFeedTabProps = ActivityFeedTabBasicProps & diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Task/TaskTab/TaskTab.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Task/TaskTab/TaskTab.component.tsx index 0159c748a34..61845ba1526 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Task/TaskTab/TaskTab.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Task/TaskTab/TaskTab.component.tsx @@ -29,7 +29,6 @@ import ActivityFeedEditor from 'components/ActivityFeed/ActivityFeedEditor/Activ import { useActivityFeedProvider } from 'components/ActivityFeed/ActivityFeedProvider/ActivityFeedProvider'; import { OwnerLabel } from 'components/common/OwnerLabel/OwnerLabel.component'; import EntityPopOverCard from 'components/common/PopOverCard/EntityPopOverCard'; -import { FQN_SEPARATOR_CHAR } from 'constants/char.constants'; import { TaskOperation } from 'constants/Feeds.constants'; import { TaskType } from 'generated/api/feed/createThread'; import { TaskDetails, ThreadTaskStatus } from 'generated/entity/feed/thread'; @@ -43,16 +42,14 @@ import { TaskActionMode, } from 'pages/TasksPage/TasksPage.interface'; import { MenuInfo } from 'rc-menu/lib/interface'; -import React, { useCallback, useEffect, useMemo, useState } from 'react'; +import React, { useCallback, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { Link, useHistory } from 'react-router-dom'; import { updateTask } from 'rest/feedsAPI'; import { getNameFromFQN } from 'utils/CommonUtils'; -import { ENTITY_LINK_SEPARATOR } from 'utils/EntityUtils'; -import { getEntityField, getEntityFQN, prepareFeedLink } from 'utils/FeedUtils'; +import { getEntityFQN, prepareFeedLink } from 'utils/FeedUtils'; import { getEntityLink } from 'utils/TableUtils'; import { - getColumnObject, isDescriptionTask, isTagsTask, TASK_ACTION_LIST, @@ -63,15 +60,13 @@ import { ReactComponent as TaskCloseIcon } from '/assets/svg/ic-close-task.svg'; import { ReactComponent as TaskOpenIcon } from '/assets/svg/ic-open-task.svg'; export const TaskTab = ({ - task, + taskThread, owner, entityType, - tags, - description, ...rest }: TaskTabProps) => { - const { task: taskDetails } = task; - const entityFQN = getEntityFQN(task.about) ?? ''; + const { task: taskDetails } = taskThread; + const entityFQN = getEntityFQN(taskThread.about) ?? ''; const entityCheck = !isUndefined(entityFQN) && !isUndefined(entityType); const { t } = useTranslation(); const [form] = Form.useForm(); @@ -90,27 +85,8 @@ export const TaskTab = ({ [AppState.userDetails, AppState.nonSecureUserDetails] ); - const entityField = useMemo(() => { - return getEntityField(task.about); - }, [task]); - - const columnObject = useMemo(() => { - // prepare column from entityField - const column = entityField?.split(ENTITY_LINK_SEPARATOR)?.slice(-2)?.[0]; - - // prepare column value by replacing double quotes - const columnValue = column?.replaceAll(/^"|"$/g, '') || ''; - - /** - * Get column name by spliting columnValue with FQN Separator - */ - const columnName = columnValue.split(FQN_SEPARATOR_CHAR).pop(); - - return getColumnObject(columnName ?? '', rest.columns || []); - }, [task, rest.columns]); - const isOwner = isEqual(owner?.id, currentUser?.id); - const isCreator = isEqual(task.createdBy, currentUser?.name); + const isCreator = isEqual(taskThread.createdBy, currentUser?.name); const checkIfUserPartOfTeam = useCallback( (teamId: string): boolean => { @@ -216,35 +192,13 @@ export const TaskTab = ({ const hasTaskUpdateAccess = () => hasEditAccess() || isPartOfAssigneeTeam; - // prepare current tags for update tags task - const getCurrentTags = () => { - if (!isEmpty(columnObject) && entityField) { - return columnObject.tags ?? []; - } else { - return tags ?? []; - } - }; - - // prepare current description for update description task - const currentDescription = () => { - if (entityField && !isEmpty(columnObject)) { - return columnObject.description || ''; - } else { - return description || ''; - } - }; - const onSave = (message: string) => { - postFeed(message, task?.id ?? '').catch(() => { + postFeed(message, taskThread?.id ?? '').catch(() => { // ignore since error is displayed in toast in the parent promise. // Added block for sonar code smell }); }; - useEffect(() => { - form.setFieldValue('description', currentDescription()); - }, [columnObject, entityField, currentDescription]); - const handleMenuItemClick: MenuProps['onClick'] = (info) => { if (info.key === TaskActionMode.EDIT) { setShowEditTaskModel(true); @@ -276,19 +230,26 @@ export const TaskTab = ({ return null; } + const parsedSuggestion = [ + 'RequestDescription', + 'UpdateDescription', + ].includes(taskDetails?.type ?? '') + ? taskDetails?.suggestion + : JSON.parse(taskDetails?.suggestion || '[]'); + return ( - {isCreator && ( + {(isCreator || hasTaskUpdateAccess()) && ( )} {hasTaskUpdateAccess() ? ( <> {['RequestDescription', 'RequestTag'].includes( taskDetails?.type ?? '' - ) && isEmpty(taskDetails?.suggestion) ? ( + ) && isEmpty(parsedSuggestion) ? (