fix(ExternalTasks): rename Task to JiraTask and cleanup code

src/components/CriteriaForm/CriteriaForm.tsx

@@ -15,32 +15,33 @@ import {
 } from '@taskany/bricks/harmony';
 
 import { GoalSelect } from '../GoalSelect/GoalSelect';
-import { getStateProps, GoalBadge } from '../GoalBadge';
+import { GoalBadge } from '../GoalBadge';
 import { FilterAutoCompleteInput } from '../FilterAutoCompleteInput/FilterAutoCompleteInput';
 import { AddInlineTrigger } from '../AddInlineTrigger/AddInlineTrigger';
 import { StateDot } from '../StateDot/StateDot';
-import { TaskBadge, TaskBadgeIcon } from '../TaskBadge/TaskBadge';
+import { JiraTaskBadge, JiraTaskBadgeIcon } from '../JiraTaskBadge/JiraTaskBadge';
 
 import { tr } from './CriteriaForm.i18n';
 import s from './CriteriaForm.module.css';
 
-type GoalStateProps = ComponentProps<typeof StateDot>['state'];
-type TaskTypeProps = NonNullable<ComponentProps<typeof TaskBadge>['type']>;
-type TaskStateProps = NonNullable<ComponentProps<typeof TaskBadge>['state']>;
-
-interface SuggestItem {
-    id: string;
-    title: string;
-    state?: GoalStateProps | TaskStateProps | null;
-    type?: TaskTypeProps | null;
-    _shortId: string;
-}
-
-const isGoalStateProps = (props: unknown): props is GoalStateProps =>
-    typeof props === 'object' && props != null && 'lightForeground' in props && 'darkForeground' in props;
-
-const isTaskStateProps = (props: unknown): props is TaskStateProps =>
-    typeof props === 'object' && props != null && 'src' in props && 'title' in props;
+type GoalStateProps = NonNullable<ComponentProps<typeof StateDot>['state']>;
+type TaskTypeProps = NonNullable<ComponentProps<typeof JiraTaskBadge>['type']>;
+
+type SuggestItem =
+    | {
+          itemType: 'goal';
+          id: string;
+          title: string;
+          state: GoalStateProps | null;
+          _shortId: string;
+      }
+    | {
+          itemType: 'task';
+          id: string;
+          title: string;
+          type: TaskTypeProps;
+          key: string;
+      };
 
 interface ValidityData {
     title: string[];
@@ -101,7 +102,7 @@ function patchZodSchema<T extends FormValues>(
                 mode: z.literal('task'),
                 id: z.string(),
                 selected: z.object({
-                    externalKey: z.string(),
+                    key: z.string(),
                 }),
             }),
         ])
@@ -241,21 +242,18 @@ const CriteriaTitleField: React.FC<CriteriaTitleFieldProps> = ({
     const { selected, title } = errors;
 
     const icon = useMemo(() => {
-        if (selectedItem == null) {
-            return null;
-        }
-
+        const existItem = selectedItem != null;
         if (mode === 'goal') {
-            if (isGoalStateProps(selectedItem.state)) {
+            if (existItem && selectedItem?.itemType === 'goal') {
                 return <StateDot size="s" state={selectedItem.state} view="stroke" />;
             }
 
             return <IconTargetOutline size="s" />;
         }
 
         if (mode === 'task') {
-            if (isTaskStateProps(selectedItem.type)) {
-                return <TaskBadgeIcon src={selectedItem.type.src} />;
+            if (existItem && selectedItem?.itemType === 'task') {
+                return <JiraTaskBadgeIcon src={selectedItem.type.src} />;
             }
 
             return <IconDatabaseOutline size="s" />;
@@ -303,14 +301,6 @@ const CriteriaTitleField: React.FC<CriteriaTitleFieldProps> = ({
     );
 };
 
-const isGoalProps = (props: unknown): props is React.ComponentProps<typeof GoalBadge> => {
-    return typeof props === 'object' && props != null && '_shortId' in props;
-};
-
-const isTaskProps = (props: unknown): props is React.ComponentProps<typeof TaskBadge> => {
-    return typeof props === 'object' && props != null && 'type' in props;
-};
-
 export const CriteriaForm = ({
     onInputChange,
     onItemChange,
@@ -444,18 +434,12 @@ export const CriteriaForm = ({
                 renderItem={(props) => {
                     const renderData = props.item;
 
-                    if (mode === 'goal' && isGoalProps(renderData)) {
-                        return (
-                            <GoalBadge
-                                title={renderData.title}
-                                state={getStateProps(renderData?.state)}
-                                className={s.GoalBadge}
-                            />
-                        );
+                    if (mode === 'goal' && renderData.itemType === 'goal') {
+                        return <GoalBadge title={renderData.title} state={renderData.state} className={s.GoalBadge} />;
                     }
 
-                    if (mode === 'task' && isTaskProps(renderData)) {
-                        return <TaskBadge {...renderData} />;
+                    if (mode === 'task' && renderData.itemType === 'task') {
+                        return <JiraTaskBadge {...renderData} />;
                     }
                 }}
             >

src/components/GoalCriteria/GoalCriteria.tsx

@@ -34,8 +34,8 @@ import { ActivityFeedItem } from '../ActivityFeed/ActivityFeed';
 import { IssueMeta } from '../IssueMeta/IssueMeta';
 import { Circle } from '../Circle/Circle';
 import { routes } from '../../hooks/router';
-import { GoalBadge } from '../GoalBadge';
-import { TaskBadge } from '../TaskBadge/TaskBadge';
+import { getStateProps, GoalBadge } from '../GoalBadge';
+import { JiraTaskBadge } from '../JiraTaskBadge/JiraTaskBadge';
 import { safeUserData } from '../../utils/getUserName';
 import { UserBadge } from '../UserBadge/UserBadge';
 import { ActivityByIdReturnType } from '../../../trpc/inferredTypes';
@@ -48,7 +48,7 @@ import { tr } from './GoalCriteria.i18n';
 type GoalCriteriaSuggestProps = React.ComponentProps<typeof GoalCriteriaSuggest>;
 
 type GoalStateProps = NonNullable<React.ComponentProps<typeof GoalBadge>['state']>;
-type ExternalTaskTypeProps = React.ComponentProps<typeof TaskBadge>['type'];
+type ExternalTaskTypeProps = NonNullable<React.ComponentProps<typeof JiraTaskBadge>['type']>;
 type CriteriaUpdateDataMode = NonNullable<GoalCriteriaSuggestProps['defaultMode']>;
 interface CriteriaProps {
     title: string;
@@ -70,10 +70,11 @@ interface GoalCriteriaProps extends CriteriaProps {
 
 interface ExternalTaskCriteriaProps extends CriteriaProps {
     externalTask: {
+        id: string;
         title: string;
         externalKey: string;
         project: string;
-        type?: ExternalTaskTypeProps;
+        type: ExternalTaskTypeProps;
         state?: {
             color: string | null;
             title: string;
@@ -85,7 +86,7 @@ interface ExternalTaskCriteriaProps extends CriteriaProps {
 
 type UnionCriteria = CriteriaProps | GoalCriteriaProps | ExternalTaskCriteriaProps;
 
-type CanBeNullableValue<T extends { [key: string]: any }> = {
+type CanBeNullableValue<T extends { [key: string]: unknown }> = {
     [K in keyof T]: T[K] | null;
 };
 
@@ -224,7 +225,7 @@ const ExternalTaskCriteria = ({ title, externalTask, weight, isDone }: Omit<Exte
     return (
         <>
             <TableCell className={classes.GoalCriteriaTitleCell} width={200}>
-                <TaskBadge
+                <JiraTaskBadge
                     title={title}
                     state={
                         externalTask.state
@@ -272,31 +273,12 @@ const GoalCriteria = ({ title, goal, weight, isDone }: Omit<GoalCriteriaProps, '
         [setPreview, title, goal],
     );
 
-    const goalState = useMemo(() => {
-        if (goal.state == null) {
-            return null;
-        }
-
-        const {
-            state: { lightForeground, darkForeground },
-        } = goal;
-
-        if (lightForeground && darkForeground) {
-            return {
-                lightForeground,
-                darkForeground,
-            };
-        }
-
-        return null;
-    }, [goal]);
-
     return (
         <>
             <TableCell className={classes.GoalCriteriaTitleCell} width={200}>
                 <GoalBadge
                     title={title}
-                    state={goalState}
+                    state={getStateProps(goal.state)}
                     href={routes.goal(goal.shortId)}
                     onClick={handleGoalCriteriaClick}
                     progress={goal.progress}
@@ -446,6 +428,7 @@ export const Criteria: React.FC<
                         title: props.title,
                         state: props.goal.state,
                         _shortId: props.goal.shortId,
+                        itemType: 'goal',
                     },
                 },
             ];
@@ -460,11 +443,11 @@ export const Criteria: React.FC<
                     title: props.title,
                     weight: props.weight ? `${props.weight}` : '',
                     selected: {
-                        id: props.externalTask.externalKey,
-                        _shortId: props.externalTask.externalKey,
+                        id: props.externalTask.id,
                         title: props.externalTask.title,
-                        state: props.externalTask.state,
-                        externalKey: props.externalTask.externalKey,
+                        type: props.externalTask.type,
+                        key: props.externalTask.externalKey,
+                        itemType: 'task',
                     },
                 },
             ];
@@ -503,7 +486,7 @@ export const Criteria: React.FC<
                     valuesToUpdate.selected.id = values.selected.id;
                     break;
                 case 'task':
-                    valuesToUpdate.selected.externalKey = values.selected.externalKey;
+                    valuesToUpdate.selected.externalKey = values.selected.key;
                     break;
                 default:
             }

src/components/GoalCriteriaSuggest.tsx

@@ -5,6 +5,7 @@ import { useGoalResource } from '../hooks/useGoalResource';
 
 import { CriteriaForm, useCriteriaValidityData } from './CriteriaForm/CriteriaForm';
 import { dispatchPreviewUpdateEvent } from './GoalPreview/GoalPreviewProvider';
+import { getStateProps } from './GoalBadge';
 
 type SuggestItems = React.ComponentProps<typeof CriteriaForm>['items'];
 
@@ -41,6 +42,7 @@ interface GoalCriteriaSuggestProps {
     validityData: React.ComponentProps<typeof CriteriaForm>['validityData'];
     onGoalSelect?: (goal: { id: string }) => void;
 }
+type SuggestItem = React.ComponentProps<typeof CriteriaForm>['items'][number];
 
 export const GoalCriteriaSuggest: React.FC<GoalCriteriaSuggestProps> = ({
     id,
@@ -83,7 +85,7 @@ export const GoalCriteriaSuggest: React.FC<GoalCriteriaSuggestProps> = ({
         { enabled: mode === 'goal' && shouldEnabledQuery, cacheTime: 0 },
     );
 
-    const { data: issues = [] } = trpc.external.search.useQuery(
+    const { data: issues = [] } = trpc.jira.search.useQuery(
         {
             value: query as string,
             limit: 5,
@@ -94,7 +96,7 @@ export const GoalCriteriaSuggest: React.FC<GoalCriteriaSuggestProps> = ({
         },
     );
 
-    const itemsToRender = useMemo(() => {
+    const itemsToRender = useMemo<SuggestItem[]>(() => {
         if (selectedGoal?.title === query || mode === 'simple') {
             return [];
         }
@@ -103,27 +105,23 @@ export const GoalCriteriaSuggest: React.FC<GoalCriteriaSuggestProps> = ({
             return goals.map(({ id, title, state, _shortId }) => ({
                 id,
                 title,
-                state:
-                    state?.lightForeground != null && state?.darkForeground != null
-                        ? {
-                              lightForeground: state.lightForeground,
-                              darkForeground: state.darkForeground,
-                          }
-                        : null,
+                state: getStateProps(state),
                 _shortId,
+                itemType: 'goal',
             }));
         }
 
         return issues.map((issue) => ({
             ...issue,
-            _shortId: issue.externalKey,
+            key: issue.externalKey,
             state: null,
             id: issue.externalId,
             title: issue.title,
             type: {
                 title: issue.type,
                 src: issue.typeIconUrl,
             },
+            itemType: 'task' as const,
         }));
     }, [goals, selectedGoal, query, mode, issues]);
 

src/components/TaskBadge/TaskBadge.module.css → src/components/JiraTaskBadge/JiraTaskBadge.module.css

@@ -1,14 +1,14 @@
-.TaskBadgeType {
+.JiraTaskBadgeType {
     --badge-icon-size: 16px;
     font-size: 16px;
 }
 
-.TaskBadgeProjectName {
+.JiraTaskBadgeProjectName {
     /* must be used of current font-size, but not root font-size */
     margin-left: 0.25em;
 }
 
-.TaskBadgeState {
+.JiraTaskBadgeState {
     color: white;
     background-color: var(--task-badge-color, var(--gray-500));
     width: var(--font-size-m);
@@ -21,7 +21,7 @@
     border-radius: var(--radius-s);
 }
 
-.TaskBadgeStateSymbol {
+.JiraTaskBadgeStateSymbol {
     vertical-align: 0.125em;
     line-height: 1rem;
 }